用户:晨茗biu/Sandbox-SaturnForum.css:修订间差异
来自Limbo Wiki Mirror
< 用户:晨茗biu
无编辑摘要 标签:(旧)WikiEditor |
无编辑摘要 标签:(旧)WikiEditor |
||
| (未显示同一用户的3个中间版本) | |||
| 第1行: | 第1行: | ||
.SaturnForum-Maincontainer { | |||
display: grid; | display: grid; | ||
width: 95%; | width: 95%; | ||
| 第189行: | 第17行: | ||
margin: 0 auto; | margin: 0 auto; | ||
} | } | ||
.SaturnForum- | .SaturnForum-logo { | ||
grid-area: logo; | grid-area: logo; | ||
justify-self: center; | justify-self: center; | ||
align-self: center; | align-self: center; | ||
} | } | ||
.SaturnForum-line- | .SaturnForum-line-top { | ||
grid-area: line-top; | grid-area: line-top; | ||
background-color: rgba(98,98,98,255); | background-color: rgba(98,98,98,255); | ||
} | } | ||
.SaturnForum-line- | .SaturnForum-line-bottom { | ||
grid-area: line-bottom; | grid-area: line-bottom; | ||
background-color: rgba(98,98,98,255); | background-color: rgba(98,98,98,255); | ||
| 第205行: | 第33行: | ||
grid-area: line-left-top; | grid-area: line-left-top; | ||
background-color: rgba(98,98,98,255); | background-color: rgba(98,98,98,255); | ||
} | } | ||
.SaturnForum-line-left-center { | .SaturnForum-line-left-center { | ||
| 第215行: | 第42行: | ||
background-color: rgba(98,98,98,255); | background-color: rgba(98,98,98,255); | ||
} | } | ||
.SaturnForum- | .SaturnForum-portrait { | ||
grid-area: portrait; | grid-area: portrait; | ||
background-color: rgba(98,92,93,255); | background-color: rgba(98,92,93,255); | ||
height: 60px; | height: 60px; | ||
width: 60px; | width: 60px; | ||
justify-self:center; | justify-self: center; | ||
align-self:center; | align-self: center; | ||
} | } | ||
.SaturnForum- | .SaturnForum-user { | ||
grid-area:user; | grid-area: user; | ||
justify-self:center; | justify-self: center; | ||
height: auto; | height: auto; | ||
text-align: center; | text-align: center; | ||
| 第232行: | 第59行: | ||
cursor: pointer; | cursor: pointer; | ||
word-break: break-all; | word-break: break-all; | ||
margin-left:15px; | margin-left: 15px; | ||
margin-right:15px; | margin-right: 15px; | ||
} | } | ||
.SaturnForum- | .SaturnForum-user:hover { | ||
color: #3498db; | color: #3498db; | ||
text-decoration: underline; | text-decoration: underline; | ||
} | } | ||
.SaturnForum- | .SaturnForum-time { | ||
grid-area: time; | grid-area: time; | ||
align-self: center; | align-self: center; | ||
| 第249行: | 第76行: | ||
word-break: break-all; | word-break: break-all; | ||
} | } | ||
.SaturnForum- | .SaturnForum-floor { | ||
grid-area: floor; | grid-area: floor; | ||
align-self: center; | align-self: center; | ||
| 第258行: | 第85行: | ||
word-break: break-all; | word-break: break-all; | ||
} | } | ||
.SaturnForum- | .SaturnForum-text { | ||
grid-area: text; | grid-area: text; | ||
font-size: 0.95rem; | font-size: 0.95rem; | ||
| 第269行: | 第96行: | ||
display: grid; | display: grid; | ||
grid-area: reaction; | grid-area: reaction; | ||
justify-self:stretch; | justify-self: stretch; | ||
align-self:stretch; | align-self: stretch; | ||
width:100%; | width: 100%; | ||
height:100%; | height: 100%; | ||
grid-template-columns:50px 20px 1fr; | grid-template-columns: 50px 20px 1fr; | ||
grid-template-areas: | grid-template-areas: | ||
"refence ping report"; | "refence ping report"; | ||
} | } | ||
.SaturnForum- | .SaturnForum-refence { | ||
grid-area: refence; | grid-area: refence; | ||
justify-self: center; | justify-self: center; | ||
| 第294行: | 第121行: | ||
} | } | ||
.SaturnForum- | .SaturnForum-ping { | ||
grid-area: ping; | grid-area: ping; | ||
justify-self: center; | justify-self: center; | ||
| 第311行: | 第138行: | ||
} | } | ||
.SaturnForum- | .SaturnForum-report { | ||
grid-area: report; | grid-area: report; | ||
justify-self: right; | justify-self: right; | ||
align-self: center; | align-self: center; | ||
text-align: center; | text-align: center; | ||
margin:10px; | margin: 10px; | ||
font-size: 0.85rem; | font-size: 0.85rem; | ||
color: #3498db; | color: #3498db; | ||
| 第327行: | 第154行: | ||
text-decoration: underline; | text-decoration: underline; | ||
} | } | ||
@media(max-width: 400px) { | |||
.SaturnForum-Maincontainer { | |||
grid-template-columns: 100px 1fr; | |||
grid-template-rows: 40px 2px 80px minmax(30px,auto) 2px minmax(150px,auto) 2px minmax(40px,auto); | |||
grid-template-areas: | |||
"logo logo" | |||
"line-left-top line-left-top" | |||
"portrait time" | |||
"user floor" | |||
"line-top line-top" | |||
"text text" | |||
"line-bottom line-bottom" | |||
"reaction reaction" | |||
} | |||
.SaturnForum-time { | |||
justify-self: end; | |||
text-align: right; | |||
margin-right: 10px; | |||
} | |||
} | |||
2026年2月1日 (日) 03:08的最新版本
.SaturnForum-Maincontainer {
display: grid;
width: 95%;
min-width: 200px;
max-width: 1100px;
min-height: 300px;
grid-template-columns: 100px 2px 1fr 1fr;
grid-template-rows: minmax(40px,auto) 2px 80px minmax(136px,auto) 2px minmax(40px,auto);
grid-template-areas:
"logo line-left-top time floor"
"line-top line-top line-top line-top"
"portrait line-left-center text text"
"user line-left-center text text"
"line-bottom line-bottom line-bottom line-bottom"
". line-left-bottom reaction reaction";
background-color: #f0f0f0;
margin: 0 auto;
}
.SaturnForum-logo {
grid-area: logo;
justify-self: center;
align-self: center;
}
.SaturnForum-line-top {
grid-area: line-top;
background-color: rgba(98,98,98,255);
}
.SaturnForum-line-bottom {
grid-area: line-bottom;
background-color: rgba(98,98,98,255);
}
.SaturnForum-line-left-top {
grid-area: line-left-top;
background-color: rgba(98,98,98,255);
}
.SaturnForum-line-left-center {
grid-area: line-left-center;
background-color: rgba(98,98,98,255);
}
.SaturnForum-line-left-bottom {
grid-area: line-left-bottom;
background-color: rgba(98,98,98,255);
}
.SaturnForum-portrait {
grid-area: portrait;
background-color: rgba(98,92,93,255);
height: 60px;
width: 60px;
justify-self: center;
align-self: center;
}
.SaturnForum-user {
grid-area: user;
justify-self: center;
height: auto;
text-align: center;
text-decoration: none;
transition: all 0.1s ease;
cursor: pointer;
word-break: break-all;
margin-left: 15px;
margin-right: 15px;
}
.SaturnForum-user:hover {
color: #3498db;
text-decoration: underline;
}
.SaturnForum-time {
grid-area: time;
align-self: center;
justify-self: start;
text-align: left;
margin-left: 10px;
font-size: 0.85rem;
word-break: break-all;
}
.SaturnForum-floor {
grid-area: floor;
align-self: center;
justify-self: end;
text-align: right;
margin-right: 10px;
font-size: 0.85rem;
word-break: break-all;
}
.SaturnForum-text {
grid-area: text;
font-size: 0.95rem;
word-break: break-all;
overflow: auto;
margin: 5px;
line-height: 1.35;
}
.SaturnForum-reaction {
display: grid;
grid-area: reaction;
justify-self: stretch;
align-self: stretch;
width: 100%;
height: 100%;
grid-template-columns: 50px 20px 1fr;
grid-template-areas:
"refence ping report";
}
.SaturnForum-refence {
grid-area: refence;
justify-self: center;
align-self: center;
text-align: center;
margin: 10px;
font-size: 0.85rem;
color: #3498db;
transition: all 0.3s ease;
cursor: pointer;
}
.SaturnForum-refence:hover {
color: #e74c3c;
text-decoration: underline;
}
.SaturnForum-ping {
grid-area: ping;
justify-self: center;
align-self: center;
text-align: center;
margin: 10px;
font-size: 0.85rem;
color: #3498db;
transition: all 0.3s ease;
cursor: pointer;
}
.SaturnForum-ping:hover {
color: #e74c3c;
text-decoration: underline;
}
.SaturnForum-report {
grid-area: report;
justify-self: right;
align-self: center;
text-align: center;
margin: 10px;
font-size: 0.85rem;
color: #3498db;
transition: all 0.3s ease;
cursor: pointer;
}
.SaturnForum-report:hover {
color: #e74c3c;
text-decoration: underline;
}
@media(max-width: 400px) {
.SaturnForum-Maincontainer {
grid-template-columns: 100px 1fr;
grid-template-rows: 40px 2px 80px minmax(30px,auto) 2px minmax(150px,auto) 2px minmax(40px,auto);
grid-template-areas:
"logo logo"
"line-left-top line-left-top"
"portrait time"
"user floor"
"line-top line-top"
"text text"
"line-bottom line-bottom"
"reaction reaction"
}
.SaturnForum-time {
justify-self: end;
text-align: right;
margin-right: 10px;
}
}
