Add placeholder button in console header for graceful shutdown

This commit is contained in:
dr|z3d 2021-08-12 02:42:20 +00:00
parent 50341f4b08
commit 6a8d539ccd
2 changed files with 51 additions and 7 deletions

View file

@ -1,3 +1,6 @@
/* "purple" console theme for i2pd */
/* Author: dr|z3d */
:root {
--bodyfont: Open Sans, Noto Sans, Ubuntu, Segoe UI, sans-serif;
--monospaced: Droid Sans Mono, Noto Mono, Lucida Console, DejaVu Sans Mono, monospace;
@ -88,10 +91,6 @@ body {
color: var(--ink);
}
.header {
display: none;
}
.wrapper {
margin: 0 auto;
padding: 5px;
@ -101,6 +100,39 @@ body {
text-align: center;
}
.header {
display: inline-block;
width: 100%;
vertical-align: middle;
position: relative;
}
#shutdownbutton {
position: absolute;
top: 0;
right: -10px;
display: inline-block;
width: 40px;
height: 44px;
font-size: 0;
background: var(--shutdown) no-repeat center center / 24px;
opacity: .6;
mix-blend-mode: luminosity;
}
#shutdownbutton:hover, #shutdownbutton:focus {
opacity: .7;
mix-blend-mode: normal;
}
#shutdownbutton:active {
transform: scale(.85);
}
#shutdownbutton:active[data-tooltip]::after {
display: none;
}
b {
font-weight: 600;
}
@ -430,9 +462,10 @@ td:last-child {
}
#warning, #success {
display: block;
margin: -5px 0 10px;
width: 100%;
height: 48px;
display: block;
background: var(--error) no-repeat center top / 44px;
}
@ -844,7 +877,8 @@ a[href^="https://gwhois"] {
}
span[data-tooltip]:hover::after, span[data-tooltip]:active::after,
.itag[data-tooltip]:hover::after, .itag[data-tooltip]:active::after {
.itag[data-tooltip]:hover::after, .itag[data-tooltip]:active::after,
.header a[data-tooltip][href*="cmd"]:hover::after {
padding: 3px 6px;
display: inline-block;
position: absolute;
@ -858,6 +892,11 @@ span[data-tooltip]:hover::after, span[data-tooltip]:active::after,
background: #fff !important;
content: attr(data-tooltip);
text-shadow: none !important;
white-space: nowrap;
}
.header a[data-tooltip][href*="cmd"]:hover::after {
left: -50px;
}
.slide label {