Published by ᯓ★ oun

published 1746808271

Category: Web, HTML, Tech

View Blog View Profile Report Blog Entry

LUMON MDR Severance inspired layout !

LUMON MDR INSPIRED LAYOUT

max

NOTES:

BLUE FILTER & TV SCREEN FILTER INCLUDED

(BLUE FILTER IS, LINE OF CODE img { .filter UNTIL THE NEXT } BRACKET )

(TV SCREEN FILTER IS, LINE OF CODE body::before{ UNTIL THE NEXT } BRACKET )

HEYSPACE URL IS HIDDEN AND THERE'S A CUSTOM ONLINE ICON

(BOTH ARE, LINE OF CODE <style> .url-info {display: none !important;} UNTIL THE LAST </style>)

I added a lumon loading screen but i don't think it works and i couldn't get it to work unfortunately cuz it clashed w the tv screen filter, but i left the code there either way incase someone manages to figure out how to get it to work without clashing lol

CODE HERE

<style>

body {

font-family: Courier New, monospace;

background-color: black;

}

img {

filter: sepia(100%) hue-rotate(175deg) saturate(50);

}

body::before{

content: " ";

display: block;

position: fixed;

top: 0;

left: 0;

bottom: 0;

right: 0;

background: linear-gradient(rgba(18, 16, 16, 0) 70%, rgba(0, 0, 0, 0.25) 70%);

z-index: 2;

background-size: 100% 1px, 3px 10%;

pointer-events: none;

}

#q, button {

color: #a6e0f7;

background-color: black;

border: 1px solid grey;

font-family: inherit;

border-image: url(https://media.tenor.com/i8-P-CgLUqAAAAAM/gif-agua.gif) 30 stretch;

}

p, i, b, .count {

color: #65e8fc !important;

}

a, .profile .friends .person p, .logout-btn {

color: #94e1ff !important;

text-decoration: underline !important;

}

.container {

margin: 0 auto 0;

margin-top: 2px;

}

.icon {

display: none;

}

nav, nav .links a {

color: #65e8fc;

padding-top: 20px;

}

nav .top {

margin-top: 20px;

background: none;

background-color: black;

border: 2px solid grey;

border-bottom: none;

border-image: url(https://media.tenor.com/i8-P-CgLUqAAAAAM/gif-agua.gif) 30 stretch;

}

nav .links {

background-color: black;

border: 1px solid grey;

border-color: #65e8fc;

border-image: url(https://media.tenor.com/i8-P-CgLUqAAAAAM/gif-agua.gif) 30 stretch;

margin-top: 20px;

}

body{

background-image:

url(https://media.licdn.com/dms/image/v2/D5622AQEkjR-_3M0MSA/feedshare-shrink_800/B56ZUTD__7HoAg-/0/1739781574746?e=2147483647&v=beta&t=8T86cAFijROKRj6jT4sdTwMwAY_gIojcEdy93-lk1xI);

background-attachment: fixed;

background-size: 1000px;

}

main {

background: black;

color: #65e8fc;

border-left: 2px solid turquoise;

border-right: 2px solid turquoise;

border-image: url(https://media.tenor.com/i8-P-CgLUqAAAAAM/gif-agua.gif) 30 stretch;

margin-top: 20px;

border-top: 2px solid turquoise;

}

.heading, .url-info {

color: #c9f8ff !important;

background: none;

background-color: black !important;

border: 2px solid turquoise;

border-image: url(https://media.tenor.com/i8-P-CgLUqAAAAAM/gif-agua.gif) 30 stretch;

margin-top: 20px;

margin-botto: 20px;

}

.inner {

color: #65e8fc !important;

border: 2px solid turquoise;

border-top: none;

border-image: url(https://media.tenor.com/i8-P-CgLUqAAAAAM/gif-agua.gif) 30 stretch;

}

.profile-info {

border: 2px solid turquoise;

border-image: url(https://media.tenor.com/i8-P-CgLUqAAAAAM/gif-agua.gif) 30 stretch;

}

.profile-info .inner {

border: none;

}

.friends .inner {

border-bottom: none;

}

#comments {

border-bottom: 2px solid turquoise;

border-image: url(https://media.tenor.com/i8-P-CgLUqAAAAAM/gif-agua.gif) 30 stretch;

}

.profile .contact, .profile .table-section, .home-actions {

border: none !important;

}

.profile .contact .f-row:first-of-type {

margin-top: 10px;

padding-top: 7px;

border-top: 20px;

}

.profile .blurbs .section h4 {

color: #65e8fc !important;

}

.details-table {

margin: 3px;

}

.details-table, td {

border: 1px solid turquoise;

border-collapse: collapse;

border-image: url(https://media.tenor.com/i8-P-CgLUqAAAAAM/gif-agua.gif) 30 stretch;

padding-top: 20px;

}

td {

color: blue !important;

background: none;

background-color: black !important;

}

table.details-table {

max-width: 98%;

}

.profile h1 {

font-size: 20px;

}

footer {

background: black;

border: 2px solid turquoise;

border-image: url(https://media.tenor.com/i8-P-CgLUqAAAAAM/gif-agua.gif) 30 stretch;

background-image:

url(https://freight.cargo.site/t/original/i/4a1ebd7f92dd623827597d9165eb9fd9f7b94f08b0d13fc87a86917984a279e4/Logo_Load_Up_Screen_2.gif);

background-attachment: fixed;

background-size: 169px;

}

footer p {

color #65e8fc !important;

}

.comments-table {

border: none;

border-collapse: collapse;

border-image: url(https://media.tenor.com/i8-P-CgLUqAAAAAM/gif-agua.gif) 30 stretch;

margin-top: 20px;

padding-top: 20px;

}

.comment-replies {

border: 1px solid grey;

margin: 2px;

border-image: url(https://media.tenor.com/i8-P-CgLUqAAAAAM/gif-agua.gif) 30 stretch;

margin-top: 20px;

}

nav .info {

background: none;

}

</style>

<style>

body:after {

content: " ";

height: 100vh;

width: 100vw;

display: block;

position: fixed;

top: 0;

left: 0;

z-index: 100;

background-image: url('https://freight.cargo.site/t/original/i/4a1ebd7f92dd623827597d9165eb9fd9f7b94f08b0d13fc87a86917984a279e4/Logo_Load_Up_Screen_2.gif');

background-size: cover;

background-repeat: no-repeat;

background-position:center;

animation: yourAnimation 5s ease 0s 1 normal forwards;

pointer-events: none;}

@keyframes yourAnimation { 0.0%{ opacity: 1;} 75%{ opacity: 1; } 100%{ opacity: 0;} }

</style>

<style>

.url-info {display: none !important;} /* to hide the url & 4online */

</style>

<style>

.online {

content: url(https://pix.crd.co/assets/images/gallery12/2589b05d.gif?v=95dd3781);

Published by ᯓ★ oun

LUMON MDR Severance inspired layout !

LUMON MDR INSPIRED LAYOUT

Comments