themes: adjust CSS for reworked apply widget

Signed-off-by: Jo-Philipp Wich <jo@mein.io>
This commit is contained in:
Jo-Philipp Wich 2018-05-31 15:38:03 +02:00
parent 5427395649
commit 79d793dffe
3 changed files with 49 additions and 3 deletions

View file

@ -1801,3 +1801,7 @@ div.cbi-value var,
line-height: 6px;
border: none;
}
html body.apply-overlay-active {
height: calc(100vh - 63px);
}

View file

@ -313,6 +313,12 @@ header > .container > .brand {
color: red;
}
.alert-message h4 {
font-weight: bold;
font-size: 110%;
padding-bottom: 1em;
}
#maincontent > .container > div:nth-child(1).alert-message.warning > a {
font: inherit;
overflow: visible;
@ -565,7 +571,7 @@ td > table > tbody > tr > td,
/* button style */
.cbi-button {
.btn, .cbi-button {
-webkit-appearance: none;
text-transform: uppercase;
color: rgba(0, 0, 0, 0.87);
@ -590,6 +596,9 @@ td > table > tbody > tr > td,
width: auto !important;
}
.btn:hover,
.btn:focus,
.btn:active,
.cbi-button:hover,
.cbi-button:focus,
.cbi-button:active {
@ -599,15 +608,19 @@ td > table > tbody > tr > td,
color: rgba(0, 0, 0, 0.87);
}
.btn:hover,
.btn:focus,
.cbi-button:hover,
.cbi-button:focus {
box-shadow: 0 0px 2px rgba(0, 0, 0, 0.12), 0 2px 2px rgba(0, 0, 0, 0.2);
}
.btn:active,
.cbi-button:active {
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
}
.btn:disabled,
.cbi-button:disabled {
cursor: not-allowed;
pointer-events: none;

View file

@ -181,6 +181,33 @@ code {
background-color: white;
}
.alert-message {
font-size: 9pt;
font-weight: normal;
padding: .5em;
border-radius: 3px;
color: #000;
}
.alert-message.notice {
background: linear-gradient(#ccc 0%, #eee 100%);
color: #4a6b7c;
}
.alert-message.warning {
background: linear-gradient(#dda 0%, #dd8 100%);
color: #c00;
}
.alert-message > * {
margin: .5em;
}
.alert-message > h4 {
font-weight: bold;
font-size: 10pt;
}
div.hostinfo {
float: left;
margin: 0;
@ -447,18 +474,20 @@ img.cbi-image-button {
vertical-align: middle;
}
.cbi-button {
.btn, .cbi-button {
padding: 2px;
border-radius: 3px;
border: 1px solid #aaa;
background: #eee 1px center no-repeat;
}
.cbi-button:hover {
.btn:hover, .cbi-button:hover {
border-color: #4a6b7c;
background-color: #fff;
}
.btn[disabled],
.btn[disabled]:hover,
.cbi-button[disabled],
.cbi-button[disabled]:hover {
opacity: .6;