hikan.ru/assets/css/desktop/styles.css

1 line
6.0 KiB
CSS

.accent{color:rgb(255, 51, 255);}.accent-dull{opacity:.8;color:rgb(255, 51, 255);}.gray{color:#696969;}.card-color{color:#080808;}.gray-dull{color:#141414;}.red{color:rgb(143, 2, 2);}::selection{color:white;background-color:rgba(255, 51, 255, .7);}#div-offset div{margin-top:1vw;}a{cursor:pointer;color:#DEDEDF;text-decoration:none;}a:hover{text-decoration:none;}input{font-size:1vw;width:10vw;border:.1vw solid #141414;border-radius:.3vw;color:#DEDEDF;background-color:#080808;transition:border .3s ease;}input[type="file"]{display:none;}input:focus{border:.1vw solid rgb(255, 51, 255);outline:none;}textarea{padding:.5vw;font-size:1vw;margin-top:1vw;resize:vertical;width:100%;border:.1vw solid #141414;border-radius:.3vw;color:#DEDEDF;background-color:#080808;transition:border .3s ease;}textarea:focus{border:.1vw solid rgb(255, 51, 255);outline:none;}button{padding:.2vw;font-size:1vw;cursor:pointer;border:.1vw solid #696969;border-radius:.3vw;color:#DEDEDF;background-color:#080808;}.button{padding:.2vw;font-size:1vw;cursor:pointer;border:.1vw solid #696969;border-radius:.3vw;color:#DEDEDF;background-color:#080808;}body{font-size:1vw;margin:0;font-family:'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;position:relative;overflow-x:hidden;color:#DEDEDF;background-color:#000;display:flex;flex-direction:column;}@keyframes blink{0%,100%{opacity:1;}50%{opacity:0;}}.content{position:relative;width:48vw;flex:1;margin:0 25vw 2vw 25vw;}.content .main-content{position:relative;width:100%;margin-right:0vw;box-sizing:border-box;}.content .main-content .tags{color:#696969;font-weight:700;margin-bottom:1vw;}.content .main-content .post{position:relative;background-color:#080808;padding:1vw;text-decoration:none;border:.1vw solid #141414;border-radius:1vw;margin:1vw 0 1vw 0;}.content .main-content .post:hover::after,.content .main-content .post:hover::before{content:'';opacity:.5;position:absolute;top:50%;transform:translateY(-50%);border-width:2vw;border-style:solid;}.content .main-content .post:hover::after{left:100%;border-color:transparent rgb(255, 51, 255) transparent transparent;}.content .main-content .post:hover::before{right:100%;border-color:transparent transparent transparent rgb(255, 51, 255);}.content .main-content .post .date{border-top:0.17vw dotted #696969;padding-top:1vw;color:#696969;margin:.2vw 0 1vw 0;}.content .main-content .post .title{border-bottom:0.17vw dotted #696969;padding-bottom:1vw;font-size:1.7vw;font-weight:700;}.content .main-content .post .body{margin-bottom:0;}.content .main-content .read-other-posts{color:#DEDEDF;text-align:center;margin-top:2vw;display:flex;align-items:center;}.content .main-content .read-other-posts #right-border{flex-grow:1;border-bottom:0.1vw solid #DEDEDF;margin-right:1vw;}.content .main-content .read-other-posts #left-border{flex-grow:1;border-bottom:0.1vw solid #DEDEDF;margin-left:1vw;}.content .main-content .next-post{color:#DEDEDF;text-align:center;margin-top:2vw;display:flex;justify-content:center;align-items:center;}.content .main-content .content-control{margin-bottom:1vw;display:flex;align-items:center;gap:0.3vw;}.content .main-content .post-header{text-decoration:none;overflow-wrap:break-word;border:none;padding-bottom:1vw;margin-bottom:0;}.content .main-content .post.red-border{border:.1vw solid rgb(255, 51, 255);}.content .main-content .mail{overflow:hidden;background-color:#080808;display:flex;box-sizing:border-box;border:.1vw solid #141414;border-radius:1vw;width:100%;height:5vw;}.content .main-content .mail button{padding:1vw;font-size:2vw;color:#DEDEDF;border:none;transition:color .3s ease;}.content .main-content .mail button:hover{color:#696969;}.content .main-content .mail textarea{border:none;padding:.7vw;font-size:.8vw;margin-top:0;resize:none;color:#DEDEDF;background-color:transparent;width:100%;height:100%;}.content .main-content .mail form{width:100%;display:flex;}.content .main-content .footer{color:#696969;text-align:center;margin-top:2vw;}.content .main-content .post-container{background-color:#080808;margin-bottom:1vw;padding:1vw;border:.1vw solid #141414;border-radius:1vw;}.content .main-content .pagination{margin-top:2vw;gap:5vw;display:flex;justify-content:center;align-items:center;}.content .main-content .page-name{box-sizing:border-box;width:100%;overflow-wrap:break-word;padding:1vw;font-size:1.7vw;border:.2vw solid #141414;border-radius:.5vw;margin:1vw 0 1vw 0;}.content .main-content .page-name .cursor{display:inline-block;animation:blink 2s step-end infinite;}.navbar{position:relative;width:48vw;gap:1vw;margin:1vw 25vw 0vw 25vw;display:flex;justify-content:center;align-items:center;}.navbar .button{position:relative;padding:.7vw;color:#696969;background-color:#080808;border:.1vw solid #141414;border-radius:.3vw;width:auto;height:auto;transition:color .3s ease;}.navbar .button:hover{color:#DEDEDF;}.navbar::before{content:'';position:absolute;top:50%;background-color:#141414;width:48vw;height:.1vw;}.logo{display:flex;width:48vw;gap:3vw;margin:2vw 25vw 0vw 25vw;}.logo .avatar{border-radius:1vw;opacity:60%;z-index:99999;transition:transform .3s ease;transform:scale(1.2) rotate(30deg);width:6vw;height:6vw;}.logo .avatar:hover{transform:rotate(-30deg);}.logo .site-name-and-status{display:flex;flex-direction:column;}.logo .site-name-and-status .site-name{font-family:Ubuntu Mono, "Courier New", Courier, monospace;font-weight:bold;font-size:3vw;}.logo .last-track{position:relative;box-sizing:border-box;background-color:#080808;padding:.5vw;gap:.5vw;border:.1vw solid rgb(255, 51, 255);border-radius:1vw;width:17vw;height:6vw;display:flex;justify-content:flex-start;align-items:center;}.logo .last-track img{box-sizing:border-box;border:.1vw solid #141414;border-radius:1vw;width:5vw;height:5vw;}.logo .last-track .overlay-image{background-color:rgba(0, 0, 0, 0.5);display:none;position:absolute;box-sizing:border-box;pointer-events:none;width:5vw;height:5vw;}.logo .last-track .descr{font-size:.8vw;gap:.1vw;margin-bottom:auto;max-height:100%;overflow-y:scroll;scrollbar-width:none;display:flex;flex-direction:column;}.logo .last-track .descr #subdescr{color:#696969;}