From e36f49c7d90bed4b8c2e3edb1225ca1b9720da4d Mon Sep 17 00:00:00 2001 From: Elias Haugsbakk Date: Tue, 21 Jul 2026 22:54:08 +0200 Subject: swap blog and post for article --- .../src/main/resources/public/css/article.css | 50 ++++++++ .../src/main/resources/public/css/articles.css | 137 +++++++++++++++++++++ .../src/main/resources/public/css/blog.css | 137 --------------------- .../src/main/resources/public/css/home.css | 6 - .../src/main/resources/public/css/post.css | 50 -------- 5 files changed, 187 insertions(+), 193 deletions(-) create mode 100644 clams-server/src/main/resources/public/css/article.css create mode 100644 clams-server/src/main/resources/public/css/articles.css delete mode 100644 clams-server/src/main/resources/public/css/blog.css delete mode 100644 clams-server/src/main/resources/public/css/post.css (limited to 'clams-server/src/main/resources/public/css') diff --git a/clams-server/src/main/resources/public/css/article.css b/clams-server/src/main/resources/public/css/article.css new file mode 100644 index 0000000..faf6f90 --- /dev/null +++ b/clams-server/src/main/resources/public/css/article.css @@ -0,0 +1,50 @@ +.article-header { + display: flex; + justify-content: space-between; + margin-top: 45px; + margin-bottom: 40px; + font-size: 0.9rem; + opacity: 0.7; + border-bottom: 1px solid var(--border-color); + padding-bottom: 10px; +} + +.article-content { + line-height: 1.8; + margin-bottom: 80px; +} + +.article-content p { + margin-bottom: 1.5rem; +} + +.article-content p:has(img) { + margin: 40px 0; + text-align: center; +} + +.article-content img { + width: 100%; + max-width: 550px; + height: auto; + border: 1px solid var(--border-color); + border-radius: 8px; + display: inline-block; +} + +.article-nav { + display: flex; + justify-content: space-between; + margin-top: 60px; + padding-top: 30px; + border-top: 1px dashed var(--border-color); +} + +@media (max-width: 768px) { + .article-header { + margin-top: 10px; + flex-direction: column; + align-items: center; + gap: 10px; + } +} diff --git a/clams-server/src/main/resources/public/css/articles.css b/clams-server/src/main/resources/public/css/articles.css new file mode 100644 index 0000000..b7b7b4f --- /dev/null +++ b/clams-server/src/main/resources/public/css/articles.css @@ -0,0 +1,137 @@ +.intro-text { + text-align: center; + max-width: 600px; + margin: 0 auto 30px auto; +} + +.articles-section { + margin-bottom: 60px; +} + +.search-form { + text-align: center; + margin-bottom: 40px; +} + +.search-form input { + font-family: var(--font-serif), serif; + padding: 6px 10px; + border: 1px solid var(--border-color); + border-radius: 4px; + background: transparent; + color: var(--text-color); + width: 180px; + font-size: 0.8rem; +} + +.search-form button { + font-family: var(--font-serif), serif; + padding: 6px 12px; + background: #e8e8e4; + color: var(--text-color); + border: 1px solid var(--border-color); + border-radius: 4px; + cursor: pointer; + font-weight: bold; + font-size: 0.8rem; +} + +.search-form button:hover { + background: #ddd; +} + +.year-accordion { + margin-bottom: 1.5rem; + cursor: pointer; +} + +.year-toggle { + font-size: 1.25rem; + font-weight: bold; + list-style: none; + margin-bottom: 0.5rem; +} + +.year-toggle::-webkit-details-marker { + display: none; +} + +.year-toggle:hover { + opacity: 0.7; +} + +.article-list { + margin-top: 10px; + padding-left: 35px !important; + border-left: 2px solid var(--border-color); +} + +.article-list li { + margin-bottom: 0.8rem; +} + +.article-list a { + font-size: 1rem; + font-weight: normal; +} + +.featured-desc { + font-weight: normal; + color: var(--text-color); + opacity: 0.85; +} + +.search-results-container { + max-width: 600px; + margin: 30px auto 0 auto; +} + +.search-results-list { + list-style-type: none; + padding: 0; + margin: 0; +} + +.search-result-item { + margin-bottom: 1.25rem; + font-size: 1rem; + line-height: 1.6; +} + +.search-result-date { + display: inline-block; + font-size: 0.9rem; + color: var(--text-color); + opacity: 0.65; + margin-right: 15px; + min-width: 110px; +} + +.search-result-item a { + font-size: 1rem; +} + +.search-result-summary { + font-weight: normal; + color: var(--text-color); + opacity: 0.85; +} + +.no-results { + padding: 20px; + background: #e8e8e4; + border-radius: 4px; + text-align: center; + font-style: italic; +} + +.back-to-articles { + margin-top: 40px; + display: inline-block; +} + +@media (max-width: 768px) { + .search-form input { + width: 250px; + } +} diff --git a/clams-server/src/main/resources/public/css/blog.css b/clams-server/src/main/resources/public/css/blog.css deleted file mode 100644 index 2284182..0000000 --- a/clams-server/src/main/resources/public/css/blog.css +++ /dev/null @@ -1,137 +0,0 @@ -.intro-text { - text-align: center; - max-width: 600px; - margin: 0 auto 30px auto; -} - -.blog-section { - margin-bottom: 60px; -} - -.search-form { - text-align: center; - margin-bottom: 40px; -} - -.search-form input { - font-family: var(--font-serif), serif; - padding: 6px 10px; - border: 1px solid var(--border-color); - border-radius: 4px; - background: transparent; - color: var(--text-color); - width: 180px; - font-size: 0.8rem; -} - -.search-form button { - font-family: var(--font-serif), serif; - padding: 6px 12px; - background: #e8e8e4; - color: var(--text-color); - border: 1px solid var(--border-color); - border-radius: 4px; - cursor: pointer; - font-weight: bold; - font-size: 0.8rem; -} - -.search-form button:hover { - background: #ddd; -} - -.year-accordion { - margin-bottom: 1.5rem; - cursor: pointer; -} - -.year-toggle { - font-size: 1.25rem; - font-weight: bold; - list-style: none; - margin-bottom: 0.5rem; -} - -.year-toggle::-webkit-details-marker { - display: none; -} - -.year-toggle:hover { - opacity: 0.7; -} - -.post-list { - margin-top: 10px; - padding-left: 35px !important; - border-left: 2px solid var(--border-color); -} - -.post-list li { - margin-bottom: 0.8rem; -} - -.post-list a { - font-size: 1rem; - font-weight: normal; -} - -.featured-desc { - font-weight: normal; - color: var(--text-color); - opacity: 0.85; -} - -.search-results-container { - max-width: 600px; - margin: 30px auto 0 auto; -} - -.search-results-list { - list-style-type: none; - padding: 0; - margin: 0; -} - -.search-result-item { - margin-bottom: 1.25rem; - font-size: 1rem; - line-height: 1.6; -} - -.search-result-date { - display: inline-block; - font-size: 0.9rem; - color: var(--text-color); - opacity: 0.65; - margin-right: 15px; - min-width: 110px; -} - -.search-result-item a { - font-size: 1rem; -} - -.search-result-summary { - font-weight: normal; - color: var(--text-color); - opacity: 0.85; -} - -.no-results { - padding: 20px; - background: #e8e8e4; - border-radius: 4px; - text-align: center; - font-style: italic; -} - -.back-to-blog { - margin-top: 40px; - display: inline-block; -} - -@media (max-width: 768px) { - .search-form input { - width: 250px; - } -} diff --git a/clams-server/src/main/resources/public/css/home.css b/clams-server/src/main/resources/public/css/home.css index f76d93a..268e371 100644 --- a/clams-server/src/main/resources/public/css/home.css +++ b/clams-server/src/main/resources/public/css/home.css @@ -29,12 +29,6 @@ word-wrap: break-word; } -.study-line { - margin-top: 0.5rem; - font-size: 0.95rem; - opacity: 0.8; -} - @media (max-width: 768px) { .content-grid { grid-template-columns: 1fr; diff --git a/clams-server/src/main/resources/public/css/post.css b/clams-server/src/main/resources/public/css/post.css deleted file mode 100644 index 6a237e1..0000000 --- a/clams-server/src/main/resources/public/css/post.css +++ /dev/null @@ -1,50 +0,0 @@ -.post-header { - display: flex; - justify-content: space-between; - margin-top: 45px; - margin-bottom: 40px; - font-size: 0.9rem; - opacity: 0.7; - border-bottom: 1px solid var(--border-color); - padding-bottom: 10px; -} - -.post-content { - line-height: 1.8; - margin-bottom: 80px; -} - -.post-content p { - margin-bottom: 1.5rem; -} - -.post-content p:has(img) { - margin: 40px 0; - text-align: center; -} - -.post-content img { - width: 100%; - max-width: 550px; - height: auto; - border: 1px solid var(--border-color); - border-radius: 8px; - display: inline-block; -} - -.post-nav { - display: flex; - justify-content: space-between; - margin-top: 60px; - padding-top: 30px; - border-top: 1px dashed var(--border-color); -} - -@media (max-width: 768px) { - .post-header { - margin-top: 10px; - flex-direction: column; - align-items: center; - gap: 10px; - } -} -- cgit v1.2.3