diff options
author | Jannik Schönartz | 2019-01-31 19:25:54 +0100 |
---|---|---|
committer | Jannik Schönartz | 2019-01-31 19:25:54 +0100 |
commit | c6b1ee42d14d360d88361737ac94cb576cfcb185 (patch) | |
tree | f90f2932be422be77812d8662e95e9c72ee714fc /style.css | |
parent | Seperate config from the python script (diff) | |
download | bwlp-monitoring-c6b1ee42d14d360d88361737ac94cb576cfcb185.tar.gz bwlp-monitoring-c6b1ee42d14d360d88361737ac94cb576cfcb185.tar.xz bwlp-monitoring-c6b1ee42d14d360d88361737ac94cb576cfcb185.zip |
Add horizontal / vertical param
Small design bugfixes.
Add horizontal param: Overrides min-width >1500px media
Add vertical param: Overrides max-width 850px media
Remove images in the header when the side gets to small
Diffstat (limited to 'style.css')
-rw-r--r-- | style.css | 47 |
1 files changed, 11 insertions, 36 deletions
@@ -34,30 +34,31 @@ a:hover { height: 60px; position: fixed; box-shadow: 0 2px 4px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12); + --header-display: flex; + z-index: 1; } -#header_left { - display: flex; +.header_element { + display: var(--header-display); flex-direction: row; - justify-content: left; align-items: center; +} + +#header_left { + justify-content: left; width: 228px; } #header_center { display: flex; - flex-direction: row; justify-content: center; - align-items: center; margin-right: 16px; margin-left: 16px; + width: 100%; } #header_right { - display: flex; - flex-direction: row; justify-content: right; - align-items: center; margin-right: 8px; width: 228px; } @@ -147,7 +148,6 @@ a:hover { #log { display: flex; flex-direction: column; - background-color: #f5f5f5; white-space: nowrap; height: 100%; --wrap: nowrap; @@ -161,6 +161,8 @@ a:hover { box-shadow: 0 2px 4px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12); overflow: auto; max-width: 80vw; + background-color: #f5f5f5; + width: 100%; } .log_item { @@ -199,30 +201,3 @@ a:hover { .log_item:hover { background-color: #efeeee; } - -@media (min-width: 1500px) { - #body { - flex-direction: row; - } - - #log_wrapper { - margin-left: 40px; - margin-top: 0px; - max-width: 60vw; - max-height: calc(100vh - 120px); - } - #content { - width: 30%; - height: calc(100vh - 120px); - min-height: 51px; - } -} - -@media (max-width: 850px) { - #header_right { - visibility: collapse; - } - #header_left { - visibility: collapse; - } -} |