no subject

Hi again! So I ended up deciding to take the info booth code you made for me, and rearrange and resize the panels to make it mobile-responsive. I'm totally fine with you taking this edit, editing it again if you wish, and releasing whatever version results on your page. You can see it in action here.

<div style="box-sizing:content-box; display:inline-block; background: rgba(200,200,200,0.5); border: 1px solid #fff;border-radius:5px;width: auto;padding:2px 0;margin:2px;"><a href="#1" style="color: #fff;text-decoration:none;text-transform:uppercase;letter-spacing:2px;font-size: 0.75em;font-weight:bold;">information</a></div>

<div style="box-sizing:content-box; display:inline-block; background: rgba(200,200,200,0.5); border: 1px solid #fff;border-radius:5px;width: auto;padding:2px 0;margin:2px;"><a href="#2" style="color: #fff;text-decoration:none;text-transform:uppercase;letter-spacing:2px;font-size: 0.75em;font-weight:bold;">application</a></div>

<div style="box-sizing:content-box; display:inline-block; background: rgba(200,200,200,0.5); border: 1px solid #fff;border-radius:5px;width: auto;padding:2px 0;margin:2px;"><a href="#3" style="color: #fff;text-decoration:none;text-transform:uppercase;letter-spacing:2px;font-size: 0.75em;font-weight:bold;">permissions</a></div>

<div style="box-sizing:content-box; display:inline-block; background: rgba(200,200,200,0.5); border: 1px solid #fff;border-radius:5px;width: auto;padding:2px 0;margin:2px;"><a href="#4" style="color: #fff;text-decoration:none;text-transform:uppercase;letter-spacing:2px;font-size: 0.75em;font-weight:bold;">links & notes</a></div>

</div></div>

<a name="home"></a> <div style="background:url(IMAGE_URL_HERE);background-position:center;background-size:cover;max-width: 100%; width: 800px; height: 500px;">

CHARACTER NAME

</h2></div>
<div style="position:relative; top: 10%;left: 5%;text-align:left;height: auto; margin: -15px 0px 0px 0px;"><h3 style="text-transform:uppercase; font-size: 0.8em;letter-spacing: 0.4em;color: #fff;text-shadow: 1px 1px 1px #000, 1px 1px 1px #000;">

SOME KIND OF FUNNY QUOTE OR WHATEVER

</h3></div>

<ul><li><b>Housing:</b>
<li><b>Roommate:</b>
<li><b>Etc.</b></ul>

</span></div></div><raw-code>

<a name="1"></a><div style="background: linear-gradient(120deg, #c7c7c7, #f5f5f5, #c7c7c7);max-width: 100%; width: 800px; height: 498px;border-radius: 18px">
<div style="text-align:left;padding-left: 15px;font-size: 1.8em; font-weight:bold;font-variant:small-caps;letter-spacing: 2px;color: #fff;text-shadow: 1px 1px 2px rgba(0,0,0,0.7);">
Character Information
</div>

<raw-code><div style="width: 200px; height: 200px;float: right;background: url(IMAGE_URL_HERE);background-position:center;background-size:cover;margin-left: 6px;border-radius:15px;box-shadow: 1px 1px 2px rgba(0,0,0,0.7);"></div></raw-code>

<raw-code><div style="width: 200px; height: 200px;float: left;background: url(IMAGE_URL_HERE);background-position:center;background-size:cover;margin-right: 16px;border-radius:15px;box-shadow: 1px 1px 2px rgba(0,0,0,0.7);">
</raw-code></div>
<b>Personal:</b>
<ul><li></ul>

<b>Canon:</b>
<ul><li></ul>

<b>Physical:</b>
<ul><li>Vital statistics:
 ◦ Height: 
 ◦ Weight: 
 ◦ Hair: 
 ◦ Eyes: 
 ◦ Gender: 
 ◦ Race: 
<li>Voice, appearance, etc, etc.</ul>

<b>Abilities:</b>
<ul><li></ul>

<raw-code></div></div>

<a name="2"></a><div style="background: linear-gradient(120deg, #c7c7c7, #f5f5f5, #c7c7c7);max-width: 100%; width: 800px; height: 498px;border-radius: 18px">
<div style="text-align:left;padding-left: 15px;font-size: 1.8em; font-weight:bold;font-variant:small-caps;letter-spacing: 2px;color: #fff;text-shadow: 1px 1px 2px rgba(0,0,0,0.7);">
Application
</div>

APPLICATION GOES HERE

<raw-code></div></div>

<a name="3"></a><div style="background: linear-gradient(120deg, #c7c7c7, #f5f5f5, #c7c7c7);max-width: 100%; width: 800px; height: 498px;border-radius: 18px">
<div style="text-align:left;padding-left: 15px;font-size: 1.8em; font-weight:bold;font-variant:small-caps;letter-spacing: 2px;color: #fff;text-shadow: 1px 1px 2px rgba(0,0,0,0.7);">
Permissions
</div>

<b>Character name:</b>
<b>Canon:</b>
<b>Canon point:</b>
<b>Age:</b>
<b>Pronouns:</b>

<b>Character details:</b>
<b>Warnings</b>:

<b>Backtagging:</b> 
<b>Threadhopping:</b>
<b>Fourthwalling:</b>
<b>Off limits:</b>
<b>Warn first:</b>

<b>Physical affection:</b>
<b>Physical violence:</b>
<b>Romance:</b>
<b>Use of telepathy/mind reading:</b>
<b>CRAU recognition:</b>
<b>Facetwins:</b>

<b>[Opt Out/Plotting]</b>
Comments to this entry are screened. Feel free to use the following form to opt out of interactions with him or aspects of his character, or use it for plotting.

<textarea><b>Name:</b>
<b>Character(s) you play:</b> 
<b>Journal(s):</b>
<b>Questions/comments/etc:</b></textarea>

<raw-code></div></div>

<a name="4"></a> <div style="background: linear-gradient(120deg, #c7c7c7, #f5f5f5, #c7c7c7);max-width: 100%; width: 800px; height: 498px;border-radius: 18px">

<div style="text-align:left;padding-left: 15px;font-size: 1.8em; font-weight:bold;font-variant:small-caps;letter-spacing: 2px;color: #fff;text-shadow: 1px 1px 2px rgba(0,0,0,0.7);">
Links
</div>

<raw-code></div>

<div style="text-align:left;padding-left: 15px;font-size: 1.8em; font-weight:bold;font-variant:small-caps;letter-spacing: 2px;color: #fff;text-shadow: 1px 1px 2px rgba(0,0,0,0.7);">
Notes
</div>

<raw-code>

</div></div>

<div style="font-variant:small-caps;text-transform:lowercase;letter-spacing: 2px;position:relative; top: 40%;"><span style="background: rgba(255,255,255,0.5);border-radius: 8px;border: 1px solid #808080;padding: 0 2px 1px;"><a href="https://killthecake.dreamwidth.org/" style="text-decoration:none;color:#808080;">from a code by killthecake</a>
</span></div>
</center>

</raw-code>

(195 comments)

no subject

Post a comment in response: