Sandbox:User:Ritsu: Difference between revisions
From Elwiki
(This is just my sandbox, not the actual box, lol. Main page elements will be protected ever after) Tag: Blanking |
No edit summary |
||
Line 1: | Line 1: | ||
{{#css: | |||
.char-banner { | |||
width: 300px; | |||
height: 61px; | |||
transform: skew(-13deg); | |||
display: flex; | |||
position: relative; | |||
} | |||
.char-banner-image { | |||
transform: skew(13deg); | |||
margin-left: -7px; | |||
} | |||
.char-banner::after { | |||
content: ""; | |||
transform: skew(50deg); | |||
display: block; | |||
position: absolute; | |||
background: inherit; | |||
width: 100px; | |||
height: 61px; | |||
right: -50px; | |||
z-index: 1; | |||
} | |||
.char-banner-title { | |||
transform: skew(13deg); | |||
font-size: 1.25rem; | |||
font-weight: 600; | |||
letter-spacing: 0.15rem; | |||
white-space: nowrap; | |||
z-index: 2; | |||
position: relative; | |||
display: flex; | |||
align-items: center; | |||
padding-left: 0.5rem; | |||
} | |||
}} | |||
<div class="char-banner tone-7"><div class="char-banner-image">{{Face|Aisha|4x2}}</div><div class="char-banner-title">Mystic Alchemist</div></div> |