« Web, HTML, Tech Forum

Green and Pink Layout

Posted by Alex

posted

Forum: Web, HTML, Tech

Just copy and paste!!


<!-- (c) Edited/curated Layout. Note that some of the code is not mine! Original creators are linked -->












<!-- About me section  -->








<img src=""/>








<img src=""/>








<img src=""/>








<img src=""/>








<img src=""/>




















<!-- (c) Original Layout created by J3TT J4YW4LK3R (https://layouts.spacehey.com/layout?id=103789) -->








<style>








.col, main, footer, nav::before, .online, nav .links, nav .top {




    animation: float 3s;




    animation-iteration-count: infinite;




    animation-timing-function: ease-in-out;




}








.col, main, footer, nav::before, .online, nav .links, nav .top {




animation: float 3s;




animation-iteration-count: infinite;




animation-timing-function: ease-in-out;




}




@keyframes float {




0% { transform: translate(0, 0px);




}




50% {




transform: translate(0, 8px);




}




100% {




transform: translate(0, -0px);




}




</style>








<!-- main Layout code -->








<style>




@import url('https://fonts.googleapis.com/css2?family=Potta+One&display=swap');




body{font-family: "potta one" ;}




</style> 








<style>




body {




    background: url("https://i.pinimg.com/736x/33/15/d0/3315d04beec7d69a7a135b3ca8879ae0.jpg");




}




.profile {




background-image:url(https://i.pinimg.com/736x/fd/b2/9f/fdb29f8b8b7476dd29d8b9bfd0f8cded.jpg);




  background-repeat: repeat;




    border-radius: 8px;




}








h1




{




color:




h1




{         color:white; 




//text-shadow: 1px 1px #ffffff;






};




text-shadow: 2px 2px 3px #ffffff, 0 0 25px #ffffff, 0 0 5px white;




}




h1, h2, h3, h4,h5,a, p, nav label, .section




{






main, top, links, nav .top, nav .links, details-table




{




    background:  !important;




background-image:   !important;




background-size: cover !important;




    padding: 0 !important;




    /*font-size: small;*/




    color: #ffffff;




{








.mood




text-transform:uppercase !important;




}








table, td




}




/* border: 1px solid var(--url-pink-bg)!important; */




border-spacing: 2px;




}








.profile .contact, .profile .url-info, .profile .table-section, .home-actions




{




    width: 100%;




    border: 2px solid var(--#FB9E00);




}




table, th, td








}




   border: 1px solid #ffffff;




   border-spacing: 2px;




}




.blog




}   




   border: 10px solid #ffffff;




}




.profile .contact, .profile .url-info, .profile .table-section, .home-actions




}




   width: 100%;




   border: 4px outset #ffffff;




   margin 10px 2;




}








.online




{




  color: gold!important; 




  //text-shadow: 1px 1px white;




}








:root 




{




--logo-blue: ;




  --darker-blue: ;




--lighter-blue: #ffffff;




--even-lighter-blue: ;




--lightest-blue: ;




--dark-orange: ;




--light-orange: ;




--even-lighter-orange: ;




--turquoise: ;




        




        --table-header: white;




--table-color: white;




--link-text: white;




--main-text: white;








    }   




main 




{




  /* changes made to stuff outside of columns */




    background: White;




    padding: 0;




    font-size: small;




    color: #ffffff;




text color: white;




  text-shadow: 1px 1px 2px #000000, 0 0 25px #000000, 0 0 3px #000000; 




}




footer 




{




    background: white!important;




}




.comments-table{




display: block;




height: 500px;




overflow-y: scroll;




Border-radius: 8px; 




color: #ffffff;




  text-shadow: 1px 1px 2px #000000, 0 0 25px #000000, 0 0 3px #000000; 




}




.contact {




  border-radius: 8px;




  background-image: url(https://i.pinimg.com/originals/55/1f/02/551f0298a38f1e1533b60a1306f4d3b9.gif);




  background-position: right top;




  background-repeat: repeat;




background-attachment: scroll;




Width: 310px;




Height:180px;








color: #ffffff;




  text-shadow: 1px 1px 2px #000000, 0 0 25px #ffffff, 0 0 3px #ffffff; 




}




.friends th, tr, .friends td, th, .icon, main, .comments-table, .friends, .profile-info, .table, .table-section,  .url-info, .mood, .blurbs, .blog-preview, .details, 




{




border: 1px curve none !important;




outline: none !important;




}




img




{




border-radius: 12px;




}








main {




background:  black;




border-radius: 14px;




padding: 0;




font-size: 85%;




color: #ffffff;




}








nav, footer, .profile .contact {




display: inherit !important;




opacity: 1 !important;




border-radius: 12px;




}




main {




background:  ;




border-radius: 12px;




border: 12px solid #ffffff;




padding: 0;




font-size: 90%;




color: #ffffff;




}




nav .top {




  background: transparent;




}








nav .links {




  background: rgba(0, 0, 0, 0.3);




}








nav { background-image: url(https://i.pinimg.com/originals/56/29/e3/5629e301c910abbe16eb5f69245dbf86.gif) 




}












/*customising interests box*/




  .profile .table-section{




    border:2px solid #ffffff;




    border-radius: 15px;




  }




  .profile .table-section .heading{




    background:#ffffff;




    border: 1px solid #ffffff;




    border-radius: 15px 15px 0px 0px;




    text-align: center;




  }




  .profile .table-section .heading h4{




    color: #ffffff;




    text-shadow: 1px 1px 2px black;




  }




  .profile .table-section .details-table td{




    background: rgba(0, 0, 0, 0);




    padding-right: 10%;




  }




 




  .profile .friends .heading{




    background: #ffffff;




    color: #ffffff;




    text-shadow: 1px 1px 2px black;




    text-align: center;




  }




  .profile .friends .heading h4{




    text-align: center;




    color: #ffffff;




    text-shadow: 1px 1px 2px black




  }




.general-about {




background-image: url(https://i.pinimg.com/736x/cb/4e/e8/cb4ee8b7b68ad16dfb2a5c1e9d0c18e7.jpg);




padding: 20px;




border-radius: 10px;




box-shadow: 4px 4px 0 #000000;




text-align: center;




animation: nineties2 2s ease 0s infinite normal none;




animation-delay: .46s;




}




.profile .blurbs .section :nth-child(2) {




background-image: url(https://i.pinimg.com/1200x/a5/09/a6/a509a61126215f98bbab148bfdf5a06f.jpg);




     /* margin-top: -8px; */




padding: 18px;




box-shadow: 4px 4px 0 #000;




}








.profile .profile-info .inner h3 {




filter: drop-shadow(3px 3px 0 #000000);




margin: 0!important;




color:#ffffff;




}




.profile .profile-info .inner h3 a {




color: #ffffff ;




}




.profile .profile-info {




background-image: url(https://i.pinimg.com/736x/98/35/e7/9835e7b5efa321e42851f7db40d33425.jpg);




padding: 20px;




border: none;




border-radius: 10px;




box-shadow: 4px 4px 0 #ffffff;




text-align: center;




animation: nineties2 2s ease 0s infinite normal none;




animation-delay: .15s;




border: none;











.online{








content: url("https://64.media.tumblr.com/9f38aec50e8f978c8a6fa84ad341bba5/7660be3d27c656cc-17/s250x400/00414796504bf8cd1bb004dac71c96248b812a82.pnj") !important;








}




</style>


Report Topic

0 Replies