diff options
| author | Emma Terzioglu <emreterzioglu49@gmail.com> | 2026-03-13 13:49:15 -0700 |
|---|---|---|
| committer | Emma Terzioglu <emreterzioglu49@gmail.com> | 2026-03-13 13:49:15 -0700 |
| commit | 7a33856a527aebbd8d2a624c6d5937c25c9a1d90 (patch) | |
| tree | 855c642394e7ba1de40b8bb8737be12bec0aedaf /src/static/stylesheets | |
initial commit
new website repo yay!!!
Diffstat (limited to 'src/static/stylesheets')
| -rw-r--r-- | src/static/stylesheets/admin_blog.css | 12 | ||||
| -rw-r--r-- | src/static/stylesheets/base.css | 117 | ||||
| -rw-r--r-- | src/static/stylesheets/blog.css | 22 | ||||
| -rw-r--r-- | src/static/stylesheets/index.css | 40 | ||||
| -rw-r--r-- | src/static/stylesheets/projects.css | 51 |
5 files changed, 242 insertions, 0 deletions
diff --git a/src/static/stylesheets/admin_blog.css b/src/static/stylesheets/admin_blog.css new file mode 100644 index 0000000..9f34d88 --- /dev/null +++ b/src/static/stylesheets/admin_blog.css @@ -0,0 +1,12 @@ +#main { + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; +} + +textarea { + width: 300px; + height: 250px; + resize: none; +} diff --git a/src/static/stylesheets/base.css b/src/static/stylesheets/base.css new file mode 100644 index 0000000..62c2874 --- /dev/null +++ b/src/static/stylesheets/base.css @@ -0,0 +1,117 @@ +:root { + font-family: var(--primary-font); + font-size: 12px; + + --navbar-height: 39px; + --primary-font: "Noto Sans Mono", monospace; +} + +body, +html { + width: 100%; + height: 100%; + margin: 0; + padding: 0; +} + +body { + background-image: url(/static/assets/watercolor.jpg); + background-size: cover; + background-position: center; + background-repeat: no-repeat; + /* #c9cfff */ + background-color: rgb(197, 198, 254); +} + +a { + text-decoration: none; +} + +input[type="text"] { + font-family: var(--primary-font); +} + +.flex-row { + display: flex; + flex-direction: row; + align-items: center; + justify-content: center; +} + +.flex-col { + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; +} + +.container { + padding: 20px; + border: 2px #fff solid; + background-color: rgba(255, 255, 255, 0.3); +} + +nav { + display: flex; + flex-direction: row; + position: fixed; + top: 0; + left: 0; + width: 100vw; + z-index: 10000 !important; +} + +#nav-padding { + flex-basis: 0%; + flex-grow: 1; + max-width: 100%; +} + +#nav-inner { + flex: 1 1 auto; + width: auto; + display: inline-flex; + flex-direction: row; + align-items: center; + justify-content: center; + padding: 4px 0; + margin: 0 auto; + gap: 6px; + background-color: #3f3f3f; + background-image: linear-gradient(to bottom, #3f3f3f, #2a2a2a); + border-bottom-left-radius: 4px; + border-bottom-right-radius: 4px; +} + +.label { + display: inline-block; + padding: 6px 8px; + text-decoration: none; + background-image: linear-gradient(to bottom, #1c1c1c, #000); + color: #fff; + border: 1px solid #ccc; +} + +.label:hover { + background-image: linear-gradient(to bottom, #1c1c1c, #2c2c2c); +} + +.label[active] { + color: #f33; +} + +#main { + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + + padding-top: calc(var(--navbar-height) + 12px); +} + +@media (max-width: 750px) { + #main { + padding-left: 5px; + padding-right: 5px; + } +} diff --git a/src/static/stylesheets/blog.css b/src/static/stylesheets/blog.css new file mode 100644 index 0000000..9b3066b --- /dev/null +++ b/src/static/stylesheets/blog.css @@ -0,0 +1,22 @@ +#posts { + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + width: 400px; + gap: 12px; +} + +.post { + color: inherit; + width: 400px; +} + +.post:visited { + color: inherit; +} + +.created-at { + font-size: 10px; + color: #333; +} diff --git a/src/static/stylesheets/index.css b/src/static/stylesheets/index.css new file mode 100644 index 0000000..9f8cda3 --- /dev/null +++ b/src/static/stylesheets/index.css @@ -0,0 +1,40 @@ +.two-section { + display: flex; + flex-direction: row; + gap: 10px; + margin: 10px 0; +} + +.two-section .container { + max-width: 400px; +} + +#top { + display: flex; + flex-direction: row; + gap: 20px; + max-width: 600px; +} + +#profile-links { + justify-content: start; + gap: 4px; +} + +#qas { + display: flex; + flex-direction: column; + gap: 20px; + padding: 20px; +} + +.button { + image-rendering: auto; + image-rendering: crisp-edges; + image-rendering: pixelated; + image-rendering: -webkit-optimize-contrast; +} + +/* +shift around the layout at 650px for mobile screens +*/ diff --git a/src/static/stylesheets/projects.css b/src/static/stylesheets/projects.css new file mode 100644 index 0000000..f3181ce --- /dev/null +++ b/src/static/stylesheets/projects.css @@ -0,0 +1,51 @@ +.project { + max-width: 600px; +} + +.project .project-head { + display: flex; + flex-direction: row; + gap: 12px; +} + +.project-head .project-labels { + display: flex; + flex-direction: row; + align-items: center; +} + +.project-head .project-labels p::after { + content: ","; + margin-right: 6px; +} + +.project-head .project-labels p:first-child::before { + content: "("; + margin: 0; +} + +.project-head .project-labels p:last-child::after { + content: ")"; + margin: 0; +} + +.project-links { + display: flex; + flex-direction: row; + align-items: center; +} + +.project-links a::after { + content: "|"; + margin: 0 6px; + cursor: none; +} + +.project-links a:last-child::after { + content: none; + margin: 0; +} + +.project-separator { + border: 1px solid black; +} |
