diff --git a/static/src/vdk2ch.css b/static/src/vdk2ch.css index 29fec9a..bbf7e7d 100644 --- a/static/src/vdk2ch.css +++ b/static/src/vdk2ch.css @@ -9,7 +9,7 @@ -webkit-clip-path: polygon(0% 50%, 25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%); -moz-clip-path: polygon(0% 50%, 25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%); } - + .hex-background { position: absolute; background-color: orange; /*color of the main-background*/ @@ -28,4 +28,27 @@ object-fit: cover; -webkit-clip-path: polygon(0% 50%, 25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%); -moz-clip-path: polygon(0% 50%, 25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%); -} \ No newline at end of file +} + + +.hex-main { + display:flex; + --s: 100px; /* size */ + --m: 4px; /* margin */ + --f: calc(1.732 * var(--s) + 4 * var(--m) - 1px); +} + +.hex-container { + font-size: 0; /*disable white space between inline block element */ +} + +.hex-container img { + width: var(--s); + margin: var(--m); + height: calc(var(--s)*1.1547); + display: inline-block; + font-size:initial; + clip-path: polygon(0% 25%, 0% 75%, 50% 100%, 100% 75%, 100% 25%, 50% 0%); + background: red; + margin-bottom: calc(var(--m) - var(--s)*0.2885); +} \ No newline at end of file diff --git a/templates/posts.html b/templates/posts.html index e074788..1014318 100644 --- a/templates/posts.html +++ b/templates/posts.html @@ -55,8 +55,8 @@ -
-
+
+
954x960