Purple dream CSS layout voor Socializen

Wil jij ook deze prachtige, paarse layout? Kopieer dan onderstaande code

Profiel layout: 'Purple dream'

Bijzonderheden: In deze layout zijn de vlakken transparant, zijn alle kolommen aan de rechterkant gezet en hebben de avatars een mooie schaduw. De profielnaam heeft een achtergrondje en de topbalk is aangepast aan het thema. 

Download HIER het pakketje met daarin de wallpaper en de cover!

Sla het pakketje op je computer op als bijv 'Purpledreamlayout.css', dus niet als .txt, anders werkt het niet!

Of kopieer onderstaande code, plak hem in je kladblok op je pc en upload hem in je Socializen Dashboard bij 'Design' in het CSS-bestand gedeelte. Kies desgewenst zelf een passende achtergrond en cover!

Wordt ook lid van de groep 'Socializen Layouts en Profielpimps' als je op de hoogte wilt blijven van de laatste layouts!

 

De CSS-code:

 

.navbar-default {
border:none;
height:50px;
box-shadow:0 1px 4px rgba(0,0,0,0.2);
background: linear-gradient(135deg, rgba(2,0,36,1) 0%, rgba(162,7,222,0.969625350140056) 67%, rgba(0,212,255,1) 100%);
box-shadow:2px 2px 7px #000;
}

.sun_profile_header_area .user-cover-reposition-w img {
height:100%;
border-radius:50px;
box-shadow:6px 4px 8px 4px rgba(0,0,0,0.77);
opacity:.8;
}

.sun_pic_info .user-avatar img {
width:100%;
box-shadow:0 2px 10px rgba(0,0,0,.15);
border-radius:50%;
box-shadow:4px 4px 15px 1px #000;
}

.sun_pic_info .info .title a {
font-weight: 700;
color: #c9b2d4;
font-size: 28px;
font-family: "Lato",sans-serif;
text-shadow: 2px 2px 3px rgba(0,0,0,0.29);
/* background: linear-gradient(67deg, rgba(2,0,36,1) 0%, rgba(2,0,36,1) 67%, rgba(2,0,36,1) 100%); */
background: linear-gradient(67deg, rgba(2,0,36,1) 0%, rgba(136,3,138,1) 67%, rgba(233,5,36,1) 100%);
border-radius: 10px;
padding-left: 5px;
padding-right: 5px;
padding-top: 5px;
padding-bottom: 5px;
box-shadow: 2px 2px 4px 0 #000;
}

.sun_pic_info .info .title a {
font-weight:700;
color:#d5ed0c;
font-size:28px;
font-family:"Lato",sans-serif;
text-shadow:2px 2px 3px rgba(0,0,0,0.29);
}

.sun_profile_container {
width:100%;
max-width:1120px;
margin:-42px auto 0;
position:relative;
opacity:.8;
background: linear-gradient(67deg, rgba(2,0,36,1) 0%, rgba(162,7,222,0.969625350140056) 67%, rgba(162,7,222,1) 100%);
border:4px solid #ee0abd;
}

.sun_innr_comm {
border-radius:18px;
display:block;
padding:8px 12px;
background-color:#fff;
position:relative;
box-shadow:4px 4px 15px 1px #000;
}

.sun_profile_container .sun_col-md-6 {
width:48%;
opacity:.8;
}

.sun_profile_container .sun_col-md-3 {
width:27%;
opacity:.8;
float:right;
}

.sun_side_widget {
background:#fff;
box-shadow:0 1px 13px rgba(0,0,0,0.08);
margin-bottom:25px;
border-radius:5px;
box-shadow:4px 4px 15px 0 #000;
}

.sun_side_widget .sun_side_widget_title a {
color:#efdf08;
text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.78);
}
}

.sun_side_widget .sun_prof_foll_ing .sidebar-user-data img {
border-radius:50%;
width:100%;
height:100%;
object-fit:cover;
position:absolute;
top:0;
right:0;
bottom:0;
left:0;
box-shadow:2px 2px 12px 0 #000;
}

.publisher-box textarea.postText {
padding:63px 35px 10px 50px;
line-height:1.628571;
height:112px;
min-height:112px;
border-radius:5px;
background: linear-gradient(135deg, rgba(2,0,36,1) 0%, rgba(162,7,222,0.969625350140056) 67%, rgba(0,212,255,1) 100%);
}

.publisher-box .post-avatar {
width:32px;
height:32px;
border-radius:50%;
position:absolute;
left:10px;
top:10px;
z-index:22;
box-shadow:4px 4px 15px 0 #000;
}

.post .post-heading .meta .title a {
color:#efdf08;
font-size:20px;text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.78);
}

.post .post-heading .avatar {
width:44px;
height:44px;
display:block;
border-radius:50%;
margin-left:-10px;
box-shadow:4px 4px 15px 0 #000;
}

.post .post-heading {
height:70px;
padding:15px;
background: linear-gradient(135deg, rgba(2,0,36,1) 0%, rgba(162,7,222,0.969625350140056) 67%, rgba(0,212,255,1) 100%);
box-shadow:2px 2px 7px #000;
}

.post .post-footer {
border-top:1px solid #f4f4f4;
padding:10px;
background:linear-gradient(135deg,rgba(30,87,153,1) 0%,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%);
box-shadow:4px 4px 15px 0 #000;
}

.post .post-description {
padding:15px 15px 8px;
box-shadow:4px 4px 11px 0 #000;
background: linear-gradient(67deg, rgba(2,0,36,1) 0%, rgba(2,0,36,1) 67%, rgba(2,0,36,1) 100%);
border-radius:4px;
}

.post .post-description p {
font-size:14px;
color:#e2d27c;
overflow:hidden;
word-wrap:break-word;
}

.post .post-footer.post-comments {
border-top:0;
border-radius:0 0 5px 5px;
box-shadow:4px 4px 15px 0 #000;
}

.sun_side_widget .sun_side_widget_title {
padding:9px 13px;
font-size:20px;
color:#efdf08;
display:flex;
align-items:center;
font-weight:700;
margin:0;
opacity:.8;
background: linear-gradient(135deg, rgba(2,0,36,1) 0%, rgba(162,7,222,0.969625350140056) 67%, rgba(0,212,255,1) 100%);
.sun_side_widgetsun_side_widget_titleacolor:#efdf08;
.chat-containerbackground:#f6f6f6;
box-shadow:-6px 0 20px rgba(0,0,0,0.04);
color:#2a2a2a;
overflow:hidden;
}


Zohra

81 Blogs posts

Reacties