mirror of
https://github.com/unraid/webgui.git
synced 2026-05-05 20:00:52 -05:00
example: format file
This commit is contained in:
Bailey Matthews
committed by
Zack Spear
Zack Spear
parent
863e92fc24
commit
37be7e9f61
@@ -0,0 +1,328 @@
|
||||
:root {--gray-000: rgb(255, 255, 255); /* #ffffff */--gray-100: rgb(242, 242, 242); /* #f2f2f2 */--gray-200: rgb(211, 211, 211); /* #d3d3d3 #d9d9d9 #dcdcdc #d4d5d6 */--gray-300: rgb(204, 204, 204); /* gray #c0c0c0 #a8a8a8 */--gray-400: rgb(144, 144, 144); /* #909090 #989898 #a2a2a2 #949494 */--gray-500: rgb(128, 128, 128); /* #808080 #606060 #585858 */--gray-600: rgb(048, 048, 048); /* #303030 #202020 */--gray-700: rgb(064, 064, 064); /* #404040 */--gary-800: rgb(025, 025, 025); /* #191919 #2b2a29 */--gray-900: rgb(029, 027, 027); /* #1c1b1b */
|
||||
--orange-200: rgb(255, 153, 0); /* #ff9900 */--orange-300: rgb(230, 138, 0); /* #e68a00 */--orange-400: rgb(206, 124, 16); /* #ce7c10 */--orange-500: rgb(255, 140, 47); /* #ff8c2f */--orange-800: rgb(241, 90, 44); /* #f15a2c */--orange-900: rgb(214, 51, 1); /* #d63301 */
|
||||
--red-100: rgb(255, 221, 209); /* #ffddd1 */--red-300: rgb(255, 158, 158); /* #ff9e9e */--red-500: rgb(255, 51, 0); /* #ff3300 */--red-600: rgb(240, 0, 12); /* #f0000c */--red-700: rgb(222, 17, 0); /* #de1100 */--red-800: rgb(226, 40, 40); /* #e22828 */--red-900: rgb(148, 28, 0); /* #941c00 */
|
||||
--green-100: rgb(223, 242, 191); /* #dff2bf */--green-200: rgb(51, 204, 51); /* #33cc33 */--green-500: rgb(23, 191, 11); /* #17bf0b */--green-800: rgb(79, 138, 16); /* #4f8a10 */--green-900: rgb(18, 122, 5); /* #127a05 */
|
||||
--blue-100: rgb(217, 237, 247); /* #d9edf7 */--blue-200: rgb(188, 232, 241); /* #bce8f1 */--blue-300: rgb(189, 229, 248); /* #bde5f8 */--blue-700: rgb(0, 153, 255); /* #0099ff */--blue-800: rgb(072, 109, 186); /* #486dba */--blue-900: rgb(59, 89, 152); /* #3b5998 */
|
||||
--yellow-100: rgb(255, 246, 191); /* #fff6bf */--yellow-200: rgb(254, 239, 179); /* #feefb3 */--yellow-500: rgb(255, 211, 36); /* #ffd324 */
|
||||
--text-color: var(--gray-900);--background-color: var(--gray-100);}
|
||||
|
||||
html {font-family: clear-sans;font-size: 62.5%;height: 100%;}
|
||||
body {font-size: 1.3rem;color: var(--text-color);background-color: var(--background-color);padding: 0;margin: 0;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;}
|
||||
@media (max-width: 1280px) {#template { min-width: 1260px; max-width: 1260px; margin: 0;}}
|
||||
@media (min-width: 1281px) {#template { min-width: 1260px; margin: 0 10px;}}
|
||||
@media (min-width: 1921px) {#template { min-width: 1260px; max-width: 1920px; margin: 0 auto;}}
|
||||
img {border: none;text-decoration: none;vertical-align: middle;}
|
||||
p {text-align: justify;}
|
||||
p.centered {text-align: left;}
|
||||
p:empty {display: none;}
|
||||
a:hover {text-decoration: underline;}
|
||||
a {color: var(--blue-800);text-decoration: none;}
|
||||
a.none {color: var(--text-color);}
|
||||
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;line-height: 2rem;color: var(--gray-100);padding: 5px 8px;border: 1px solid rgba(var(--gray-000), 0.25);border-radius: 3px;background-color: rgba(var(--gray-800), 0.95);box-shadow: 0 0 3px var(--gray-700);}
|
||||
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: var(--gray-400);text-decoration: none;}
|
||||
a.view {display: inline-block;width: 20px;}
|
||||
i.spacing {margin-left: -6px;}
|
||||
i.icon {font-size: 1.6rem;margin-right: 4px;vertical-align: middle;}
|
||||
i.title {margin-right: 8px;}
|
||||
i.control {cursor: pointer;color: var(--gray-400);font-size: 1.8rem;}
|
||||
hr {border: none;height: 1px !important;color: var(--gray-300);background-color: var(--gray-300);}
|
||||
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: none;border-bottom: 1px solid var(--gray-900);padding: 4px 0;text-indent: 0;min-height: 2rem;line-height: 2rem;outline: none;width: 300px;margin: 0 20px 0 0;box-shadow: none;border-radius: 0;color: var(--text-color);}
|
||||
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: 1.8px;text-transform: uppercase;min-width: 86px;margin: 10px 12px 10px 0;padding: 8px;text-align: center;text-decoration: none;white-space: nowrap;cursor: pointer;outline: none;border-radius: 4px;border: none;color: var(--orange-500);background: -webkit-gradient( linear, left top, right top, from(var(--red-800)), to(var(--orange-500)) ) 0 0 no-repeat, -webkit-gradient( linear, left top, right top, from(var(--red-800)), to(var(--orange-500)) ) 0 100% no-repeat, -webkit-gradient( linear, left bottom, left top, from(var(--red-800)), to(var(--red-800)) ) 0 100% no-repeat, -webkit-gradient( linear, left bottom, left top, from(var(--orange-500)), to(var(--orange-500)) ) 100% 100% no-repeat;background: linear-gradient(90deg, var(--red-800) 0, var(--orange-500)) 0 0 no-repeat, linear-gradient(90deg, var(--red-800) 0, var(--orange-500)) 0 100% no-repeat, linear-gradient(0deg, var(--red-800) 0, var(--red-800)) 0 100% no-repeat, linear-gradient(0deg, var(--orange-500) 0, var(--orange-500)) 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-color: var(--gray-300);outline: 0;}
|
||||
input:hover[type="button"],
|
||||
input:hover[type="reset"],
|
||||
input:hover[type="submit"],
|
||||
button:hover,
|
||||
button:hover[type="button"],
|
||||
a.button:hover {color: var(--gray-100);background: -webkit-gradient( linear, left top, right top, from(var(--red-800)), to(var(--orange-500)));background: linear-gradient(90deg, var(--red-800) 0, var(--orange-500));}
|
||||
input[disabled],
|
||||
textarea[disabled] {color: var(--text-color);border-bottom-color: var(--gray-400);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: var(--gray-500);background: -webkit-gradient( linear, left top, right top, from(var(--gray-700)), to(var(--gray-500)) ) 0 0 no-repeat, -webkit-gradient( linear, left top, right top, from(var(--gray-700)), to(var(--gray-500)) ) 0 100% no-repeat, -webkit-gradient( linear, left bottom, left top, from(var(--gray-700)), to(var(--gray-700)) ) 0 100% no-repeat, -webkit-gradient( linear, left bottom, left top, from(var(--gray-500)), to(var(--gray-500)) ) 100% 100% no-repeat;background: linear-gradient(90deg, var(--gray-700) 0, var(--gray-500)) 0 0 no-repeat, linear-gradient(90deg, var(--gray-700) 0, var(--gray-500)) 0 100% no-repeat, linear-gradient(0deg, var(--gray-700) 0, var(--gray-700)) 0 100% no-repeat, linear-gradient(0deg, var(--gray-500) 0, var(--gray-500)) 100% 100% no-repeat;background-size: 100% 2px, 100% 2px, 2px 100%, 2px 100%;}
|
||||
input::-webkit-input-placeholder {color: var(--blue-800);}
|
||||
select {-webkit-appearance: none;font-family: clear-sans;font-size: 1.3rem;min-width: 166px;max-width: 300px;padding: 5px 8px 5px 0;text-indent: 0;margin: 0 10px 0 0;border: none;border-bottom: 1px solid var(--gray-900);box-shadow: none;border-radius: 0;color: var(--text-color);background-color: transparent;background-image: linear-gradient( 66.6deg, transparent 60%, var(--gray-900) 40% ), linear-gradient(113.4deg, var(--gray-900) 40%, transparent 60%);background-position: calc(100% - 4px), 100%;background-size: 4px 6px, 4px 6px;background-repeat: no-repeat;outline: none;display: inline-block;cursor: pointer;}
|
||||
select option {color: var(--text-color);background-color: var(--gray-300);}
|
||||
select:focus {outline: 0;}
|
||||
select[disabled] {color: var(--text-color);border-bottom-color: var(--gray-500);opacity: 0.5;cursor: default;}
|
||||
select[name="enter_view"] {margin: 0;padding: 0 12px 0 0;border: none;min-width: auto;}
|
||||
select[name="enter_share"] {font-size: 1.1rem;padding: 0;border: none;min-width: 40px;float: right;margin-top: 13px;margin-right: 20px;}
|
||||
select[name="port_select"] {border: none;min-width: 54px;padding-top: 0;padding-bottom: 0;}
|
||||
select.narrow {min-width: 76px;}
|
||||
select.auto {min-width: auto;}
|
||||
select.slot {min-width: 44rem;max-width: 44rem;}
|
||||
input.narrow {width: 166px;}
|
||||
input.trim {width: 76px;min-width: 76px;}
|
||||
textarea {resize: none;}
|
||||
#header {position: absolute;top: 0;left: 0;width: 100%;min-width: 1260px;height: 91px;z-index: 102;margin: 0;color: var(--gray-100);background-color: var(--gray-900);background-size: 100% 90px;background-repeat: no-repeat;}
|
||||
#header .logo {float: left;margin-left: 10px;color: var(--red-800);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(var(--gray-900), 0.3);padding: 10px 12px;}
|
||||
#header .text-left {float: left;text-align: right;padding-right: 5px;border-right: solid medium var(--orange-800);}
|
||||
#header .text-right {float: right;text-align: left;padding-left: 5px;}
|
||||
#header .text-right a {color: var(--gray-100);}
|
||||
#header .text-right #licensetype {font-weight: bold;font-style: italic;margin-right: 4px;}
|
||||
div.title {margin: 20px 0 32px 0;padding: 8px 10px;clear: both;border-bottom: 1px solid var(--gray-300);background-color: var(--gray-300);letter-spacing: 1.8px;}
|
||||
div.title span.left {font-size: 1.4rem;}
|
||||
div.title span.right {font-size: 1.4rem;padding-top: 2px;padding-right: 10px;float: right;}
|
||||
div.title span img {padding-right: 4px;}
|
||||
div.title.shift {margin-top: -30px;}
|
||||
#menu {position: absolute;top: 90px;left: 0;right: 0;display: grid;grid-template-columns: auto max-content;z-index: 101;}
|
||||
.nav-tile {height: 4rem;line-height: 4rem;padding: 0;margin: 0;font-size: 1.2rem;letter-spacing: 1.8px;background-color: var(--gray-900);white-space: nowrap;overflow-x: auto;overflow-y: hidden;scrollbar-width: thin;}
|
||||
.nav-tile::-webkit-scrollbar {height: 8px;}
|
||||
.nav-tile.right {text-align: right;}
|
||||
.nav-item,
|
||||
.nav-user {position: relative;display: inline-block;text-align: center;margin: 0;}
|
||||
.nav-item a {min-width: 0;}
|
||||
.nav-item a span {display: none;}
|
||||
.nav-item .system {vertical-align: middle;padding-bottom: 2px;}
|
||||
.nav-item a {color: var(--gray-100);background-color: transparent;text-transform: uppercase;font-weight: bold;display: block;padding: 0 10px;}
|
||||
.nav-item a {text-decoration: none;text-decoration-skip-ink: auto;-webkit-text-decoration-skip: objects;-webkit-transition: all 0.25s ease-out;transition: all 0.25s ease-out;}
|
||||
.nav-item:after,
|
||||
.nav-user.show:after {border-radius: 4px;display: block;background-color: transparent;content: "";width: 32px;height: 2px;bottom: 8px;position: absolute;left: 50%;margin-left: -16px;-webkit-transition: all 0.25s ease-in-out;transition: all 0.25s ease-in-out;pointer-events: none;}
|
||||
.nav-item:focus:after,
|
||||
.nav-item:hover:after,
|
||||
.nav-user.show:hover:after {background-color: var(--orange-800);}
|
||||
.nav-item.active:after {background-color: var(--background-color);}
|
||||
.nav-user a {color: var(--gray-100);background-color: transparent;display: block;padding: 0 10px;}
|
||||
.nav-user .system {vertical-align: middle;padding-bottom: 2px;}
|
||||
#clear {clear: both;}
|
||||
#footer {position: fixed;bottom: 0;left: 0;color: var(--gray-800);background-color: var(--gray-200);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: var(--green-800);padding-left: 5px;padding-right: 5px;}
|
||||
.red {color: var(--red-600);padding-left: 5px;padding-right: 5px;}
|
||||
.orange {color: var(--orange-300);padding-left: 5px;padding-right: 5px;}
|
||||
.blue {color: var(--blue-800);padding-left: 5px;padding-right: 5px;}
|
||||
.green-text,
|
||||
.passed {color: var(--green-800);}
|
||||
.red-text,
|
||||
.failed {color: var(--red-600);}
|
||||
.orange-text,
|
||||
.warning {color: var(--orange-300);}
|
||||
.blue-text {color: var(--blue-800);}
|
||||
.grey-text {color: var(--gray-500);}
|
||||
.green-orb {color: var(--green-200);}
|
||||
.grey-orb {color: var(--gray-300);}
|
||||
.blue-orb {color: var(--blue-700);}
|
||||
.yellow-orb {color: var(--orange-200);}
|
||||
.red-orb {color: var(--red-500);}
|
||||
.usage-bar {float: left;height: 2rem;line-height: 2rem;width: 14rem;padding: 1px 1px 1px 2px;margin: 8px 12px;border-radius: 3px;background-color: var(--gray-500);box-shadow: 0 1px 0 var(--gray-400), inset 0 1px 0 var(--gray-600);}
|
||||
.usage-bar > span {display: block;height: 100%;text-align: right;border-radius: 2px;color: var(--gray-100);background-color: var(--gray-500);box-shadow: inset 0 1px 0 rgba(var(--gray-000), 0.5);}
|
||||
.usage-disk {position: relative;height: 1.8rem;background-color: var(--gray-200);margin: 0;}
|
||||
.usage-disk > span:first-child {position: absolute;left: 0;margin: 0 !important;height: 1.8rem;background-color: var(--gray-300);}
|
||||
.usage-disk > span:last-child {position: relative;padding-right: 4px;z-index: 1;}
|
||||
.usage-disk.sys {height: 12px;margin: -15px 20px 0 44px;}
|
||||
.usage-disk.sys > span:first-child {height: 12px;padding: 0;}
|
||||
.usage-disk.sys.none {background-color: transparent;}
|
||||
.usage-disk.mm {height: 3px;margin: 5px 20px 0 0;}
|
||||
.usage-disk.mm > span:first-child {height: 3px;}
|
||||
.notice {background: var(--yellow-100) url(../images/notice.png) no-repeat;background-position: 60px 50%;color: var(--text-color);font-size: 1.4rem;text-align: left;padding: 15px 0 15px 130px;display: block;height: 7rem;line-height: 7rem;vertical-align: middle;border-top: 2px solid var(--yellow-500);border-bottom: 2px solid var(--yellow-500);}
|
||||
.notice.shift {margin-top: 160px;}
|
||||
.greenbar {background: -webkit-gradient( linear, left top, right top, from(var(--green-900)), to(var(--green-500)));background: linear-gradient(90deg, var(--green-900) 0, var(--green-500));}
|
||||
.orangebar {background: -webkit-gradient( linear, left top, right top, from(var(--orange-400)), to(var(--orange-400)));background: linear-gradient(90deg, var(--orange-400) 0, var(--orange-400));}
|
||||
.redbar {background: -webkit-gradient( linear, left top, right top, from(var(--red-900)), to(var(--red-700)));background: linear-gradient(90deg, var(--red-900) 0, var(--red-700));}
|
||||
.graybar {background: -webkit-gradient( linear, left top, right top, from(var(--gray-400)), to(var(--gray-200)));background: linear-gradient(90deg, var(--gray-400) 0, var(--gray-200));}
|
||||
table {border-collapse: collapse;border-spacing: 0;border-style: hidden;margin: -30px 0 0 0;width: 100%;background-color: var(--background-color);}
|
||||
table thead td {padding: 7px 0;}
|
||||
table tbody td {padding: 5px 0;}
|
||||
table tbody tr.tr_last {background-color: var(--background-color);border-top: 1px solid var(--gray-300);}
|
||||
table td.cpu-info {border: 1px solid var(--gray-300);}
|
||||
table.disk_status {white-space: nowrap;}
|
||||
table.disk_status td span {margin-left: 10px;}
|
||||
table.disk_status thead tr:first-child td {font-size: 1.1rem;text-transform: uppercase;letter-spacing: 1px;background-color: var(--gray-200);}
|
||||
table.disk_status thead tr:last-child {border-bottom: 1px solid var(--gray-300);}
|
||||
table.disk_status tr > td {width: 10%;padding-left: 12px;padding-right: 0;white-space: nowrap;}
|
||||
table.disk_status tr > td + td {width: auto;}
|
||||
table.disk_status tr > td + td + td {width: 6.5%;text-align: center;padding-left: 4px;padding-right: 8px;}
|
||||
table.disk_status tr > td + td + td + td {text-align: right;padding-left: 0;padding-right: 12px;}
|
||||
table.disk_status tbody tr:nth-child(even) {background-color: var(--background-color);}
|
||||
table.disk_status tbody tr:not(.tr_last):hover td {background-color: rgba(var(--gray-900), 0.1);}
|
||||
table.disk_status.stats tr > td + td {text-align: left;padding-left: 0;padding-right: 12px;}
|
||||
table.array_status td {padding: 4px 0;}
|
||||
table.array_status tr > td {text-align: left;white-space: nowrap;padding-left: 12px;width: 30%;}
|
||||
table.array_status tr > td + td {padding-left: 2px;width: 20%;}
|
||||
table.array_status tr > td + td + td {width: auto;}
|
||||
table.array_status td.line {border-top: 1px solid var(--gray-300);}
|
||||
table.array_status.noshift {margin-top: 0;}
|
||||
table.settings {margin: 0;padding: 0;background-color: transparent;}
|
||||
table.settings td:first-child {width: 35%;padding: 12px;}
|
||||
table.settings td + td {padding-left: 8px;}
|
||||
table.settings.shifted {padding: 0;margin-left: 0;margin-top: 0;}
|
||||
table.settings.shifted td {padding-left: 0;}
|
||||
table.access_list {border-spacing: 0;margin-top: 10px;border: none;}
|
||||
table.access_list tr:first-child td {font-size: 1.1rem;text-transform: uppercase;letter-spacing: 1px;vertical-align: middle;text-align: left;border: 1px solid var(--gray-300);border-bottom: 1px solid var(--gray-300);background-color: var(--gray-200);}
|
||||
table.access_list td:first-child {font-weight: normal;width: 35%;padding-left: 12px;}
|
||||
table.access_list tr:first-child td:first-child {font-weight: normal;}
|
||||
table.access_list tr > td + td {white-space: nowrap;}
|
||||
table.share_status {white-space: nowrap;}
|
||||
table.share_status thead tr:first-child td {font-size: 1.1rem;text-transform: uppercase;letter-spacing: 1px;background-color: var(--gray-300);}
|
||||
table.share_status tr > td {text-align: left;padding-left: 12px;}
|
||||
table.share_status tr > td + td {padding-left: 0;}
|
||||
table.share_status tbody tr:nth-child(even) {background-color: var(--background-color);}
|
||||
table.share_status:not(.dashboard) tbody tr:hover td {background-color: rgba(var(--gray-900), 0.1);}
|
||||
table.share_status tbody tr.alert {color: var(--red-600);}
|
||||
table.share_status tbody tr.warn {color: var(--orange-300);}
|
||||
table.share_status.fixed tr > td + td {min-width: 39px;font-size: 1.1rem;text-align: center;padding: 0;}
|
||||
table.share_status.table {margin-top: 36px;}
|
||||
table.share_status.table tr > td {width: 50%;}
|
||||
table.share_status.dashboard {margin: 0;border: 1px solid var(--gray-200);}
|
||||
table.share_status.dashboard tbody {border: 1px solid var(--gray-200);}
|
||||
table.share_status.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.share_status.dashboard tr:nth-child(even) {background-color: transparent;}
|
||||
table.share_status.dashboard tr:last-child > td {padding-bottom: 20px;}
|
||||
table.share_status.dashboard tr.last > td {padding-bottom: 20px;}
|
||||
table.share_status.dashboard tr.header td {padding-bottom: 10px;}
|
||||
table.share_status.dashboard td {padding: 3px 10px;}
|
||||
table.share_status.dashboard td.vpn {font-size: 1.1rem;font-weight: bold;text-transform: uppercase;letter-spacing: 1px;}
|
||||
table.share_status.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.share_status.dashboard td div.section span {font-weight: normal;text-transform: none;letter-spacing: 0;white-space: normal;}
|
||||
table.share_status.dashboard td span.info {float: right;margin-right: 20px;font-size: 1.2rem;font-weight: normal;text-transform: none;letter-spacing: 0;}
|
||||
table.share_status.dashboard td span.info.title {font-weight: bold;}
|
||||
table.share_status.dashboard td span.load {display: inline-block;width: 38px;text-align: right;}
|
||||
table.share_status.dashboard td span.finish {float: right;margin-right: 24px;}
|
||||
table.share_status.dashboard i.control {float: right;font-size: 1.4rem !important;margin: 0 3px 0 0;cursor: pointer;background-color: rgba(var(--gray-900), 0.1);padding: 2px;}
|
||||
[name="arrayOps"] {margin-top: 12px;}
|
||||
span.error {color: var(--red-600);background-color: var(--red-300);display: block;width: 100%;}
|
||||
span.warn {color: var(--orange-300);background-color: var(--yellow-200);display: block;width: 100%;}
|
||||
span.system {color: var(--blue-700);background-color: var(--blue-300);display: block;width: 100%;}
|
||||
span.array {color: var(--green-800);background-color: var(--green-100);display: block;width: 100%;}
|
||||
span.login {color: var(--orange-900);background-color: var(--red-100);display: block;width: 100%;}
|
||||
span.lite {background-color: var(--background-color);}
|
||||
span.label {font-size: 1.2rem;padding: 2px 0 2px 6px;margin-right: 6px;border-radius: 4px;display: inline;width: auto;vertical-align: middle;}
|
||||
span.cpu-speed {display: block;color: var(--blue-900);}
|
||||
span.status {float: right;font-size: 1.4rem;margin-top: 30px;padding-right: 8px;letter-spacing: 1.8px;}
|
||||
span.status.vhshift {margin-top: 0;margin-right: -9px;}
|
||||
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.ucfirst {text-transform: capitalize;}
|
||||
span.strong {font-weight: bold;}
|
||||
span.big {font-size: 1.4rem;}
|
||||
span.small {font-size: 1.2rem;}
|
||||
span.outer {margin-bottom: 20px;margin-right: 0;}
|
||||
span.outer.solid {background-color: var(--background-color);}
|
||||
span.hand {cursor: pointer;}
|
||||
span.outer.started > img,
|
||||
span.outer.started > i.img {opacity: 1;}
|
||||
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;}
|
||||
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: 86px;}
|
||||
div.tabs {position: relative;margin: 130px 0 0 0;}
|
||||
div.tab {float: left;margin-top: 30px;}
|
||||
div.tab input[id^="tab"] {display: none;}
|
||||
div.tab [type="radio"] + label:hover {background-color: transparent;border: 1px solid var(--orange-500);border-bottom: none;cursor: pointer;opacity: 1;}
|
||||
div.tab [type="radio"]:checked + label {cursor: default;background-color: transparent;border: 1px solid var(--orange-500);border-bottom: none;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;font-size: 1.4rem;letter-spacing: 1.8px;padding: 4px 10px;margin-right: 2px;border-top-left-radius: 6px;border-top-right-radius: 6px;border: 1px solid var(--gray-400);border-bottom: none;background-color: var(--gray-200);opacity: 0.5;}
|
||||
div.tab [type="radio"] + label img {padding-right: 4px;}
|
||||
div.Panel {text-align: center;float: left;margin: 0 30px 30px 12px;height: 8rem;}
|
||||
div.Panel a {text-decoration: none;}
|
||||
div.Panel span {height: 42px;display: block;}
|
||||
div.Panel:hover .PanelText {text-decoration: underline;}
|
||||
div.Panel img.PanelImg {width: auto;max-width: 32px;height: 32px;}
|
||||
div.Panel i.PanelIcon {font-size: 32px;color: var(--text-color);}
|
||||
div.user-list {float: left;padding: 10px;margin-right: 10px;margin-bottom: 24px;border: 1px solid var(--gray-300);border-radius: 5px;line-height: 2rem;height: 10rem;width: 10rem;background-color: var(--gray-200);}
|
||||
div.user-list img {width: auto;max-width: 48px;height: 48px;margin-bottom: 16px;}
|
||||
div.up {margin-top: -30px;border: 1px solid var(--gray-200);padding: 4px 6px;overflow: auto;}
|
||||
div.spinner {margin: 48px auto;text-align: center;}
|
||||
div.spinner.fixed {display: none;position: fixed;top: 50%;left: 50%;margin-top: -16px;margin-left: -64px;z-index: 10000;}
|
||||
div.spinner .unraid_mark {height: 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;}
|
||||
div.domain {margin-top: -20px;}
|
||||
@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: -30px;}
|
||||
pre {border: 1px solid var(--gray-300);font-family: bitstream;font-size: 1.3rem;line-height: 1.8rem;padding: 4px 6px;overflow: auto;}
|
||||
iframe#progressFrame {position: fixed;bottom: 32px;left: 0;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: var(--gray-500);white-space: nowrap;z-index: -10;}
|
||||
dl {margin: 0;padding-left: 12px;line-height: 2.6rem;}
|
||||
dt {clear: left;float: left;width: 35%;font-weight: normal;}
|
||||
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-top: 2px solid var(--blue-200);border-bottom: 2px solid var(--blue-200);color: var(--gray-800);background-color: var(--blue-100);}
|
||||
blockquote.ontop {margin-top: -20px;margin-bottom: 46px;}
|
||||
blockquote a {color: var(--orange-500);font-weight: 600;}
|
||||
blockquote a:hover,
|
||||
blockquote a:focus {color: var(--orange-800);}
|
||||
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: var(--gray-200);border-radius: 100%;}
|
||||
label.checkbox:hover input ~ .checkmark {background-color: var(--gray-300);}
|
||||
label.checkbox input:checked ~ .checkmark {background-color: var(--orange-500);}
|
||||
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: var(--orange-300);}
|
||||
a.bannerInfo {cursor: pointer;text-decoration: none;}
|
||||
.bannerInfo::before {content: "\f05a";font-family: fontAwesome;color: var(--orange-300);}
|
||||
::-webkit-scrollbar {width: 10px;height: 10px;background: transparent;}
|
||||
::-webkit-scrollbar-thumb {background: var(--gray-400);border-radius: 10px;}
|
||||
::-webkit-scrollbar-corner {background: var(--gray-400);border-radius: 10px;}
|
||||
::-webkit-scrollbar-thumb:hover {background: var(--gray-500);}
|
||||
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user