Report Blog Entry
some of u have really made ur spacehey pages ur own. how do u do that?! it look so cool and i really want to try that! i dont think any other social media sites allow for as much personalization as myspace / spacehey, and thats where the magic truly is.
how do yall make ur pages look so cool?
0 Kudos
Comments
Displaying 2 of 2 comments ( View all | Add Comment )
JJHICKS10
Layouts here is a layout
@import url('https://fonts.googleapis.com/css2?family=Indie+Flower&display=swap');
body {
background-image: url(https://media.giphy.com/media/26ueZ3ADWRdWhWc4o/source.gif);
font-size: 24px;
line-height: .8em;
font-family: 'Indie Flower', cursive;
}
main {
background: none;
}
a {
color: #FFFFFF;
}
a:hover {
color#FFFFFF;
}
.profile h1 {
background-image: url(https://media.giphy.com/media/fxF1zmiELyendKbfro/source.gif);
background-color: #0D2B7DCC;
padding: 10px;
border-radius: 10px;
box-shadow: 4px 4px 0 #2d1157;
text-align: center;
color: #FFF;
font-size: 2.5em;
animation: nineties1 2s ease 0s infinite normal none;
}
.general-about {
background-image: url(https://media.giphy.com/media/GcIK1jot8WVDq/source.gif);
padding: 20px;
border-radius: 10px;
box-shadow: 4px 4px 0 #2d1157;
text-align: center;
animation: nineties2 2s ease 0s infinite normal none;
animation-delay: .46s;
}
.general-about .profile-pic {
float: none;
image-radius: 10px;
}
.details p {
margin: 0;
}
.profile .mood {
background-image: url(https://media.giphy.com/media/2eaVqI4IUdHIk/source.gif);
padding: 10px;
background-color: #FFF;
border-radius: 10px;
text-align: center;
margin-top: 20px;
animation-delay: .3s;
animation: nineties1 2s ease 0s infinite normal none;
box-shadow: 4px 4px 0 #2d1157;
}
.profile .mood:hover {
animation-play-state: paused;
}
.profile .contact {
background-image: url(https://media.giphy.com/media/3oz8xGDDJLZAMGqG08/source.gif);
padding: 20px;
border: none;
border-radius: 10px;
box-shadow: 4px 4px 0 #2d1157;
text-align: center;
animation: nineties2 2s ease 0s infinite normal none;
animation-delay: .6s;
border: none;
}
.profile .contact:hover {
animation-play-state: paused;
}
.profile .contact a {
color: #FFF;
filter: drop-shadow(1px 1px 0px #000);
}
.profile .url-info {
border-radius: 10px;
text-align: center;
color: #FFF;
filter: drop-shadow(3px 3px 0 #000);
}
.profile .profile-info .inner h3 {
filter: drop-shadow(3px 3px 0 #000000);
margin: 0!important;
color:#FFF;
}
.profile .profile-info .inner h3 a {
color: #FFFFFF;
}
.profile .profile-info {
background-image: url(https://media.giphy.com/media/RhaXsDHl7ojLk3jnrW/source.gif);
padding: 20px;
border: none;
border-radius: 10px;
box-shadow: 4px 4px 0 #2d1157;
text-align: center;
animation: nineties2 2s ease 0s infinite normal none;
animation-delay: .15s;
border: none;
}
.profile .left .table-section {
border-radius: 10px;
filter: drop-shadow(3px 3px 0 #000000);
}
.profile .left .table-section .heading {
text-align: center;
background: none;
}
.details-table td:first-child {
background-color: #21208F66;
color: #FFFFFF;
padding: 10px;
}
.details-table td {
background-color: #23234066;
color: #FFFFFF;
padding: 10px;
}
a {
color: #FFFFFF;
}
.details-table p a:hover {
transform: scale(1.2);
}
.profile .right .blog-preview h4 {
color: #FFFFFF;
filter: drop-shadow(3px 3px 0 #000);
}
.profile .right .blog-preview p {
padding: 10px;
border: 3px solid var(--lighter-blue);
border-radius: 10px;
background-color: #23234066;
color: #FFF;
text-align: center;
filter: drop-shadow(3px 3px 0 #000);
}
.blurbs .heading h4, .friends .heading h4 {
color: #FFF;
font-size: 1.4em;
filter: drop-shadow(3px 3px 0 #000);
}
.profile .blurbs .section h4 {
color: #FFF!important;
font-size: 1.5em;
margin-top: .3em;
filter: drop-shadow(3px 3px 0 #000);
}
.profile .blurbs .section :nth-child(2) {
background-image: url(https://i.imgur.com/d27Wx1b.jpg);
padding: 20px;
/* margin-top: -5px; */
box-shadow: 4px 4px 0 #000;
}
.profile .blurbs .section:nth-of-type(even) {
transform: rotate(-2deg);
}
.profile .blurbs .section:nth-of-type(odd) {
transform: rotate(2deg);
}
.friends .inner p {
text-align: center;
color: #FFF!important;
filter: drop-shadow(3px 3px 0 #000);
}
.comments-table td {
background-color: #E34E6B77;
padding: 20px;
}
.comments-table td p {
text-align: left!important;
}
footer {
background-color: #00000077;
color: #FFF;
border-radius: 20px;
padding: 20px;
}
@keyframes nineties1 {
0.0% {
transform: rotate(0deg);
}
19.4% {
transform: rotate(-3deg);
}
20.1% {
transform: rotate(3deg);
}
29.3% {
transform: rotate(3deg);
}
30.3% {
transform: rotate(-6deg);
}
39.3% {
transform: rotate(-6deg);
}
40.0% {
transform: rotate(-2deg);
}
48.7% {
transform: rotate(-2deg);
}
49.7% {
transform: rotate(5deg);
}
59.2% {
transform: rotate(5deg);
}
60.2% {
transform: rotate(9deg);
}
69.2% {
transform: rotate(9deg);
}
70.2% {
transform: rotate(-8deg);
}
79.4% {
transform: rotate(-8deg);
}
8.7% {
transform: rotate(0deg);
}
80.4% {
transform: rotate(-2deg);
}
88.5% {
transform: rotate(-2deg);
}
89.6% {
transform: rotate(5deg);
}
9.5% {
transform: rotate(-3deg);
}
98.7% {
transform: rotate(5deg);
}
99.5% {
transform: rotate(0deg);
}
}
@keyframes nineties2 {
0.0% {
transform: rotate(0deg);
}
19.4% {
transform: rotate(3deg);
}
20.1% {
transform: rotate(-3deg);
}
29.3% {
transform: rotate(-3deg);
}
30.3% {
transform: rotate(6deg);
}
39.3% {
transform: rotate(6deg);
}
40.0% {
transform: rotate(2deg);
}
48.7% {
transform: rotate(2deg);
}
49.7% {
transform: rotate(-5deg);
}
59.2% {
transform: rotate(-5deg);
}
60.2% {
transform: rotate(-9deg);
}
69.2% {
transform: rotate(-9deg);
}
70.2% {
transform: rotate(8deg);
}
/* New 90s City - By Cory Anotado - PacdudeGames.com */
79.4% {
transform: rotate(8deg);
}
8.7% {
transform: rotate(0deg);
}
80.4% {
transform: rotate(2deg);
}
88.5% {
transform: rotate(2deg);
}
89.6% {
transform: rotate(-5deg);
}
9.5% {
transform: rotate(3deg);
}
98.7% {
transform: rotate(-5deg);
}
99.5% {
transform: rotate(0deg);
}
}
Paula Jean
I browsed through some blogs by clicking on blog on the nav bar then web, html, tech.
Here's one that may be helpful for you:
https://blog.spacehey.com/entry?id=1254