Browse Source

新增主题,并迁移部分自定义css到主题

pull/4/head
欧醚 1 year ago
parent
commit
c4ff322c3a
9 changed files with 385 additions and 0 deletions
  1. +4
    -0
      app/javascript/styles/application.scss
  2. +37
    -0
      app/javascript/styles/closed-social/global.scss
  3. +20
    -0
      app/javascript/styles/closed-social/timeline_comments.scss
  4. +65
    -0
      app/javascript/styles/closed-social/tree.scss
  5. +3
    -0
      app/javascript/styles/thu.scss
  6. +247
    -0
      app/javascript/styles/thu/diff.scss
  7. +7
    -0
      app/javascript/styles/thu/variables.scss
  8. +1
    -0
      config/locales/zh-CN.yml
  9. +1
    -0
      config/themes.yml

+ 4
- 0
app/javascript/styles/application.scss View File

@ -26,3 +26,7 @@
@import 'mastodon/dashboard';
@import 'mastodon/rtl';
@import 'mastodon/accessibility';
@import 'closed-social/tree';
@import 'closed-social/timeline_comments';
@import 'closed-social/global';

+ 37
- 0
app/javascript/styles/closed-social/global.scss View File

@ -0,0 +1,37 @@
.column {
flex: 1 0 auto;
}
.pinned-info {
opacity: 0.85;
}
.tabs-bar__wrapper {
-webkit-mask-image: linear-gradient(#1a1a1a 55%,transparent);
mask-image: linear-gradient(#1a1a1a 55%,transparent);
}
div {
&.status__info {
& > a {
&.status__display-name {
display: inline-block;
}
}
}
}
.gifv {
& > video {
width: 100%;
max-height: 100%;
}
}
.columns-area--mobile {
.getting-started__trends {
display: block;
.trends__item {
display: flex;
}
}
}

+ 20
- 0
app/javascript/styles/closed-social/timeline_comments.scss View File

@ -0,0 +1,20 @@
.comments_timeline {
max-height: 160px;
overflow: hidden;
-webkit-mask-image: linear-gradient(#1a1a1a,transparent);
mask-image: linear-gradient(#1a1a1a,transparent);
transform: scale(0.85);
transform-origin: 80% 0%;
padding-bottom: -32px;
&:hover {
max-height: none;
-webkit-mask-image: none;
mask-image: none;
}
&:active {
max-height: none;
-webkit-mask-image: none;
mask-image: none;
}
}

+ 65
- 0
app/javascript/styles/closed-social/tree.scss View File

@ -0,0 +1,65 @@
div.tree-ance {
.account__avatar {
display: none;
}
.display-name {
display: none;
}
}
.tree {
a.status__display-name {
>span {
>bdi {
>strong {
animation: none;
}
}
}
}
a {
>div {
>div.account__avatar {
animation: none;
}
}
}
}
.tree-ance {
background: linear-gradient(-15deg, #282C3710,90%, #197171, 95%, #0DA454);
>div.status {
padding-left: 18px;
>div.deep__number {
text-align: left;
}
}
}
.tree-desc {
background: linear-gradient(15deg, #282C3710,90%, #197171, 95%, #0da454);
>div.status {
>div.deep__number {
text-align: right;
}
}
}
svg.tree-svg {
.node {
circle {
fill: #F3F3FF;
stroke: #2593B8;
stroke-width: 1.5px;
}
text {
font-size: 11px;
background-color: #444;
fill: #F4F4F4;
text-shadow: 0 1px 4px black;
}
cursor: pointer;
}
path.link {
fill: none;
stroke: #2593B8;
stroke-width: 1.5px;
}
}

+ 3
- 0
app/javascript/styles/thu.scss View File

@ -0,0 +1,3 @@
@import 'thu/variables';
@import 'application';
@import 'thu/diff';

+ 247
- 0
app/javascript/styles/thu/diff.scss View File

@ -0,0 +1,247 @@
/* 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;
}
body.app-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;
}
body.about-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;
}
body.admin {
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;
}
.regeneration-indicator {
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;
}
.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);
}

+ 7
- 0
app/javascript/styles/thu/variables.scss View File

@ -0,0 +1,7 @@
// Dependent colors
$classic-base-color: rgba(40,44,55,0.7);
// Differences
$ui-base-color: $classic-base-color !default;

+ 1
- 0
config/locales/zh-CN.yml View File

@ -1008,6 +1008,7 @@ zh-CN:
contrast: Mastodon(高对比度)
default: Mastodon(暗色主题)
mastodon-light: Mastodon(亮色主题)
thu: closed.social(清华紫)
time:
formats:
default: "%Y年%-m月%d日 %H:%M"

+ 1
- 0
config/themes.yml View File

@ -1,3 +1,4 @@
default: styles/application.scss
contrast: styles/contrast.scss
mastodon-light: styles/mastodon-light.scss
thu: styles/thu.scss

Loading…
Cancel
Save