Streamlining the design of the frontend

- Screenshots updated to show the design changes
- Merge parts of b69912fe31
- maintenance page redesigned
This commit is contained in:
leiweibau
2022-07-19 20:32:25 +02:00
parent 65b788bc54
commit 00b9462708
18 changed files with 235 additions and 242 deletions

View File

@@ -199,21 +199,6 @@ h4 {
.box.box-danger {
border-top-width: 3px;
}
.box.box-info {
border-top-color: #00c0ef;
}
.box.box-primary {
border-top-color: #075383;
}
.box.box-success {
border-top-color: #00a65a;
}
.box.box-warning {
border-top-color: #ff851b;
}
.box.box-danger {
border-top-color: #dd4b39;
}
.main-header .navbar {
background-color: #272c30;
}
@@ -609,41 +594,7 @@ input[type="password"]::-webkit-caps-lock-indicator {
}
/*** Additional fixes For Pi.Alert UI ***/
.small-box {
border-radius: 10px;
}
.pa-small-box-aqua .inner {
background-color: rgb(45,108,133);
border-top-left-radius: 10px;
border-top-right-radius: 10px;
}
.pa-small-box-green .inner {
background-color: rgb(31,76,46);
border-top-left-radius: 10px;
border-top-right-radius: 10px;
}
.pa-small-box-yellow .inner {
background-color: rgb(151,104,37);
border-top-left-radius: 10px;
border-top-right-radius: 10px;
}
.pa-small-box-red .inner {
background-color: rgb(120,50,38);
border-top-left-radius: 10px;
border-top-right-radius: 10px;
}
.pa-small-box-gray .inner {
background-color: #777;
color: rgba(20,20,20,30%);
border-top-left-radius: 10px;
border-top-right-radius: 10px;
}
.pa-small-box-gray .inner h3 {
color: #bbb;
}
.text-gray-20 {
color: rgba(220,220,220,30%);
}
.bg-gray {
background-color: #888888 !important;
}
@@ -677,3 +628,30 @@ input[type="password"]::-webkit-caps-lock-indicator {
width: 100%;
margin: auto;
}
.nav-tabs-custom > .nav-tabs > li:hover > a, .nav-tabs-custom > .nav-tabs > li.active:hover > a {
background-color: #272c30;
color: #bec5cb;
}
.nav-tabs-custom > .nav-tabs > li.active > a, .nav-tabs-custom > .nav-tabs > li.active:hover > a {
border-left-color: #30383f;
border-right-color: #30383f;
background-color: #272c30;
color: #bec5cb;
}
.nav-tabs-custom .tab-content {
background-color: #272c30;
}
.top_small_box_gray_text {
color: white !important;
}
/* remove white border that appears on mobile screen sizes */
.box-body {
border: 0px;
}
/* remove white border that appears on mobile screen sizes */
.table-responsive {
border: 0px;
}

View File

@@ -161,7 +161,7 @@
/* -------------------------------------------------------------------------- */
.pa-small-box-aqua {
border-top: 3px solid #00c0ef;
/* border-top: 3px solid #00c0ef; */
box-shadow: 0 5px 5px rgba(0, 0, 0, 0.1);
}
@@ -180,7 +180,7 @@
/* -------------------------------------------------------------------------- */
.pa-small-box-green {
border-top: 3px solid #00a65a;
/* border-top: 3px solid #00a65a; */
box-shadow: 0 5px 5px rgba(0, 0, 0, 0.1);
}
@@ -199,7 +199,7 @@
/* -------------------------------------------------------------------------- */
.pa-small-box-yellow {
border-top: 3px solid #f39c12;
/* border-top: 3px solid #f39c12; */
box-shadow: 0 5px 5px rgba(0, 0, 0, 0.1);
}
@@ -218,7 +218,7 @@
/* -------------------------------------------------------------------------- */
.pa-small-box-red {
border-top: 3px solid #dd4b39;
/* border-top: 3px solid #dd4b39; */
box-shadow: 0 5px 5px rgba(0, 0, 0, 0.1);
}
@@ -237,7 +237,7 @@
/* -------------------------------------------------------------------------- */
.pa-small-box-gray {
border-top: 3px solid #a0a0a0;
/* border-top: 3px solid #a0a0a0; */
box-shadow: 0 5px 5px rgba(0, 0, 0, 0.1);
}
@@ -257,7 +257,7 @@
/* -----------------------------------------------------------------------------
Customized Box Borders
----------------------------------------------------------------------------- */
.box.box-aqua {
/* .box.box-aqua {
border-top-color: #00c0ef;
}
@@ -271,7 +271,7 @@
.box.box-red {
border-top-color: #dd4b39;
}
} */
/* -----------------------------------------------------------------------------
Custom Border
@@ -459,7 +459,6 @@
white-space: normal;
word-wrap: break-word;
font-size: 16px;
border-radius: 10px;
padding: 4px;
}
@@ -527,3 +526,19 @@ background-repeat: no-repeat;
background-position: center;
height: 50px;
}
.nav-tabs-custom .tab-content {
background-color: white;
}
.top_small_box_gray_text {
color: white !important;
}
.bg-gray {
background-color: #b2b6be !important;
}
.infobox_label {
font-size: 16px !important;
}