ghost's graveyard
POSTED ON Oct 4, 2024 12:59:52 GMT -5
Post by ghost on Oct 4, 2024 12:59:52 GMT -5
[attr="class","post-prue"]
[attr="class","post-image"]
[attr="class","inner-image"]
[attr="class","image-bg"]
[attr="class","image-color"]
[attr="class","inner-post"]
I have never coded for Proboards before and I don't know what I'm doing, so if this looks janky no it doesn't.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. "Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat." Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
[attr="class","post-head"]— headsick.
[attr="class","head-span"]i'm on the wrong side of this story
I have never coded for Proboards before and I don't know what I'm doing, so if this looks janky no it doesn't.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. "Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat." Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
[attr="class","post-foot"]
[attr="class","tag"]tags here
[googlefont=Source+Sans+3:400,600,400italic,600italic|Abril+Fatface]
[newclass=".post-prue"]--p-accent: #cf90ae; --p-color-1: #f5f5f5; --p-color-2: #f0f0f0; --p-color-3: #2f2f2f; --p-border: #dfdfdf; --p-text: #444; --p-text-d: #111; --p-text-l: #777; --p-font: 'Source Sans 3',sans-serif; --p-font-display: 'Abril Fatface',serif; max-width: 580px; border: 1px solid var(--p-border); padding: 20px; margin: auto; background-color: var(--p-color-2);[/newclass]
[newclass=".post-prue .post-image"]width: 100%; height: 175px; background-color: var(--p-color-3); position: relative; z-index: 1;[/newclass]
[newclass=".post-prue .post-image .inner-image"]position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px; z-index: 1; mix-blend-mode: lighten;[/newclass]
[newclass=".post-prue .post-image .image-bg"]position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px; z-index: 1; background: url('https://i.ibb.co/PrgP79R/600x175-1.png') center/cover; filter: grayscale(100%) brightness(175%) contrast(130%);[/newclass]
[newclass=".post-prue .post-image .image-color"]position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px; z-index: 2; background-color: var(--p-accent); mix-blend-mode: multiply;[/newclass]
[newclass=".post-prue .inner-post"]outline: 1px solid var(--p-border); margin: 1px; margin-top: 0px; background-color: var(--p-color-1); border-left: 35px solid var(--p-accent); padding: clamp(10px,5vw,50px); font: 400 14px var(--p-font); color: var(--p-text); letter-spacing: .3px; text-align: justify; line-height: 200%;[/newclass]
[newclass=".post-prue .post-head"]text-align: right; font: 100 60px var(--p-font-display); text-transform: lowercase; color: var(--p-accent); letter-spacing: 0px; line-height: 80%; display: flex; flex-flow: column nowrap; align-items: flex-end; gap: 15px;[/newclass]
[newclass=".post-prue .post-head .head-span"]border: 1px solid #dfdfdf; background-color: #f0f0f0; border-radius: 4px; padding: 10px; font: 600 11px var(--p-font); letter-spacing: 3px; text-transform: uppercase; color: var(--p-text-d); line-height: 100%;[/newclass]
[newclass=".post-prue .inner-post > b"]font: 600 110% 'Source Sans 3',sans-serif; color: var(--p-text-d); background: linear-gradient(to bottom, transparent 55%, color-mix(in srgb, var(--p-accent) 25%, transparent) 55%);[/newclass]
[newclass=".post-prue .inner-post > i"]color: color-mix(in srgb, var(--p-accent), #444)[/newclass]
[newclass=".post-prue .post-foot"]text-align: right; display: flex; flex-flow: row wrap; justify-content: flex-end; align-items: center; gap: 10px;[/newclass]
[newclass=".post-prue .post-foot .tag"]border: 1px solid #dfdfdf; border-radius: 4px; background-color: #f0f0f0; padding: 10px; font: 600 10px var(--p-font); text-transform: uppercase; letter-spacing: 2px; color: var(--p-text-d); line-height: 100%;[/newclass]