From 897e58b6ced91e877de7daf853f93cbf1fa837c9 Mon Sep 17 00:00:00 2001 From: zk_exe Date: Sun, 27 Jul 2025 18:55:14 -0300 Subject: [PATCH] layout posts teste. --- css/base.css | 3 ++ css/style.css | 55 +++++++++++++++++++++++++++++++ index.html | 89 +++++++++++++++++++++++++++++++++++++++++++++++++++ 3 files changed, 147 insertions(+) diff --git a/css/base.css b/css/base.css index 50203c8..418cf0f 100644 --- a/css/base.css +++ b/css/base.css @@ -7,6 +7,9 @@ @import url("https://fonts.googleapis.com/css2?family=Public+Sans:ital,wght@0,100..900;1,100..900&display=swap"); /* font-family: "Public Sans", sans-serif; */ +@import url("https://fonts.googleapis.com/css2?family=Special+Gothic+Expanded+One&display=swap"); +/* font-family: "Special Gothic Expanded One", sans-serif; */ + :root { --font: #c4e5f2; --bg-dark: #010d26; diff --git a/css/style.css b/css/style.css index f449f8e..33d4513 100644 --- a/css/style.css +++ b/css/style.css @@ -87,3 +87,58 @@ } } } + +#posts { + background-color: #0000007a; + padding: 4dvw 0 4dvw 0; + margin: 4dvw 0 0 0; + width: 100%; + display: flex; + justify-content: center; + + ul { + width: calc(100% - 5dvw); + display: flex; + flex-wrap: wrap; + gap: 1.5vw; + a { + width: calc(33.33% - 1dvw - 2px); + height: 30dvh; + overflow: hidden; + + border-radius: 1dvw; + li { + overflow: hidden; + width: 100%; + background: #0000007a; + display: flex; + img { + width: 25dvh; + height: 30dvh; + object-fit: cover; + } + hgroup { + width: calc(100% - 25dvh); + label { + display: block; + width: 100%; + text-align: center; + font-size: 1.5em; + font-family: "Special Gothic Expanded One", sans-serif; + color: var(--btn); + } + h3 { + font-family: Arial; + display: block; + width: 100%; + text-align: right; + } + p { + font-family: Arial; + white-space: pre-wrap; + } + } + } + } + } +} diff --git a/index.html b/index.html index 2d7618a..4807afe 100644 --- a/index.html +++ b/index.html @@ -39,5 +39,94 @@ +
+ +