UserStyles/Mastodon/QuickTweak.css

313 lines
6.3 KiB
CSS

/* ==UserStyle==
@name Quick Tweak Mastodon
@namespace github.com/openstyles/stylus
@version 0.11.0
@author Clovis Gauzy
@license BSD-4-Clause
@preprocessor less
@updateURL https://dev.clov.fr/clov/UserStyles/src/branch/monster/Mastodon/QuickTweak.css
==/UserStyle== */
@-moz-document regexp(".*") {
/*
body {
}
body.with-modals--active {
margin-right: 1em;
}
body.error .dialog {
margin: 1.5em;
}
body.error .dialog h1 {
font-size: 1.75em;
line-height: 1.15
}
body.app-body.layout-multiple-columns {
width: auto;
height: auto;
top: 0;
bottom: 0;
left: 0;
right: 0;
overflow: hidden!important;
} */
#mastodon {
font-size: 1rem;
line-height: 1;
margin: 0;
padding: 0;
.ui {
overflow: auto;
overflow-x: hidden;
}
.columns-area {
display: flex;
flex-flow: row nowrap;
}
.column,
.drawer {
padding: 0!important;
width: auto;
margin: 0 1px;
}
.column {
flex: 1;
min-width: 21em;
}
.drawer {
flex: .75;
min-width: 16em;
max-width: 21em;
}
.container-alt {
width: 50em;
margin: 3em auto 0;
}
.column-header__buttons {
height: auto;
}
.notification__message,
.status__prepend,
.embed .status, .public-layout .status,
.status {
padding: .5em;
min-height: 0;
}
/*
.embed .status__avatar, .public-layout .status__avatar,
.status__avatar {
float: left;
position: relative;
left: 0;
top: 0;
height: 3.75em;
width: 3.75em;
background-size: cover
}
.account__avatar {
width: 1em;
height: 1em!important;
}
.embed .account__avatar-overlay, .public-layout .account__avatar-overlay,
.account__avatar-overlay {
height: 3.8em;
width: 3.8em;
}
.embed .account__avatar-overlay-base, .public-layout .account__avatar-overlay-base,
.account__avatar-overlay-base {
height: 3.2em;
width: 3.2em;
background-size: cover
}*/
.embed .account__avatar-overlay-base, .public-layout .account__avatar-overlay-base,
.account__avatar-overlay-overlay {
/*
z-index: 10;
top: -1.15em;
left: .33em;
height: 1.25em;
width: 1.25em;
background-size: cover;
right: .25em; */
opacity: .6;
/* border-radius: .33em!important; */
}
.muted .status__avatar {
opacity: 1;
}
.account__section-headline a, .account__section-headline button, .notification__filter-bar a, .notification__filter-bar button {
padding: .5em 0 .5em;
}
.reply-indicator__content, .status__content {
font-size: .9rem;
line-height: 1.25;
padding-top: .5em;
}
.account__section-headline a.active::after, .account__section-headline a.active::before, .account__section-headline button.active::after, .account__section-headline button.active::before, .notification__filter-bar a.active::after, .notification__filter-bar a.active::before, .notification__filter-bar button.active::after, .notification__filter-bar button.active::before {
border-width: 0 .4em .4em;
}
.media-gallery {
min-height: 3em;
height: auto!important;
border-radius: .33em;
}
.media-gallery__item-gifv-thumbnail {
top: 0;
transform: none;
}
.media-spoiler {
height: 6em!important;
}
.status__content__read-more-button {
text-align: center;
font-size: .9em;
width: 100%;
}
.status__wrapper, .status__wrapper--filtered {
font-size: 1em;
}
.status__wrapper--filtered {
padding: .5em
}
.drawer__header,
.search {
font-size: .9em;
margin-bottom: 0
}
.drawer__tab {
padding: .25em;
}
.search__input {
padding: .75em;
padding-right: 2.5em;
font-size: .9em;
}
.search__icon .fa {
top: .5em;
right: .5em;
font-size: 1.2em;
width: 1em;
height: 1em;
}
.navigation-bar {
padding: .5em;
}
.status__action-bar {
justify-content: flex-end;
}
.column-back-button,
.column-header {
font-size: .9em;
}
.column-back-button,
.column-header > button {
padding: .5em;
}
.column-header__button {
margin: 0;
padding: .25em .5em;
}
.status-card {
margin-top: 1.25em;
border-radius: .33em;
}
.status-card.compact .status-card__image {
flex-basis: 6em;
}
.reply-indicator__content, .status__content {
display: inline;
hyphens: auto;
}
.detailed-status, .detailed-status__action-bar {
background-color: inherit;
padding: .5em;
}
.reply-indicator__content .status__content__spoiler-link, .status__content .status__content__spoiler-link {
float: right;
}
.status__info {
margin-bottom: .5em;
}
.display-name__account {
display: block;
font-weight: 300;
font-size: .85em;
padding: .2em 0 .1em;
}
.reply-indicator__content p, .status__content p {
margin-bottom: .75em;
}
.account__header__image {
height: 12em
}
.account__header__fields dd, .account__header__fields dt {
padding: .5em
}
.media-gallery {
display: grid!important;
grid-template: auto / auto auto;
}
.media-gallery__item {
height: auto!important;
width: 100%!important;
min-height: 1em;
}
.media-gallery__item:only-of-type,
.media-gallery__item:nth-child(2):last-child {
grid-column: 1 / 3;
}
.poll__chart {
margin: 0 -.5em;
border-radius: 0 .33em .33em 0;
}
.public-layout .public-account-header__tabs__tabs .counter {
border: none!important;
}
.column-back-button--slim-button {
position: initial
}
.compose-form {
padding: .25rem;
}
.compose-form .autosuggest-textarea__textarea {
padding: .5em;
}
.compose-form .emoji-picker-dropdown {
top: -2em;
}
.compose-form__warning {
display: none;
}
.getting-started__footer {
font-size: .9em;
padding: 1em;
}
article, .drawer__pager, .notification-favourite, .notification-reblog, .status__wrapper-direct, .notification-follow, .notification-poll, .notification__filter-bar, .notification__filter-bar .active, .announcements, .column-header__collapsible-inner, .getting-started__footer, .search__input, .drawer__header, .drawer__header a:hover, .column-header, .load-more, [aria-label="Accueil"] .column-header {
border: none;
border-radius: 0!important;
}
}
.emoji-mart-scroll {
height: auto;
max-height: calc(100vh - 30em);
}
}