MaDgIK
/
openaire-theme
13
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Add tab and dropdown css. Add ovveride css for links, navbar

This commit is contained in:
Konstantinos Triantafyllou 2022-03-04 17:35:02 +02:00
parent e5410728a1
commit f4123f0969
9 changed files with 127 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
css/import.css vendored
View File

@ -3,19 +3,21 @@
@import "theme.update.css";
@import "structure/variables.css";
@import "structure/height.css";
@import "structure/text.css";
@import "structure/button.css";
@import "structure/link.css";
@import "structure/background.css";
@import "structure/icons.css";
@import "structure/breadcrumbs.css";
@import "structure/card.css";
@import "structure/navbar.css";
@import "structure/list.css";
@import "structure/alert.css";
@import "structure/slider.css";
@import "structure/background.css";
@import "structure/breadcrumb.css";
@import "structure/button.css";
@import "structure/card.css";
@import "structure/dropdown.css";
@import "structure/height.css";
@import "structure/icons.css";
@import "structure/input.css";
@import "structure/link.css";
@import "structure/list.css";
@import "structure/navbar.css";
@import "structure/slider.css";
@import "structure/text.css";
@import "structure/tab.css";
@import "openaire.css";

4
css/openaire.css
View File

@ -1 +1,5 @@
/* Overrides common to all dashboards*/
.graph {
--link-color: var(--graph-color);
--font-primary-color: var(--graph-color);
}

4
css/structure/background.css
View File

@ -1,9 +1,9 @@
:root{
--primary-background: var(--primary-color);
--primary-background-image: linear-gradient(51deg, var(--primary-color) 50%,var(--primary-color) 75%, var(--secondary-color) 100%);
--primary-background-image: linear-gradient(51deg, var(--primary-light-color) 0%, var(--primary-dark-color) 100%);
--primary-background-color: var(--light-color);
--secondary-background: var(--secondary-color);
--secondary-background-image: linear-gradient(51deg, var(--primary-color) 50%,var(--primary-color) 75%, var(--secondary-color) 100%);
--secondary-background-image: none;
--secondary-background-color: var(--light-color);
}

0
css/structure/breadcrumbs.css → css/structure/breadcrumb.css
View File

30
css/structure/dropdown.css Normal file
View File

@ -0,0 +1,30 @@
:root {
--dropdown-background: var(--light-color);
--dropdown-color: var(--grey-color);
--dropdown-background-hover: var(--light-blue);
--dropdown-font-size: 14px;
}
.uk-navbar-dropdown, .uk-dropdown {
background: var(--dropdown-background);
border-radius: 0;
padding: 5px 0;
}
.uk-navbar-dropdown-nav > li > a, .uk-dropdown-nav > li > a {
padding: 5px 30px;
background: transparent;
color: var(--dropdown-color);
font-weight: normal;
font-size: 14px;
}
.uk-navbar-dropdown-nav > li:hover > a, .uk-dropdown-nav > li:hover > a,
.uk-navbar-dropdown-nav > li.uk-active > a, .uk-dropdown-nav > li.uk-active > a {
background: var(--dropdown-background-hover);
}
.uk-nav > .uk-nav-divider {
margin: 5px 0;
}

24
css/structure/link.css
View File

@ -1,13 +1,25 @@
/*:root{
:root {
--link-color: var(--primary-color);
--link-color-hover: var(--secondary-color);
}
.uk-link, a{
color:var(--link-color);
/*.uk-button-text, .uk-button-text:hover {
color: var(--link-color);
}
.uk-link:hover, a:hover{
color:var(--link-color-hover);
.uk-button-text.uk-disabled, .uk-button-text:hover.uk-disabled {
color: var(--disable-color);
}*/
.uk-link, a {
color: var(--link-color);
}
.uk-link-muted {
color: var(--disable-color);
}
.uk-link:hover, .uk-link-toggle:hover, .uk-link-muted:hover, .uk-link-text:hover, .uk-link-heading:hover {
color: var(--link-color-hover) !important;
text-decoration: underline !important;
}

26
css/structure/navbar.css
View File

@ -1,9 +1,33 @@
:root {
--navbar-background-color: var(--light-color);
--navbar-background-image: none;
--navbar-color: var(--grey-color);
--navbar-color-hover: var(--link-color);
--navbar-height: 90px;
--navbar-shadow: 0px 3px 6px #0000001A;
}
navbar .uk-navbar-container {
background-color: var(--navbar-background-color) !important;
background: var(--navbar-background-color) !important;
background-image: var(--navbar-background-image) !important;
height: var(--navbar-height);
border-bottom: none !important;
box-shadow: var(--navbar-shadow);
}
.uk-navbar-container .uk-logo {
padding-top: 10px;
padding-bottom: 10px;
}
.uk-navbar-container .uk-logo > img {
max-height: calc(var(--navbar-height) - 20px);
}
.uk-navbar-item, .uk-navbar-nav > li > a, .uk-navbar-toggle {
min-height: var(--navbar-height);
}
.uk-navbar-nav > li.uk-active >a::before, .uk-navbar-nav >li:hover >a::before, .uk-navbar-nav >li >a[aria-expanded=true]::before {
opacity: 0;
}

28
css/structure/tab.css Normal file
View File

@ -0,0 +1,28 @@
:root {
--tab-bar-border: 2px solid var(--muted-color);
--tab-color: var(--placeholder-color);
--tab-color-hover: var(--secondary-color);
--tab-active-border: 3px solid var(--secondary-color);
--tab-active-color: var(--primary-color);
}
.uk-tab::before {
border-bottom: var(--tab-bar-border);
box-shadow: none;
}
.uk-tab > li > a {
color: var(--tab-color);
font-weight: normal;
border-bottom: none;
}
.uk-tab > * > a:hover {
color: var(--tab-color-hover);
}
.uk-tab> li.uk-active > a {
color: var(--tab-active-color);
border-bottom: var(--tab-active-border);
font-weight: 600;
}

6
css/structure/variables.css
View File

@ -9,9 +9,11 @@
--dark-color: #2C2C2C;
--grey-color: #4B4B4B;
--placeholder-color: #8E8E8E;
--disable-color: #B3B3B3;
--muted-color: #EAEAEA;
--light-color: #FFFFFF;
--default-color: #F9F9F9;
--light-blue: #F4F8F9;
--explore-color: #D95F2D;
--provide-color: #37C7E9;
@ -20,6 +22,8 @@
--monitor-color-rgb: 86, 166, 1;
--monitor-light-color: #8BCC00;
--monitor-dark-color: #228001;
/**/
/* Connect */
--connect-color: #EBB13E;
/* Graph */
--graph-color: #FA193E;
}