custom styling of the Elk browser for Mastodon; give space to images and provides a calmer experience

elk-mastodon-css.css

/* ==UserStyle==
@name           elk-mastodon-css
@version        2
@description    custom styling of the Elk browser for Mastodon; give space to images and provides a calmer experience
@author         Liam Collod
==/UserStyle== */

@-moz-document domain("elk.zone") {
:root{
    --c-bg-base: rgb(28, 28, 28);
}

@media (min-width: 1024px){
    .xl\:w-1\/4{
        width: 20%;
    }
    .lg\:max-w-80rem, [lg\:max-w-80rem=""]{
        max-width: 95rem;
    }
}
        
        
@media (min-width: 640px){
    .sm\:w-600px{
        width: 800px;
    }
    .sm\:max-w-600px {
	    max-width: 800px;
    }
}

main > aside:nth-child(1) {
    opacity: 0.2;
}

/*images in posts*/
.object-cover, [object-cover=""] {
    object-fit: contain;
}

/* separator line between posts */
article > div > div[h="1px"] {
    margin: 3rem;
}

article img.account-avatar {
    width: 24px;
    height: 24px;
}
article img.account-avatar[w-48px] {
    width: 30px;
    height: 30px;
}

/*profile names*/
article div > span > div > a:not([text-sm])[href*="@"] {
    background-color: var(--c-bg-btn-disabled);
    padding-top: 3px;
    padding-bottom: 3px;
    opacity: 0.5;
}
}