Sunflowers

Tags: sunflowers, simple, layout, orange, cream, white, layouts

Description:

If you would like to use this layout please leave me a shoutout below! I would like to know what you think.

Please DO NOT remove any of the credits or copyrights from inside the code.

You Can NOT Use This Layout As A Base For Your Layouts!!!

Preview:

click on the image for a larger preview

Code:

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

<style>
/*==========⚠️==========
* sunflower background from vector stock.
============⚠️========*/

a:hover{
    cursor: url('http://www.rw-designer.com/cursor-extern.php?id=130362'), auto;
}
* {
    cursor: url('http://www.rw-designer.com/cursor-extern.php?id=130361'), auto;
}

*::-webkit-scrollbar {
  width: 12px;
}

*::-webkit-scrollbar-track {
  background: #e5ceae;
}
	
*::-webkit-scrollbar-thumb {
  background-color: #e5ceae;
  border-radius: 10px;
  border: 2px solid #d3933b;
}

</style>

<style>
@font-face {
font-family: "CRYSRG__-monospace"; src: url('https://dl.dropbox.com/s/iil39lnci2fdfg5/CRYSRG__.TTF');
}
@font-face {
font-family: "Tangerine_Regular"; src: url('https://dl.dropbox.com/s/w3of2vezcu4opdd/Tangerine_Regular.ttf');
}

:root{
  --headers: #b26422;
  --links: #d3933b;
  --text: #8a3c26;
  --names: #d3933b;
  --background_image: url("https://photos.smugmug.com/JaguarKisses/Spacehey/Backgrounds/i-Nr9FXGM/0/240a29cd/O/EVRYlbw.jpg");
  --font-family: "CRYSRG__-monospace";
  --mynamesize: 35px;
  --curve: 25px;
  --simple_bg: #e5ceae;
  --logo-blue: transparent;
  --darker-blue: transparent;
  --lighter-blue: transparent;
  --even-lighter-blue: transparent;
  --lightest-blue: transparent!important;
  --dark-orange: white!important;
  --light-orange: transparent;
  --even-lighter-orange: transparent;
  --green: transparent;
}

h3, h4, h5, .url-info b{ color: var(--headers) !important;} /* headings*/

a{color: var(--links) !important;} /* color of links */

p, h2{color: var(--text) !important;} /* color of text */

h1, .count, .friends a p{color: var(--names) !important;} /* color of names, and friends 
counter */

nav label{color: var(--headers) !important;} /* color of search */

.section h4{color: var(--names) !important;} /* aboutme & want2meet headings */

.online{color: var(--links) !important;} /* color of the 'online' text */

.section{color: var(--text) !important;} /* sometimes <p> is broken by embeds maybe. */

h2, h3, h4, h5, a, nav label{ 
  font-family: var(--font-family) !important;
  text-transform: uppercase !important;
  font-size: 11px;
  text-align: center;
  text-shadow: 0px 0px white !important;
}

p, .section{
  font-family: var(--font-family) !important;
  font-size: 12px;
}

.section h4{
  font-size: 12px;
  text-align: center;
  padding: 2px;
  background-image: linear-gradient(to bottom right, #ffffff,#fad79a,#ffffff);
  border: 1px solid var(--text) !important;
}

h1{ 
  font-size: var(--mynamesize) !important;
  font-family: "Tangerine_Regular";
  text-transform: none !important;
  padding-left: 10px !important;
}

body {
  background-image: var(--background_image) !important;
  background-color: white !important;
  background-attachment: fixed !important;
}

.search-wrapper input[type=text] {
  background-color: var(--simple_bg) !important;
  border: 1px solid var(--text) !important;
  color: var(--names) !important;
}

button{
  border: 1px solid var(--text) !important;
  font-family: var(--font-family) !important;
  background-color: var(--simple_bg) !important;
  color:var(--headers) !important;
  background-image: linear-gradient(to bottom right, #ffffff,#fad79a,#ffffff);
}

nav{
  background-color:var(--simple_bg); !important;
  border-radius: var(--curve) var(--curve) 0px 0px;
}

nav ul{
  background-color: var(--simple_bg) !important;
}

nav img{
  filter: opacity(80%) !important;
}

nav ul a img, .mood a img, .online{
  display:none !important;
}

.top, nav .links{
  background:none !important;
  background-color: var(--simple_bg); !important;
  text-align: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
  font-size: 10px;
}

nav .links li:not(:last-child)::after,
footer .links li:not(:last-child)::after{
  content: "🌻";
  color: var(--links);
}

.profile-pic img{
  -webkit-mask-image: url('https://photos.smugmug.com/JaguarKisses/Spacehey/Profile-Image/i-3QGJhzC/0/012be850/O/nlhZDtP.png');
  -webkit-mask-size: 100%;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  transform:scale(1.025,1.025);
  position:relative;
  top:-0.25em;
  filter: sepia(100%);
}

.mood, .url-info{
  text-align: center;
}

.friends-grid img{
  outline:none !important;
  width:80% !important;
  height:80% !important;
  -webkit-mask-image: url('https://photos.smugmug.com/JaguarKisses/Spacehey/Profile-Image/i-3QGJhzC/0/012be850/O/nlhZDtP.png');
  -webkit-mask-size: 100%;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  transform:scale(1.025,1.025);
  position:relative;
  top:-0.25em;
  filter: sepia(100%);
}

.inner img{
  -webkit-mask-image: url('https://photos.smugmug.com/JaguarKisses/Spacehey/Profile-Image/i-3QGJhzC/0/012be850/O/nlhZDtP.png');
  -webkit-mask-size: 100%;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  transform:scale(1.025,1.025);
  position:relative;
  top:-0.25em;
  filter: sepia(100%);
}

.count{
  color: var(--text);
}

.contact .inner a img {
    display: none;
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(1) a:before {
	/* Add to Friends */
	content: '🌻';
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
	/* Add to Favorites */
	content: '🌻';
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
	/* Send Message */
	content: '🌻';
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
	/* Forward to Friend */
	content: '🌻';
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {
	/* Instant Message */
	content: '🌻';
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
	/* Block User */
	content: '🌻';
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {
	/* Add to Group */
	content: '🌻';
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
	/* Report Profile */
	content: '🌻';
}

main{
  background-color: var(--simple_bg);
}

.profile .profile-info{
  background-image: var(--background_image);
  background-position: center top;
  background-size: 25%;
  border: 1px solid var(--text) !important;
}

.friends th, tr, .friends td, th, .icon, #comments, .comments-table, .friends, .profile-info, .table, .table-section, .contact, .url-info, .mood, .blurbs, .blog-preview{
  border: 1px solid var(--text) !important;
}

.profile .contact .heading, .profile .table-section .heading, .profile .blurbs .heading,
.profile .friends .heading{
  border-bottom: 1px solid var(--text) !important;
  background-image: linear-gradient(to bottom right, #ffffff,#fad79a,#ffffff);
  text-align: center;
  padding: 2px;
}

#comments, .comments-table, .comment-replies{
  border: 1px solid var(--text) !important;
  font-size: 10px;
}

footer{
  background-color: var(--simple_bg) !important;
  margin-top: -15px!important;
  border-radius: 0px 0px var(--curve) var(--curve);
}

</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 4 of 4 comments ( View all | Add Comment )

Clarissa	1688916420 Using but no images are showing. Report Comment
Diana	1682636193 Lovely, using. Except no images are showing up atm Report Comment This will happen if the image hosting site goes down for Maintenance. This is common for any site that hosts images. by Coffee Queen; 1682862796; Report Unfortunately, this wasn't the case imgur seems to have pulled the plug on everyone without an account from what I gathered. Thank you, for your input. by Diana; 1682986811; Report
SunflowerSorrows	1682131083 perfect, using! Report Comment
Jennifer	1681861603 Love this layout, definitely gonna use it Report Comment