Cat.Chrestomanci
¯\_(ツ)_/¯ Not a Bad Slime
Code:
[nobr][class=Background]
background:url('https://static.zerochan.net/Rin-shiba.full.1337008.jpg');
position:relative;
padding:20px;
height:25vh;
width:35vh;
transition: width 3s, height 3s;
[/class]
[class=BackgroundFull]
height:60vh;
width:100vh;
transition: width 1s, height 1s;
[/class]
[class=Hide]
display: none;
[/class]
[class=Image]
float:left;
margin-right:20px;
border:2px SOLID #92C9ED;
line-height:0;
width:25vh;
height:25vh;
border-radius:50%;
overflow:hidden;
background:url('https://static.zerochan.net/Pixiv.Id.5270607.full.2476655.jpg');
background-size:100%;background-position:center;background-repeat:no-repeat;
background-position: 20% 5%;
cursor:pointer;
transition: width 3s, border-radius 3s, height 3s;
[/class]
[class=ImageFull]
width:40vh;
height: 60vh;
border-radius:10px;
overflow:hidden;
background-position: 20% 5%;
background-size:cover;
background-position: 20% 5%;
background-repeat:no-repeat;
transition: width 3s , border-radius 3s, height 3s;
[/class]
[class=Name]
float:left;
width:53vh;
font-size:3em;
text-align:center;
color:#92C9ED;
[/class]
[class=Title]
font-family:Noto Serif SC;
font-size:1.75em;
color:#92C9ED;
text-align:center;
position:absolute;
margin:auto;center;
margin-left:30vh;
z-index:25px;
opacity:0.9;
[/class]
[class=Text]
float:left;
background-color:rgba(77,77,76,0.7);
width:53vh;
height:47vh;
overflow:scroll;
overflow-x:hidden;
padding:10px;
font-size:1em;
color:#92C9ED;
box-shadow: 0px 0px 5px 10px rgba(77,77,76,0.6);
[/class]
[Script class=Image]
set addedClass 0
set fadedIn 0
[/script]
[Script class=Image on=click]
if (eq ${addedClass} 0) (addClass ImageFull) (removeClass ImageFull)
if (eq ${addedClass} 0) (addClass BackgroundFull Background) (removeClass BackgroundFull Background)
if (eq ${addedClass} 0) (set addedClass 1) (set addedClass 0)
if (eq ${fadedIn} 0) (fadeIn 1000 Name) (fadeOut 1000 Name)
if (eq ${fadedIn} 0) (fadeIn 1000 Text) (fadeOut 1000 Text)
if (eq ${fadedIn} 0) (fadeOut 1000 Title) (fadeIn 1000 Title)
if (eq ${fadedIn} 0) (set fadedIn 1) (set fadedIn 0)
[/script]
[div class="Background"]
[div class="Image"][/div]
[div class=Title]言[br][/br]葉[br][/br]の[br][/br]力
[/div]
[div class="Name Hide"]
[font=Indie Flower]Name[/font]
[/div]
[div class="Text Hide"]
[font=Simonetta]
Age:
[br][/br][br][/br]
Height:
[br][/br][br][/br]
Weight:
[br][/br][br][/br]
Likes:
[br][/br][br][/br]
Dislikes:
[br][/br][br][/br]
Hair:
[br][/br][br][/br]
Eyes:
[br][/br][br][/br]
Occupation:
[br][/br][br][/br]
Ability:
[br][/br][br][/br]
Race:
[br][/br][br][/br]
Partner:
[br][/br][br][/br]
Traits:
[br][/br][br][/br]
Other:
[/font][/div][/div]
[div class="Line"][/div]
[div=float:left;][FONT=courier new]Code by [USER=44533]@AgWordSmith[/USER][USER=44533][/USER][/FONT]
[/div][/nobr]
Code:
[div=width:330px;background:#eee;margin:auto;]
[div=height:155px;width:290px;background:#fff;margin:auto;center;border:1px solid #ccc;][div=height:130px;width:130px;background:url('https://i-h1.pinimg.com/564x/cf/70/d6/cf70d6201312e1a540d612c2d3c9fa96.jpg');background-size:100%;border:1px solid #fff;position:relative;left:10px; top:10px;][/div][div=width:80px;height:25px;background:#fff;border:1px solid #ccc;margin:auto:center;position:relative;top:-110px;left:150px;][div=font-size:12px;color:#666;text-align:center;text-transform:uppercase;position:relative;top:5px;]Nickname[/div][/div][div=width:25px;height:25px;border:1px solid #ccc;background:#fff;margin:auto:center;position:relative;top:-137px;left:240px;][div=font-size:10px;color:#666;text-align:center;text-transform:uppercase;position:relative;top:5px;]G[/div][/div][div=width:25px;height:25px;border:1px solid #ccc;background:#fff;margin:auto:center;position:relative;top:-129px;left:150px;][div=font-size:12px;color:#666;text-align:center;text-transform:uppercase;position:relative;top:5px;]Yr[/div][/div][div=width:80px;height:25px;border:1px solid #ccc;background:#fff;margin:auto:center;position:relative;top:-156px;left:186px][div=font-size:12px;color:#666;text-align:center;text-transform:uppercase;position:relative;top:5px;]Blessed[/div][/div][div=width:116px;height:25px;border:1px solid #ccc;background:#fff;margin:auto:center;position:relative;top:-146px;left:150px][div=font-size:12px;color:#666;text-align:center;text-transform:uppercase;position:relative;top:5px;]Word[/div][/div][/div]
[div=height:135px;width:290px;background:#fff;margin:auto;center;border:1px solid #ccc;][div=height:115px;width:270px;position:relative;top:8px;margin:auto;overflow:hidden;][div=width: calc(100%); height: calc(100%); overflow: scroll; box-sizing: border-box; text-align: justify;][div=font-family:'lao ui', calibri, arial, sans-serif;font-size:10px;text-align:justify;text-transform:uppercase;letter-spacing:.4px;margin:5px 0px;color:#666;line-height:11px;]Real Name:
Likes:
Dislikes:
Height:
Weight:
Hair:
Eyes:
Occupation:
Voice:
[/div][/div][/div]
[/div]
[CENTER]code by [USER=27673]@pasta[/USER]
Code:
[div=height:135px;width:290px;background:#fff;margin:auto;center;border:1px solid #ccc;][div=height:115px;width:270px;position:relative;top:8px;margin:auto;overflow:hidden;][div=width: calc(100%); height: calc(100%); overflow: scroll; box-sizing: border-box; text-align: justify;][div=font-family:'lao ui', calibri, arial, sans-serif;font-size:10px;text-align:justify;text-transform:uppercase;letter-spacing:.4px;margin:5px 0px;color:#666;line-height:11px;]Details
[/div][/div][/div][/div]
Code:
[div=width:75px;height:75px;background:url('URL');background-position:top;background-repeat:none;background-size:100%;display:inline-block;][/div][div=display:inline-block;position:relative;top:-1em;left:1em;][div=border-bottom:1px solid #d8baba;letter-spacing:0.5em;]Person 01[/div][div=font-size:0.8em;]Relationship[/div][/div][/div]
Last edited:
