diff options
Diffstat (limited to 'elm/cost-of-meeting/src/styles.css')
-rw-r--r-- | elm/cost-of-meeting/src/styles.css | 121 |
1 files changed, 121 insertions, 0 deletions
diff --git a/elm/cost-of-meeting/src/styles.css b/elm/cost-of-meeting/src/styles.css new file mode 100644 index 0000000..5d0427b --- /dev/null +++ b/elm/cost-of-meeting/src/styles.css @@ -0,0 +1,121 @@ +* { + box-sizing: border-box; + margin: 0; + padding: 0; +} + +body { + background-color: white; + font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; + line-height: 1.6; +} + +.container { + max-width: 100%; + margin: 0; + padding: 1rem; + border: 3px solid black; +} + +@media (min-width: 600px) { + .container { + max-width: 600px; + margin: 2rem auto; + padding: 2rem; + } +} + +.input-group { + margin-bottom: 2rem; + border: 2px solid black; + padding: 1rem; +} + +.input-group label { + display: block; + margin-bottom: 0.5rem; + font-weight: bold; + text-transform: uppercase; + font-size: 0.9rem; + letter-spacing: 0.05em; +} + +.input-group input { + width: 100%; + padding: 0.75rem; + font-size: 16px; + border: 2px solid black; + background: white; + -webkit-appearance: none; + -moz-appearance: textfield; +} + +.input-group input:focus { + outline: none; + border-width: 3px; +} + +.results { + margin-top: 2rem; + padding: 1.5rem; + border: 2px solid black; + background-color: white; +} + +.errors { + margin: 1rem 0; + padding: 1rem; + border: 2px solid black; + background-color: white; +} + +.errors p { + color: black; + font-size: 0.9rem; + margin: 0.5rem 0; + font-weight: normal; +} + +h1 { + color: black; + margin-bottom: 2rem; + font-size: 1.5rem; + text-transform: uppercase; + letter-spacing: 0.1em; + border-bottom: 3px solid black; + padding-bottom: 0.5rem; +} + +h2 { + color: black; + font-size: 1.2rem; + margin-bottom: 1rem; + text-transform: uppercase; + letter-spacing: 0.05em; + border-bottom: 2px solid black; + padding-bottom: 0.5rem; +} + +p { + margin: 1rem 0; + font-size: 1.1rem; + font-weight: 500; + display: flex; + justify-content: space-between; + align-items: baseline; +} + +p span { + font-weight: normal; +} + +p strong { + min-width: 120px; + text-align: right; +} + +input[type=number]::-webkit-inner-spin-button, +input[type=number]::-webkit-outer-spin-button { + -webkit-appearance: none; + margin: 0; +} \ No newline at end of file |