115 lines
3.0 KiB
SCSS
115 lines
3.0 KiB
SCSS
.o_home_menu_background {
|
|
// 'Home menu background' design is shared with enterprise login
|
|
// screens and it's located in './home_menu_background.scss'
|
|
|
|
// When applied on webclient (note: we do not specify the webclient class
|
|
// here to avoid breaking studio custom style)
|
|
&:not(.o_home_menu_background_custom) .o_main_navbar {
|
|
background: transparent;
|
|
border-bottom-color: transparent;
|
|
|
|
.dropdown-menu {
|
|
border-color: $dropdown-bg;
|
|
}
|
|
|
|
.o_dropdown_active,
|
|
> ul > li.show > a {
|
|
outline: none;
|
|
}
|
|
}
|
|
|
|
&.o_home_menu_background_custom .o_home_menu {
|
|
background: {
|
|
size: cover;
|
|
repeat: no-repeat;
|
|
position: center;
|
|
}
|
|
}
|
|
|
|
.o_menu_systray {
|
|
@include print-variable(o-navbar-badge-bg, $o-navbar-home-menu-badge-bg);
|
|
}
|
|
}
|
|
|
|
.o_home_menu {
|
|
font-size: $o-home-menu-font-size-base;
|
|
|
|
.container {
|
|
@include media-breakpoint-up(md) {
|
|
max-width: $o-home-menu-container-size !important;
|
|
}
|
|
}
|
|
|
|
.o_app {
|
|
&,
|
|
.o_app_icon {
|
|
transition: all 0.3s ease 0s;
|
|
}
|
|
|
|
.o_app_icon {
|
|
width: $o-home-menu-app-icon-max-width;
|
|
height: $o-home-menu-app-icon-max-width;
|
|
background: {
|
|
size: cover;
|
|
repeat: no-repeat;
|
|
position: center;
|
|
}
|
|
|
|
.fa {
|
|
font-size: $o-home-menu-app-icon-max-width * 0.5;
|
|
text-shadow: 0 2px 0 rgba(0, 0, 0, 0.23);
|
|
}
|
|
}
|
|
|
|
.o_caption {
|
|
color: $o-home-menu-caption-color;
|
|
text-shadow: $o-home-menu-caption-shadow;
|
|
}
|
|
|
|
&:focus,
|
|
&.o_focused,
|
|
&:hover {
|
|
.o_app_icon {
|
|
box-shadow: 0 8px 15px -10px black;
|
|
transform: translateY(-1px);
|
|
}
|
|
}
|
|
|
|
&:focus,
|
|
&.o_focused {
|
|
background-color: rgba(white, 0.05);
|
|
border-radius: $border-radius;
|
|
}
|
|
}
|
|
|
|
// iOS iPhone list layout due to Apple AppStore review
|
|
@include media-breakpoint-down(md) {
|
|
&.o_ios_app {
|
|
.o_apps {
|
|
flex-direction: column;
|
|
font-size: $o-home-menu-font-size-base * 1.25;
|
|
margin-top: map-get($spacers, 1);
|
|
padding: 0 map-get($spacers, 2);
|
|
}
|
|
|
|
.o_app {
|
|
flex-direction: row !important;
|
|
justify-content: initial !important;
|
|
width: 100%;
|
|
background-color: rgba(255, 255, 255, 0.1);
|
|
padding: map-get($spacers, 3) map-get($spacers, 4) !important;
|
|
}
|
|
|
|
.o_app_icon {
|
|
width: $o-home-menu-app-icon-max-width * 0.75;
|
|
height: $o-home-menu-app-icon-max-width * 0.75;
|
|
margin-right: map-get($spacers, 4);
|
|
}
|
|
|
|
.o_caption {
|
|
text-align: start !important;
|
|
}
|
|
}
|
|
}
|
|
}
|