Files
webgui/emhttp/plugins/dynamix/styles/default-gray.css
2024-02-22 14:28:49 +01:00

275 lines
20 KiB
CSS

html{font-family:clear-sans,sans-serif;font-size:62.5%;height:100%}
body{font-size:1.3rem;color:#606e7f;background-color:#1b1d1b;padding:0;margin:0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
img{border:none;text-decoration:none;vertical-align:middle}
p{text-align:left}
p.centered{text-align:left}
p:empty{display:none}
a:hover{text-decoration:underline}
a{color:#486dba;text-decoration:none}
a.none{color:#606e7f}
a.img{text-decoration:none;border:none}
a.info{position:relative}
a.info span{display:none;white-space:nowrap;font-variant:small-caps;position:absolute;top:16px;left:12px;color:#b0b0b0;line-height:2rem;padding:5px 8px;border:1px solid #82857e;border-radius:3px;background-color:#121510}
a.info:hover span{display:block;z-index:1}
a.nohand{cursor:default}
a.hand{cursor:pointer;text-decoration:none}
a.static{cursor:default;color:#606060;text-decoration:none}
a.view{display:inline-block;width:20px}
i.spacing{margin-left:0;margin-right:10px}
i.icon{font-size:1.6rem;margin-right:4px;vertical-align:middle}
i.title{display:none}
i.control{cursor:pointer;color:#606060;font-size:1.8rem}
i.favo{display:none;font-size:1.8rem;position:absolute}
pre ul{margin:0;padding-top:0;padding-bottom:0;padding-left:28px}
pre li{margin:0;padding-top:0;padding-bottom:0;padding-left:18px}
big{font-size:1.4rem;font-weight:bold;text-transform:uppercase}
hr{border:none;height:1px!important;color:#606e7f;background-color:#606e7f}
input[type=text],input[type=password],input[type=number],input[type=url],input[type=email],input[type=date],input[type=file],textarea,.textarea{font-family:clear-sans;font-size:1.3rem;background-color:transparent;border:1px solid #606e7f;padding:5px 6px;min-height:2rem;line-height:2rem;outline:none;width:300px;margin:0 20px 0 0;box-shadow:none;border-radius:0;color:#606e7f}
input[type=button],input[type=reset],input[type=submit],button,button[type=button],a.button,.sweet-alert button{font-family:clear-sans;font-size:1.2rem;border:1px solid #606e7f;border-radius:5px;min-width:76px;margin:10px 12px 10px 0;padding:8px;text-align:center;cursor:pointer;outline:none;color:#606e7f;background-color:#121510}
input[type=checkbox]{vertical-align:middle;margin-right:6px}
input[type=number]::-webkit-outer-spin-button,input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none}
input[type=number]{-moz-appearance:textfield}
input:focus[type=text],input:focus[type=password],input:focus[type=number],input:focus[type=url],input:focus[type=email],input:focus[type=file],textarea:focus,.sweet-alert button:focus{background-color:#121510;border-color:#0072c6}
input:hover[type=button],input:hover[type=reset],input:hover[type=submit],button:hover,button:hover[type=button],a.button:hover,.sweet-alert button:hover{border-color:#0072c6;color:#b0b0b0;background-color:#121510!important}
input:active[type=button],input:active[type=reset],input:active[type=submit],button:active,button:active[type=button],a.button:active,.sweet-alert button:active{border-color:#0072c6;box-shadow:none}
input[disabled],button[disabled],input:hover[type=button][disabled],input:hover[type=reset][disabled],input:hover[type=submit][disabled],button:hover[disabled],button:hover[type=button][disabled],input:active[type=button][disabled],input:active[type=reset][disabled],input:active[type=submit][disabled],button:active[disabled],button:active[type=button][disabled],textarea[disabled],.sweet-alert button[disabled]{color:#808080;border-color:#808080;background-color:#383a34;opacity:0.5;cursor:default}
input::-webkit-input-placeholder{color:#00529b}
select{-webkit-appearance:none;font-family:clear-sans;font-size:1.3rem;min-width:188px;max-width:314px;padding:6px 14px 6px 6px;margin:0 10px 0 0;border:1px solid #606e7f;box-shadow:none;border-radius:0;color:#606e7f;background-color:transparent;background-image:linear-gradient(66.6deg, transparent 60%, #606e7f 40%),linear-gradient(113.4deg, #606e7f 40%, transparent 60%);background-position:calc(100% - 8px),calc(100% - 4px);background-size:4px 6px,4px 6px;background-repeat:no-repeat;outline:none;display:inline-block;cursor:pointer}
select option{color:#606e7f;background-color:#121510}
select:focus{border-color:#0072c6}
select[disabled]{color:#808080;border-color:#808080;background-color:#383a34;opacity:0.3;cursor:default}
select[name=enter_view]{font-size:1.2rem;margin:0;padding:0 12px 0 0;border:none;min-width:auto}
select[name=enter_share]{font-size:1.1rem;color:#82857e;padding:0;border:none;min-width:40px;float:right;margin-top:18px;margin-right:20px}
select[name=port_select]{border:none;min-width:54px;padding-top:0;padding-bottom:0}
select.narrow{min-width:87px}
select.auto{min-width:auto}
select.slot{min-width:44rem;max-width:44rem}
input.narrow{width:174px}
input.trim{width:74px;min-width:74px}
textarea{resize:none}
#header{position:fixed;top:0;left:0;width:100%;height:90px;z-index:100;margin:0;background-color:#121510;background-size:100% 90px;background-repeat:no-repeat;border-bottom:1px solid #42453e}
#header .logo{float:left;margin-left:75px;color:#e22828;text-align:center}
#header .logo svg{width:160px;display:block;margin:25px 0 8px 0}
#header .block{margin:0;float:right;text-align:right;background-color:rgba(18,21,16,0.2);padding:10px 12px}
#header .text-left{float:left;text-align:right;padding-right:5px;border-right:solid medium #f15a2c}
#header .text-right{float:right;text-align:left;padding-left:5px}
#header .text-right a{color:#606e7f}
#header .text-right #licensetype{font-weight:bold;font-style:italic;margin-right:4px}
#menu{position:fixed;top:0;left:0;bottom:12px;width:65px;padding:0;margin:0;background-color:#383a34;z-index:2000;box-shadow:inset -1px 0 2px #121510}
#nav-block{position:absolute;top:0;bottom:12px;color:#ffdfb9;white-space:nowrap;float:left;overflow-y:scroll;direction:rtl;letter-spacing:1.8px;scrollbar-width:none}
#nav-block::-webkit-scrollbar{display:none}
#nav-block{-ms-overflow-style:none;overflow:-moz-scrollbars-none}
#nav-block>div{direction:ltr}
.nav-item{width:40px;text-align:left;padding:14px 24px 14px 0;border-bottom:1px solid #42453e;font-size:18px!important;overflow:hidden;transition:.2s background-color ease}
.nav-item:hover{width:auto;padding-right:0;color:#ffdfb9;background:-webkit-gradient(linear,left top,right top,from(#e22828),to(#ff8c2f));background:linear-gradient(90deg,#e22828 0,#ff8c2f);-webkit-transition:all 0.2s ease-in-out;transition:all 0.2s ease-in-out;border-bottom-color:#e22828}
.nav-item:hover a{color:#ffdfb9;background:-webkit-gradient(linear,left top,right top,from(#e22828),to(#ff8c2f));background:linear-gradient(90deg,#e22828 0,#ff8c2f);border-bottom-color:#e22828;font-size:18px}
.nav-item img{display:none}
.nav-item a{color:#a6a7a7;text-decoration:none;padding:20px 80px 13px 16px}
.nav-item.util a{padding-left:24px}
.nav-item a:before{font-family:docker-icon,fontawesome,unraid;font-size:26px;margin-right:25px}
.nav-item.util a:before{font-size:16px}
.nav-item.active,.nav-item.active a{color:#ffdfb9;background:-webkit-gradient(linear,left top,right top,from(#e22828),to(#ff8c2f));background:linear-gradient(90deg,#e22828 0,#ff8c2f)}
.nav-item.HelpButton.active:hover,.nav-item.HelpButton.active a:hover{background:-webkit-gradient(linear,left top,right top,from(#e22828),to(#ff8c2f));background:linear-gradient(90deg,#e22828 0,#ff8c2f);font-size:18px}
.nav-item.HelpButton.active,.nav-item.HelpButton.active a{font-size:18px}
.nav-item a b{display:none}
.nav-user{position:fixed;top:102px;right:10px}
.nav-user a{color:#606e7f;background-color:transparent}
.LanguageButton{font-size:12px!important} /* Fix Switch Language Being Cut-Off */
div.title{color:#39587f;margin:20px 0 10px 0;padding:10px 0;clear:both;background-color:#1b1d1b;border-bottom:1px solid #606e7f;letter-spacing:1.8px}
div.title span.left{font-size:1.6rem;text-transform:uppercase}
div.title span.right{font-size:1.6rem;padding-right:10px;float:right}
div.title span img,.title p{display:none}
div.title:first-child{margin-top:0}
div.title.shift{margin-top:-12px}
#clear{clear:both}
#footer{position:fixed;bottom:0;left:0;color:#808080;background-color:#121510;padding:5px 0;width:100%;height:1.6rem;line-height:1.6rem;text-align:center;z-index:10000}
#statusraid{float:left;padding-left:10px}
#countdown{margin:0 auto}
#copyright{font-family:bitstream;font-size:1.1rem;float:right;padding-right:10px}
.green{color:#4f8a10;padding-left:5px;padding-right:5px}
.red{color:#f0000c;padding-left:5px;padding-right:5px}
.orange{color:#e68a00;padding-left:5px;padding-right:5px}
.blue{color:#486dba;padding-left:5px;padding-right:5px}
.green-text,.passed{color:#4f8a10}
.red-text,.failed{color:#f0000c}
.orange-text,.warning{color:#e68a00}
.blue-text{color:#486dba}
.grey-text{color:#606060}
.green-orb{color:#33cc33}
.grey-orb{color:#c0c0c0}
.blue-orb{color:#0099ff}
.yellow-orb{color:#ff9900}
.red-orb{color:#ff3300}
.usage-bar{position:fixed;top:64px;left:300px;height:2.2rem;line-height:2.2rem;width:11rem;background-color:#606060}
.usage-bar>span{display:block;height:3px;color:#ffffff;background-color:#606e7f}
.usage-disk{position:relative;height:2.2rem;line-height:2.2rem;background-color:#232523;margin:0}
.usage-disk>span:first-child{position:absolute;left:0;margin:0!important;height:3px;background-color:#606e7f}
.usage-disk>span:last-child{position:relative;padding-right:4px;z-index:1}
.usage-disk.sys{line-height:normal;background-color:transparent;margin:-15px 20px 0 44px}
.usage-disk.sys>span{line-height:normal;height:12px;padding:0}
.usage-disk.mm{height:3px;line-height:normal;background-color:transparent;margin:5px 20px 0 0}
.usage-disk.mm>span:first-child{height:3px;line-height:normal}
.notice{background:url(../images/notice.png) no-repeat 30px 50%;font-size:1.5rem;text-align:left;vertical-align:middle;padding-left:100px;height:6rem;line-height:6rem}
.greenbar{background:-webkit-radial-gradient(#127a05,#17bf0b);background:linear-gradient(#127a05,#17bf0b)}
.orangebar{background:-webkit-radial-gradient(#ce7c10,#f0b400);background:linear-gradient(#ce7c10,#f0b400)}
.redbar{background:-webkit-radial-gradient(#941c00,#de1100);background:linear-gradient(#941c00,#de1100)}
.graybar{background:-webkit-radial-gradient(#949494,#d9d9d9);background:linear-gradient(#949494,#d9d9d9)}
table{border-collapse:collapse;border-spacing:0;border-style:hidden;margin:0;width:100%}
table thead td{line-height:3rem;height:3rem;white-space:nowrap}
table tbody td{line-height:3rem;height:3rem;white-space:nowrap}
table tbody tr.tr_last{border-bottom:1px solid #606e7f}
table.unraid thead tr:first-child>td{font-size:1.2rem;text-transform:uppercase;letter-spacing:1px;color:#82857e;border-bottom:1px solid #606e7f}
table.unraid tbody tr:not(.tr_last):hover>td{background-color:rgba(255,255,255,0.05)}
table.unraid tr>td{overflow:hidden;text-overflow:ellipsis;padding-left:8px}
table.unraid tr>td:hover{overflow:visible}
table.legacy{table-layout:auto!important}
table.legacy thead td{line-height:normal;height:auto;padding:7px 0}
table.legacy tbody td{line-height:normal;height:auto;padding:5px 0}
table.disk_status{table-layout:fixed}
table.disk_status tr>td:last-child{padding-right:8px}
table.disk_status tr>td:nth-child(1){width:13%}
table.disk_status tr>td:nth-child(2){width:30%}
table.disk_status tr>td:nth-child(3){width:8%;text-align:right}
table.disk_status tr>td:nth-child(n+4){width:7%;text-align:right}
table.disk_status tr.offline>td:nth-child(2){width:43%}
table.disk_status tr.offline>td:nth-child(n+3){width:5.5%}
table.disk_status tbody tr{border-bottom:1px solid #0c0f0b}
table.array_status{table-layout:fixed}
table.array_status tr>td{padding-left:8px;white-space:normal}
table.array_status tr>td:nth-child(1){width:33%}
table.array_status tr>td:nth-child(2){width:22%}
table.array_status.noshift{margin-top:0}
table.array_status td.line{border-top:1px solid #0c0f0b}
table.share_status{table-layout:fixed;margin-top:12px}
table.share_status tr>td{padding-left:8px}
table.share_status tr>td:nth-child(1){width:15%}
table.share_status tr>td:nth-child(2){width:30%}
table.share_status tr>td:nth-child(n+3){width:10%}
table.share_status tr>td:nth-child(5){width:15%}
table.dashboard{margin:0;border:none;background-color:#212f3d}
table.dashboard tbody{border:1px solid #566573}
table.dashboard tr:first-child>td{height:3.6rem;padding-top:12px;font-size:1.6rem;font-weight:bold;letter-spacing:1.8px;text-transform:none;vertical-align:top}
table.dashboard tr:last-child>td{padding-bottom:20px}
table.dashboard tr.last>td{padding-bottom:20px}
table.dashboard tr.header>td{padding-bottom:10px;color:#82857e}
table.dashboard tr{border:none}
table.dashboard td{line-height:normal;height:auto;padding:3px 10px;border:none!important}
table.dashboard td.stopgap{height:20px!important;line-height:20px!important;padding:0!important;background-color:#1b1d1b}
table.dashboard td.vpn{font-size:1.1rem;font-weight:bold;text-transform:uppercase;letter-spacing:1px}
table.dashboard td div.section{display:inline-block;vertical-align:top;margin-left:4px;font-size:1.2rem;font-weight:bold;text-transform:uppercase;letter-spacing:1px}
table.dashboard td div.section span{font-weight:normal;text-transform:none;letter-spacing:0;white-space:normal}
table.dashboard td span.info{float:right;margin-right:20px;font-size:1.2rem;font-weight:normal;text-transform:none;letter-spacing:0}
table.dashboard td span.info.title{font-weight:bold}
table.dashboard td span.load{display:inline-block;width:38px;text-align:right}
table.dashboard td span.finish{float:right;margin-right:24px}
table.dashboard i.control{float:right;font-size:1.4rem!important;margin:0 3px 0 0;cursor:pointer;color:#212f3d;background-color:rgba(255,255,255,0.3);padding:2px;border-radius:5px}
tr.alert{color:#f0000c;background-color:#ff9e9e}
tr.warn{color:#e68a00;background-color:#feefb3}
tr.past{color:#d63301;background-color:#ffddd1}
[name=arrayOps]{margin-top:12px}
span.error{color:#f0000c;background-color:#ff9e9e;display:block;width:100%}
span.warn{color:#e68a00;background-color:#feefb3;display:block;width:100%}
span.system{color:#00529b;background-color:#bde5f8;display:block;width:100%}
span.array{color:#4f8a10;background-color:#dff2bf;display:block;width:100%}
span.login{color:#d63301;background-color:#ffddd1;display:block;width:100%}
span.lite{background-color:#121510}
span.label{font-size:1.1rem;padding:2px 0 2px 6px;margin-right:6px;border-radius:4px;display:inline;width:auto;vertical-align:middle}
span.cpu-speed{display:block;color:#3b5998}
span.status{float:right;font-size:1.4rem;letter-spacing:1.8px}
span.status.vhshift{margin-top:0;margin-right:8px}
span.status.vshift{margin-top:-16px}
span.status.hshift{margin-right:-20px}
span.diskinfo{float:left;clear:both;margin-top:5px;padding-left:10px}
span.bitstream{font-family:bitstream;font-size:1.1rem}
span.p0{padding-left:0}
span.ucfirst{text-transform:capitalize}
span.strong{font-weight:bold}
span.big{font-size:1.4rem}
span.small{font-size:1.1rem}
span#dropbox{background:none;line-height:6rem;margin-right:20px}
span.outer{margin-bottom:20px;margin-right:0}
span.outer.solid{background-color:#212f3d}
span.hand{cursor:pointer}
span.outer.started>img,span.outer.started>i.img{opacity:1.0}
span.outer.stopped>img,span.outer.stopped>i.img{opacity:0.3}
span.outer.paused>img,span.outer.paused>i.img{opacity:0.6}
span.inner{display:inline-block;vertical-align:top}
span.state{font-size:1.1rem;margin-left:7px}
span.slots{display:inline-block;width:44rem;margin:0!important}
span.slots-left{float:left;margin:0!important}
input.subpool{float:right;margin:2px 0 0 0}
i.padlock{margin-right:8px;cursor:default;vertical-align:middle}
i.nolock{visibility:hidden;margin-right:8px;vertical-align:middle}
i.lock{margin-left:8px;cursor:default;vertical-align:middle}
i.orb{font-size:1.1rem;margin:0 8px 0 3px}
img.img,i.img{width:32px;height:32px;margin-right:10px}
img.icon{margin:-3px 4px 0 0}
img.list{width:auto;max-width:32px;height:32px}
i.list{font-size:32px}
a.list{text-decoration:none;color:inherit}
div.content{position:absolute;top:0;left:0;width:100%;padding-bottom:30px;z-index:-1;clear:both}
div.content.shift{margin-top:1px}
label+.content{margin-top:64px}
div.tabs{position:relative;margin:110px 20px 30px 90px;background-color:#1b1d1b}
div.tab{float:left;margin-top:23px}
div.tab input[id^='tab']{display:none}
div.tab [type=radio]+label:hover{cursor:pointer;border-color:#0072c6;opacity:1}
div.tab [type=radio]:checked+label{cursor:default;background-color:transparent;color:#606e7f;border-color:#004e86;opacity:1}
div.tab [type=radio]+label~.content{display:none}
div.tab [type=radio]:checked+label~.content{display:inline}
div.tab [type=radio]+label{position:relative;letter-spacing:1.8px;padding:10px 10px;margin-right:2px;border-top-left-radius:12px;border-top-right-radius:12px;background-color:#606e7f;color:#b0b0b0;border:1px solid #8b98a7;border-bottom:none;opacity:0.5}
div.tab [type=radio]+label img{display:none}
div.Panel{width:25%;height:auto;float:left;margin:0;padding:5px;border-right:#0c0f0b 1px solid;border-bottom:1px solid #0c0f0b;box-sizing:border-box}
div.Panel a{text-decoration:none}
div.Panel:hover{background-color:#121510}
div.Panel:hover .PanelText{text-decoration:underline}
div.Panel br,.vmtemplate br{display:none}
div.Panel img.PanelImg{float:left;width:auto;max-width:32px;height:32px;margin:10px}
div.Panel i.PanelIcon{float:left;font-size:32px;color:#606e7f;margin:10px}
div.Panel .PanelText{font-size:1.4rem;padding-top:16px;text-align:center}
div.user-list{float:left;padding:10px;margin-right:10px;margin-bottom:24px;border:1px solid #0c0f0b;border-radius:5px;line-height:2rem;height:10rem;width:10rem}
div.user-list img{width:auto;max-width:48px;height:48px;margin-bottom:16px}
div.user-list:hover{background-color:#121510}
div.vmheader{display:block;clear:both}
div.vmtemplate:hover{background-color:#121510}
div.vmtemplate{height:12rem;width:12rem;border:1px solid #0c0f0b}
div.vmtemplate img{margin-top:20px}
div.up{margin-top:-20px;border:1px solid #0c0f0b;padding:4px 6px;overflow:auto}
div.spinner{text-align:center;cursor:wait}
div.spinner.fixed{display:none;position:fixed;top:0;left:0;z-index:99999;bottom:0;right:0;margin:0}
div.spinner .unraid_mark{height:64px; position:fixed;top:50%;left:50%;margin-top:-16px;margin-left:-64px}
div.spinner .unraid_mark_2,div .unraid_mark_4{animation:mark_2 1.5s ease infinite}
div.spinner .unraid_mark_3{animation:mark_3 1.5s ease infinite}
div.spinner .unraid_mark_6,div .unraid_mark_8{animation:mark_6 1.5s ease infinite}
div.spinner .unraid_mark_7{animation:mark_7 1.5s ease infinite}
@keyframes mark_2{50% {transform:translateY(-40px)} 100% {transform:translateY(0px)}}
@keyframes mark_3{50% {transform:translateY(-62px)} 100% {transform:translateY(0px)}}
@keyframes mark_6{50% {transform:translateY(40px)} 100% {transform:translateY(0px)}}
@keyframes mark_7{50% {transform:translateY(62px)} 100% {transform: translateY(0px)}}
pre.up{margin-top:0}
pre{border:1px solid #0c0f0b;font-family:bitstream;font-size:1.3rem;line-height:1.8rem;padding:0;overflow:auto;margin-bottom:10px;padding:10px}
iframe#progressFrame{position:fixed;bottom:32px;left:60px;margin:0;padding:8px 8px 0 8px;width:100%;height:1.2rem;line-height:1.2rem;border-style:none;overflow:hidden;font-family:bitstream;font-size:1.1rem;color:#808080;white-space:nowrap;z-index:-2}
dl{margin-top:0;padding-left:12px;line-height:2.6rem}
dt{width:35%;clear:left;float:left;text-align:right;margin-right:4rem}
dd{margin-bottom:12px;white-space:nowrap}
dd p{margin:0 0 4px 0}
dd blockquote{padding-left:0}
blockquote{width:90%;margin:10px auto;text-align:left;padding:4px 20px;border:1px solid #bce8f1;color:#222222;background-color:#d9edf7;box-sizing:border-box}
blockquote.ontop{margin-top:0;margin-bottom:46px}
blockquote a{color:#ff8c2f;font-weight:600}
blockquote a:hover,blockquote a:focus{color:#f15a2c}
label.checkbox{display:block;position:relative;padding-left:28px;margin:3px 0;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
label.checkbox input{position:absolute;opacity:0;cursor:pointer}
span.checkmark{position:absolute;top:0;left:6px;height:14px;width:14px;background-color:#2b2d2b;border-radius:100%}
label.checkbox:hover input ~ .checkmark{background-color:#5b5d5b}
label.checkbox input:checked ~ .checkmark{background-color:#ff8c2f}
label.checkbox input:disabled ~ .checkmark{opacity:0.5}
a.bannerDismiss {float:right;cursor:pointer;text-decoration:none;margin-right:1rem}
.bannerDismiss::before {content:"\e92f";font-family:Unraid;color:#e68a00}
a.bannerInfo {cursor:pointer;text-decoration:none}
.bannerInfo::before {content:"\f05a";font-family:fontAwesome;color:#e68a00}
::-webkit-scrollbar{width:8px;height:8px;background:transparent}
::-webkit-scrollbar-thumb{background:gray;border-radius:10px}
::-webkit-scrollbar-corner{background:gray;border-radius:10px}
::-webkit-scrollbar-thumb:hover{background:lightgray}