luci-theme-openwrt-2020: add css success label
[project/luci.git] / themes / luci-theme-openwrt-2020 / htdocs / luci-static / openwrt2020 / cascade.css
index affb7dcaf1d074d872bd784504500a5c945e43dd..c6e5d774283eff334dcf5d3d3dd291968f08a025 100644 (file)
@@ -5,6 +5,7 @@
        --secondary-dark-color: #212322;
        --danger-color: #CC1111;
        --warning-color: #CC8800;
+       --success-color: #5CB85C;
        --regular-font: "GalanoGrotesqueW00-Regular";
        --base-font-size: 16px;
 }
@@ -147,7 +148,8 @@ body {
 }
 
 #mainmenu {
-       flex: 1 1 200px;
+       flex: 1 1 100px;
+       max-width: 250px;
        background: var(--main-dark-color);
        color: var(--main-bright-color);
        padding: 1em;
@@ -166,7 +168,7 @@ body {
 
 #mainmenu ul {
        padding: 0;
-       margin: 0 0 .5em .5em;
+       margin: 0 0 0 .5em;
        line-height: 1.5em;
 }
 
@@ -188,6 +190,7 @@ body {
 #mainmenu li.active > ul {
        max-height: 3000px;
        transition: max-height 1s ease-in-out;
+       margin: 0 0 .5em .5em;
 }
 
 #mainmenu .l1 > li > a {
@@ -661,7 +664,7 @@ ul > li {
        padding: 0;
        text-align: center;
        width: 100%;
-       max-width: 100px;
+       max-width: 150px;
 }
 
 .ifacebox-head {
@@ -848,6 +851,10 @@ ul > li {
        background: var(--danger-color);
 }
 
+.alert-message.success {
+       background: var(--success-color);
+}
+
 .alert-message .btn {
        background: inherit;
        box-shadow: 0 0 2px var(--secondary-bright-color);
@@ -1512,11 +1519,12 @@ div[id$=".editlist"] {
        top: 0;
        bottom: 0;
        left: .4em;
-       width: 1.3em;
-       height: 1.3em;
+       width: 1.4em;
+       height: 1.4em;
        animation: spin 1s linear infinite;
        content: url("spinner.svg");
        margin: auto;
+       line-height: 0;
 }
 
 button.spinning, .btn.spinning {
@@ -1550,6 +1558,10 @@ button.spinning::before, .btn.spinning::before {
        background: var(--danger-color);
 }
 
+.label.success {
+       background: var(--success-color);
+}
+
 ul.deps {
        margin: 0;
        padding: 0;