1. Change border color in flat inputs to gray-300. 2. Cards: Disabled apply opacity only in content. Accordion: Change arrows and size of icon and align content before icon. 3. Made off-canvar full screen in mobile.

This commit is contained in:
Konstantinos Triantafyllou 2023-03-22 16:07:27 +02:00
parent 2c01fda5b4
commit f7ce215ad7
6 changed files with 36 additions and 10 deletions

View File

@ -3,16 +3,20 @@
@accordion-padding-bottom: 20px;
@accordion-title-font-size: @global-large-font-size;
@accordion-title-font-size-s: @global-font-size;
@accordion-title-padding-vertical: 5px;
@accordion-title-padding-horizontal: 0;
@accordion-title-background: transparent;
@accordion-title-color: @global-emphasis-color;
@accordion-title-hover-color: @global-primary-background;
@accordion-title-hover-color: @accordion-title-color;
@accordion-title-font-weight: 600;
@accordion-icon-margin-left: 10px;
@accordion-icon-color: @global-primary-background;
@accordion-content-font-size: @global-font-size;
@accordion-content-font-size-s: @global-small-font-size;
.uk-accordion > * {
padding-bottom: @accordion-padding-bottom;
border-bottom: @accordion-border-width solid @accordion-border;
@ -25,20 +29,36 @@
font-weight: @accordion-title-font-weight;
&::before {
content: "\e5cc";
content: "\e5cf";
font-family: "Material Icons";
font-size: 2em;
font-size: 1.5em;
line-height: inherit;
margin-left: @accordion-icon-margin-left;
margin-top: -0.4em;
margin-top: -0.3em;
float: right;
color: @accordion-icon-color;
}
}
.hook-accordion-content() {
font-size: @accordion-content-font-size;
margin-right: 1.5*@accordion-title-font-size;
}
.hook-accordion-misc() {
@media(max-width: @breakpoint-small-max) {
.uk-accordion-title {
font-size: @accordion-title-font-size-s;
}
.uk-accordion-content {
font-size: @accordion-content-font-size-s;
margin-right: 1.5*@accordion-title-font-size-s;
}
}
.uk-open > .uk-accordion-title::before {
content: "\e5cf"
content: "\e5ce"
}
}

View File

@ -44,7 +44,10 @@
&.uk-disabled {
box-shadow: @card-disabled-box-shadow;
border: @card-disabled-border-width solid @card-disabled-border;
opacity: @card-disabled-opacity;
.uk-card-media-top, .uk-card-body, .uk-card-media-bottom {
opacity: @card-disabled-opacity;
}
}
&:not(.uk-card-default, .uk-card-primary, .uk-card-secondary):hover {
@ -92,7 +95,9 @@
@media (min-width: @breakpoint-medium) {
.uk-card {
&.uk-disabled {
opacity: @card-disabled-opacity-m;
.uk-card-media-top, .uk-card-body, .uk-card-media-bottom {
opacity: @card-disabled-opacity-m;
}
}
}

View File

@ -7,6 +7,7 @@
@grey-color: #2C2C2C;
@placeholder-color: #6e6e6e;
@disable-color: #B3B3B3;
@gray-300: #DDDDDD;
@muted-color: #EAEAEA;
@light-color: #FFFFFF;
@table-color: #F5F5F5;

View File

@ -242,7 +242,7 @@
&.flat {
--input-background: @global-inverse-color;
--input-border: @global-muted-color;
--input-border: @gray-300;
}
&.border-bottom {

View File

@ -13,7 +13,7 @@
@offcanvas-count-background: @global-secondary-background;
@offcanvas-count-color: @global-inverse-color;
@offcanvas-bar-width: 350px;
@offcanvas-bar-width: 100vw;
@offcanvas-bar-padding-vertical: @global-medium-gutter;
@offcanvas-bar-padding-horizontal: @global-medium-gutter;
@offcanvas-bar-width-m: 550px;

View File

@ -92,7 +92,7 @@
&.flat {
--search-input-background: @global-inverse-color;
--search-input-border-width: @global-border-width;
--search-input-border: @global-muted-color;
--search-input-border: @gray-300;
}
&.outer {