mirror of
https://github.com/RaspAP/raspap-webgui.git
synced 2024-11-25 00:50:29 +00:00
Add .signal-icon + .signal-bar classes
This commit is contained in:
parent
26bde30e95
commit
4850354630
3 changed files with 109 additions and 1 deletions
|
@ -257,3 +257,57 @@ canvas#divDBChartBandwidthhourly {
|
|||
color: #ff4500;
|
||||
}
|
||||
|
||||
.signal-icon {
|
||||
margin-top: 2px;
|
||||
height: 16px;
|
||||
width: 16px;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items: baseline;
|
||||
}
|
||||
.signal-icon .signal-bar {
|
||||
width: 4px;
|
||||
border-radius: 1px;
|
||||
opacity: 30%;
|
||||
background: <?php echo $color; ?>;
|
||||
}
|
||||
|
||||
.signal-icon .signal-bar:nth-child(1) { height: 40%; }
|
||||
.signal-icon .signal-bar:nth-child(2) { height: 70%; }
|
||||
.signal-icon .signal-bar:nth-child(3) { height: 100%; }
|
||||
|
||||
.signal-icon.weak .signal-bar:nth-child(1),
|
||||
.signal-icon.medium .signal-bar:nth-child(1),
|
||||
.signal-icon.medium .signal-bar:nth-child(2),
|
||||
.signal-icon.strong .signal-bar:nth-child(1),
|
||||
.signal-icon.strong .signal-bar:nth-child(2),
|
||||
.signal-icon.strong .signal-bar:nth-child(3)
|
||||
{ opacity: 100%; }.signal-icon {
|
||||
margin-top: 2px;
|
||||
height: 16px;
|
||||
width: 16px;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items: baseline;
|
||||
}
|
||||
.signal-icon .signal-bar {
|
||||
width: 4px;
|
||||
border-radius: 1px;
|
||||
opacity: 30%;
|
||||
background: <?php echo $color; ?>;
|
||||
}
|
||||
|
||||
.signal-icon .signal-bar:nth-child(1) { height: 40%; }
|
||||
.signal-icon .signal-bar:nth-child(2) { height: 70%; }
|
||||
.signal-icon .signal-bar:nth-child(3) { height: 100%; }
|
||||
|
||||
.signal-icon.weak .signal-bar:nth-child(1),
|
||||
.signal-icon.medium .signal-bar:nth-child(1),
|
||||
.signal-icon.medium .signal-bar:nth-child(2),
|
||||
.signal-icon.strong .signal-bar:nth-child(1),
|
||||
.signal-icon.strong .signal-bar:nth-child(2),
|
||||
.signal-icon.strong .signal-bar:nth-child(3)
|
||||
{ opacity: 100%; }
|
||||
|
||||
|
|
|
@ -39,7 +39,7 @@ h5.card-title {
|
|||
}
|
||||
|
||||
.card, .modal-dialog {
|
||||
border-radius: 1px;
|
||||
border-radius: 3px;
|
||||
border-color: #ff6600;
|
||||
}
|
||||
|
||||
|
@ -302,3 +302,30 @@ canvas#divDBChartBandwidthhourly {
|
|||
color: #ff4500;
|
||||
}
|
||||
|
||||
.signal-icon {
|
||||
margin-top: 2px;
|
||||
height: 16px;
|
||||
width: 16px;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items: baseline;
|
||||
}
|
||||
.signal-icon .signal-bar {
|
||||
width: 4px;
|
||||
border-radius: 1px;
|
||||
opacity: 30%;
|
||||
background: #ff6600;
|
||||
}
|
||||
|
||||
.signal-icon .signal-bar:nth-child(1) { height: 40%; }
|
||||
.signal-icon .signal-bar:nth-child(2) { height: 70%; }
|
||||
.signal-icon .signal-bar:nth-child(3) { height: 100%; }
|
||||
|
||||
.signal-icon.weak .signal-bar:nth-child(1),
|
||||
.signal-icon.medium .signal-bar:nth-child(1),
|
||||
.signal-icon.medium .signal-bar:nth-child(2),
|
||||
.signal-icon.strong .signal-bar:nth-child(1),
|
||||
.signal-icon.strong .signal-bar:nth-child(2),
|
||||
.signal-icon.strong .signal-bar:nth-child(3)
|
||||
{ opacity: 100%; }
|
||||
|
|
|
@ -484,3 +484,30 @@ canvas#divDBChartBandwidthhourly {
|
|||
color: #ff4500;
|
||||
}
|
||||
|
||||
.signal-icon {
|
||||
margin-top: 2px;
|
||||
height: 16px;
|
||||
width: 16px;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items: baseline;
|
||||
}
|
||||
.signal-icon .signal-bar {
|
||||
width: 4px;
|
||||
border-radius: 1px;
|
||||
opacity: 30%;
|
||||
background: #2b8080;
|
||||
}
|
||||
|
||||
.signal-icon .signal-bar:nth-child(1) { height: 40%; }
|
||||
.signal-icon .signal-bar:nth-child(2) { height: 70%; }
|
||||
.signal-icon .signal-bar:nth-child(3) { height: 100%; }
|
||||
|
||||
.signal-icon.weak .signal-bar:nth-child(1),
|
||||
.signal-icon.medium .signal-bar:nth-child(1),
|
||||
.signal-icon.medium .signal-bar:nth-child(2),
|
||||
.signal-icon.strong .signal-bar:nth-child(1),
|
||||
.signal-icon.strong .signal-bar:nth-child(2),
|
||||
.signal-icon.strong .signal-bar:nth-child(3)
|
||||
{ opacity: 100%; }
|
||||
|
|
Loading…
Reference in a new issue