diff options
| -rw-r--r-- | css/xengineering.css | 61 |
1 files changed, 32 insertions, 29 deletions
diff --git a/css/xengineering.css b/css/xengineering.css index 4a322ed..9067ec7 100644 --- a/css/xengineering.css +++ b/css/xengineering.css @@ -34,6 +34,9 @@ contact via mail: me@xengineering.eu --background-color-dark2: darkgray; --font-family-primary: Arial, Helvetica, sans-serif; + + --vertical-space-small: 1vh; + --vertical-space-big: 3vh; } /***************************** DEFAULT / MOBILE *******************************/ @@ -85,50 +88,50 @@ main { } h1 { - margin-top: 3vh; - margin-bottom: 1vh; + margin-top: var(--vertical-space-big); + margin-bottom: var(--vertical-space-small); font-size: 2.2em; } h2 { - margin-top: 3vh; - margin-bottom: 1vh; + margin-top: var(--vertical-space-big); + margin-bottom: var(--vertical-space-small); font-size: 2.0em; } h3 { - margin-top: 3vh; - margin-bottom: 1vh; + margin-top: var(--vertical-space-big); + margin-bottom: var(--vertical-space-small); font-size: 1.8em; } h4 { - margin-top: 3vh; - margin-bottom: 1vh; + margin-top: var(--vertical-space-big); + margin-bottom: var(--vertical-space-small); font-size: 1.6em; } h5 { - margin-top: 3vh; - margin-bottom: 1vh; + margin-top: var(--vertical-space-big); + margin-bottom: var(--vertical-space-small); font-size: 1.4em; } h6 { - margin-top: 3vh; - margin-bottom: 1vh; + margin-top: var(--vertical-space-big); + margin-bottom: var(--vertical-space-small); font-size: 1.2em; } p { - margin-top: 1vh; - margin-bottom: 1vh; + margin-top: var(--vertical-space-small); + margin-bottom: var(--vertical-space-small); } a { display: inline; - margin-top: 1vh; - margin-bottom: 1vh; + margin-top: var(--vertical-space-small); + margin-bottom: var(--vertical-space-small); text-decoration: none; color: blue; } @@ -148,33 +151,33 @@ button:hover { } img { - margin-top: 1vh; - margin-bottom: 1vh; + margin-top: var(--vertical-space-small); + margin-bottom: var(--vertical-space-small); } ol { - margin-top: 1vh; - margin-bottom: 1vh; + margin-top: var(--vertical-space-small); + margin-bottom: var(--vertical-space-small); list-style-position: outside; padding-left: 2em; } ul { - margin-top: 1vh; - margin-bottom: 1vh; + margin-top: var(--vertical-space-small); + margin-bottom: var(--vertical-space-small); list-style-position: outside; padding-left: 2em; } li { display: list-item; - margin-top: 1vh; - margin-bottom: 1vh; + margin-top: var(--vertical-space-small); + margin-bottom: var(--vertical-space-small); } pre { - margin-top: 1vh; - margin-bottom: 1vh; + margin-top: var(--vertical-space-small); + margin-bottom: var(--vertical-space-small); padding: 1em; white-space: pre-wrap; background-color: var(--background-color-light2); @@ -182,13 +185,13 @@ pre { } footer { - height: 3vh; + height: var(--vertical-space-big); background-color: rgba(0,0,0,0); } .card { - margin-top: 1vh; - margin-bottom: 1vh; + margin-top: var(--vertical-space-small); + margin-bottom: var(--vertical-space-small); padding: 1em; box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2); border-radius: 0.5em; |