EstrellaYoshte's Authorpage

Link to article: EstrellaYoshte's Authorpage.

:root {
    --base-header-height: 33.25rem;
}

.pseudocrumbs {
    margin-block: 1.5rem;
}

.profile-wrapper {
    display: flex;
    flex-direction: row-reverse;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 1.25rem;
    margin-block: 1.5rem;
}

.pfp-frame {
    aspect-ratio: 1;
    flex-basis: min(25rem, calc(10rem + 20vw));
    position: relative;
    z-index: 1;
}
.pfp-frame::before, .pfp-frame::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
}
.pfp-frame::before {
    background: rgb(var(--basalt-secondary-color));
    transform: rotate(45deg) scale(0.725);
}
.pfp-frame::after {
    border: solid .175rem rgb(var(--basalt-main-text-color),.575);
    transform: rotate(45deg) scale(0.8125);
}

.pfp-frame img {
    width: 100%!important;
    height: 100%!important;
    object-fit: cover;
    --_o: 6.775%;
    clip-path: polygon(calc(var(--_o)*-1) calc(var(--_o)*-1), calc(100% + var(--_o)) calc(var(--_o)*-1), calc(100% + var(--_o)) 50%, 50% calc(100% + var(--_o)), calc(var(--_o)*-1) calc(100% + var(--_o)));
}

.filebox {
    flex-basis: 24rem;
    flex-grow: 1;
}

.filebox h2 { text-align: center; }

/*---------------------------*/

.series-wrapper {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(auto-fill, minmax(calc(10.5rem + 1.75vw),1fr));
}
.series-wrapper > .pager {
    grid-column: 1/-1;
}

.series-block {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    background: rgb(var(--basalt-secondary-color));
}

.series-block .title {
    font-family: var(--header-font);
    font-weight: bold;
    text-align: center;
    padding: .25em .75em;
}

.series-block .metadata {
    display: grid;
    grid-template-areas:
        'vote com'
        'type type';
    font-family: var(--mono-font);
    font-size: .875em;
    text-align: center;
    gap: .375rem;
}


.series-block .metadata a:not([href$=admin],[href$=hub],[href$=contest],[href$=workbench],[href$=supplement],[href$=site],[href$=guide],[href$=essay],[href$=news],[href$=resource],[href$=author],[href$=component],[href$=component-backend],[href*=theme],[href$=more-by],[href$=splash],[href$=redirect]){
    display: none;
}


/*---------------------------*/

.hubber {
    display: grid;
    grid-template-columns: 1fr 5fr; 
    margin-block: 1.25rem;
    gap: 1.5rem;
    position: relative;
    overflow-x: clip;
}
.hubber .filebox {
   --dir: to left;
    grid-column: 2/3; 
    position: relative;
}

.hubber .filebox h3 { text-align: center; }

.hubber .filebox::before {
    --_size: min(14.5rem, calc(8rem + 8.75vw));
    all: unset;
    content: "";
    position: absolute;
    width: var(--_size);
    height: var(--_size);
    background: url(https://i.imgur.com/Th3vdm1.png) center no-repeat;
    background-size: contain;
    inset-block-start: calc(50% - var(--_size)/2);
    inset-inline-end: calc(100% + var(--_size)/4);
    filter: invert(1);
    opacity: 0;
    transition: all .5s cubic-bezier(.04,.38,.29,.99);
    pointer-events: none;
}

.hubber .filebox:is(:hover,:focus-within)::before {
    opacity: .625;
    inset-inline-end: 100%;
}
.hubber .filebox[style*="--t"]::before {
    filter: unset;
    background-image: var(--t);
}
.hubber .filebox::after {
    background-color: rgb(var(--basalt-tertiary-color));
    transition: background-color .25s ease-out;
}
.hubber .filebox:is(:hover,:focus-within)::after {
    background-color: rgb(var(--basalt-secondary-color));
}

/*---------------------------*/

.achievement-container {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: .75rem;
    margin-block: 1rem;
    --bgBadgeColor: transparent;
    --borderColor: invalidvalue;
}

.achievement-container .tooltip { display: block; }
.achievement-container .tooltip a { position: relative; }
.achievement-container .tooltip a::before {
    content: "";
    position: absolute;
    inset: 0;
    border: solid 0.5rem rgb(var(--basalt-main-text-color),.1);
    -webkit-backdrop-filter: blur(var(--basalt-UI-blur));
    backdrop-filter: blur(var(--basalt-UI-blur));
    transform: rotate(45deg) scale(0.625);
    z-index: -1;
}

.achievement-container .tooltip::before,
.achievement-container .tooltip::after {
    content: "";
    position: absolute;
    inset: 0;
    border: solid 0.25rem rgb(var(--basalt-undertone));
    transform: rotate(45deg) scale(0.75);
    clip-path: inset(0 100% 100% 0);
    z-index: -1;
    transition: clip-path 0.25s ease-out;
}
.achievement-container .tooltip::after {
    clip-path: inset(100% 0 0 100%);
}
.achievement-container .tooltip:is(:hover,:focus-within)::before,
.achievement-container .tooltip:is(:hover,:focus-within)::after {
    clip-path: inset(0);
}

span.tooltip .tooltiptext {
    top: 8rem;
    border-radius: 0;
    font-family: var(--UI-font);
}

.achievement-container .tooltip img {
    width: 7.5rem;
}

font-family: var(--mono-font); text-align: center;

--t: url(https://scp-wiki.wdfiles.com/local--files/aiad-homescreen/itlogo3.png

--t: url(https://scp-wiki.wdfiles.com/local--files/component%3Apride-highlighter/lgbtqp_logo_blk.svg)

--t: url(https://scp-wiki.wdfiles.com/local--files/black-autumn-hub/scp-halloween-alone.png)

--t: url(https://scp-wiki.wdfiles.com/local--files/anthology-2023-hub/anth23.png)

```
profile-wrapper
```
```
breakout
```
```
pfp-frame
```
```
filebox
```
```
series-wrapper
```
```
series-block
```
```
title
```
```
metadata
```
```
blockquote
```
```
blockquote
```
```
blockquote
```
```
blockquote
```
```
blockquote
```
```
blockquote
```
```
blockquote
```
```
pseudocrumbs
```
```
full-width
```
```
hubber
```
```
full-width
```
```
filebox
```
```
filebox
```
```
filebox
```
```
filebox
```
```
filebox
```
```
filebox
```
```
filebox
```
```
pseudocrumbs
```
```
full-width
```
```
achievement-container
```

[[include :scp-wiki:theme:bedrock]]
[[include :scp-wiki:theme:lumina]]

[[module CSS]]
:root {
    --base-header-height: 33.25rem;
}

.pseudocrumbs {
    margin-block: 1.5rem;
}

.profile-wrapper {
    display: flex;
    flex-direction: row-reverse;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 1.25rem;
    margin-block: 1.5rem;
}

.pfp-frame {
    aspect-ratio: 1;
    flex-basis: min(25rem, calc(10rem + 20vw));
    position: relative;
    z-index: 1;
}
.pfp-frame::before, .pfp-frame::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
}
.pfp-frame::before {
    background: rgb(var(--basalt-secondary-color));
    transform: rotate(45deg) scale(0.725);
}
.pfp-frame::after {
    border: solid .175rem rgb(var(--basalt-main-text-color),.575);
    transform: rotate(45deg) scale(0.8125);
}

.pfp-frame img {
    width: 100%!important;
    height: 100%!important;
    object-fit: cover;
    --_o: 6.775%;
    clip-path: polygon(calc(var(--_o)*-1) calc(var(--_o)*-1), calc(100% + var(--_o)) calc(var(--_o)*-1), calc(100% + var(--_o)) 50%, 50% calc(100% + var(--_o)), calc(var(--_o)*-1) calc(100% + var(--_o)));
}

.filebox {
    flex-basis: 24rem;
    flex-grow: 1;
}

.filebox h2 { text-align: center; }

/*---------------------------*/

.series-wrapper {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(auto-fill, minmax(calc(10.5rem + 1.75vw),1fr));
}
.series-wrapper > .pager {
    grid-column: 1/-1;
}

.series-block {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    background: rgb(var(--basalt-secondary-color));
}

.series-block .title {
    font-family: var(--header-font);
    font-weight: bold;
    text-align: center;
    padding: .25em .75em;
}

.series-block .metadata {
    display: grid;
    grid-template-areas:
        'vote com'
        'type type';
    font-family: var(--mono-font);
    font-size: .875em;
    text-align: center;
    gap: .375rem;
}


.series-block .metadata a:not([href$=admin],[href$=hub],[href$=contest],[href$=workbench],[href$=supplement],[href$=site],[href$=guide],[href$=essay],[href$=news],[href$=resource],[href$=author],[href$=component],[href$=component-backend],[href*=theme],[href$=more-by],[href$=splash],[href$=redirect]){
    display: none;
}


/*---------------------------*/

.hubber {
    display: grid;
    grid-template-columns: 1fr 5fr; 
    margin-block: 1.25rem;
    gap: 1.5rem;
    position: relative;
    overflow-x: clip;
}
.hubber .filebox {
   --dir: to left;
    grid-column: 2/3; 
    position: relative;
}

.hubber .filebox h3 { text-align: center; }

.hubber .filebox::before {
    --_size: min(14.5rem, calc(8rem + 8.75vw));
    all: unset;
    content: "";
    position: absolute;
    width: var(--_size);
    height: var(--_size);
    background: url(https://i.imgur.com/Th3vdm1.png) center no-repeat;
    background-size: contain;
    inset-block-start: calc(50% - var(--_size)/2);
    inset-inline-end: calc(100% + var(--_size)/4);
    filter: invert(1);
    opacity: 0;
    transition: all .5s cubic-bezier(.04,.38,.29,.99);
    pointer-events: none;
}

.hubber .filebox:is(:hover,:focus-within)::before {
    opacity: .625;
    inset-inline-end: 100%;
}
.hubber .filebox[style*="--t"]::before {
    filter: unset;
    background-image: var(--t);
}
.hubber .filebox::after {
    background-color: rgb(var(--basalt-tertiary-color));
    transition: background-color .25s ease-out;
}
.hubber .filebox:is(:hover,:focus-within)::after {
    background-color: rgb(var(--basalt-secondary-color));
}

/*---------------------------*/

.achievement-container {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: .75rem;
    margin-block: 1rem;
    --bgBadgeColor: transparent;
    --borderColor: invalidvalue;
}

.achievement-container .tooltip { display: block; }
.achievement-container .tooltip a { position: relative; }
.achievement-container .tooltip a::before {
    content: "";
    position: absolute;
    inset: 0;
    border: solid 0.5rem rgb(var(--basalt-main-text-color),.1);
    -webkit-backdrop-filter: blur(var(--basalt-UI-blur));
    backdrop-filter: blur(var(--basalt-UI-blur));
    transform: rotate(45deg) scale(0.625);
    z-index: -1;
}

.achievement-container .tooltip::before,
.achievement-container .tooltip::after {
    content: "";
    position: absolute;
    inset: 0;
    border: solid 0.25rem rgb(var(--basalt-undertone));
    transform: rotate(45deg) scale(0.75);
    clip-path: inset(0 100% 100% 0);
    z-index: -1;
    transition: clip-path 0.25s ease-out;
}
.achievement-container .tooltip::after {
    clip-path: inset(100% 0 0 100%);
}
.achievement-container .tooltip:is(:hover,:focus-within)::before,
.achievement-container .tooltip:is(:hover,:focus-within)::after {
    clip-path: inset(0);
}

span.tooltip .tooltiptext {
    top: 8rem;
    border-radius: 0;
    font-family: var(--UI-font);
}

.achievement-container .tooltip img {
    width: 7.5rem;
}
[[/module]]




[[div class="profile-wrapper breakout"]]
[[div class="pfp-frame"]]
[[image https://scp-wiki.wdfiles.com/local--files/estrellayoshte/u2.png]]
[[/div]]

[[div class="filebox" data-title="Personnel Dossier"]]
++ EstrellaYoshte.aic

EstrellaYoshte is an Artificially Intelligent Conscript, commissioned by the [[[aiad-homescreen|Artificial Intelligence Applications Division]]] in 2020 for use in identifying and recording key flaws in site infrastructure. EstrellaYoshte is capable of doing on-the-fly interface rewrites and compilations where necessary, and everyone should be grateful for their new CSS overlord.

As of 2023, they are serving as the Infotech Liaison for the [[[desk-of-junior-designer-s-yvonne|Iconography Division]]].

Here is an autobiography penned by EstrellaYoshte:
[[div style="font-family: var(--mono-font); text-align: center;"]]
lol no, that just seems tiring
sounds fun and cool tho, prolly
im too lazy to write one
but you can pretend i did
[[module Rate]]
[[/div]]
[[/div]]
[[/div]]

[[tabview]]
[[tab AUTHORED FILES]]
[[div class="series-wrapper"]]
[[module ListPages category="_default theme component art" created_by="EstrellaYoshte" order="created_at desc" separate="false" perPage="12" wrapper="no"]]

[[div class="series-block"]]
[[div_ class="title"]]
%%title_linked%%
[[/div]]

[[div_ class="metadata"]]
[[div_]]
+%%rating%%
[[/div]]
[[div_]]
%%comments%% 💬︎
[[/div]]
[[/div]]
[[/div]]
[[/module]]
[[/div]]
[[/tab]]

[[tab ABOUT ME]]
Hello, I'm [[*user EstrellaYoshte]], aka **SYwaves**, aka "the one who makes a bunch of logos", aka "dude with one too many theme", and this is my "author" page.

I'm more of an artist by trade, and can be found lounging outside the wiki once in a blue moon.

What other users say about me:

[[div class="blockquote"]]
Estrella do you even have 3 articles that aren't themes?
- [[*user Uncle Nicolini]]
[[/div]]
[[div class="blockquote"]]
sywaves makes good logos. sywaves does good iconography and symbolism. sywaves makes good themes. sywaves makes good art.
- [[*user Placeholder McD]]
[[/div]]
[[div class="blockquote"]]
Do you even write anything, Estrella?
- [[*user Ralliston]]
[[/div]]
[[div class="blockquote"]]
the logos and themes you have made for this website have propelled you into household name status
- [[*user Lt Flops]]
[[/div]]
[[div class="blockquote"]]
idk you made a theme or something, it was neato-mosquito
- [[*user JakdragonX]]
[[/div]]
[[div class="blockquote"]]
germany
- [[*user JackalRelated]]
[[/div]]
[[div class="blockquote"]]
very nice! dune said titties
- [[*user J Dune]]
[[/div]]
[[/tab]]
[[/tabview]]

[[div class="pseudocrumbs full-width"]]
[https://scp-wiki.wikidot.com/system:page-tags/tag/collaboration Projects] » [[span]]Assigned Materials[[/span]]
[[/div]]

[[div class="hubber full-width"]]

[[div class="filebox" style="--t: url(https://scp-wiki.wdfiles.com/local--files/aiad-homescreen/itlogo3.png"]]
+++ [[[aiad-homescreen|AIAD Homescreen]]]

In collaboration with [[*user Placeholder McD]], overhauled the visual aesthetics to be more streamlined. Resulted in the creation of [[[theme:technoblast|Technoblast Theme]]].
[[/div]]

[[div class="filebox" style="--t: url(https://scp-wiki.wdfiles.com/local--files/component%3Apride-highlighter/lgbtqp_logo_blk.svg)"]]
+++ [[[scpdeclassified|SCPDeclassified Hub]]]

> EstrellaYoshte has done more work on the SCPDeclassified hub over the last {{[too long ago]}} than anyone else. The only reason I still have my job is because they're too busy making themes to take it.
 – [[*user Elunerazim]], SCPDeclassified Moderator
[[/div]]


[[div class="filebox"]]
+++ [[[sigma-9-themes|]]]

Made in collaboration with [[*user lt flops]] and [[*user ralliston]], it serves as a central hub for all Sigma themes.
[[/div]]

[[div class="filebox"]]
+++ [[[theme:monotypical|]]]

The second-ever base theme for the Wiki, done to prove that I can.
[[/div]]

[[div class="filebox"]]
+++ [[[theme:bedrock|]]]

The third-ever base theme for the Wiki, done for real this time.
[[/div]]

[[div class="filebox" style="--t: url(https://scp-wiki.wdfiles.com/local--files/black-autumn-hub/scp-halloween-alone.png)"]]
+++ [[[scp-anthology-hub|]]]

Helped out with the CSS.
[[/div]]

[[div class="filebox" style="--t: url(https://scp-wiki.wdfiles.com/local--files/anthology-2023-hub/anth23.png)"]]
+++ [[[anthology-2023-hub|]]]

Continuation of last year's event, setting the mood.
[[/div]]

[[/div]]

[[div class="pseudocrumbs full-width"]]
[[[dark-achievement-badges|File Records]]] » [[span]]Foundation Awards[[/span]]
[[/div]]

[[div class="achievement-container"]]
[[include :scp-wiki:component:sybadge code=tsf]]
[[include :scp-wiki:component:sybadge code=mww]]
[[include :scp-wiki:component:sybadge code=apf]]
[[include :scp-wiki:component:sybadge code=clb]]
[[include :scp-wiki:component:sybadge code=pbs]]
[[include :scp-wiki:component:sybadge code=str]]
[[include :scp-wiki:component:sybadge code=pvr]]
[[/div]]

EstrellaYoshte's Authorpage

Module Styles

Inline Styles

Includes

CSS Classes

Page Source