News Stand

Tags: newspaper, news, layout, simple, crashtestdummy

Description:

Simple News Paper style layout

Preview:

click on the image for a larger preview

Code:

<!-- (c) Layout created by Crash Test Dummy (https://layouts.spacehey.com/layout?id=2758) -->

<style>
@import url('https://fonts.googleapis.com/css2?family=Fredericka+the+Great&family=News+Cycle:wght@700&family=Newsreader&display=swap');

body{filter:invert(100%) url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxkZWZzPjxmaWx0ZXIgaWQ9ImYiPjxmZUNvbG9yTWF0cml4IHR5cGU9Imx1bWluYW5jZVRvQWxwaGEiIHZhbHVlcz0iIj48L2ZlQ29sb3JNYXRyaXg+PC9maWx0ZXI+PC9kZWZzPjwvc3ZnPg==#f)}
:root{
  background-image: url(https://i.imgur.com/QOoA96L.jpg);
  background-attachment: scroll;
  background-size: cover
}


.profile {
	font-family: 'Newsreader', serif;
	text-shadow:  black;
}
.profile .left h1 {
	
    font-family: 'Fredericka the Great', cursive;
	line-height:1em;
	
}

h1 {
  color: black;
  text-shadow: 1px 1px 2px black, 0 0 25px grey, 0 0 5px grey;
}

.profile .left h1 {
	text-transform: uppercase;
	font-size: 3rem;
	color: black;
	
}

.profile .contact .heading h4, .profile .table-section .heading h4, .profile .blurbs .heading h4, .profile .friends .heading h4, .blog-entry .comments .heading h4, .bulletin .comments .heading h4, .home-actions .heading h1, .statistics .heading h4 {
    font-family: 'News Cycle', sans-serif;
	line-height:2em;
	text-shadow: 0 0 7px grey;
}

h1, h2, h3, h4,h5,a, p, nav label, .section {color: black;}

.profile .right .blurbs {
	position: relative;
}

.profile .section p, .details-table td:last-child p{
	padding:.9em;
}

.profile .contact, .profile .url-info, .profile .table-section, .home-actions {
	border: dotted!important;
	width: 100%;
}

.profile .contact .heading h4, .profile .table-section .heading h4, .profile .blurbs .heading h4, .profile .friends .heading h4, .blog-entry .comments .heading h4, .bulletin .comments .heading h4, .home-actions .heading h1, .statistics .heading h4 {
	text-transform: uppercase;
	font-size: 1.3rem;
}

.profile .blurbs .section h4 {
	color: black;
	font-size: 1.3rem;
	text-transform: uppercase;
}

.comments-table, .details-table {
	border: 1px solid #0000;
	border-collapse: separate;
	border-spacing: 0 .5em;
}

.comments-table tr td:last-child {
	height: 150px;
	display: block;
	overflow-y: scroll;
}

.comments-table td, .music-table td {
	background: none;
	color: #000;
}
.comments-table tr {
	border-bottom: 1px solid #000;
}
.comments-table td:first-child, .music-table td:first-child {
	background: none;
	text-align: left;
}

.blog-preview {
    border: 1px dotted crimson!important;
    background: rgba (190, 190, 190);
    background-image: url();
    opacity: 0.5
    border-radius: 10px;
    box-shadow: 1px 1px 2px rgba( 190, 190, 190,);
    height: 155px!important;
    background-position: bottom-right;
    backround-repeat: no-repeat;
}

.contact .inner a img {
    font-size: 0;
}
.contact .inner a img:before {
    font-size: 1em;
    display: block;
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(1) a:before {
	/* add to friends */
	content: "\2795"
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
	/* add to favorites */
	content: "\2b50"
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
	/* Send Message */
	content: "\1F4ac"
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
	/* forward to friend */
	content: "\23e9"
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {
	/* instant message */
	content: "\1F4f1"
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
	/* block user */
	content: "\274c"
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {
	/* add to group */
	content: "\1F465"
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
	/* report user */
	content: "\1f5e3"
}




@media only screen and (max-width: 600px) {
	.profile .left h1:before{
		transform: rotate(-4deg) scale(1.7) translateX(3.5em);
	}
	.profile .left .table-section:nth-last-child(2):before {
		transform: rotate(-4deg) scale(1.7) translateX(14em) translateY(-1.5em);
		z-index: 0;
	}	 
}


</style>

<style>

.online{content:url(https://i.imgur.com/iRDuNrA.gif);
    width: 75px;
    height: 75px;
}
</style>

<style>





</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 )

Malachitgrün

1699824676

BEAUTIFUL!!!

Report Comment