kenmirrors/MagicMirror
1
0
Fork 0
mirror of https://github.com/MichMich/MagicMirror.git synced 2025-06-27 11:50:00 +00:00
Code Issues Projects Releases Wiki Activity

Use custom property for gaps between modules

Browse Source
This commit is contained in:
veeck 2021-05-07 16:22:07 +02:00
parent e31450f731
commit cf5c0464fe
1 changed files with 12 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
css/main.css
View File

@ -6,6 +6,9 @@
--font-size: 20px; --font-size: 20px;
--font-primary: "Roboto Condensed"; --font-primary: "Roboto Condensed";
--font-secondary: "Roboto"; --font-secondary: "Roboto";
--gap-body: 60px;
--gap-modules: calc(var(--gap-body) / 2);
} }
html { html {
@ -21,10 +24,10 @@ html {
} }
body { body {
margin: 60px; margin: var(--gap-body);
position: absolute; position: absolute;
height: calc(100% - 120px); height: calc(100% - 2 * var(--gap-body));
width: calc(100% - 120px); width: calc(100% - 2 * var(--gap-body));
background: var(--color-background); background: var(--color-background);
color: var(--color-text); color: var(--color-text);
font-family: var(--font-primary), sans-serif; font-family: var(--font-primary), sans-serif;
@ -125,11 +128,11 @@ sup {
*/ */
.module { .module {
margin-bottom: 30px; margin-bottom: var(--gap-modules);
} }
.region.bottom .module { .region.bottom .module {
margin-top: 30px; margin-top: var(--gap-modules);
margin-bottom: 0; margin-bottom: 0;
} }
@ -153,10 +156,10 @@ sup {
.region.fullscreen { .region.fullscreen {
position: absolute; position: absolute;
top: -60px; top: calc(-1 * var(--gap-body));
left: -60px; left: calc(-1 * var(--gap-body));
right: -60px; right: calc(-1 * var(--gap-body));
bottom: -60px; bottom: calc(-1 * var(--gap-body));
pointer-events: none; pointer-events: none;
} }