mastodon/app/javascript/styles/mastodon-material/theme/widgets.scss
Rintan ef16faf928 update material theme
add y-zu auto theme
2021-08-03 22:52:07 +09:00

167 lines
2.9 KiB
SCSS

.hero-widget {
@include shadow-2dp;
margin-bottom: 16px;
&__img {
border-radius: $card-radius $card-radius 0 0;
background: $card-bg-color;
img { border-radius: $card-radius $card-radius 0 0 }
}
&__text {
background: $card-bg-color;
padding: 16px;
color: $primary-text-color;
border-radius: 0 0 $card-radius $card-radius;
a { color: $link-text-color }
}
}
.endorsements-widget {
padding-bottom: 8px;
margin-bottom: 8px;
h4 {
padding: 12px 16px;
color: $section-text-color;
}
.account { padding: 8px 16px }
}
.trends-widget h4 { color: $section-text-color }
.placeholder-widget {
border-radius: 0;
border: none;
color: $tips-text-color;
margin-bottom: 16px;
}
.directory__tag {
margin-bottom: 16px;
&>a,
&>div {
@include shadow-2dp;
background: $card-bg-color;
border-radius: $card-radius;
padding: 16px;
&:active,
&:focus,
&:hover { background: $card-bg-color }
}
h4 {
color: $primary-text-color;
.fa { color: $icon-color }
small { color: $info-text-color }
}
}
.contact-widget {
color: $ui-text-color;
padding: 8px;
h4 {
color: $ui-text-color;
padding: 0 0 8px;
}
.account { padding: 8px 0 }
&>a {
padding: 8px 0;
color: $primary-text-color;
}
}
.box-widget {
@include shadow-2dp;
padding: 16px;
border-radius: $card-radius;
background: $card-bg-color;
}
.rich-formatting {
color: $ui-text-color;
h1, h2, h3, h4, h5, h6 { color: $primary-text-color }
a { color: $link-text-color }
li, p { color: $ui-text-color }
strong { color: $primary-text-color }
table {
border-radius: 4px;
border: 1px solid $border-color;
thead tr,
tbody tr {
color: $ui-text-color;
border-bottom: 1px solid $border-color;
}
}
}
.table-of-contents {
background: $bg-color;
border-radius: 0;
li {
ul {
padding-left: 16px;
border-bottom: 1px solid $border-color;
}
a {
padding: 16px;
color: $ui-text-color;
border-bottom: 1px solid $border-color;
}
}
}
.page-header {
background: $card-bg-color;
padding: 42px 16px;
margin: 16px 0;
h1 {
color: $primary-text-color;
margin-bottom: 8px;
}
p { color: $ui-text-color }
}
.memoriam-widget,
.page-header {
@include shadow-4dp;
border-radius: $card-radius;
}
.accounts-table {
tbody td { padding: 16px 8px }
.fa.active,
.fa.active.passive { color: $icon-color }
&__count {
color: $ui-text-color;
small { color: $secondary-text-color }
}
}
.statuses-grid .detailed-status {
@include shadow-1dp;
border-radius: $card-radius;
}