mastodon/app/javascript/styles/thu/diff.scss

/* Fil */
/* Status */
@keyframes "spin" {
	from {
		transform: rotate(0deg);
	}
	to {
		transform: rotate(360deg);
	}
}
/* Drawer */
body {
	background: rgba(73, 58, 99, 1) url(https://www.tsinghua.edu.cn/publish/thu2018/images/footer.jpg) no-repeat fixed;
	background-size: cover;
	background-attachment: fixed;
  background-position: center;
  height: 100vh !important;
}
body.theme-thu {
	background: rgba(73, 58, 99, 1) url(https://www.tsinghua.edu.cn/publish/thu2018/images/footer.jpg) no-repeat fixed;
	background-size: cover;
	background-attachment: fixed;
  background-position: center;
  height: 100vh !important;
}
.ui {
	background: rgba(0, 0, 0, .4);
}
.column {
	>.scrollable {
		background: rgba(128, 112, 132, 0);
		border-radius: 0 0 0.25rem 0.25rem;
		color: rgba(240, 240, 240, 1);
	}
}
.column-back-button {
	background: rgba(240, 240, 240, 1);
	box-shadow: inset 0 5px 5px rgba(0, 0, 0, 0.05);
	border-bottom: 1px solid transparent;
	height: auto;
}
.column-header {
	background: rgba(73, 58, 99, 0.4);
	border-bottom: 1px solid #aaa;
	border-radius: 0.25rem 0.25rem 0 0;
}
.column-icon {
	background: transparent !important;
	color: rgba(255, 255, 255, .5);
}
.collapsable-collapsed {
	background: transparent !important;
	color: rgba(255, 255, 255, .5);
}
.column-header__button {
	background: transparent !important;
	color: rgba(255, 255, 255, .5);
}
.column-header__back-button {
	background: transparent !important;
	color: rgba(255, 255, 255, .5);
}
.column-link {
	background: rgba(40, 40, 40, 0);
	color: rgba(200, 200, 200, 1);
	box-shadow: inset 0 5px 5px rgba(0, 0, 0, 0.05);
	&:hover {
		background: rgba(102, 8, 116, 0.5);
		color: rgba(255, 255, 255, 1);
	}
}
.drawer__header {
	a {
		&:hover {
			background: rgba(66, 40, 72, 1);
		}
	}
	background: transparent;
}
.getting-started {
	p {
		color: rgba(102, 102, 102, 1);
	}
	background: rgb(52, 40, 62, 0.4);
}
.static-content {
	p {
		margin-bottom: 0.5rem;
	}
}
.drawer__inner__mastodon {
	display: none;
}
.column-subheading {
	background: rgba(255, 255, 255, 0.2);
	color: white;
}
.column-header__collapsible {
	>div {
		background: rgba(40, 60, 85, 0.6);
		border-bottom: 1px solid;
	}
}
.account__moved-note__message {
	color: rgba(255, 255, 255, 1);
}
.account__moved-note {
	.detailed-status__display-name {
		span {
			color: rgba(255, 255, 255, 1);
		}
		strong {
			color: rgba(255, 255, 255, 0.5) !important;
		}
	}
}
.reply-indicator__content {
	color: #DDD;
	a {
		color: rgba(37, 136, 208, 1);
	}
	.status__content__spoiler-link {
		background: rgba(49, 53, 67, 1);
		line-height: 1.2rem;
	}
}
.status__content {
	color: #DDD;
	a {
		color: rgba(37, 136, 208, 1);
	}
	.status__content__spoiler-link {
		background: rgba(49, 53, 67, 1);
		line-height: 1.2rem;
	}
}
.status__wrapper {
	border-top: 1px solid #ccc;
}
.focusable {
	&:focus {
		background: rgba(200, 222, 243, 0.5);
	}
}
.account__header {
	.icon-button {
		color: rgba(255, 255, 255, 1);
		color: rgba(255, 255, 255, 0.8);
		&:hover {
			color: rgba(255, 255, 255, 1);
		}
	}
	background: rgba(57, 48, 59, 0);
	>div {
		background: rgba(57, 48, 59, 0);
	}
}
.icon-button {
	color: rgba(255, 255, 255, 0.6);
}
.status__display-name {
	strong {
		color: rgba(240, 240, 240, 1);
	}
}
.account__display-name {
	strong {
		color: rgba(240, 240, 240, 1);
	}
}
.status__content__spoiler-link {
	span {
		color: rgba(255, 255, 255, 1);
	}
}
.account__action-bar {
	.icon-button {
		color: rgba(255, 255, 255, 0.8);
		&:hover {
			color: rgba(255, 255, 255, 1);
		}
	}
	background: rgba(255, 255, 255, 1);
	border-top: 1px solid rgba(255, 255, 255, 0.25);
	border-bottom: 1px solid rgba(255, 255, 255, 0.25);
}
.account__action-bar__tab {
	border-left: 1px solid rgba(255, 255, 255, 0.25);
}
.notification__message {
	a {
		&:hover {
			color: rgba(37, 136, 208, 1);
		}
	}
}
.detailed-status {
	background: rgba(200, 222, 243, .2);
	color: rgba(51, 51, 51, 1);
}
.detailed-status__display-name {
	color: rgba(255, 255, 255, 0.5);
	strong {
		color: rgba(255, 255, 255, 0.5);
	}
}
.detailed-status__meta {
	color: rgba(255, 255, 255, 0.5);
}
.detailed-status__action-bar {
	background: rgba(0, 0, 0, 0.05);
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	box-shadow: inset 0 5px 5px rgba(0, 0, 0, 0.05);
}
button.icon-button.active {
	i.fa-retweet {
		&:after {
			animation: spin 0.5s linear;
		}
	}
}
.drawer__inner {
	background: rgb(52, 40, 62, 0.7);
	border-radius: 0.25rem;
	height: auto;
	max-height: 100%;
	overflow-y: auto;
}
.getting-started__wrapper {
	background: rgb(52, 40, 62, 0.4);
}
.pinned-info {
	background: rgba(73, 58, 99, 0.7);
}

.tabs-bar__wrapper {
  background: rgba(23,25,31);
}