status.cafe Cozy by skykristal

status.cafe Cozy screenshot
Homepage Install Get Stylus Write a review

Details

Authorskykristal

LicenseNo License

Created

Updated

Categoryuserstyles

Statistics

Learn how we calculate statistics in the FAQ.

Total views

Total installs

Weekly installs

Description

Chill blue theme for status.cafe.
Affects the homepage, settings, and edit status pages.
Does not affect other people's profiles.

06.06 added the forum too!

Notes

Userstyle doesn't have notes.

History

Daily snapshots of style statistics.

No style history. Come back in a couple of days.

Source code

/* ==UserStyle==
@name         status.cafe Cozy
@version      20220915.20.04
@namespace    userstyles.world/user/skykristal
@description  Chill blue theme for status.cafe.
Affects the homepage, settings, and edit status pages.
Does not affect other people's profiles.
--
06.06  added the forum too!
@author       skykristal
@license      No License
==/UserStyle== */

/* ==UserStyle==
@name         status.cafe Cozy
@version      20220711.06.21
@namespace    userstyles.world/user/skykristal
@description  Chill blue theme for status.cafe.
Affects the homepage, settings, and edit status pages.
Does not affect other people's profiles.
--
Might include the forum as well in the future.
@author       skykristal
@license      No License
==/UserStyle== */

@-moz-document url("https://status.cafe/"), url("https://status.cafe/settings"), url("https://status.cafe/manage"), url("https://status.cafe/login"), url-prefix("https://status.cafe/edit"), url-prefix("https://status.cafe/register"), url-prefix("https://forum.status.cafe/") {
@import url('https://fonts.googleapis.com/css2?family=Jura:wght@300&display=swap');

body {
    background-image: url(https://skykristal.art/images/SVG/wavesniche.svg);
    background-size: cover;
    background-attachment: fixed;
    background-position: bottom;
    color: #c8d6de;
   font-family: 'Jura', sans-serif;
    background-color: #0a192f;
    font-size: .9em;
    max-width: 1200px;
}

input,
textarea,
input#name,
input#password {
    border: 0px;
    border-radius: 20px;
    padding: 5px;
       background: rgb(10 37 60 / 33%);
    color: #73afc1;
    outline: 0!important;
    backdrop-filter:blur(10px);
}



input[type="radio"] {
    appearance: none;
    background-color: #131736;
    margin: 0px;
    font: inherit;
    color: currentColor;
    border: 0 solid currentColor;
    border-radius: 50%;
    transform: translateY(-0.075em);
    display: grid;
    place-content: center;
}

input[type="radio"]::before {
    content: "";
    width: 0.85em;
    height: 0.85em;
    border-radius: 50%;
    transform: scale(0);
    transition: 120ms transform ease-in-out;
    background: #00ffe1;
    box-shadow: 0 0 10px #0bf, 0 0 10px #0bf;
}

input[type="radio"]:checked::before {
    transform: scale(1);
}

input[type="radio"]:focus {
    outline: max(2px, 0.15em) solid currentColor;
    outline-offset: max(2px, 0.15em);
}

label {

    font-size: 20px;
    margin: -3px;
}


p > img {
    margin-left: auto;
    margin-right: auto;
    display: block;
}

textarea {
    min-height: 120px;
}

tbody, .forum {
    background-color: rgb(0 0 0 / 29%);
}

table, th, td {
    border: 0px;
}

tr, td, th {
    border: 0px;
    padding: 2em;
        text-align: left;
}

.signature {
    border-top: 0px;
    background:rgba(0, 0, 0, .34);
    padding:10px;
    border-radius:20px;
}

hr{
    background:#00ffff12;
}

.status-content {
    line-break: anywhere;
}

.topic > tbody > tr:nth-child(2n) {
    background-color: rgba(0, 0, 0, .33);
}

nav.breadcrumb {
    padding: 1em;
    border: 0px;
    margin: 1em 0;
}

thead {
    background-color: #112132;
    color: white;
}

.radio + .radio {
    margin-top: 1em;
}



::placeholder {
    color: #ffffff47;
    text-align: center;
}

h1,
h2,
h3,
h4,
h5,
dt.about,
dt.homepage {
    text-transform: uppercase;
    font-size: 2rem!important;
    line-height: 40px;
    margin-top: 40px;
}

.cols > section:nth-child(1) {
    background: rgb(18 60 84 / 49%);
    padding: 10px;
    border-radius: 20px;
    margin-top: 25px;
    height:fit-content;
    
}

.cols > section:nth-child(2) {
    background: rgb(18 60 84 / 49%);
    border-radius: 20px;
    margin-top: 25px;
    overflow: auto;
}


h2:first-of-type {
    text-align: center;
    font-size: 4em;
}



section:last-child > p:last-of-type {
    text-align: center;
}

dt.about,
dt.homepage {
    margin-bottom: 20px;
}

section:first-child > p:first-of-type {

    bottom: 0;
    right: 0;
    padding: 1em;
    font-size: 10px;
}


hr {
    border-color: rgb(20 130 255 / 36%);
    border-top: 0px;
    border-left: 0px;
    border-right: 0px;
    border-width: 1px;
}

.flash {
    background-color: #294f29;
    padding: 0.5em 1em;
    color: #54c854;
    margin: 1.3em;
    border-radius: 20px;
}


.status {
    transform: scale(1);
    transition: 0.5s;
}

.status:hover {
    transition: 0.5s;
    background: rgba(0, 0, 0, 0.8);
}

.status-username > a {
    color: white;
    text-shadow: none;
}

a {
    text-decoration: none;
    color: #5fbbec;
    word-break: break-word;
}

a:hover {
    color: #fdfdfd;
}

main,
header {

    padding: 30px;
    border-radius: 20px;
    margin: 3% auto;
    position: relative;
}

cols {
    justify-items: center;
}

section:nth-child(2) {
    text-align: center;
}

about {
    text-align: left;
}

nav > a {
    margin: 8px;
    font-size:18px;
}

nav {
    text-align: center;
}

nav > a:nth-child(2) {
    color: #00ed83;
}

nav > a:nth-child(3) {
    color: #edeb00;
}

nav > a:nth-child(4) {
    color: #ed0000;
}

nav > a:nth-child(5) {
    color: #ed00d7;
}

dd {
    margin-bottom: 2em;
    margin-left: 0px;
}

section:last-child {
    height: auto;
    overflow: visible;
}

section > p {
    text-align: left;
}


.status {
    margin-bottom: 1em;
    background-color: rgba(0, 0, 0, 0.2);
    display: inline-table;
    border-radius: 20px;
    padding: 1rem;
    width: 200px;
    height: 160px;
    margin-left: 0px;
    margin-right: 0px;
    text-align: left;
}



/* width */
::-webkit-scrollbar {
    width: 7px;
}

/* Track */
::-webkit-scrollbar-track {
    border-radius: 0px;
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: #314279;
    border-radius: 20px;
}


::-webkit-scrollbar-track-piece {
    background: #0a192e;
    border: 0px solid #0e3154;
    border-radius: 10px;
}

::-webkit-scrollbar-corner {
    border-radius: 0px;
}

::selection {
    background: #63F4F6;
    color: black;
}

@media screen and (max-width: 600px) {
    .profile-picture {
        transform: translateX(20%) translateY(-4%);
    }
}
}

Reviews

No reviews yet.