diff options
| -rw-r--r-- | themes/luci-theme-bootstrap/htdocs/luci-static/bootstrap/cascade.css | 219 |
1 files changed, 139 insertions, 80 deletions
diff --git a/themes/luci-theme-bootstrap/htdocs/luci-static/bootstrap/cascade.css b/themes/luci-theme-bootstrap/htdocs/luci-static/bootstrap/cascade.css index 4a40f6d68..b54510876 100644 --- a/themes/luci-theme-bootstrap/htdocs/luci-static/bootstrap/cascade.css +++ b/themes/luci-theme-bootstrap/htdocs/luci-static/bootstrap/cascade.css @@ -215,7 +215,8 @@ a:hover { * ---------------------------------------------------------------------------------------- */ p, .cbi-map-descr, -.cbi-section-descr { +.cbi-section-descr, +.table .tr.cbi-section-table-descr .th { font-size: 13px; font-weight: normal; line-height: 18px; @@ -229,7 +230,7 @@ p small { h1, h2, -h3, +h3, legend, h4, h5, h6 { @@ -265,14 +266,14 @@ h2 small { font-size: 14px; } -h3, +h3, legend, h4, h5, h6 { line-height: 36px; } -h3 { +h3, legend { font-size: 18px; } @@ -645,6 +646,26 @@ textarea[readonly] { border-color: #ddd; } +.cbi-optionals, +.cbi-section-create { + padding: 0 0 10px 10px; +} + +.cbi-section-create { + margin: -3px; + display: inline-flex; + align-items: center; +} + +.cbi-section-create > * { + margin: 3px; + flex: 1 1 auto; +} + +.cbi-section-create > * > input { + width: 100%; +} + .actions, .cbi-page-actions { background: #f5f5f5; @@ -706,6 +727,7 @@ textarea[readonly] { padding: 0; font-size: 13px; border-collapse: collapse; + position: relative; } .table .th, .table .td { @@ -732,6 +754,19 @@ textarea[readonly] { vertical-align: top; } +.tr.placeholder { + height: calc(3em + 20px); +} + +.tr.placeholder > .td { + position: absolute; + left: 0; + right: 0; + bottom: 0; + text-align: center; + line-height: 3em; +} + /* Patterns.less * Repeatable UI elements outside the base styles provided from the scaffolding * ---------------------------------------------------------------------------- */ @@ -1244,99 +1279,67 @@ footer { outline: 1px dotted #666; } -.btn.primary, -.cbi-page-actions .cbi-button-apply, -.cbi-page-actions .cbi-button-save, -.cbi-page-actions .cbi-button-reset { - color: #ffffff; - padding: 5px 14px 6px; - background-color: #0064cd; - background-repeat: repeat-x; - background-image: linear-gradient(to bottom, #049cdb, #0064cd); - text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); - border-color: #0064cd #0064cd #003f81; - border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25); -} - .cbi-input-invalid, .cbi-value-error input { color: #FF0000; border-color: #FF0000; } -.cbi-button-up, -.cbi-input-up { - background-position: center center; - background-image: url('../resources/cbi/up.gif'), linear-gradient(#ffffff, #ffffff 25%, #e6e6e6); -} - -.cbi-button-down, -.cbi-input-down { - background-position: center center; - background-image: url('../resources/cbi/down.gif'), linear-gradient(#ffffff, #ffffff 25%, #e6e6e6); +.cbi-button-positive, +.cbi-button-fieldadd, +.cbi-button-add, +.cbi-button-save { + border-color: #4a4; + color: #4a4; } +.cbi-button-neutral, +.cbi-button-download, .cbi-button-find, -.cbi-input-find { - background-position: 6px center, left top; - padding-left: 28px; - background-image: url('../resources/cbi/find.gif'), linear-gradient(#ffffff, #ffffff 25%, #e6e6e6); -} - -.cbi-button-add, -.cbi-input-add { - background-position: 6px center, left top; - padding-left: 28px; - background-image: url('../resources/cbi/add.gif'), linear-gradient(#ffffff, #ffffff 25%, #e6e6e6); +.cbi-button-link, +.cbi-button-up, +.cbi-button-down { + border-color: #444; + color: #444; } +.btn.primary, +.cbi-button-action, .cbi-button-apply, -.cbi-input-apply { - background-position: 6px center, left top; - padding-left: 28px; - background-image: url('../resources/cbi/apply.gif'), linear-gradient(#ffffff, #ffffff 25%, #e6e6e6); +.cbi-button-reload, +.cbi-button-edit { + border-color: #0069d6; + color: #0069d6; } +.cbi-button-negative, +.cbi-section-remove .cbi-button, .cbi-button-reset, -.cbi-input-reset { - background-position: 6px center, left top; - padding-left: 28px; - background-image: url('../resources/cbi/reset.gif'), linear-gradient(#ffffff, #ffffff 25%, #e6e6e6); +.cbi-button-remove { + border-color: #c44; + color: #c44; } -.cbi-button-edit, -.cbi-input-edit { - background-position: 6px center, left top; - padding-left: 28px; - background-image: url('../resources/cbi/edit.gif'), linear-gradient(#ffffff, #ffffff 25%, #e6e6e6); -} - -.cbi-button-remove, -.cbi-input-remove { - background-position: 6px center, left top; - padding-left: 28px; - background-image: url('../resources/cbi/remove.gif'), linear-gradient(#ffffff, #ffffff 25%, #e6e6e6); -} - -.cbi-button-reload, -.cbi-input-reload { - background-position: 6px center, left top; - padding-left: 28px; - background-image: url('../resources/cbi/reload.gif'), linear-gradient(#ffffff, #ffffff 25%, #e6e6e6); +.btn.primary, +.cbi-button-action.important, +.cbi-page-actions .cbi-button-apply, +.cbi-section-actions .cbi-button-edit { + color: #fff; + background: #0069d6; + text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); } -.cbi-button-link, -.cbi-input-link { - background-position: 6px center, left top; - padding-left: 28px; - background-image: url('../resources/cbi/link.gif'), linear-gradient(#ffffff, #ffffff 25%, #e6e6e6); +.cbi-button-positive.important, +.cbi-page-actions .cbi-button-save { + color: #fff; + background: #4a4; + text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); } -.cbi-button-download, -.cbi-input-download { - background-position: 6px center, left top; - padding-left: 28px; - background-image: url('../resources/cbi/download.gif'), linear-gradient(#ffffff, #ffffff 25%, #e6e6e6); +.cbi-page-actions .cbi-button-apply + .cbi-button-save { + background: linear-gradient(#ffffff, #ffffff 25%, #e6e6e6); + text-shadow: 0 -1px 0 rgba(255, 255, 255, 0.75); + color: #4a4; } .cbi-dropdown { @@ -1492,6 +1495,58 @@ footer { opacity: .6; } +.cbi-tooltip-container { + cursor: help; +} + +.cbi-tooltip { + position: absolute; + z-index: 1000; + left: -1000px; + opacity: 0; + transition: opacity .25s ease-out; +} + +.cbi-tooltip-container:hover .cbi-tooltip:not(:empty) { + left: auto; + opacity: 1; + transition: opacity .25s ease-in; +} + +.zonebadge .cbi-tooltip { + padding: 1px; + background: inherit; + margin: -1.6em 0 0 -5px; + border-radius: 3px; + pointer-events: none; + box-shadow: 0 0 3px #444; +} + +.zonebadge .cbi-tooltip > * { + margin: 1px; +} + +.zone-forwards { + display: flex; + flex-wrap: wrap; +} + +.zone-forwards > * { + flex: 1 1 40%; + padding: 1px; +} + +.zone-forwards > span { + flex-basis: 10%; + text-align: center; +} + +.zone-forwards .zone-src, +.zone-forwards .zone-dest { + display: flex; + flex-direction: column; +} + .btn.active, .btn:active { box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.25), 0 1px 2px rgba(0, 0, 0, 0.05); } @@ -1751,9 +1806,13 @@ table table td, vertical-align: middle; } -.cbi-value-description { display: inline; } - -.cbi-value-description img { vertical-align: middle; } +.cbi-value-description { + background-image: url(/luci-static/resources/cbi/help.gif); + background-position: .25em .2em; + background-repeat: no-repeat; + margin: .25em 0 0 0; + padding: 0 0 0 1.7em; +} .cbi-section-error { border: 1px solid #FF0000; @@ -1852,6 +1911,7 @@ table table td, flex-wrap: wrap; } +.ifacebadge.large, .network-status-table .ifacebox-body .ifacebadge { flex: 1; margin: .5em .25em 0 .25em; @@ -1866,7 +1926,6 @@ table table td, white-space: nowrap; color: #666666; text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75); - cursor: pointer; } .zonebadge > em, |