diff --git a/assets/css/main.css b/assets/css/main.css index 166ade9..97e2d06 100644 --- a/assets/css/main.css +++ b/assets/css/main.css @@ -1,22 +1,78 @@ +:root { + --beetbox-red: #9e0008; + --beetbox-pink: #d93370; + --beetbox-purple: #ac65cb; + --beetbox-green: #003f56; + --beetbox-blue: #5fcfd0; + + --light: #F8F8FF; + + --background: #1f2835; + --text: var(--light); + --links: var(--beetbox-blue); + --link-hover: var(--beetbox-pink); +} + body { - color: #222; + background-color: var(--background); + color: var(--text); font-family: sans-serif; line-height: 1.5; - margin: 1rem; - max-width: 768px; + padding: 0; + margin: 0; +} + +a { + color: var(--links); + text-decoration: none; + transition: color 0.2s ease; +} + +a:hover { + color: var(--link-hover); + text-decoration: underline; +} + +p { + margin-bottom: 1.5rem; } header { - border-bottom: 1px solid #222; - margin-bottom: 1rem; + padding: 4px; + background-color: #f8f8ffcc; +} + +header div {max-width: 1200px; margin: 0 auto;} + +nav ul li { font-weight: 600; } + +main { + max-width: 1200px; + margin: 0 auto; + padding: 1rem; } footer { - border-top: 1px solid #222; - margin-top: 1rem; + border-top: 1px solid var(--light); + max-width: 1200px; + margin: 0 auto; } -a { - color: #00e; - text-decoration: none; +code { white-space: nowrap; } + +pre { + border-radius: .4rem; + max-width: 100%; } + +pre code { + display: block; + tab-size: 4; + padding: 1rem 1.5rem; + font-size: 1.05rem; + white-space: pre; + max-width: 100%; + overflow-x: auto; + border-left: .3rem solid var(--beetbox-purple); + border-radius: .4rem; + } \ No newline at end of file