Report Blog Entry
Hey guys!, so im finally satisfied with my layout, i will post the code bellow, it will be broken up in two sections, the cursor i have, and the the layout itself.
The cursor: (you may go to cursor-4u.com and find one for yourself if you want to change it.)
<style>* {cursor: url(https://cur.cursors-4u.net/cursors/cur-2/cur141.cur), auto !important;}</style><a href="https://www.cursors-4u.com/cursor/2009/02/19/big-yellow-pointer-2.html" target="_blank" title="Big Yellow Pointer"><img src="https://cur.cursors-4u.net/cursor.png" alt="Big Yellow Pointer" style="position:absolute; top: 0px; right: 0px;"/></a>
here's my actual layout, exactly as i have it in my about me section, right after the code for my cursor.
you may keep it as is, and we can be twins, or tweak it to your hearts content!
Enjoy!
<style>
body {
background-color: grey;
background-image: url(https://cdn.dribbble.com/users/974517/screenshots/11232624/v5mt_snapchat_animated_stickers_90s_deco_g.gif);
background-position: top;
background-repeat: ;
background-attachment: fixed;
}
main {
Background-color: transparent;
background-image: url(https://thumbs.gfycat.com/ImmenseNewAmberpenshell-max-1mb.gif);
background-position: left;
background-repeat: repeat;
background-attachment: fixed;
border: dashed 3px;
border-color: var(--lighter-blue);
}
nav {
color: white;
}
nav .top {
background-image: url('https://thumbs.gfycat.com/ImmenseNewAmberpenshell-max-1mb.gif');
background-position: left;
background-attachment: fixed;
}
footer {
background: #FFF44D;
}
body, div {
font-family: verdana;
font-size: 14px;
color: white;
font-weight: bold;
font-style: ;
text-decoration: none;
}
/* bellow this you can change the left side of your profile,
including the interests details' table, but only the heading! */
.profile .contact,
.profile .url-info,
.profile .table-section,
.home-actions {
background: black;
width: 100%;
border: solid 2px #3feffa;
margin: 10px 0;
}
.profile .contact .heading,
.profile .table-section .heading,
.home-actions .heading {
background: #3feffa;
color: white;
padding: 2px 7px;
}
/* this is the part where you tweak the right side of your profile */
.profile .blurbs {
background: black;
margin: 20px 0;
border: solid 2px;
border-color: #3feffa;
}
.profile .friends {
border: dashed 3px;
border-color: hotpink;
}
.profile .blurbs .heading {
background-color: #3feffa;
color: rgb(300, 300, 300);
}
.profile .friends .heading {
background-color: hotpink;
color: rgb(300, 300, 300);
}
.profile .blurbs .section h4 {
margin: 14px;
color: #FF69B4;
font-weight: bold;
}
.profile .friends .person p {
color: #a94c9f;
font-weight: bold;
width: 100%;
word-break: break-word;
font-size: 100%;
text-align: center;
}
.count {
color: #ffef00;
}
/* this is the part you change your comments background colors,
and your interests table background colors.
P.S.: the ones with ":first-child" variables, will control the left side of the tables. */
.comments-table td,
.music-table td {
background: #d5f1ff;
vertical-align: top;
position: relative;
}
.comments-table td:first-child,
.music-table td:first-child {
background: #479f78;
text-align: center;
font-weight: bold;
width: 38%;
}
.details-table td {
background: transparent;
vertical-align: top;
}
.details-table td:first-child {
background: #cceeff;
color: #ff77bc;
font-weight: bold;
width: 33%;
}
/* this is the part you can change how the colors of the links look
DON'T mess with anything but the color! (or do... im not your mom.) */
a.navbar:link, a.navbar:active, a.navbar:visited, a.navbar:hover,
a.man:link, a.man:active, a.man:visited, a.man:hover,
a, a:link, a:active, a:visited, a:hover,
a.navbar:link, a.navbar:active, a.navbar:visited, a.visited:hover,
a.text:link, a.text:active, a.text:visited, a.text:hover,
a.searchlinksmall:link, a.searchlinksmall:active, a.searchlinksmall:visited,
a.searchlinksmall:hover, a.redlink:link, a.redlink:active, a.redlink:visited,
a.redlink:hover {
color: #49d3cc;
font-weight: bold;
font-style: normal;
text-decoration: none;
}
a.navbar:hover, a.man:hover, a:hover {
color: #bba8ff;
font-weight: bold;
font-style: normal;
text-decoration: underline;
}
/* Hope this helped you out! */
</style>
And that's it!
-- oh and the ".details-table td" is your general interests and social media links tables combined. i haven't figured out to make them different from each other.
Comments
Displaying 1 of 1 comments ( View all | Add Comment )
ADELIA
TYSM THIS HELPS SM