/********************************************************************************** * * Copyright (c) 2017-2019 MuK IT GmbH. * * This file is part of MuK Backend Theme * (see https://mukit.at). * * This program is free software: you can redistribute it and/or modify * it under the terms of the GNU Lesser General Public License as published by * the Free Software Foundation, either version 3 of the License, or * (at your option) any later version. * * This program is distributed in the hope that it will be useful, * but WITHOUT ANY WARRANTY; without even the implied warranty of * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the * GNU Lesser General Public License for more details. * * You should have received a copy of the GNU Lesser General Public License * along with this program. If not, see . * **********************************************************************************/ .o_menu_apps { .full { width: 46px; font-size: 18px; text-align: center; } .dropdown-menu.show { @include mk-full-screen-sections(); align-content: flex-start; overflow: inital; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: flex-start; @include media-breakpoint-up(lg) { padding: { left: 20vw; right: 20vw; } } .o_app { display: flex; margin-top: 20px; align-items: center; flex-direction: column; justify-content: flex-start; width: percentage(1/3); @include media-breakpoint-up(sm) { width: percentage(1/4); } @include media-breakpoint-up(md) { width: percentage(1/6); } &:hover, &:focus, &:active, &.active { background: none; .o-app-icon { box-shadow: 0 8px 15px -10px black; transform: translateY(-1px); } } } .has-results ~ .o_app { display: none; } .o-app-icon { height: auto; max-width: 7rem; width: 100%; flex-basis: 0; } .o-app-name { color: $mk-apps-color; } .form-row { width: 100%; } .mk_search_container { margin-top: 25px; .mk_search_input { input:focus { box-shadow: none; border: 1px solid $gray-400; } } &.has-results { height: 100%; .mk_search_input { height: 3em; } .mk_search_results { height: calc(100% - 3em); .mk_menu_search_result { display: block; cursor: pointer; align-items: center; padding-left: 3rem; padding-right: 1rem; background-position: left; background-repeat: no-repeat; background-size: contain; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: $mk-apps-color; &:hover, &:active, &.active { background-color: rgba(255, 255, 255, 0.05); } } } } @include media-breakpoint-down(md) { padding-right: 5px; } } } }