From b7c37574f4f90fc346bc51dd06c77c8958570b33 Mon Sep 17 00:00:00 2001 From: Stanisław Zagórowski Date: Wed, 30 Aug 2023 18:00:11 +0200 Subject: all: move front into its own directory --- front/src/app.css | 120 ++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 120 insertions(+) create mode 100644 front/src/app.css (limited to 'front/src/app.css') diff --git a/front/src/app.css b/front/src/app.css new file mode 100644 index 0000000..b4086a2 --- /dev/null +++ b/front/src/app.css @@ -0,0 +1,120 @@ +#app-main { + font-family: 'Hack', monospace; + max-width: 1280px; + margin: 0 auto; + padding: 2rem 2rem 2rem 2rem; + text-align: center; +} + +#app { + margin: 0 auto; + text-align: center; + align-content: center; + justify-content: center; +} + +.logo { + height: 6em; + padding: 1.5em; +} +.logo:hover { + filter: drop-shadow(0 0 2em #646cffaa); +} +.logo.preact:hover { + filter: drop-shadow(0 0 2em #673ab8aa); +} + +.main-info { + text-align: center; +} + +@media (min-width: 1150px) { + .main-info { + margin-top: 72px; + } +} + +.main-info-image { + width: 128px; + height: 128px; + border-radius: 100%; + margin: 6px 6px 6px 6px; +} + +.main-info-title { + font-size: 42pt; +} + +.main-info-subtitle { + font-size: 26pt; + font-style: italic; + color: #5c6370; +} + +.quiet { + color: var(--color-gray); + font-style: italic; +} + +.section { + font-size: 22pt; +} + +.highlight { + color: #e5c07b; +} + +@media (max-width: 480px) { + .main-info-title { + font-size: 32pt; + } + + .main-info-subtitle { + font-size: 18pt; + } +} + +@media (max-width: 1150px) and (min-width: 480px) { + .main-info-title { + font-size: 42pt; + } + + .main-info-subtitle { + font-size: 26pt; + } +} + +@media (min-width: 1150px) { + .main-info-title { + font-size: 42pt; + } + + .main-info-subtitle { + font-size: 26pt; + } +} + + +@media (max-width: 480px) { + .about-paragraph { + margin: auto; + font-size: 16pt; + max-width: 90%; + } +} + +@media (max-width: 1150px) and (min-width: 480px) { + .about-paragraph { + margin: auto; + font-size: 18pt; + max-width: 80%; + } +} + +@media (min-width: 1150px) { + .about-paragraph { + margin: auto; + font-size: 18pt; + max-width: 60%; + } +} -- cgit v1.3.1