1
0
Fork 0
mirror of https://github.com/documize/community.git synced 2025-07-24 15:49:44 +02:00

Introduce new button and toolbar styles

This commit is contained in:
Harvey Kandola 2018-12-06 20:13:03 +00:00
parent 3b179d5bc0
commit 0de7efdf20
11 changed files with 420 additions and 109 deletions

View file

@ -0,0 +1,88 @@
%dmz-toolbar {
display: inline-block;
text-align: center;
white-space: nowrap;
vertical-align: middle;
border: 1px solid transparent;
height: 30px;
padding: 5px 10px;
line-height: 24px;
@extend .no-select;
@include border-radius(6px);
> .dicon {
font-size: 16px;
font-weight: 500;
color: map-get($gray-shades, 600);
padding: 0 0.25rem;
cursor: pointer;
&:hover {
color: map-get($gray-shades, 700);
}
}
> .red {
color: map-get($red-shades, 500);
&:hover {
color: map-get($red-shades, 600);
}
}
> .yellow {
color: map-get($yellow-shades, 600);
&:hover {
color: map-get($yellow-shades, 700);
}
}
> .green {
color: map-get($green-shades, 500);
&:hover {
color: map-get($green-shades, 600);
}
}
}
.dmz-toolbar-dark-small {
@extend %dmz-toolbar;
background-color: map-get($gray-shades, 200);
}
.dmz-toolbar-dark-large {
@extend %dmz-toolbar;
background-color: map-get($gray-shades, 200);
height: 36px;
padding: 5px 10px;
line-height: 33px;
> .dicon {
font-size: 20px;
font-weight: 500;
}
}
.dmz-toolbar-small {
@extend %dmz-toolbar;
background-color: transparent;
}
.dmz-toolbar-large {
@extend .dmz-toolbar-dark-large;
background-color: transparent;
}
.dmz-toolbar-raised-small {
@extend %dmz-toolbar;
background-color: map-get($gray-shades, 100);
@include button-shadow-light();
}
.dmz-toolbar-raised-large {
@extend .dmz-toolbar-dark-large;
background-color: map-get($gray-shades, 100);
@include button-shadow-light();
}