diff --git a/app/assets/styles/general.css b/app/assets/styles/general.css index 99a8bc6..1028fda 100755 --- a/app/assets/styles/general.css +++ b/app/assets/styles/general.css @@ -65,6 +65,8 @@ --radius-border: var(--font-size-default); --transition-default: 150ms; + + --page-max-width: 820px; } * { @@ -78,9 +80,14 @@ body { height: 100%; overflow-x: hidden; font-family: sans-serif; - background: var(--color-main-darkest); color: var(--color-text); font-size: var(--font-size-default); + max-width: var(--page-max-width); + margin: 0 auto; + background-image: url("/img/desktop-background.svg"); + background-position: center; + box-shadow: var(--box-shadow-z2); + } h1, h2, h3 { diff --git a/app/assets/styles/header.css b/app/assets/styles/header.css index 5e5226d..101693a 100755 --- a/app/assets/styles/header.css +++ b/app/assets/styles/header.css @@ -17,6 +17,7 @@ backdrop-filter: blur(10px); mask: linear-gradient(to top, transparent, black 30%); width: 100%; + max-width: var(--page-max-width); top: 0; padding-bottom: var(--padding-xxl); } diff --git a/app/assets/styles/timelineCard.css b/app/assets/styles/timelineCard.css index 033721e..cf860a5 100644 --- a/app/assets/styles/timelineCard.css +++ b/app/assets/styles/timelineCard.css @@ -7,12 +7,13 @@ padding: var(--padding-xs); & .icon { + flex: 0 0 25%; font-size: var(--font-size-xxl); - flex: 1 0 4rem; color: var(--color-main-dark); } & .text { text-align: left; + flex-grow: 1; } } \ No newline at end of file diff --git a/public/img/desktop-background.svg b/public/img/desktop-background.svg new file mode 100644 index 0000000..6e811bd --- /dev/null +++ b/public/img/desktop-background.svg @@ -0,0 +1 @@ + \ No newline at end of file