Skip to content

Instantly share code, notes, and snippets.

@JaeBats

JaeBats/! Maverick [ rpr ] Secret

Last active August 19, 2021 10:14
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save JaeBats/f0819ac0b46e4e078333891763c71015 to your computer and use it in GitHub Desktop.
Save JaeBats/f0819ac0b46e4e078333891763c71015 to your computer and use it in GitHub Desktop.
Download ZIP
! Maverick [ rpr ]
Raw
! Maverick [ rpr ]
property of jaeknight from jaecomponents
-please do not redistribute
-comment before using
-upvote
Raw
main
<div style="width:500px; margin:auto">
<div style="width: 480px; float: left; border: 10px solid #fff; margin:30px 0; ">
<div style="width: 480px; height: 480px; float: left; background: #fff; padding:10px; margin: 1px; color: #000; font-family: 'helvetica', arial; font-size: 0.8em;">
<div style="width: 320px; height: 480px; float: left;">
<!-- Image -->
<div style="width: 320px; height: 480px; float: left;">
<img src="https://i.imgur.com/oVEkUpL.jpg" style="width: 320px; height: 480px; "/>
</div>
<!-- end of image -->
<div style="width: 320px; height: 480px; float: left; margin-top: -480px; overflow: hidden;">
<div style="width: 340px; height: 100%; float: left; overflow: auto; ">
<div style="width: 320px; height: 480px; float: left; margin-top: 480px; background: #fff; opacity: 0.3;">
&nbsp;
</div>
<!-- First white box -->
<div style="width: 320px; height: 250px; float: left; margin-top: -380px; background: #fff; opacity: 0.99;">
<div style="width: 170px; height: 100%; float: left; margin-left: 10px;">
<!-- text box -->
<div style="width: 158px; height: 95px; float: left; margin-top: 20px;">
<div style="width: 158px; float: left; font-size:2.1em; font-weight: 700; line-height: 1.2em;font-family: 'Century Gothic', Helvetica, arial ">about.</div>
<div style="width: 158px; float: left; font-size:0.6em; font-weight: 700; text-transform: uppercase;line-height: 1em; letter-spacing: 1px; ">maverick</div>
<div style="width: 158px; height: 50px; float: left; overflow: hidden; margin-top: 6px;">
<div style="width: 178px; height: 100%; float: left; overflow: auto; ">
<div style="width: 158px; float:left;line-height: 1em; font-size: 0.8em;color:#303030;">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dapibus diam. Sed nisi. Nulla quis sem at nibh elementum imperdiet. Duis sagittis ipsum. Praesent mauris. Fusce nec tellus sed augue semper porta. Mauris massa. Vestibulum lacinia arcu eget nulla. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.
</div>
</div>
</div>
</div>
<!-- text box -->
<!-- text box -->
<div style="width: 158px; height: 95px; float: left; margin-top: 20px;">
<div style="width: 158px; float: left; font-size:0.6em; font-weight: 700; text-transform: uppercase;line-height: 1em; letter-spacing: 1px; ">— rules</div>
<div style="width: 158px; height: 80px; float: left; overflow: hidden; margin-top: 6px;">
<div style="width: 178px; height: 100%; float: left; overflow: auto; ">
<div style="width: 158px; float:left;line-height: 1.3em; font-size: 0.6rem;color:#303030; margin-top: 4px;">
<span style="background: #000; color:#fff; padding:1px 3px; border-radius: 2px; font-size: 0.6rem;">one</span> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. <br/>
<span style="background: #000; color:#fff; padding:1px 3px; border-radius: 2px; font-size: 0.6rem;">two</span> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. <br/>
<span style="background: #000; color:#fff; padding:1px 3px; border-radius: 2px; font-size: 0.6rem;">three</span> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. <br/>
<span style="background: #000; color:#fff; padding:1px 3px; border-radius: 2px; font-size: 0.6rem;">four</span> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. <br/>
</div>
</div>
</div>
</div>
<!-- text box -->
</div>
<!-- right side bar -->
<div style="width: 120px; float: right; margin-top: -10px; margin-right: 10px;">
<div style="width: 120px; float: right; margin-bottom:4px">
<img src="https://i.imgur.com/t0VV0z1.jpg" width="120"/>
</div>
<div style="width: 120px; float: right; margin-bottom:-2px">
<img src="https://i.imgur.com/5QjEFbO.jpg" width="120"/>
</div>
<div style="float: left;font-size: 40px; color: #dedede;margin-top: -8px;">❝</div>
<div style="width: 114px; height: 30px; float: left; overflow: hidden; margin-top: -40px; margin-bottom: 10px; margin-left: 5px;">
<div style="width: 134px; height: 100%; float: left; overflow: auto; ">
<div style="width: 114px; float:left;line-height: 1em; font-size: 1em;color:#000; font-family: 'Didot', Times;">
<i> "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero."</i>
</div>
</div>
</div>
<div style="width: 120px; float: right; margin-bottom:0px">
<img src="https://i.imgur.com/ZE6urqa.jpg" width="120"/>
</div>
</div>
<!-- end of image on right side -->
</div>
<!-- end of first white box -->
<div style="width: 320px; height: 92px; float: left; margin-top: -130px; opacity: 0.99; ">
<div style="width: 210px; height: 62px; float: right; margin-top: 21px; margin-right: 30px;">
<div style="width: 210px; height: 35px; float: right; background:#fff; overflow: hidden;">
<div style="float: left; padding: 7px 10px; font-family: 'Helvetica', arial;line-height: 0.8em;">
<span style="font-weight: 700; font-size: 0.8rem;">Featured: name here</span><br/>
<span style="font-weight: 100; font-size: 0.4rem;"><i>Scroll up</i></span>
</div>
<div style="width: 210px; height: 35px; float: right; margin-top: -35px; overflow: hidden;">
<div style="width: 230px; height: 100%; float: left; overflow: auto; ">
<div style="width: 210px; height: 35px; float: left; margin-top: 35px;background:#2b69c7; color: #fff; ">
<div style="width: 200px; height: 80%; margin:auto;">
<div style="width: 200px; height: 100%; float: left; margin-top: 3px; overflow: hidden; ">
<div style="width: 220px; height: 100%; float: left; overflow: auto; ">
<div style="width: 200px; float:left;line-height: 1.2em; font-size: 9px; text-align: justify;">
<b>Scroll.</b> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dapibus diam. Sed nisi. Nulla quis sem at nibh elementum imperdiet. Duis sagittis ipsum. Praesent mauris. Fusce nec tellus sed augue semper porta. Mauris massa. Vestibulum lacinia arcu eget nulla. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div style="width: 100%; height: 5px; float: right; background:#fff; margin-top: 1px;">&nbsp;
</div>
<span style="color:#fff; font-size:0.6rem; float: left; text-align: left; letter-spacing: 0.5px;">
<a href="jaecomponents"><span style="color:#fff; ">
link
</span></a> /
<a href="jaecomponents"><span style="color:#fff; ">
link
</span></a> /
<a href="jaecomponents"><span style="color:#fff; ">
link
</span></a>
</span>
</div>
</div>
<div style="width: 320px; height: 38px; float: left; margin-top: -38px; background: #fff; color: #303030; opacity: 0.99; font-size: 0.6rem;">
<div style="width: 150px; height: 38px; float: left; line-height: 38px;">
<span style="float: left; padding: 0 10px;"><i><span style="color:#000"><b>— Status:</b></span> Short text here.</i></span>
</div>
<div style="width: 150px; height: 38px; float: left; line-height: 38px;">
<span style="float: left; padding: 0 10px;"><i><span style="color:#000"><b>— Update:</b></span> Short text here.</i></span>
</div>
</div>
</div>
</div>
</div>
<div style="width: 128px; height: 400px; float: left; margin-left: 10px; margin-top: 100px;">
<div style="width: 5px; height:25px; float: right; margin-left: 3px; background:#dedede">&nbsp;</div>
<!-- text box -->
<div style="width: 128px; height: 95px; float: left; margin-top: 20px;">
<div style="width: 128px; float: left; font-size:2.6em; font-weight: 700; line-height: 1.2em;font-family: 'Century Gothic', Helvetica, arial ">0042</div>
<div style="width: 128px; float: left; font-size:0.6em; font-weight: 700; text-transform: uppercase;line-height: 1em; letter-spacing: 1px; ">total members</div>
<div style="width: 128px; height: 40px; float: left; overflow: hidden; margin-top: 6px;">
<div style="width: 148px; height: 100%; float: left; overflow: auto; ">
<div style="width: 128px; float:left;line-height: 1em; font-size: 0.8em;color:#303030;">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dapibus diam. Sed nisi. Nulla quis sem at nibh elementum imperdiet. Duis sagittis ipsum. Praesent mauris. Fusce nec tellus sed augue semper porta. Mauris massa. Vestibulum lacinia arcu eget nulla. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.
</div>
</div>
</div>
</div>
<!-- text box -->
<!-- text box -->
<div style="width: 128px; height: 95px; float: left; margin-top: 10px;">
<div style="width: 128px; float: left; font-size:2.6em; font-weight: 700; line-height: 1.1em;font-family: 'Century Gothic', Helvetica, arial ">0719</div>
<div style="width: 128px; float: left; font-size:0.6em; font-weight: 700; text-transform: uppercase;line-height: 2em; letter-spacing: 1px; ">active since</div>
<div style="width: 128px; height: 40px; float: left; overflow: hidden; margin-top: 6px;">
<div style="width: 148px; height: 100%; float: left; overflow: auto; ">
<div style="width: 128px; float:left;line-height: 1em; font-size: 0.8em;color:#303030;">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dapibus diam. Sed nisi. Nulla quis sem at nibh elementum imperdiet. Duis sagittis ipsum. Praesent mauris. Fusce nec tellus sed augue semper porta. Mauris massa. Vestibulum lacinia arcu eget nulla. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.
</div>
</div>
</div>
</div>
<!-- text box -->
<div style="width: 164px; height: 100px; float: left; border:3px solid #000;margin-left: -20px; margin-top: 35px; opacity: .99; overflow: hidden; ">
<div style="width: 15px; height: 100px; float: left; background: #000; padding: 5px; color: #fff; font-family: 'Didot', Times; line-height: 1.2em; text-transform: uppercase; text-align: center;"><i>o p e n</i></div>
<div style="width: 133px; height: 100px; float: left;background: #fff;">
<div style="width: 133px; float: left; margin: 3px;">
<img src="https://i.imgur.com/t0VV0z1.jpg"/>
</div>
<div style="width: 133px; float: left;">
<span style="float: left; padding: 0 4px; font-size: 0.6em; line-height: 1em;"><i><span style="color:#000"><b>We're open!</b></span> Join us.</i></span>
</div>
</div>
</div>
</div>
</div>
<!-- HEADER TEXT -->
<!-- notes:
- Adjust font-size until your text fits
-Repeat text
-->
<!-- Hovers -->
<div style="width: 480px; float: left; font-family: 'helvetica',arial">
<!-- Headers -->
<div style="width: 480px; float: left; margin-top: -480px; overflow: hidden;">
<div style="float: left; color: #000; font-family: 'Didot', Times ; font-size: 4.4rem;letter-spacing: 5px; margin-left: 30px;">
MAVERICK
</div>
</div>
<div style="width: 331px; float: left; margin-top: -480px; overflow: hidden;">
<div style="float: left; color: #fff; font-family: 'Didot', Times; font-size: 4.4rem;letter-spacing: 5px; margin-left: 30px;">
MAVERICK
</div>
</div>
<!-- End of Headers -->
<!-- Subheader -->
<div style="float: left; margin-top: -400px; color: #fff; font-size: 0.5rem; letter-spacing: 4px; margin-left: 30px; ">
roleplay
</div>
<!-- image text -->
<div style="width: 100px;float: left; margin-top: -100px; color: #fff; text-align: center;">
<div style="width: 100%; float: left; font-size:1.6em; font-weight: 700; line-height: 1.1em; font-family: 'Century Gothic', Helvetica, arial; ">04</div>
<div style="width: 100%; float: left; font-size:0.6em; font-weight: 100; line-height: 1em; ">years active<br/>in aff</div>
</div>
<div style="float: left;color:#fff; font-size:8px;margin-top: -10px; margin-left: 20px;">▲</div>
</div>
</div>
<!-- DO NOT REMOVE CREDITS -->
<div style="float: right; margin-top: -26px; margin-right: 12px; overflow: hidden; ">
<div style="float: right; color: #353535; font-family: arial; font-size: 7px;letter-spacing: 0.3px; text-transform: uppercase;background:#fff; padding: 0 2px">
<a href="https://www.roleplayrepublic.com/roleplay/view_desc/30554/" title="coded by JaeKnight"><span style=" color: #353535; ">Jaecomponents</span></a>
</div>
</div>
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment