Compare commits
10 commits
4bd07a3a85
...
d75d8c79b5
Author | SHA1 | Date | |
---|---|---|---|
d75d8c79b5 | |||
17b30cc283 | |||
5d2ad3b0e5 | |||
b29c9354d5 | |||
a72c55ab15 | |||
f2ad437dbc | |||
3d812fdacc | |||
6db344f524 | |||
3aa5634a73 | |||
9f6ddc0e54 |
14 changed files with 102 additions and 13 deletions
|
@ -69,6 +69,7 @@
|
|||
align-self: start;
|
||||
|
||||
font-size: 0.625em;
|
||||
font-weight: bold;
|
||||
line-height: 1.2;
|
||||
text-align: start;
|
||||
color: var(--clr-heading-data);
|
||||
|
|
|
@ -84,6 +84,7 @@
|
|||
--clr-link: var(--clr-accent-1);
|
||||
--clr-link-underline: var(--clr-accent-1);
|
||||
--clr-gallery-indicator: var(--clr-accent-1);
|
||||
--clr-gradient-box-shadow: var(--clr-accent-1);
|
||||
}
|
||||
|
||||
.viktor {
|
||||
|
@ -106,6 +107,7 @@
|
|||
--clr-link-underline: var(--clr-accent-8);
|
||||
--clr-timeline-stroke: var(--clr-accent-8);
|
||||
--clr-gallery-indicator: var(--clr-accent-8);
|
||||
--clr-gradient-box-shadow: var(--clr-accent-8);
|
||||
|
||||
@media (prefers-color-scheme: light) {
|
||||
--clr-accent-8: oklch(from var(--clr-accent-7) 60% calc(c * 3) h);
|
||||
|
@ -129,5 +131,7 @@
|
|||
--clr-link: var(--clr-accent-1);
|
||||
--clr-link-underline: var(--clr-accent-1);
|
||||
--clr-gallery-indicator: var(--clr-accent-1);
|
||||
--clr-gradient-box-shadow: var(--clr-accent-1);
|
||||
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
<svg webc:root="override">
|
||||
<svg aria-hidden="true" webc:root="override">
|
||||
<use :href="`#${icon}`"></use>
|
||||
</svg>
|
||||
|
||||
|
|
Before Width: | Height: | Size: 197 B After Width: | Height: | Size: 216 B |
|
@ -28,13 +28,16 @@
|
|||
--nav-border: var(--border-thin) solid var(--clr-box-border);
|
||||
|
||||
position: sticky;
|
||||
top: 0;
|
||||
inset: 0.5em;
|
||||
|
||||
display: grid;
|
||||
justify-items: end;
|
||||
|
||||
background-color: var(--nav-background-color);
|
||||
|
||||
margin-block: 0.5em 0;
|
||||
margin-inline: 0.5em;
|
||||
border-radius: inherit;
|
||||
border-block-end: var(--nav-border);
|
||||
|
||||
z-index: 2;
|
||||
|
@ -46,7 +49,7 @@
|
|||
}
|
||||
|
||||
@media (min-width: 64em) {
|
||||
--nav-spacing: 2em;
|
||||
--nav-spacing: 1.5em;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -82,7 +85,7 @@
|
|||
--nav-items-orientation: column nowrap;
|
||||
|
||||
position: var(--nav-items-position);
|
||||
top: 3em;
|
||||
top: 3.5em;
|
||||
|
||||
display: flex;
|
||||
flex-flow: var(--nav-items-orientation);
|
||||
|
@ -93,10 +96,9 @@
|
|||
background-color: var(--clr-nav-background);
|
||||
|
||||
margin: 0;
|
||||
border: var(--border-thin) solid var(--clr-nav-border);
|
||||
border-block-start: none;
|
||||
border-inline-end: none;
|
||||
border-end-start-radius: 0.75em;
|
||||
border-radius: inherit;
|
||||
padding-inline: var(--nav-spacing);
|
||||
|
||||
z-index: 3;
|
||||
|
|
|
@ -17,7 +17,24 @@
|
|||
border: var(--border-thin) solid var(--clr-box-border);
|
||||
border-radius: var(--border-radius);
|
||||
|
||||
overflow: clip;
|
||||
transform: translate(0);
|
||||
transform-style: preserve-3d;
|
||||
}
|
||||
|
||||
:host::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
inset: 0.5em -0.5em -0.5em 0.5em;
|
||||
|
||||
background: radial-gradient(
|
||||
ellipse at top left,
|
||||
oklch(from var(--clr-gradient-box-shadow) calc(l - 0.2) c h) 60%,
|
||||
oklch(from var(--clr-gradient-box-shadow) calc(l + 0.1) c h)
|
||||
);
|
||||
|
||||
border-radius: inherit;
|
||||
|
||||
transform: translate3d(0, 0, -1px);
|
||||
}
|
||||
|
||||
:host > :not(.character-nav, .slider) {
|
||||
|
|
|
@ -40,6 +40,9 @@
|
|||
padding-block: var(--sidebar-padding);
|
||||
padding-inline: var(--sidebar-padding);
|
||||
|
||||
transform: translate(0);
|
||||
transform-style: preserve-3d;
|
||||
|
||||
@media (min-width: 64em) {
|
||||
--sidebar-position: sticky;
|
||||
--sidebar-padding: 1.5rem;
|
||||
|
@ -50,6 +53,22 @@
|
|||
}
|
||||
}
|
||||
|
||||
:host::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
inset: -0.5em 0.5em 0.5em -0.5em;
|
||||
|
||||
background: radial-gradient(
|
||||
ellipse at bottom right,
|
||||
oklch(from var(--clr-gradient-box-shadow) calc(l - 0.2) c h) 60%,
|
||||
oklch(from var(--clr-gradient-box-shadow) calc(l + 0.1) c h)
|
||||
);
|
||||
|
||||
border-radius: inherit;
|
||||
|
||||
transform: translate3d(0, 0, -1px);
|
||||
}
|
||||
|
||||
:host .avatar {
|
||||
grid-area: avatar;
|
||||
justify-self: center;
|
||||
|
|
|
@ -32,7 +32,7 @@
|
|||
place-content: center;
|
||||
row-gap: 1rem;
|
||||
|
||||
margin-block: 0;
|
||||
margin-block: 2em;
|
||||
margin-inline: auto;
|
||||
|
||||
.nsfw &:has(.image.nsfw) {
|
||||
|
|
|
@ -113,14 +113,18 @@
|
|||
:host {
|
||||
display: grid;
|
||||
grid-auto-columns: auto 1fr auto;
|
||||
grid-template-areas:
|
||||
'prev track next'
|
||||
'. progress .';
|
||||
grid-template-areas: 'prev track next';
|
||||
align-items: center;
|
||||
gap: 1em;
|
||||
margin-block: var(--inbox-spacing);
|
||||
}
|
||||
|
||||
:host:has(.slider-nav) {
|
||||
grid-template-areas:
|
||||
'prev track next'
|
||||
'. progress .';
|
||||
}
|
||||
|
||||
:host :where(.prev, .next, .indicator-btn) {
|
||||
--gradient-dir: to bottom right;
|
||||
--gradient-start: var(--clr-box-gradient-start);
|
||||
|
@ -217,6 +221,7 @@
|
|||
:host .track > * {
|
||||
scroll-snap-align: center;
|
||||
padding-inline: var(--inbox-spacing);
|
||||
margin-block: 0;
|
||||
}
|
||||
|
||||
:host .track::-webkit-scrollbar {
|
||||
|
|
|
@ -65,6 +65,7 @@
|
|||
|
||||
:host .type {
|
||||
font-size: 0.625em;
|
||||
font-weight: bold;
|
||||
color: var(--clr-heading-data);
|
||||
text-align: left;
|
||||
text-transform: uppercase;
|
||||
|
|
BIN
src/img/jarek/ref-full-nsfw.png
Normal file
BIN
src/img/jarek/ref-full-nsfw.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 1.6 MiB |
BIN
src/img/jarek/ref-full.png
Normal file
BIN
src/img/jarek/ref-full.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 1.4 MiB |
|
@ -25,6 +25,11 @@
|
|||
<p @text="getDescription(char)"></p>
|
||||
</card>
|
||||
</div>
|
||||
|
||||
<section class="beta-note">
|
||||
<p class="head">🏗️ Work in progress! 🚧</p>
|
||||
<p>Please note that this site is still being worked on and contents are subject to change.</p>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<style>
|
||||
|
@ -53,4 +58,20 @@
|
|||
grid-template-columns: repeat(auto-fit, minmax(17.5em, 1fr));
|
||||
gap: 1.5em;
|
||||
}
|
||||
|
||||
.beta-note {
|
||||
max-width: 60ch;
|
||||
margin: auto;
|
||||
|
||||
margin-block: 2em;
|
||||
border: 0.125em solid white;
|
||||
border-radius: 0.75em;
|
||||
padding-inline: 1em;
|
||||
}
|
||||
|
||||
.beta-note .head {
|
||||
font-family: var(--font-family-headings);
|
||||
font-size: 1.5em;
|
||||
font-weight: bold;
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -4,6 +4,15 @@ eleventyNavigation:
|
|||
order: 2
|
||||
---
|
||||
|
||||
Jarek's color palette:
|
||||
<ref-img
|
||||
:@src="'ref-full.png'"
|
||||
:@alt="'Jarek Ref'"
|
||||
:@artist="'Alpha Moonlight'"
|
||||
:@href="'https://bsky.app/profile/alphamoonlight.bsky.social'"
|
||||
:@width="[1000]"
|
||||
:@char="$data.firstName.toLowerCase()"
|
||||
:@dropshadow="true"
|
||||
:@nsfw="true"
|
||||
></ref-img>
|
||||
|
||||
<colors :@colors="$data.colors"></colors>
|
||||
|
|
|
@ -4,4 +4,14 @@ eleventyNavigation:
|
|||
order: 1
|
||||
---
|
||||
|
||||
Jarek is a proud Krondir. He lives for the hunt.
|
||||
The jungle of Nakiridaani whispers secrets to those who listen, of a creature so ferocious and powerful that its very presence seems to shape the landscape itself. Deep within the underbrush, where the canopy overhead is a vibrant tapestry of greens and the air is thick with the sounds of exotic life, Jarek, the mighty Krondir, stalks his domain. And those who know of him tremble with awe and respect, acknowledging him as a force to be reckoned with.
|
||||
|
||||
The jungle's ancient heart beats within the walls of Jarek's lair, known to many simply as the old "Former Building". This forsaken place was once home to the magic guild of the eponymous Formers, known for their magical prowess to create buildings entirely from living plants. Myths tell of the place's demise, after one of their own destroyed it in a mad outburst of power, turning it into a place that is now shunned by all. Some say that the madman has imposed his spirit on the place, while others tell of it as a cursed place of no return.
|
||||
|
||||
Krondir exist in solitude, and so, the superstition surrounding his chosen lair provides Jarek with a secure retreat that hardly anyone in their right mind would ever set foot in. Yet, the allure of his Trii, a precious gemstone encrusted in the horn that adorns his snout, draws out the unwary, those foolish enough to venture into Jarek's domain. Healers often pay hunters exorbitant sums, because the coveted Trii of a Krondir has special healing properties. As a result, Jarek finds himself perpetually on guard, ever vigilant against those who seek his life for the promise of coin.
|
||||
|
||||
When night falls over Nakiridaani, Jarek begins his nightly hunt, stalking his prey through the shadows with a stealth that is almost supernatural. His imposing physique, honed from years of hunting and survival, is a finely tuned instrument of death. The slightest sound—a snapped twig, a rustling leaf—betrays the presence of his quarry, drawing them inexorably into Jarek's deadly path. And then, in a flash of fury and power, he strikes, his claws tearing flesh and bone with merciless efficiency, as his thunderous roar shatters the night's silence and sends tremors through the jungle.
|
||||
|
||||
After the thrill of the hunt subsides, Jarek returns to the sanctuary of his lair, nesting deep within the shadows of the Former guild's forsaken place of study. There, surrounded by the vibrant greenery of its adnate walls, he allows himself a fleeting moment of respite.
|
||||
|
||||
And so, Jarek waits, an unyielding sentinel guarding his domain against all comers. His legend grows, a testament to the indomitable nature of the Krondir, whose unwavering dedication to survival inspires both terror and reverence in those who know of his existence. Those who dare set foot in Jarek's domain do so at their own peril, for in this unforgiving world of the wilderness, only the strongest shall live to see another day.
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue