Better spacehey

Tags: spacehey, layout, black, white, tiktok, instagram, best, better, fast
Description:

My redesign for spacehey. I'm working for version 2🙄
Preview:

click on the image for a larger preview
Code:

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

<style>
body {
	-webkit-tap-highlight-color: transparent;
	-webkit-font-smoothing: antialiased;
	font-family: "Sofia Pro", "PingFang SC", sans-serif;
	color: rgb(18, 18, 18);
	font-size: 18px;
	font-weight: 700;
}

nav .top {
	background: #fff;
	color: #000;
}

nav .top .left .logo {
	filter: invert(1);
}

nav .links a[href^="https://spacehey.com/notification"]::after {
	content: " Notification";
}

nav .links a[href^="https://spacehey.com/home"] {
	display: none;
}

nav .links a[href^="https://spacehey.com/search"] {
	display: none;
}

body > div.container > nav > ul > li:nth-child(5) > a {
	display: none;
}

body > div.container > nav > ul > li:nth-child(6) > a {
	display: none;
}

nav .links a[href^="https://spacehey.com/topmusic"] {
	display: none;
}

nav .links li:not(:last-child)::after {
	display: none;
}

#q {
	font-family: "Sofia Pro", "PingFang SC", sans-serif;
	border-radius: 6px;
	background: #d9d9db;
	border: 0;
	padding: 5px;
	border: 2px solid #000;
}

body > div.container > nav > div > div.center > form > button {
	color: #fff !important;
	background: #000 !important;
	font-family: "Sofia Pro", "PingFang SC", sans-serif !important;
	padding: 5px 5px 5px 5px !important;
	font-weight: bold;
	border-radius: 6px !important;
	text-decoration: none !important;	
}

body > div.container > nav > div > div.right > form > button
{
	color: #fff !important;
	background: #000 !important;
	font-family: "Sofia Pro", "PingFang SC", sans-serif !important;
	padding: 5px 5px 5px 5px !important;
	font-weight: bold;
	border-radius: 6px !important;
	text-decoration: none !important;
}

.general-about .profile-pic img {
	border-radius: 50%;
	box-shadow: 0 0 0 3px #dddfe2;
}

.profile h1 {
	text-transform: uppercase;
	font-weight: 700;
	font-size: 32px;
}

.profile .mood p {
	text-transform: uppercase;
	border: 1px solid #000;
	padding: 11px 8px;
}

.profile .contact, .profile .url-info, .profile .table-section, .home-actions {
	border: 0;
}

.profile .contact .heading, .profile .table-section .heading, .home-actions .heading {
	background: none;
	text-align: center;
	padding: 5px;
	border-bottom: 3px solid #000;
	color: rgb(18, 18, 18);
	font-weight: 700;
	font-size: 18px;
}

.profile .blurbs .heading, .profile .friends .heading {
	background: none;
	color: #000;
	text-align: center;
	border-bottom: 3px solid #000;
}

body > div.container > main > div > div.col.w-40.left > div > div.heading
{
	margin-bottom: 10px;
}


body > div.container > main > div > div.col.right > div:nth-child(4) > div.inner > p > b {
	font-size: 20px;
}

body > div.container > main > div > div.col.right > div.blog-preview > p {
	font-size: 20px;
}

body > div.container > main > div > div.col.w-40.left > div.url-info > p:nth-child(2) {
	color: #eb2a3d;
}

#comments > div.inner > p > b > a:nth-child(3) {
	font-size: 80%;
}

#comments > div.inner > p > b > a:nth-child(4) {
	font-size: 80%;
}

.comments-table td:first-child, .music-table td:first-child {
	background: #fff;
}

.comments-table td, .music-table td {
	background: #f8f9fa;
	font-weight: 400;
	font-size: 14px;
}

.comments-table a {
	color: #000;
}

.comments-table button {
	font-family: "Sofia Pro", "PingFang SC", sans-serif !important;
	padding: 5px 10px;
	background: #000;
	color: #fff;
	border-radius: 6px;
}

.profile-info {
	padding: 5px 5px;
}

.profile .blurbs .inner, .profile .friends .inner {
	padding: 7px 0 7px 0;
}

.profile .blurbs .inner, .profile .friends .inner b {
	font-weight: 100;
}

#comments > div.inner > p > b {
	font-size: 16px;
}

.f-col a[href^="/addfriend?id=53754"] {
	font-size: 16px;
	color: #eb2a3d;
}

.profile .blurbs {
	display: none;
}

.friends-grid {
	display: none;
}

body > div.container > main > div > div.col.w-40.left > div.general-about > div.details > p:nth-child(1) {
	font-size: 18px;
}

.details-table td:first-child {
	background: #000;
	color: #fff;
}

.details-table td a {
	color: #eb2a3d;
}

.details-table td:first-child a {
	background: #000;
	color: #fff;
}

.details-table td {
	background: #fff;
	vertical-align: top;
	border: 1px solid #000;
}

.count {
	font-size: 22px;
	color: rgba(18, 18, 18, 0.75);
}

time {
	border-bottom: 2px solid #000;
}

.online {
	-webkit-animation: PULSE 1s infinite; 
	-ms-animation: PULSE 1s infinite;
 	animation: PULSE 1.25s infinite; 
}

@-webkit-keyframes PULSE{
	0%{color:rgba(235, 42, 61, 1);}	
	110%{color: black;}
}

@-ms-keyframes PULSE{
	0%{color:rgba(235, 42, 61, 1);}	
	110%{color: black;}
}

@keyframes PULSE{
	0%{color:rgba(235, 42, 61, 1);}	
	110%{color: black;}
}

@font-face {font-family: "Sofia Pro"; src: url("//db.onlinewebfonts.com/t/05428692254b58ccb090358a3dfecfff.eot"); src: url("//db.onlinewebfonts.com/t/05428692254b58ccb090358a3dfecfff.eot?#iefix") format("embedded-opentype"), url("//db.onlinewebfonts.com/t/05428692254b58ccb090358a3dfecfff.woff2") format("woff2"), url("//db.onlinewebfonts.com/t/05428692254b58ccb090358a3dfecfff.woff") format("woff"), url("//db.onlinewebfonts.com/t/05428692254b58ccb090358a3dfecfff.ttf") format("truetype"), url("//db.onlinewebfonts.com/t/05428692254b58ccb090358a3dfecfff.svg#Sofia Pro") format("svg"); }
@font-face {font-family: "PingFang SC"; src: url("//db.onlinewebfonts.com/t/05e476e067ffef74ca5686f229c40a63.eot"); src: url("//db.onlinewebfonts.com/t/05e476e067ffef74ca5686f229c40a63.eot?#iefix") format("embedded-opentype"), url("//db.onlinewebfonts.com/t/05e476e067ffef74ca5686f229c40a63.woff2") format("woff2"), url("//db.onlinewebfonts.com/t/05e476e067ffef74ca5686f229c40a63.woff") format("woff"), url("//db.onlinewebfonts.com/t/05e476e067ffef74ca5686f229c40a63.ttf") format("truetype"), url("//db.onlinewebfonts.com/t/05e476e067ffef74ca5686f229c40a63.svg#PingFang SC") format("svg"); }
</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 )
Shaitanshammer
1627987083
Nice! Sleek and pretty clear design!
Report Comment