🔪 L1am 🥩's profile picture

Published by

published
updated

Category: Web, HTML, Tech

My Bloody Valentine Layout

<style>
          @import url('https://fonts.googleapis.com/css2?family=Fondamento:ital@0;1&display=swap');
.fondamento-regular {
  font-family: "Fondamento", cursive;
  font-weight: 400;
  font-style: normal;
}
.fondamento-regular-italic {
  font-family: "Fondamento", cursive;
  font-weight: 400;
  font-style: italic;
}


.logo {
content:url("https://i.postimg.cc/NjnRyp4T/MV5-BNGQx-OTg2-ZTgt-MTU4-MS00-MDI2-LTgx-Zj-Yt-Nzg0-ODI4-Yz-Nh-YTE2-Xk-Ey-Xk-Fqc-Gde-QXVy-Mj-Uz-OTY1-NTc-V1-FMjpg-UX1000.jpg");
width:100%;
}
body {
background-image: url("https://i.postimg.cc/05Zxd3JT/hearts-4.jpg");
background-attachment: fixed;
background-color:black;
font-size: 1.2rem;
color: #fff;
}
nav .top, nav .links, footer {
background:black;
}
main {
background-image:url("https://i.postimg.cc/3NNqZtsh/hearts-5.gif");
background-color:red;
}
::-webkit-scrollbar {
  width: 0px;
}

.general-about .profile-pic img {
    width: 160px;
    height: 160px;
}
.profile-pic .pfp-fallback {
content:url("https://i.postimg.cc/Yq97X36h/Screenshot-2024-06-04-223222.png");
}

.profile .blurbs .heading, .profile .friends .heading, .profile .contact .heading, .profile .table-section .heading, .setting-section .heading, .home-actions .heading {
background:black;
}
.profile .contact, .profile .url-info, .profile .table-section, .setting-section, .home-actions {
background:grey;
border: 2px solid black;
}
.details-table td {
background:grey;
}
.details-table td:first-child {
background:grey;
}

.profile .blurbs .inner {
background: grey;
border: 2px solid black;
}
.profile .blurbs .heading, .profile .friends .heading {
color:white;
text-shadow:2px 2px black;
}
.profile .blurbs .section h4 {
color:black;
}

#comments.friends {
background: rgb(0, 0, 0, 0);
overflow:scroll;
height:500px;
}
table.comments-table, table.music-table, table.bulletin-table, table.forum-table, table.groups-table, .comment-replies {
border-color:black;
}
.comments-table td:first-child, .music-table td:first-child {
background: gray;
border: 2px solid black;
}
.comments-table td, .music-table td {
background: grey;
border: 2px solid black;
}

a:hover {
color:red;
}
a {
color:maroon;
}

/*CONTACT ICONS*/
.contact .inner a img {
font-size: 0}
.contact .inner a img:before {
font-size: 1em;
display: block}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(1) a:before {
/* ADD TO FRIENDS */
content: url(https://i.postimg.cc/Hkkt8JCG/blood2.gif)}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
/* ADD TO FAVOURITE */
content: url(https://i.postimg.cc/Hkkt8JCG/blood2.gif)}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
/*SEND A MESSAGE */
content: url(https://i.postimg.cc/Hkkt8JCG/blood2.gif)}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
/*FORWARD TO FRIEND*/
content: url(https://i.postimg.cc/Hkkt8JCG/blood2.gif)}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {
/*INSTANT MESSAGE*/
content: url(https://i.postimg.cc/Hkkt8JCG/blood2.gif)}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
/*BLOCK USER*/
content: url(https://i.postimg.cc/Hkkt8JCG/blood2.gif)}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {
/*ADD 2 GROUP*/
content: url(https://i.postimg.cc/Hkkt8JCG/blood2.gif)}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
/*REPORT*/
content: url(https://i.postimg.cc/Hkkt8JCG/blood2.gif)}


table, th, td {
  border: 0px solid;
     }
:root {
  --topic1: "General";
  --topic2: "Music";
  --topic3: "Movies";
  --topic4: "Television";
  --topic5: "Ship List";
  --topic6: "Pookies";
 }
.table-section:not(:last-child) .details-table tr td:first-child p{color:transparent !important;text-shadow: none !important;letter-spacing: -100px;}
.details-table tr td:first-child p::after{
color:var(--links) !important;
letter-spacing:normal !important;
text-shadow: 2px 2px black !important;
filter: brightness(95%) !important;
}
.table-section:not(:last-child) .details-table tr:nth-child(1) td:first-child p::after{
  content: var(--topic1);
}
.table-section:not(:last-child) .details-table tr:nth-child(2) td:first-child p::after{
  content: var(--topic2);
}
.table-section:not(:last-child) .details-table tr:nth-child(3) td:first-child p::after{
  content: var(--topic3);
}
.table-section:not(:last-child) .details-table tr:nth-child(4) td:first-child p::after{
  content: var(--topic4);
}
.table-section:not(:last-child) .details-table tr:nth-child(5) td:first-child p::after{
  content: var(--topic5);
}
.table-section:not(:last-child) .details-table tr:nth-child(6) td:first-child p::after{
  content: var(--topic6);
}
.general-about img {-webkit-mask-image: url(https://i.postimg.cc/8CB1CTyG/heart.png);-webkit-mask-size: 100%;-webkit-mask-repeat: no-repeat;-webkit-mask-position: center;}
.profile .friends .person img:not(.icon) { -webkit-mask-image: url(https://i.postimg.cc/8CB1CTyG/heart.png);-webkit-mask-size: 100%;-webkit-mask-repeat: no-repeat;-webkit-mask-position: center;}
.comments-table td:first-child img:not(.icon) { -webkit-mask-image: url(https://i.postimg.cc/8CB1CTyG/heart.png);-webkit-mask-size: 100%;-webkit-mask-repeat: no-repeat;-webkit-mask-position: center;}
          </style>


0 Kudos

Comments

Displaying 0 of 0 comments ( View all | Add Comment )