Win98 pink

Tags: 98
Description:

Windows 98
Preview:

click on the image for a larger preview
Code:

<!-- (c) Layout created by WlodekM (https://layouts.spacehey.com/layout?id=101915) -->


<style>

.f-row {
	width: auto;
}

.contact .heading {
	width: min-content;
	display: none !important;
}
.contact .inner::before {
	content: "Starte"
}

.profile .contact .heading h4 {
	font-size: 0;
}

.profile .contact .heading {
	background: silver !important;
	box-shadow: inset -1px -1px #0a0a0a,inset 1px 1px #dfdfdf,inset -2px -2px grey,inset 2px 2px #fff;
	padding: 3px;
	border: none;
	color: black;
}

.profile .contact .heading h4 {
	margin: 0;
	display: inline-block;
}

.profile .contact .inner, .profile .contact .inner .f-row, .profile .contact .inner .f-row .f-col {
	display: flex;
	margin: 0;
	align-items: center;
justify-content: start;
}

.contact {
	display: flex!important;
	opacity: 1 !important;
	display: block;
	position: fixed;
	bottom: 0;
	left: 0;
	margin: 0 !important; /* me stupid */
}
.contact .heading {
	display: block;
}
.contact .heading::after {
	display: none;
}

/* brokey */
.edit-link {
	display: none
}

/* SECTION - WIN98 */
@font-face{
    font-family:"Pixelated MS Sans Serif";
    font-style:normal;
    font-weight:400;
    src:url(https://jdan.github.io/98.css/ms_sans_serif.woff) format("woff");
    src:url(https://jdan.github.io/98.css/ms_sans_serif.woff2) format("woff2")
}
@font-face{
    font-family:"Pixelated MS Sans Serif";
    font-style:normal;
    font-weight:700;
    src:url(https://jdan.github.io/98.css/ms_sans_serif_bold.woff) format("woff");
    src:url(https://jdan.github.io/98.css/ms_sans_serif_bold.woff2) format("woff2")
}

p.edit-link:not(.details .edit-link, .table-section .edit-link), .general-about {
	box-shadow: inset -1px 0px #0a0a0a,inset 1px 0px #dfdfdf,inset -2px 0px grey,inset 2px 0px #fff !important;
	margin: 0;
}

span[itemprop="name"] h1 {
	box-shadow: inset -1px 0px #0a0a0a,inset 1px 1px #dfdfdf,inset -2px 0px grey,inset 2px 2px #fff !important;
	margin: 0 !important;
}

.general-about {
	margin: 0 !important;
}

.mood {
	box-shadow: inset -1px -1px #0a0a0a,inset 1px 0px #dfdfdf,inset -2px -2px grey,inset 2px 0px #fff !important;
	margin-top: 0 !important;
}

.blurbs, .profile .contact,
.profile .url-info, .profile .table-section,
.setting-section, .home-actions, .friends,
.blog-preview, .profile-info, .mood,
.general-about, span[itemprop="name"] h1,
div.col.w-40.left p.edit-link:not(.details .edit-link, .table-section .edit-link),
.contact .inner::before, nav, .f-col
{
	background: silver;
	box-shadow: inset -1px -1px #0a0a0a,inset 1px 1px #dfdfdf,inset -2px -2px grey,inset 2px 2px #fff;
	padding: 3px;
	border: none;
	color: black
}

span[itemprop="name"] h1, .heading{
	align-items: center;
	/*background: linear-gradient(90deg,navy,#1084d0);*/
	display: flex;
	justify-content: space-between;
	padding: 5px 4px 5px 4px !important;
	font-family: "Pixelated MS Sans Serif",Arial;
	font-size: 11px;
}

span[itemprop="name"] h1::after, .heading::after {
	background: silver;
	box-shadow: inset -1px -1px #0a0a0a,inset 1px 1px #dfdfdf,inset -2px -2px grey,inset 2px 2px #fff;
	content: "";
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='8' height='7' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 0h2v1h1v1h2V1h1V0h2v1H7v1H6v1H5v1h1v1h1v1h1v1H6V6H5V5H3v1H2v1H0V6h1V5h1V4h1V3H2V2H1V1H0V0z' fill='%23000'/%3E%3C/svg%3E");
	background-position: top 3px left 4px;
	background-repeat: no-repeat;
	display: block;
	height: 14px;
	width: 16px;
	padding: 0;
}

.friends {
	margin-bottom: 20px;
}

/* Make original header dissapear */
.friends .heading {
	font-size: 0
}

/* Do comment header */
.friends#comments .heading::before {
	content: "Comments";
	font-size: 0.79rem !important;
	font-weight: bold;
}

/* Do friend list header */
.friends .heading::before {
	content: "Cool peoples";
	font-size: 0.79rem !important;
	font-weight: bold;
}

nav .top .center{
	display: flex;
}

.heading, .url-info p:nth-child(1), .blog-preview h4:nth-child(1), span[itemprop="name"] h1, nav .top {
	background: #f9c56c !important;
	background: linear-gradient(90deg,#F560FA ,#7910d0) !important;
	color: #FFF !important;
	/*color: var(--dark-orange) !important;*/
	padding: 2px 7px;
}

.url-info p:nth-child(1), .blog-preview h4:nth-child(1) {
	margin-top: 0;
	margin-bottom: 7px;
}

nav ul.links {
	background: transparent
}

/* SECTION - SEARCH */
label[for="q"] {
  font-size: 0
}

form[role="search"] input{
	--size: 32px;
	height: var(--size);
}

form[role="search"] button {
	--size: 32px;
	display: inline-block;
	background-image: url(https://win98icons.alexmeub.com/icons/png/computer_search-0.png);
	background-size: var(--size) var(--size);
	background-color: #0000;
	content: "";
	width: var(--size);
	height: var(--size);
	font-size: 0;
	border:0
}

/* SECTION - OTHER */
.general-about {
	display: flex;
	margin-bottom: 8px;
}

.profile-pic {
	margin-bottom: 0 !important;
}

.mood p:nth-child(2) {
	margin: 0;
}

.mood {
	margin: 0 0 8px 0;
}

.blog-preview {
	margin-top: 20px;
}

.blog-preview p {
	padding-inline: 7px;
}

.blurbs * a, .profile * a, .contact * a,
.blurbs a, .profile a, .contact a
{
	color: #0087ff !important;
}

nav .links a {
	text-decoration: none;
	color: white;
	text-shadow: 0 0 7px #D81DCC;
	font-size: 0.98em;
	font-size: max(0.98em, 12px);
}

footer {
	background: #0005;
	color: white;
}

#hi {
  font-family: "Comic Sans MS", "Comic Sans", "Times New Roman";
  color: red;
}

.section h4 {
  display:none;
}

 body {
	margin: 0;
	background: linear-gradient(#0005, #000a),aliceblue url(https://external-media.spacehey.net/media/sfKMp_fYmblmXBmDixYMTiJ0Ib1n2AM-W9DyDX6QzVN0=/https://autumn.revolt.chat/attachments/lX0a8eNn-LS3L7cmoqRBXaf0hAt7VjB-gtSspgzCFC/139.png);
	padding-bottom: 2em;
}
main {
	background: transparent;
	color: white
}

footer a {
	color: aqua;
}

a {
	color: #5000ff;
}

td {
	color: black
}

:root {
	--light-gray: #f2f0f0;
	--gray: #e3e3e3;
	--dark-gray: #919191;
	--darker-gray: #545454;
	--logo-blue: #D81DCC;
	--darker-blue: #7B1EAF;
	--lighter-blue: #F560FA;
	--even-lighter-blue: #F0BFFE;
	--lightest-blue: #FEDBFA;
	--red: #FF0000;
	--dark-orange: #7A07ED;
	--light-orange: #c06cf9;
	--even-lighter-orange: #d4b8fc;
	--strange-yellow: #dbae2e;
	--green: #34D399;
	--light-green: #E6F8DD;
	--medium-green: #A0C99C;
	--dark-green: #059669;
	accent-color: #1D4ED8;
	accent-color: var(--logo-blue);
}
</style>
Copy and paste this code into the "About me" section of your Profile to use it.
Caution: This Layout was not inspected by SpaceHey — use it at your own risk.
Comments

Displaying 1 of 1 comments ( View all | Add Comment )
R4Z0	1715678643 Using! :D Report Comment