DEVELOPMENT
LEARN: GAMEDEV // MODDING // WEBDEV
MY EXPERIMENTS AND PROJECTS
archive / pages / graphics / codes / other
pages
- Hey, by The Steppes. credits: drawing, body css
graphics
codes
/ theme for bear blog
:root { --width: 720px; --font-main: monospace, "Segoe UI"; --font-secondary: monospace; --font-scale: 1.2em; --background-color: #283739; --heading-color: #e0e0e0; --text-color: #a2c11c; --link-color: #e0e0e0; --visited-color: #2c5d63; --code-background-color: #2c5d63; --code-color: #e0e0e0; --blockquote-color: #2c5d63; } body { font-family: var(--font-secondary); font-size: var(--font-scale); margin: auto; padding: 19px; max-width: var(--width); text-align: left; background-color: var(--background-color); word-wrap: break-word; overflow-wrap: break-word; line-height: 1.5; color: var(--text-color); } h1, h2, h3, h4, h5, h6 { font-family: var(--font-main); color: var(--heading-color); letter-spacing: 2px; margin: 2px; } ol { list-style-type: hiragana; } ol li { margin-bottom: 6px; } a { color: var(--link-color); cursor: pointer; text-decoration: none; } details { margin: 2px 0; border: 1.5px solid var(--visited-color); } details summary { padding: 3px; margin: 5px 7px; list-style: "〣 "; } details p { padding: 2px; margin-bottom: 7px; margin-left: 10px; } ul { list-style-type: "➼ "; margin: 5px; } ul li { margin-bottom: 5px; } a:hover { color: var(--visited-color); text-decoration-line: overline underline; } nav a { margin-right: 8px; } nav a::hover { text-decoration: none; } strong, b { color: var(--text-color); text-decoration: underline dotted; } /* that thing on the bottom of the page */ .upvote-count { color: var(--text-color); } button { margin: 0; cursor: pointer; } main { line-height: 1.6; } table { width: 100%; } /* that thing near upvotes counter */ .css-i6dzq1 { color: var(--link-color); } hr { border: 0; border-top: 2px solid var(--link-color); } img { max-width: 100%; } code { font-family: monospace; padding: 2px; background-color: var(--code-background-color); color: var(--code-color); } blockquote { border-left: 5px solid var(--text-color); padding: 0 15px; margin: 7px 0; line-height: 32px; font-size: 16px; background-color: var(--background-color); color: var(--code-color); } footer { padding: 25px 0; text-align: center; } .title h1 { color: var(--link-color); } .title h1:hover { color: var(--visited-color); } .inline { width: auto !important; } .highlight, .code { padding: 1px 15px; background-color: var(--code-background-color); color: var(--code-color); border-radius: 3px; margin-block-start: 1em; margin-block-end: 1em; overflow-x: auto; } ul.blog-posts { list-style-type: "➼ "; padding: unset; } ul.blog-posts li { display: flex; } ul.blog-posts li span { width: 150px; } ul.blog-posts li a:visited { color: var(--visited-color); }
ELDER SCROLLS
- (almost) first layout, no CSS, based on windchime. i was breaking everything. and also it's my first REALLY webdev experience. not Markdown, not cursed FurAffinity code editor...
- second big layout and 1000 personal edits, based on skyline. oh my. really big thing... i didn't know about java, so i was editing every HTML page every time i was changing sidebar links. bruh. even with CSS it was too big...
- third layout, based on zonelets. I've tried kinda medieval fantasy style lmao!