mirror of
https://github.com/unraid/webgui.git
synced 2026-05-08 05:12:14 -05:00
Black and White theme: simplified input & select boxes
This commit is contained in:
@@ -20,26 +20,26 @@ i.spacing{margin-left:-6px}
|
||||
i.icon{margin-right:4px}
|
||||
i.title{margin-right:8px}
|
||||
hr{border:none;height:1px!important;color:#2b2b2b;background-color:#2b2b2b}
|
||||
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:transparent;border:1px solid #e5e5e5;padding:5px 10px;min-height:2rem;line-height:2rem;outline:none;width:304px;margin:0 20px 0 0;box-shadow:none;color:#f2f2f2}
|
||||
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:transparent;border:none;border-bottom:1px solid #e5e5e5;padding:5px 3px;min-height:2rem;line-height:2rem;outline:none;width:304px;margin:0 20px 0 0;box-shadow:none;color:#f2f2f2}
|
||||
input[type=button],input[type=reset],input[type=submit],button,button[type=button],a.button{font-family:clear-sans;font-size:1.1rem;font-weight:bold;letter-spacing:2px;text-transform:uppercase;margin:10px 12px 10px 0;padding:9px 18px;text-decoration:none;white-space:nowrap;cursor:pointer;outline:none;border-radius:4px;border:0;color:#ff8c2f;background:-webkit-gradient(linear,left top,right top,from(#e22828),to(#ff8c2f)) 0 0 no-repeat,-webkit-gradient(linear,left top,right top,from(#e22828),to(#ff8c2f)) 0 100% no-repeat,-webkit-gradient(linear,left bottom,left top,from(#e22828),to(#e22828)) 0 100% no-repeat,-webkit-gradient(linear,left bottom,left top,from(#ff8c2f),to(#ff8c2f)) 100% 100% no-repeat;background:linear-gradient(90deg,#e22828 0,#ff8c2f) 0 0 no-repeat,linear-gradient(90deg,#e22828 0,#ff8c2f) 0 100% no-repeat,linear-gradient(0deg,#e22828 0,#e22828) 0 100% no-repeat,linear-gradient(0deg,#ff8c2f 0,#ff8c2f) 100% 100% no-repeat;background-size:100% 2px,100% 2px,2px 100%,2px 100%}
|
||||
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{background:#262626;border-color:#ff8c2f}
|
||||
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{background:#262626}
|
||||
input:hover[type=button],input:hover[type=reset],input:hover[type=submit],button:hover,button:hover[type=button],a.button:hover{color:#f2f2f2;background:-webkit-gradient(linear,left top,right top,from(#e22828),to(#ff8c2f));background:linear-gradient(90deg,#e22828 0,#ff8c2f)}
|
||||
input[disabled],textarea[disabled]{color:#f2f2f2;border-color:#6c6c6c;background:#262626;opacity:0.5;cursor:default}
|
||||
input[disabled],textarea[disabled]{color:#f2f2f2;border-bottom-color:#6c6c6c;opacity:0.5;cursor:default}
|
||||
input[type=button][disabled],input[type=reset][disabled],input[type=submit][disabled],button[disabled],button[type=button][disabled],a.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],a.button:hover[disabled]
|
||||
input:active[type=button][disabled],input:active[type=reset][disabled],input:active[type=submit][disabled],button:active[disabled],button:active[type=button][disabled],a.button:active[disabled]
|
||||
{cursor:default;color:#808080;background:-webkit-gradient(linear,left top,right top,from(#404040),to(#808080)) 0 0 no-repeat,-webkit-gradient(linear,left top,right top,from(#404040),to(#808080)) 0 100% no-repeat,-webkit-gradient(linear,left bottom,left top,from(#404040),to(#404040)) 0 100% no-repeat,-webkit-gradient(linear,left bottom,left top,from(#808080),to(#808080)) 100% 100% no-repeat;background:linear-gradient(90deg,#404040 0,#808080) 0 0 no-repeat,linear-gradient(90deg,#404040 0,#808080) 0 100% no-repeat,linear-gradient(0deg,#404040 0,#404040) 0 100% no-repeat,linear-gradient(0deg,#808080 0,#808080) 100% 100% no-repeat;background-size:100% 2px,100% 2px,2px 100%,2px 100%}
|
||||
input::-webkit-input-placeholder{color:#486dba}
|
||||
select{font-family:clear-sans;font-size:1.3rem;min-width:188px;max-width:326px;padding:6px 6px;margin:0 10px 0 0;border:#e5e5e5 1px solid;box-shadow:none;color:#f2f2f2;background:transparent;outline:none;display:inline-block;cursor:pointer}
|
||||
select{font-family:clear-sans;font-size:1.3rem;min-width:172px;max-width:310px;padding:6px 0;margin:0 10px 0 0;border:none;border-bottom:#e5e5e5 1px solid;box-shadow:none;color:#f2f2f2;background:transparent;outline:none;display:inline-block;cursor:pointer}
|
||||
select option{color:#f2f2f2;background-color:#262626}
|
||||
select:focus{border-color:#ff8c2f}
|
||||
select[disabled]{color:#f2f2f2;border-color:#6c6c6c;background:#262626;opacity:0.5;cursor:default}
|
||||
select:focus{}
|
||||
select[disabled]{color:#f2f2f2;border-bottom-color:#6c6c6c;opacity:0.5;cursor:default}
|
||||
select[name=enter_view]{padding:0;float:right}
|
||||
select[name=enter_share]{padding:0;float:right}
|
||||
select.narrow{min-width:87px}
|
||||
select.narrow{min-width:71px}
|
||||
select.auto{min-width:auto}
|
||||
select.slot{min-width:44rem;max-width:44rem}
|
||||
input.narrow{width:166px}
|
||||
|
||||
@@ -20,26 +20,26 @@ i.spacing{margin-left:-6px}
|
||||
i.icon{margin-right:4px}
|
||||
i.title{margin-right:8px}
|
||||
hr{border:none;height:1px!important;color:#e3e3e3;background-color:#e3e3e3}
|
||||
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:transparent;border:1px solid #1c1c1c;padding:5px 10px;min-height:2rem;line-height:2rem;outline:none;width:304px;margin:0 20px 0 0;box-shadow:none;color:#1c1c1c}
|
||||
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:transparent;border:none;border-bottom:1px solid #1c1c1c;padding:5px 3px;min-height:2rem;line-height:2rem;outline:none;width:304px;margin:0 20px 0 0;box-shadow:none;color:#1c1c1c}
|
||||
input[type=button],input[type=reset],input[type=submit],button,button[type=button],a.button{font-family:clear-sans;font-size:1.1rem;font-weight:bold;letter-spacing:2px;text-transform:uppercase;margin:10px 12px 10px 0;padding:9px 18px;text-decoration:none;white-space:nowrap;cursor:pointer;outline:none;border-radius:4px;border:0;color:#ff8c2f;background:-webkit-gradient(linear,left top,right top,from(#e22828),to(#ff8c2f)) 0 0 no-repeat,-webkit-gradient(linear,left top,right top,from(#e22828),to(#ff8c2f)) 0 100% no-repeat,-webkit-gradient(linear,left bottom,left top,from(#e22828),to(#e22828)) 0 100% no-repeat,-webkit-gradient(linear,left bottom,left top,from(#ff8c2f),to(#ff8c2f)) 100% 100% no-repeat;background:linear-gradient(90deg,#e22828 0,#ff8c2f) 0 0 no-repeat,linear-gradient(90deg,#e22828 0,#ff8c2f) 0 100% no-repeat,linear-gradient(0deg,#e22828 0,#e22828) 0 100% no-repeat,linear-gradient(0deg,#ff8c2f 0,#ff8c2f) 100% 100% no-repeat;background-size:100% 2px,100% 2px,2px 100%,2px 100%}
|
||||
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{background:#e8e8e8;border-color:#ff8c2f}
|
||||
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{background:#e8e8e8}
|
||||
input:hover[type=button],input:hover[type=reset],input:hover[type=submit],button:hover,button:hover[type=button],a.button:hover{color:#f2f2f2;background:-webkit-gradient(linear,left top,right top,from(#e22828),to(#ff8c2f));background:linear-gradient(90deg,#e22828 0,#ff8c2f)}
|
||||
input[disabled],textarea[disabled]{color:#1c1c1c;border-color:#a2a2a2;background:#e8e8e8;opacity:0.5;cursor:default}
|
||||
input[disabled],textarea[disabled]{color:#1c1c1c;border-bottom-color:#a2a2a2;opacity:0.5;cursor:default}
|
||||
input[type=button][disabled],input[type=reset][disabled],input[type=submit][disabled],button[disabled],button[type=button][disabled],a.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],a.button:hover[disabled]
|
||||
input:active[type=button][disabled],input:active[type=reset][disabled],input:active[type=submit][disabled],button:active[disabled],button:active[type=button][disabled],a.button:active[disabled]
|
||||
{cursor:default;color:#808080;background:-webkit-gradient(linear,left top,right top,from(#404040),to(#808080)) 0 0 no-repeat,-webkit-gradient(linear,left top,right top,from(#404040),to(#808080)) 0 100% no-repeat,-webkit-gradient(linear,left bottom,left top,from(#404040),to(#404040)) 0 100% no-repeat,-webkit-gradient(linear,left bottom,left top,from(#808080),to(#808080)) 100% 100% no-repeat;background:linear-gradient(90deg,#404040 0,#808080) 0 0 no-repeat,linear-gradient(90deg,#404040 0,#808080) 0 100% no-repeat,linear-gradient(0deg,#404040 0,#404040) 0 100% no-repeat,linear-gradient(0deg,#808080 0,#808080) 100% 100% no-repeat;background-size:100% 2px,100% 2px,2px 100%,2px 100%}
|
||||
input::-webkit-input-placeholder{color:#486dba}
|
||||
select{font-family:clear-sans;font-size:1.3rem;min-width:188px;max-width:326px;padding:6px 6px;margin:0 10px 0 0;border:#1c1c1c 1px solid;box-shadow:none;color:#1c1c1c;background:transparent;outline:none;display:inline-block;cursor:pointer}
|
||||
select{font-family:clear-sans;font-size:1.3rem;min-width:172px;max-width:310px;padding:6px 0;margin:0 10px 0 0;border:none;border-bottom:#1c1c1c 1px solid;box-shadow:none;color:#1c1c1c;background:transparent;outline:none;display:inline-block;cursor:pointer}
|
||||
select option{color:#1c1c1c;background-color:#e8e8e8}
|
||||
select:focus{border-color:#ff8c2f}
|
||||
select[disabled]{color:#1c1c1c;border-color:#a2a2a2;background:#e8e8e8;opacity:0.5;cursor:default}
|
||||
select:focus{}
|
||||
select[disabled]{color:#1c1c1c;border-bottom-color:#a2a2a2;opacity:0.5;cursor:default}
|
||||
select[name=enter_view]{padding:0;float:right}
|
||||
select[name=enter_share]{padding:0;float:right}
|
||||
select.narrow{min-width:87px}
|
||||
select.narrow{min-width:71px}
|
||||
select.auto{min-width:auto}
|
||||
select.slot{min-width:44rem;max-width:44rem}
|
||||
input.narrow{width:166px}
|
||||
|
||||
@@ -16,12 +16,12 @@ div.jGrowl div.jGrowl-closer{width:400px;color:#808080;background-color:#121510;
|
||||
div.jGrowl div.jGrowl-closer.top{position:fixed;top:130px}
|
||||
@media print{div.jGrowl{display:none}}
|
||||
.ui-dropdownchecklist{background:transparent;border:none;box-shadow:0 1px 0 #f2f2f2;outline:none;height:3.2rem;line-height:3.2rem;cursor:pointer}
|
||||
.ui-dropdownchecklist-selector{border:1px solid #f2f2f2;display:inline-block;cursor:pointer;padding:1px 9px 1px 11px}
|
||||
.ui-dropdownchecklist-group{font-weight:normal;font-style:italic;padding:1px 9px 1px 11px}
|
||||
.ui-dropdownchecklist-selector{border:none;border-bottom:1px solid #f2f2f2;display:inline-block;cursor:pointer;padding:1px 3px}
|
||||
.ui-dropdownchecklist-group{font-weight:normal;font-style:italic;padding:1px 3px}
|
||||
.ui-dropdownchecklist-selector-wrapper{vertical-align:middle;font-size:0}
|
||||
.ui-state-active{border-color:#ff8c2f;background:transparent}
|
||||
.ui-dropdownchecklist-dropcontainer{color:#f2f2f2;background-color:#262626;border:#ff8c2f 1px solid}
|
||||
.ui-state-disabled{color:#f2f2f2;border-color:#6c6c6c;background:#262626;opacity:0.5;cursor:default}
|
||||
.ui-state-active{background:transparent}
|
||||
.ui-dropdownchecklist-dropcontainer{color:#f2f2f2;background-color:#262626}
|
||||
.ui-state-disabled{color:#f2f2f2;border-bottom-coloer:#6c6c6c;opacity:0.5;cursor:default}
|
||||
.ui-dropdownchecklist-indent{padding-left:7px}
|
||||
.ui-dropdownchecklist-text{font-family:clear-sans;font-size:1.3rem;color:#f2f2f2}
|
||||
.ui-dropdownchecklist-item{height:2.4rem;line-height:2.4rem}
|
||||
|
||||
@@ -16,12 +16,12 @@ div.jGrowl div.jGrowl-closer{width:400px;color:#808080;background-color:#121510;
|
||||
div.jGrowl div.jGrowl-closer.top{position:fixed;top:130px}
|
||||
@media print{div.jGrowl{display:none}}
|
||||
.ui-dropdownchecklist{background:transparent;border:none;box-shadow:0 1px 0 #1c1c1c;outline:none;height:3.2rem;line-height:3.2rem;cursor:pointer}
|
||||
.ui-dropdownchecklist-selector{border:1px solid #1c1c1c;display:inline-block;cursor:pointer;padding:1px 9px 1px 11px}
|
||||
.ui-dropdownchecklist-group{font-weight:normal;font-style:italic;padding:1px 9px 1px 11px}
|
||||
.ui-dropdownchecklist-selector{border:none;border-bottom:1px solid #1c1c1c;display:inline-block;cursor:pointer;padding:1px 3px}
|
||||
.ui-dropdownchecklist-group{font-weight:normal;font-style:italic;padding:1px 3px}
|
||||
.ui-dropdownchecklist-selector-wrapper{vertical-align:middle;font-size:0}
|
||||
.ui-state-active{border-color:#ff8c2f;background:transparent}
|
||||
.ui-dropdownchecklist-dropcontainer{color:#1c1c1c;background-color:#e8e8e8;border:#ff8c2f 1px solid}
|
||||
.ui-state-disabled{color:#1c1c1c;border-color:#a2a2a2;background:#e8e8e8;opacity:0.5;cursor:default}
|
||||
.ui-state-active{background:transparent}
|
||||
.ui-dropdownchecklist-dropcontainer{color:#1c1c1c;background-color:#e8e8e8}
|
||||
.ui-state-disabled{color:#1c1c1c;border-bottom-color:#a2a2a2;opacity:0.5;cursor:default}
|
||||
.ui-dropdownchecklist-indent{padding-left:7px}
|
||||
.ui-dropdownchecklist-text{font-family:clear-sans;font-size:1.3rem;color:#1c1c1c}
|
||||
.ui-dropdownchecklist-item{height:2.4rem;line-height:2.4rem}
|
||||
|
||||
Reference in New Issue
Block a user