treewide: rework uci change display

[project/luci.git] / themes / luci-theme-openwrt / htdocs / luci-static / openwrt.org / cascade.css

diff --git a/themes/luci-theme-openwrt/htdocs/luci-static/openwrt.org/cascade.css b/themes/luci-theme-openwrt/htdocs/luci-static/openwrt.org/cascade.css
index 4e8ff77506c2c17b35fbb2e0da60add4649149cd..5becfc5ba59ad1d44bc6af3c969d08060f9d9b7a 100644 (file)
--- a/themes/luci-theme-openwrt/htdocs/luci-static/openwrt.org/cascade.css
+++ b/themes/luci-theme-openwrt/htdocs/luci-static/openwrt.org/cascade.css
@@ -379,6 +379,11 @@ textarea#syslog {
        border-color: #444444;
 }
 
+#applyreboot-section {
+       margin: 2rem;
+       line-height: 300%;
+}
+
 .lang_he #maincontent {
        direction: rtl;
 }
@@ -429,11 +434,11 @@ p {
 }
 
 .cbi-title-ref {
-       color: inherit;
-       text-decoration: none;
-       padding-right: 18px;
-       background: url('../resources/cbi/link.gif') no-repeat scroll right center;
-       background-color: inherit;
+       color: #37c;
+}
+
+.cbi-title-ref::after {
+       content: "➙";
 }
 
 ul.cbi-apply {
@@ -850,7 +855,9 @@ div.cbi-optionals {
        margin-left: 50%;
 }
 
-.cbi-page-actions > .cbi-button-apply + .cbi-button-save {
+.cbi-page-actions > .cbi-button-apply + .cbi-button-save,
+.cbi-page-actions > .cbi-button-save + form[method="post"],
+.cbi-page-actions > form[method="post"] + form[method="post"] {
        margin-left: 3px;
 }
 
@@ -1144,6 +1151,19 @@ ul.cbi-tabmenu li.cbi-tab {
        opacity: .6;
 }
 
+input[type="text"] + .cbi-button,
+input[type="password"] + .cbi-button,
+select + .cbi-button {
+       border-radius: 0 3px 3px 0;
+       border: 1px outset #000;
+       margin: 0 0 1px -2px;
+       padding: 0 6px;
+       vertical-align: top;
+       display: inline-block;
+       height: 14pt;
+       font-size: 10pt;
+       line-height: 12pt;
+}
 
 .cbi-tooltip-container {
        cursor: help;
@@ -1332,6 +1352,11 @@ ul.cbi-tabmenu li.cbi-tab {
        margin: .5em 0 0 0;
 }
 
+#dsl_status_table .ifacebox-body > span > strong {
+       display: inline-block;
+       min-width: 35%;
+}
+
 
 .zonebadge {
        padding: 2px;
@@ -1372,44 +1397,49 @@ ul.cbi-tabmenu li.cbi-tab {
 
 .uci-change-list {
        font-family: monospace;
+       white-space: pre;
 }
 
+.uci-change-list del,
 .uci-change-list ins,
-.uci-change-legend-label ins {
+.uci-change-list var,
+.uci-change-legend-label del,
+.uci-change-legend-label ins,
+.uci-change-legend-label var {
        text-decoration: none;
-       border: 1px solid #00FF00;
-       background-color: #CCFFCC;
-       display: block;
+       font-style: normal;
+       border: 1px solid #ccc;
+       background: #eee;
        padding: 2px;
+       display: block;
+       line-height: 15px;
+       margin-bottom: 1px;
+}
+
+.uci-change-list ins,
+.uci-change-legend-label ins {
+       border-color: #0f0;
+       background: #cfc;
 }
 
 .uci-change-list del,
 .uci-change-legend-label del {
-       text-decoration: none;
-       border: 1px solid #FF0000;
-       background-color: #FFCCCC;
-       display: block;
-       font-style: normal;
-       padding: 2px;
+       border-color: #f00;
+       background: #fcc;
 }
 
 .uci-change-list var,
 .uci-change-legend-label var {
-       text-decoration: none;
-       border: 1px solid #CCCCCC;
-       background-color: #EEEEEE;
-       display: block;
-       font-style: normal;
-       padding: 2px;
+       border-color: #ccc;
+       background: #eee;
 }
 
 .uci-change-list var ins,
 .uci-change-list var del {
-       /*display: inline;*/
+       display: inline-block;
        border: none;
-       white-space: pre;
-       font-style: normal;
-       padding: 0px;
+       width: 100%;
+       padding: 0;
 }
 
 .uci-change-legend {
@@ -1427,15 +1457,20 @@ ul.cbi-tabmenu li.cbi-tab {
 .uci-change-legend-label>var {
        float: left;
        margin-right: 4px;
-       width: 10px;
-       height: 10px;
+       width: 12px;
+       height: 12px;
        display: block;
+       position: relative;
 }
 
 .uci-change-legend-label var ins,
 .uci-change-legend-label var del {
-       line-height: 6px;
        border: none;
+       position: absolute;
+       top: 1px;
+       left: 1px;
+       right: 1px;
+       bottom: 1px;
 }
 
 
@@ -1631,6 +1666,10 @@ ul.cbi-tabmenu li.cbi-tab {
        .hide-xs {
                display: none;
        }
+
+       #dsl_status_table .ifacebox-body > span > strong {
+               min-width: 50%;
+       }
 }
 
 @media screen and (max-width: 480px) {
@@ -1742,4 +1781,10 @@ ul.cbi-tabmenu li.cbi-tab {
        #cbi-network-switch_vlan .td.cbi-section-actions {
                flex-basis: 100%;
        }
+
+       #dsl_status_table .ifacebox-body > span > strong {
+               display: block;
+               width: 100%;
+               margin-top: .5em;
+       }
 }