LGBTQ+

Tags: lgbtq+, gay, rainbow
Description:

LGBTQ+ Layout, Feel free to use, comment if using and no need for credit but its appreciated
Preview:

click on the image for a larger preview
Code:

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

<style>


/* cursors */
a:hover{
    cursor: url('http://www.rw-designer.com/cursor-set/lgbt-pride'), auto;
}
* {
    cursor: url('http://www.rw-designer.com/cursor-extern.php?id=114514'), auto;
}
</style>

<style>

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Indie+Flower&display=swap');

:root{
  --headers: blue ;
  --links: yellow;
  --text: violet;
  --names: darkolivegreen;
  --background_image: url("https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcR_HT7SKP-Mx0KqLGdveBOycD3bjfAjz8NSRHeISjdfQyS6scHfX_0jiHDG1zMb0IOw5D4&usqp=CAU");
  --font-family: 'Playfair Display', sanif;
  --mynamesize: 35px;
  --curve: 30px;
  --simple_bg: #000;
  --logo-blue: transparent;
  --darker-blue: transparent;
  --lighter-blue: transparent;
  --even-lighter-blue: transparent;
  --lightest-blue: transparent!important;
  --dark-orange: orange!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: !important;
  font-size: 13px;
  text-shadow:0px 0px gray !important;
  text-align: center;
}

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

.section h4{
  font-size: 14px;
  text-align: center;
  padding: 2px;
  border: 2px outset var(--text) !important;
}

h1{ 
  font-size: var(--mynamesize) !important;
  font-family: 'Indie Flower', cursive;
  text-transform: none !important;
  padding-left: 15px !important;
}

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

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

button{
  border: 1px outset var(--text) !important;
  font-family: var(--font-family) !important;
  background-color: var(--simple_bg) !important;
  color:var(--headers) !important;
}

nav img.logo{
  filter: invert(81%) sepia(76%) saturate(150%) hue-rotate(284deg) brightness(101%) contrast(50%) !important;
}

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{
  border-radius: var(--curve) !important;
  filter: sepia(100%) hue-rotate(260deg);
}

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

.friends-grid img{
  outline:none !important;
  width:80% !important;
  height:80% !important;
  border-radius: var(--curve) !important;
  filter: sepia(100%) hue-rotate(260deg);
}

.inner img{
  outline:none !important;
  border-radius: var(--curve) !important;
  filter: sepia(100%) hue-rotate(260deg);
}

.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 outset 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 outset var(--text) !important;
}

.profile .contact .heading, .profile .table-section .heading, .profile .blurbs .heading,
.profile .friends .heading{
  border: 1px outset var(--text) !important;
  text-align: center;
  padding: 2px;
}

#comments, .comments-table, .comment-replies{
  border: 1px outset 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 0 of 0 comments ( View all | Add Comment )
Layout published by Axelotl​

LGBTQ+

Description:

Preview:

Code:

Comments

Layout published by Axelotl
