Integrate light theme's `gray-light` using a media query
This commit is contained in:
parent
62979c31f0
commit
b7f42e52dc
|
@ -24,7 +24,8 @@ pre > code {
|
|||
}
|
||||
|
||||
.chapter a {
|
||||
border-bottom: 1px @gray-light dotted;
|
||||
border-bottom: 1px dotted;
|
||||
.var(border-bottom-color, gray-light);
|
||||
font-weight: @font-weight-bold;
|
||||
|
||||
&:hover {
|
||||
|
|
|
@ -35,7 +35,7 @@
|
|||
}
|
||||
|
||||
&.-inactive {
|
||||
color: @gray-light;
|
||||
.var(color, gray-light);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -70,7 +70,7 @@
|
|||
color: white;
|
||||
}
|
||||
.group-grid-cell > div.state-none {
|
||||
background-color: @gray-light;
|
||||
.var(background-color, gray-light);
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -651,7 +651,7 @@ form.instance-features span.description, form.object-features span.description {
|
|||
|
||||
& + span.hint {
|
||||
margin: .35em;
|
||||
color: @gray-light;
|
||||
.var(color, gray-light);
|
||||
font-style: italic;
|
||||
}
|
||||
}
|
||||
|
@ -702,7 +702,8 @@ form.instance-features span.description, form.object-features span.description {
|
|||
.markdown,
|
||||
.plugin-output {
|
||||
a {
|
||||
border-bottom: 1px @gray-light dotted;
|
||||
border-bottom: 1px dotted;
|
||||
.var(border-bottom-color, gray-light);
|
||||
|
||||
&:hover {
|
||||
border-bottom: 1px solid;
|
||||
|
|
|
@ -5,7 +5,7 @@
|
|||
white-space: nowrap;
|
||||
|
||||
td {
|
||||
color: @gray-light;
|
||||
.var(color, gray-light);
|
||||
padding: 0.2em;
|
||||
text-align: center;
|
||||
width: 1em;
|
||||
|
@ -66,7 +66,7 @@ form.filter-toggle {
|
|||
display: inline-block;
|
||||
vertical-align: top;
|
||||
margin-left: .5em;
|
||||
color: @gray-light;
|
||||
.var(color, gray-light);
|
||||
}
|
||||
|
||||
input[type="checkbox"]:checked ~ label {
|
||||
|
|
|
@ -20,7 +20,8 @@
|
|||
}
|
||||
|
||||
h3 {
|
||||
border-bottom: 1px solid @gray-light;
|
||||
border-bottom: 1px solid;
|
||||
.var(border-bottom-color, gray-light);
|
||||
}
|
||||
|
||||
h3 em,
|
||||
|
@ -36,7 +37,7 @@
|
|||
}
|
||||
|
||||
.icon {
|
||||
color: @gray-light;
|
||||
.var(color, gray-light);
|
||||
|
||||
&.granted {
|
||||
color: @color-granted;
|
||||
|
@ -59,7 +60,8 @@
|
|||
|
||||
&:hover .spacer {
|
||||
.transition(opacity .25s .25s ease-in);
|
||||
border: 0 dashed @gray-light;
|
||||
border: 0 dashed;
|
||||
.var(border-color, gray-light);
|
||||
border-top-width: .2em;
|
||||
opacity: 1;
|
||||
}
|
||||
|
|
|
@ -127,6 +127,7 @@
|
|||
|
||||
--gray: #7F7F7F;
|
||||
--gray-semilight: #A9A9A9;
|
||||
--gray-light: #C9C9C9;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -110,7 +110,8 @@ form.icinga-form.inline .control-label-group {
|
|||
margin: 0;
|
||||
padding: 0;
|
||||
border: none;
|
||||
border-top: 1px solid @gray-light;
|
||||
border-top: 1px solid;
|
||||
.var(border-top-color, gray-light);
|
||||
|
||||
legend, .description {
|
||||
margin-left: .7em;
|
||||
|
@ -393,12 +394,12 @@ form.inline {
|
|||
cursor: default;
|
||||
|
||||
& > .toggle-slider {
|
||||
background-color: @gray-light;
|
||||
border-color: @gray-light;
|
||||
.var(background-color, gray-light);
|
||||
.var(border-color, gray-light);
|
||||
|
||||
&:before {
|
||||
background-color: @gray-lighter;
|
||||
border-color: @gray-light;
|
||||
.var(border-color, gray-light);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -36,7 +36,8 @@
|
|||
}
|
||||
|
||||
tr:not(:last-child) td {
|
||||
border: 0 solid @gray-light;
|
||||
border: 0 solid;
|
||||
.var(border-color, gray-light);
|
||||
border-bottom-width: 1px;
|
||||
}
|
||||
|
||||
|
|
|
@ -207,7 +207,8 @@
|
|||
.var(color, text-color);
|
||||
display: block;
|
||||
line-height: 2.5em;
|
||||
border-left: .5em solid @gray-light;
|
||||
border-left: .5em solid;
|
||||
.var(border-left-color, gray-light);
|
||||
.var(background, body-bg-color);
|
||||
margin-bottom: 1px;
|
||||
box-shadow: 0 0 1em 0 rgba(0,0,0,0.25);
|
||||
|
|
|
@ -162,7 +162,8 @@ a:hover > .icon-cancel {
|
|||
}
|
||||
|
||||
thead {
|
||||
border-bottom: 1px solid @gray-light;
|
||||
border-bottom: 1px solid;
|
||||
.var(border-bottom-color, gray-light);
|
||||
}
|
||||
|
||||
tbody tr {
|
||||
|
@ -282,7 +283,7 @@ a:hover > .icon-cancel {
|
|||
box-shadow: 0 0 1/3em rgba(0,0,0,.3);
|
||||
|
||||
&:hover {
|
||||
background: @gray-light;
|
||||
.var(background, gray-light);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -241,7 +241,8 @@
|
|||
#layout:not(.minimal-layout) #menu .nav-level-1 > .nav-item:not(.active).hover {
|
||||
> .nav-level-2 {
|
||||
background-color: @menu-flyout-bg-color;
|
||||
border: 1px solid @gray-light;
|
||||
border: 1px solid;
|
||||
.var(border-color, gray-light);
|
||||
border-radius: .25em;
|
||||
box-shadow: 0 0 1em 0 rgba(0,0,0,.3);
|
||||
padding: @vertical-padding 0;
|
||||
|
@ -253,8 +254,10 @@
|
|||
.transform(rotate(45deg));
|
||||
|
||||
.var(background-color, body-bg-color);
|
||||
border-bottom: 1px solid @gray-light;
|
||||
border-left: 1px solid @gray-light;
|
||||
border-bottom: 1px solid;
|
||||
.var(border-bottom-color, gray-light);
|
||||
border-left: 1px solid;
|
||||
.var(border-left-color, gray-light);
|
||||
content: "";
|
||||
display: block;
|
||||
height: 1.1em;
|
||||
|
@ -415,19 +418,19 @@ input[type=text].search-input {
|
|||
}
|
||||
|
||||
.search-input:focus:-moz-placeholder { // FF 18-
|
||||
color: @gray-light;
|
||||
.var(color, gray-light);
|
||||
}
|
||||
|
||||
.search-input:focus::-moz-placeholder { // FF 19+
|
||||
color: @gray-light;
|
||||
.var(color, gray-light);
|
||||
}
|
||||
|
||||
.search-input:focus:-ms-input-placeholder {
|
||||
color: @gray-light;
|
||||
.var(color, gray-light);
|
||||
}
|
||||
|
||||
.search-input:focus::-webkit-input-placeholder {
|
||||
color: @gray-light;
|
||||
.var(color, gray-light);
|
||||
}
|
||||
|
||||
.search-input ~ .search-reset {
|
||||
|
|
|
@ -65,7 +65,8 @@
|
|||
.rounded-corners(0 0 0.3em 0.3em);
|
||||
|
||||
.var(background-color, body-bg-color);
|
||||
border: 1px solid @gray-light;
|
||||
border: 1px solid;
|
||||
.var(border-color, gray-light);
|
||||
border-top: none;
|
||||
margin-left: -1px;
|
||||
min-width: 14em;
|
||||
|
|
|
@ -286,7 +286,8 @@ form.role-form {
|
|||
}
|
||||
|
||||
.collapsible-control {
|
||||
border-bottom: 1px solid @gray-light;
|
||||
border-bottom: 1px solid;
|
||||
.var(border-bottom-color, gray-light);
|
||||
cursor: pointer;
|
||||
-webkit-touch-callout: none;
|
||||
-webkit-user-select: none;
|
||||
|
@ -362,7 +363,7 @@ ul.tree li::before, ul.tree li::after {
|
|||
position: absolute;
|
||||
right: auto;
|
||||
left: -0.2em;
|
||||
border-color: @gray-light;
|
||||
.var(border-color, gray-light);
|
||||
border-style: dotted;
|
||||
border-width: 0;
|
||||
}
|
||||
|
@ -543,8 +544,8 @@ ul.tree li a.error:hover {
|
|||
}
|
||||
|
||||
.slice-state-not-checked {
|
||||
stroke: @gray-light;
|
||||
background: @gray-light;
|
||||
.var(stroke, gray-light);
|
||||
.var(background, gray-light);
|
||||
}
|
||||
|
||||
.donut {
|
||||
|
@ -570,7 +571,7 @@ ul.tree li a.error:hover {
|
|||
}
|
||||
|
||||
.donut-label-big {
|
||||
color: @gray-light;
|
||||
.var(color, gray-light);
|
||||
font-size: 6em;
|
||||
line-height: 0;
|
||||
text-anchor: middle;
|
||||
|
|
|
@ -1,5 +1,3 @@
|
|||
|
||||
@gray-semilight: #A9A9A9;
|
||||
@gray-light: #C9C9C9;
|
||||
@gray-lighter: #EEEEEE;
|
||||
@gray-lightest: #F7F7F7;
|
||||
|
|
Loading…
Reference in New Issue