using button-color + button-background

This commit is contained in:
Silke Pisulla 2017-01-05 10:47:49 +01:00
commit dba38052f8
6 changed files with 62 additions and 42 deletions

View file

@ -21,6 +21,7 @@
} }
li { li {
list-style-type: none;
color: @color-nav; color: @color-nav;
&:first-of-type { &:first-of-type {
@ -29,16 +30,26 @@
} }
.li { .li {
color: @color-nav;
a { a {
color: inherit; display: list-item;
list-style-type: square;
color: @color-nav;
padding-top: .1rem;
padding-bottom: .1rem;
transition: @transition color;
&:hover,
&:focus,
&:active {
color: @button_color;
}
} }
} }
/* + + + first level + + + */ /* + + + first level + + + */
> li {position: relative; > li {
position: relative;
list-style-type: none; list-style-type: none;
margin: 0; margin: 0;
padding: 0 0 .3rem 0; padding: 0 0 .3rem 0;
@ -48,22 +59,20 @@
content: ''; content: '';
position: absolute; position: absolute;
left: 0; left: 0;
bottom: 0px; bottom: 0;
display: block; display: block;
width: 100%; width: 100%;
height: 1px; height: 1px;
background-color: @color-border; background-color: @color-border;
transition: @transition background-color;
} }
> .li { > .li {
position: relative; position: relative;
z-index: 1; z-index: 1;
padding: .5rem 0 .5rem (@icon-size + 1);
margin-top: -1px; margin-top: -1px;
padding: .5rem 0 .5rem (@icon-size + 1);
&::before { &::before {
color: @color-nav;
content: counter(nav-counter); content: counter(nav-counter);
position: absolute; position: absolute;
top: 0; top: 0;
@ -77,6 +86,7 @@
height: 100%; height: 100%;
width: @icon-size; width: @icon-size;
overflow: hidden; overflow: hidden;
color: @color-nav;
text-align: center; text-align: center;
margin-top: auto; margin-top: auto;
margin-bottom: auto; margin-bottom: auto;
@ -90,7 +100,6 @@
width: 1px; width: 1px;
left: (@icon-size + .5); left: (@icon-size + .5);
background-color: @color-border; background-color: @color-border;
transition: @transition background-color;
} }
&.opened, &.opened,
@ -129,6 +138,7 @@
text-align: center; text-align: center;
margin-top: auto; margin-top: auto;
margin-bottom: auto; margin-bottom: auto;
transition: @transition color;
} }
&::after { &::after {
@ -145,37 +155,41 @@
&:hover, &:hover,
&:focus, &:focus,
&:active { &:active {
background-color: #fff; background-color: @button_background;
border-color: @color-link; border-color: @button_color;
color: @color-link; color: @button_color;
text-decoration: none; text-decoration: none;
&::before {
color: @button_color;
}
&::after {
background-color: @button_color;
}
} }
} }
} }
&.opened { &.opened {
a { a {
background-color: @color-link; background-color: @button_color;
color: #fff; color: @button_background;
&::after, &::before {
&::before{ color: @button_background;
color: #fff;
border-color: #fff;
} }
&:hover, &:hover,
&:focus, &:focus,
&:active { &:active {
background-color: #fff; background-color: @button_background;
border-color: @color-link; border-color: @button_color;
color: @color-link; color: @button_color;
text-decoration: none; text-decoration: none;
&::after,
&::before { &::before {
color: inherit; color: @button_color;
border-color: inherit;
} }
} }
} }

View file

@ -160,6 +160,8 @@
} }
} }
.mode_admin{
/* + + + + + ? + + + + + */
.mode_admin {
} }

View file

@ -90,17 +90,9 @@
} }
.prefix { .prefix {
.btn-prefix (); .btn-prefix();
.icon-clipboard(); .icon-clipboard();
} }
&.opentasks,
&.opentask {
.num {
background-color: @color-link;
color: #fff;
}
}
} // user-task } // user-task
} // li } // li
@ -118,10 +110,10 @@
&:hover, &:hover,
&:active, &:active,
&:focus { &:focus {
border-color: @color-nav-hover; border-color: @button_color;
//-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6); //-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);
//box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6); //box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);
color: @color-nav-hover; color: @button_color;
} }
&::before { &::before {

View file

@ -46,11 +46,11 @@
&:hover, &:hover,
&:focus, &:focus,
&:active { &:active {
border: solid 1px @color-link; border: solid 1px @button_color;
color: @color-link; color: @button_color;
&::after { &::after {
background-color: @color-link; background-color: @button_color;
} }
} }

View file

@ -50,16 +50,28 @@
} }
} }
/* + + + linklist + + + */ /* + + + linklist + + + */
ul { ul {
padding-left: (@icon-size + .5); padding-left: (@icon-size + .5);
} }
li { li {
color: @color-nav; list-style-type: none;
a { a {
color: inherit; display: list-item;
list-style-type: square;
color: @color-nav;
padding-top: .1rem;
padding-bottom: .1rem;
transition: @transition color;
&:hover,
&:focus,
&:active {
color: @button_color;
}
} }
&:first-of-type { &:first-of-type {

View file

@ -164,7 +164,7 @@
top: -.4em; top: -.4em;
background-color: @button_color; background-color: @button_color;
border-radius: 2px; border-radius: 2px;
color: #fff; color: @button_background;
font-size: .6rem; font-size: .6rem;
font-weight: 400; font-weight: 400;
text-align: center; text-align: center;