ВКонтакте's profile picture

Published by

published
updated

Category: Web, HTML, Tech

Мой css(сырая версия)

<style>

    body {

        font-family: tahoma, arial, verdana, sans-serif, Lucida Sans;

        font-size: 12px;

        background: #fff;

    }

    

    .container {

        width: 800px;

    }

    

    a {

        color: #4E7AA1;

    }

    

    a:hover {

        color: #4E7AA1;

        text-decoration: none;

    }

    

    nav .links {

        background-color: #fff;

        padding: 10px;

    }

    

    nav .links li {

        display: block;

    }

    

    nav .links a {

        color: #4E7AA1;

        text-shadow: none;

    }

    

    nav .links a:hover {

        color: #4E7AA1;

    }

    

    nav .links li.active a {

        font-weight: 100;

    }

    

    nav .links a:hover {

        text-decoration: none;

    }


    nav .links li:not(:last-child)::after{

        content: "";

    }


    nav .links li:not(:last-child)::before {

        content: "My ";

        color: #4E7AA1;

    }

    

    nav .links li:not(:last-child)::after, footer .links li:not(:last-child)::after {

        content: " ⠀ ";

    }


    nav .top {

        background: #4E7AA1;

        background: linear-gradient(0deg, rgba(78, 122, 161, 1) 0%, rgba(22, 71, 115, 1) 100%);

        padding: 10px;

        border-radius: 0 0 10px 10px;

        border: 1px solid #164773;

        box-shadow: inset 0 -1px rgba(255, 255, 255, 0.25);

    }

    

    nav .top .left .logo {

        width: 0;

        height: 0;

    }

    

    nav .top a {

        font-weight: bold;

    }

    

    main {

        padding: 0;

        color: #666;

        margin-top: -255.27px;

    }

    

    main .left {

        padding-left: 170px;

    }

    

    @media (min-width: 30em) {

        .col.w-40 {

            width: 50%;

        }

    }

    

    .profile .blurbs .heading, .profile .friends .heading {

        padding: 3px 8px;

        background: #e1e7ed;

        border-top: 1px solid #d3dae0;

        border-bottom: 1px solid #d8dfe5;

        color: #4E7AA1;

    }

    

    .profile .blurbs .inner, .profile .friends .inner, .blog-entry .comments .inner, .bulletin .comments .inner, .setting-section .inner {

        padding: 10px 0 0 0;

    }

    

    .profile .blurbs .section {

        margin-bottom: 10px;

    }

    

    .profile .blurbs .section h4 {

        color: #4E7AA1;

    }

    

    .count {

        color: #666;

    }

    

    .profile h1 {

        color: #4E7AA1;

    }

    

    .online {

        color: #666;

    }

    

    .online img  {

        filter: brightness(0) saturate(100%) invert(40%) sepia(0%) saturate(0%) hue-rotate(0deg);

    }

    

    footer p {

        color: #666;

    }

    

    footer {

        background: #fff;

    }

    

    footer .copyright {

        text-decoration: none;

    }

    

    .comments-table td:first-child, .music-table td:first-child {

        background: none;

        border: none;

    }

    

    .comments-table td, .music-table td {

        background: none;

        border: none;

    }

    

    nav .top a {

        color: #fff;

    }

    

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

        border: 0;

    }

    

    .profile .contact .heading, .profile .table-section .heading, .setting-section .heading, .home-actions .heading {

        padding: 3px 8px;

        background: #e1e7ed;

        border-top: 1px solid #d3dae0;

        border-bottom: 1px solid #d8dfe5;

        color: #4E7AA1;

    }

    

    .details-table td:first-child {

        background: none;

        color: #4E7AA1;

    }

    

    .details-table td {

        background: none;

    }

    

    .icon, .award img {

        height: 0;

        width: 0;

    }


    table.comments-table, table.music-table, table.bulletin-table, table.forum-table, table.groups-table {

        border: none;

    }


    button {

        background: none;

        border: none;

        color: rgba( 0, 0, 0, 0)

    }


    nav .top .center form {

        margin-top: 0;

        color: rgba(0,0,0, 0);

    }


    .general-about .profile-pic {

        margin: 20px 10px 20px 0;

    }


    .comments-table td:first-child img:not(.icon) {

        width: 60px;

    }


    .comments-table button, .bulletin-table button {

        color: #4E7AA1;

        font-size: 0.7em;

        cursor: pointer;

    }


    .profile .blurbs .section p, .profile .friends p, .blog-entry .comments p, .bulletin .comments p {

        margin: 0 0 5px 0;

    }


    nav .top .left:not(:last-child)::before {

        content: "ВКонтакте";

        color: #fff;

        font-size: 16px;

        font-weight: bold;

        font-family: Arial, Helvetica, sans-serif;

        text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);

    }


    nav .top .left img {

        margin: 0;

    }

</style>


1 Kudos

Comments

Displaying 0 of 0 comments ( View all | Add Comment )