frodovdr/raspap-webgui
1
0
Fork 0
mirror of https://github.com/billz/raspap-webgui.git synced 2025-03-01 10:31:47 +00:00
Code Issues Packages Projects Releases Wiki Activity

Added @media query to optimize display on small devices

Browse Source
This commit is contained in:
billz
2019-11-01 09:11:48 +00:00
parent 7f384e9ff1
commit 5ba9122aaa
3 changed files with 46 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
app/css/hackernews.css
View File

@@ -38,7 +38,7 @@ h5.card-title {
.card-header .col {
color: #212529;
font-size: 1.1rem;
font-size: 1.0rem;
}
.card-header [class^="fa"] {
@@ -79,6 +79,17 @@ ul.nav-tabs, .nav-tabs .nav-link {
background-color: #fff;
}
/* Small devices (portrait phones, up to 576px) */
@media (max-width: 576px) {
.container-fluid, .card-body, .col-md-6 { padding-left: 0.5rem; padding-right: 0.5rem; }
.card .card-header { padding: .75rem .5rem; font-size: 1.0rem; }
.row { margin-left: 0rem; margin-right: 0rem; }
.col-lg-12 { padding-right: 0.25rem; padding-left: 0.25rem; }
.form-group.col-md-6 { margin-left: -0.5rem; }
.js-wifi-stations { margin-left: -0.5rem; margin-right: -0.5rem; }
h4.mt-3 { margin-left: 0.5rem; }
}
.card-body {
background-color: #f6f6ef;
}
@@ -130,15 +141,15 @@ ul.nav-tabs, .nav-tabs .nav-link {
border-width: 0;
}
i.fas.fa-circle.service-status-running {
i.fas.fa-circle.service-status-up {
color: green;
}
i.fas.fa-circle.service-status-stopped {
i.fas.fa-circle.service-status-down {
color: red;
}
.service-status-stopped {
.service-status-down {
animation: flash 1s linear infinite;
}
@keyframes flash {