Layout Preview

No. 1

Author: ZL33PL3ZZ
Category: ¿?
Created: August 5, 2026
Downloads: 48
First attempt at blog layout
Log in to Apply

Live Preview

Comments (0)

No comments yet. Be the first!

Log in to leave a comment.

Layout CSS

<style>
  body {
font-family: Courier New, monospace;
background-color: black;
}
img {
filter: sepia(100%) hue-rotate(312deg) saturate(0);
}
body::before {
content: " ";
display: block;
position: fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.25) 50%);
z-index: 2;
background-size: 100% 2px, 3px 100%;
pointer-events: none;
}
body, body.profile-page {
  background-image: url("https://i.postimg.cc/d0pVNPgL/IMG-3999.jpg") !important;
  background-repeat: repeat !important;
  background-size: auto !important;
  background-attachment: scroll !important;
  background-position: center center !important;}
  
  @media (min-width: 769px) and (pointer: fine) {
  body, body.profile-page {
    background-attachment: fixed !important;
  }
}

@keyframes boxFloat{0%,100%{transform:translateY(0);}50%{transform:translateY(-10px);}} .contact{animation:boxFloat 3s infinite ease-in-out;}

@keyframes boxFloat{0%,100%{transform:translateY(0);}50%{transform:translateY(-10px);}} .table-section, .friends, .blurbs, .module, .profileInfo{animation:boxFloat 3s infinite ease-in-out;}

main::before {
    content: "" !important;
    display: block !important;
    width: 100% !important;
    height: 300px !important;
    background-image: url('https://i.postimg.cc/d3KdXTgY/IMG-1500.gif') !important;
    background-size: cover !important;
    background-position: center center !important;
  }
  
#q, button {
color: red;
background-color: black;
border: 1px solid grey;
font-family: inherit;
}
p, i, b, .count {
color: red !important;
}
a, .profile .friends .person p, .logout-btn {
color: red !important;
text-decoration: underline !important;
}
.blog-entry .title {
padding-top: 7px;
background: black !important;
background-color: black !important;
border: 2px solid grey;
color: white;
}
.blog-entry .content {
color: red !important;
border: 1px solid grey;
margin: 2px;
background: black !important;
background-color: black !important;
border: 2px solid grey;
color: white;
}
.blog-entry .content blockquote {
margin: 2px;
background: black !important;
background-color: black !important;
color: white;  
}
td {
color: red !important;
background: none;
background-color: black !important;
} 
table.details-table {
max-width: 98%;
}
.blog-entry .profile-pic {
font-size: 20px;
border: 1px solid grey;
margin: 1px;
width: 83px;
length: 83px;
background: black !important;
background-color: black !important;
color: white;
}
footer {
background: black;
border: 2px solid grey;
}
footer p {
color red !important;
}
.comments-table {
border: 2px solid grey;
border-collapse: collapse;
}
.comment-replies {
border: 1px solid grey;
margin: 2px;
}
nav .info {
background: none;
}
.heading {
  background: black !important;
background-color: black !important;
  border: 2px solid grey;
}
.blog-preview {
  background: black !important;
background-color: black !important;
  border: 2px solid grey;
  color: white;
  }
.comments-table {
background: black !important;
background-color: black !important;
border: 2px solid grey;
color: white;
  }
.blog-entry .author-details {
background: black !important;
background-color: black !important;
border: 2px solid grey;
color: white;
  }
nav.top {
background: linear-gradient(90deg, #000000, #000000);
color: #ffffff;
padding: 8px 12px;
margin: -16px -16px 12px;
border-radius: 10px 10px 0 0;
color: white;
  }
nav.links {
background: linear-gradient(90deg, #000000, #000000);
color: #ffffff;
padding: 8px 12px;
margin: -16px -16px 12px;
border-radius: 10px 10px 0 0;
color: white;
  }
.blog-entry.title {
  background: black !important;
  background-color: black !important;
  border: 2px solid grey;
  color: white;
  }
 .row.article{
  background: black !important;
  background-color: black !important;
  border: 2px solid grey;
  color: white;
  }
.blog-entry .kudos-container {
  background: black !important;
  background-color: black !important;
  border: 2px solid grey;
  color: white;
  }
body {
  background: black !important;
  background-color: black !important;
  border: 2px solid grey;
  color: white;
</style>