重构基本框架

This commit is contained in:
lutinglt
2025-06-23 01:28:13 +08:00
parent 36a1707b3e
commit 55ac3af9b7
56 changed files with 7053 additions and 422 deletions

138
styles/public/button.scss Normal file
View File

@@ -0,0 +1,138 @@
// Made by Luting ^-^
.ui.button {
min-height: 30px;
font-weight: 500;
padding: 9px 16px;
}
.ui.primary.button {
background-color: #238636;
&:hover {
background-color: #29903b;
}
}
.ui.basic.button {
color: #f0f6fc;
}
.ui.basic.button:hover,
.ui.labeled.button > .label:hover {
color: #f0f6fc;
background: #262c36;
border-color: var(--color-light-border);
}
.ui.red.button,
.ui.basic.red.buttons .button,
.ui.basic.red.button {
color: #fa5e55;
background-color: var(--color-button);
border-color: var(--color-light-border);
&:hover {
color: #fff;
background-color: #b62324;
border-color: #ffffff1a;
}
}
.ui.button.branch-dropdown-button {
padding: 3px 12px;
min-height: 30px;
}
.ui.menu button.item:hover {
color: var(--color-text);
background: var(--color-hover);
border-radius: 0;
}
// 设置界面
.user-main-content,
.repo-setting-content,
.user-setting-content,
.org-setting-content {
.ui.primary.button {
color: #f0f6fc;
background-color: var(--color-button);
border-color: var(--color-light-border);
&:hover {
background-color: #262c36;
}
}
}
%button-tiny-style {
color: #39d353;
background-color: var(--color-button);
border-color: var(--color-light-border);
&:hover {
color: #fff;
background-color: #29903b;
border-color: #ffffff1a;
}
}
.user-main-content,
.repo-setting-content,
.user-setting-content,
.org-setting-content {
.ui.primary.button.tiny {
@extend %button-tiny-style;
}
}
.admin-setting-content .ui.primary.button {
@extend %button-tiny-style;
}
.user-main-content,
.repo-setting-content,
.user-setting-content,
.org-setting-content,
.admin-setting-content {
.ui.right {
.ui.primary.button.tiny {
color: #fff;
background-color: #238636;
&:hover {
background-color: #29903b;
border-color: var(--color-light-border);
}
}
}
}
// 工单侧边栏
.ui.fluid.ui.button,
.ui.button.branch-dropdown-button,
.ui.ui.icon.button,
.ui.two.wide.button {
background-color: var(--color-button);
&:hover {
color: #fff;
background-color: #262c36;
}
}
// 关闭工单按钮
.ui.red.basic.button#status-button {
color: #ab7df8;
border-color: var(--color-light-border);
background-color: var(--color-button);
&:hover {
color: #fff;
border-color: #ffffff1a;
background-color: var(--color-purple);
}
}
// 重新开启按钮
.ui.basic.primary.button#status-button {
color: #39d353;
background-color: var(--color-button);
border-color: var(--color-light-border);
&:hover {
color: #44ff61;
background: var(--color-hover);
}
}

274
styles/public/chroma.scss Normal file
View File

@@ -0,0 +1,274 @@
// Made by Rainnny <3
.chroma {
background-color: var(--color-code-bg);
.lntd {
vertical-align: top;
border: 0;
margin: 0;
padding: 0;
}
.lntable {
border-spacing: 0;
border: 0;
width: auto;
margin: 0;
padding: 0;
display: block;
overflow: auto;
}
.hl {
width: 100%;
display: block;
}
.lnt,
.ln {
margin-right: 0.4em;
padding: 0 0.4em;
}
.gs {
font-weight: var(--font-weight-semibold);
}
.gl {
text-decoration: underline;
}
.bp {
color: #fabd2f;
}
.c,
.c1,
.ch,
.cm {
color: #777e94;
}
.cp {
color: #8ec07c;
}
.cpf {
color: #79c0ff;
}
.cs {
color: #9075cd;
}
.dl {
color: #79c0ff;
}
.gd {
color: #fff;
background-color: #5f3737;
}
.ge {
color: #ddee30;
}
.gh {
color: #ffaa10;
}
.gi {
color: #fff;
background-color: #3a523a;
}
.go {
color: #777e94;
}
.gp {
color: #ebdbb2;
}
.gr {
color: #f43;
}
.gs {
color: #ebdbb2;
}
.gt {
color: #7ee787;
}
.gu {
color: #a5d6ff;
}
.il {
color: #79c0ff;
}
.k {
color: #ff7b72;
}
.kc {
color: #79c0ff;
}
.kd {
color: #ff7b72;
}
.kn {
color: #ff7b72;
}
.kp {
color: #5f8700;
}
.kr {
color: #7ee787;
}
.kt {
color: #ff7b72;
}
.m,
.mb,
.mf,
.mh,
.mi,
.mo {
color: #79c0ff;
}
.n {
color: #c9d1d9;
}
.na {
color: #d2a8ff;
}
.nb {
color: #a5d6ff;
}
.nc {
color: #e6edf3;
}
.nd {
color: #79c0ff;
}
.ne {
color: #7ee787;
}
.nf,
.ni {
color: #d2a8ff;
}
.nl {
color: #7ee787;
}
.nn {
color: #e6edf3;
}
.no {
color: #79c0ff;
}
.nt {
color: #7ee787;
}
.nv {
color: #ebdbb2;
}
.nx {
color: #b6bac5;
}
.o {
color: #7ee787;
}
.ow {
color: #5f8700;
}
.p {
color: #d2d4db;
}
.s,
.s1,
.s2 {
color: #a5d6ff;
}
.sa {
color: #79c0ff;
}
.sb {
color: #a5d6ff;
}
.sc {
color: #79c0ff;
}
.sd {
color: #777e94;
}
.se {
color: #7ee787;
}
.sh {
color: #79c0ff;
}
.si {
color: #ffaa10;
}
.sr {
color: #9075cd;
}
.ss {
color: #7ee787;
}
.sx {
color: #ffaa10;
}
.vc {
color: #7ee787;
}
.vg,
.vi {
color: #ffaa10;
}
.w {
color: #7f8699;
}
}

View File

@@ -0,0 +1,86 @@
// Made by Rainnny <3
.CodeMirror.cm-s-default,
.CodeMirror.cm-s-paper {
.cm-property {
color: #a0cc75;
}
.cm-header {
color: #9daccc;
}
.cm-quote {
color: #090;
}
.cm-keyword {
color: #cc8a61;
}
.cm-atom {
color: #ef5e77;
}
.cm-number {
color: #ff5656;
}
.cm-def {
color: #e4e4e4;
}
.cm-variable-2 {
color: #00bdbf;
}
.cm-variable-3 {
color: #085;
}
.cm-comment {
color: #8e9ab3;
}
.cm-string {
color: #a77272;
}
.cm-string-2 {
color: #f50;
}
.cm-meta,
.cm-qualifier {
color: #ffb176;
}
.cm-builtin {
color: #b7c951;
}
.cm-bracket {
color: #997;
}
.cm-tag {
color: #f1d273;
}
.cm-attribute {
color: #bfcc70;
}
.cm-hr {
color: #999;
}
.cm-url {
color: #c5cfd0;
}
.cm-link {
color: #d8c792;
}
.cm-error {
color: #dbdbeb;
}
}

222
styles/public/dropdown.scss Normal file
View File

@@ -0,0 +1,222 @@
// Made by Luting ^-^
// 下拉菜单动画
@keyframes overlay-appear {
0% {
opacity: 0;
transform: translateY(-12px);
}
35% {
transform: translateY(-2px);
}
100% {
opacity: 1;
transform: translateY(0);
}
}
// clone 下拉菜单
.tippy-box {
margin-top: -3px;
background: var(--color-box-header);
border-radius: 12px;
overflow: hidden;
box-shadow:
0px 0px 0px 0.5px #30363d,
0px 6px 12px -3px rgba(1, 4, 9, 0.4),
0px 6px 18px 0px rgba(1, 4, 9, 0.4);
animation: 200ms cubic-bezier(0.33, 1, 0.68, 1) 0s 1 normal none running overlay-appear;
.clone-panel-field {
margin-top: 16px;
}
.flex-text-block.clone-panel-field {
color: #fff;
font-weight: bold;
margin-left: 16px;
}
.clone-panel-tab {
margin-left: 16px;
button {
color: #f0f6fc !important;
font-weight: 600;
padding: 6px 8px;
margin: 8px 0;
&:hover {
background: var(--color-hover);
border-radius: var(--border-radius);
}
&.active:after {
content: "";
display: block;
position: absolute;
bottom: -8px;
left: 0;
width: 100%;
height: 2px;
background: #f78166;
}
}
.item.active {
border-bottom: 0;
position: relative;
}
}
.flex-items-block {
margin: 0;
.item {
display: block;
padding: 8px 10px;
text-align: left;
text-transform: none;
line-height: 1em;
margin: 0;
svg {
margin-right: 0.5rem;
}
}
> .item:hover {
color: var(--color-text);
text-decoration: none;
background: var(--color-hover);
}
}
}
// 下拉菜单
.ui.dropdown .menu {
margin-top: 3.75px !important;
border-radius: 12px !important;
overflow: hidden auto;
box-shadow:
0px 0px 0px 0.5px #30363d,
0px 6px 12px -3px #01040966,
0px 6px 18px 0px #01040966;
animation: 200ms cubic-bezier(0.33, 1, 0.68, 1) 0s 1 normal none running overlay-appear;
> .item {
padding: 8px 10px !important;
}
}
.ui.dropdown .menu,
.branch-tag-item.active,
.ui.pointing.dropdown > .menu:not(.hidden):after {
background: var(--color-box-header) !important;
}
%item-style {
background: #1f6feb;
}
.ui.dropdown .menu > .item.context:hover {
@extend %item-style;
}
.user-main-content,
.repo-setting-content,
.user-setting-content,
.org-setting-content,
.admin-setting-content {
.ui.dropdown .menu > .item {
&:hover {
@extend %item-style;
a {
color: var(--color-text);
}
}
}
}
// 按钮菜单选项(主要为仓库)
.tippy-box .flex-items-block,
.ui.dropdown > .visible.menu .scrolling.menu,
.ui.button.dropdown .menu {
.item {
display: flex;
align-items: center;
border-radius: var(--border-radius);
margin: 0 8px;
&:first-of-type {
border-radius: var(--border-radius);
margin-top: 8px;
}
&:last-of-type {
border-radius: var(--border-radius);
margin-bottom: 8px;
}
}
}
// 下拉菜单分隔线
.ui.dropdown .menu > .divider {
border: 0;
height: 1px;
background-color: #3d444db3;
margin-top: calc(7px);
margin-bottom: 8px;
list-style: none;
}
.ui.dropdown.branch-selector-dropdown > .visible.menu {
// 仓库分支列表下查看操作按钮
> .item {
display: flex;
align-items: center;
border-radius: var(--border-radius);
margin: 8px;
padding: 6px 8px !important;
}
.scrolling.menu .item {
padding: 6px 16px !important;
// 分支菜单下划线
&:before {
content: " ";
display: block;
position: absolute;
width: 100%;
top: 0px;
left: 0px;
border-width: 1px 0px 0px;
border-style: solid;
border-image: initial;
border-color: #3d444db3;
}
&:first-of-type:before {
border-color: transparent;
}
&:hover {
&:before {
border-color: transparent;
}
+ :before {
border-color: transparent;
}
}
.ui.label {
margin-top: 1px;
margin-left: auto;
margin-right: 0;
}
}
}

23
styles/public/emoji.scss Normal file
View File

@@ -0,0 +1,23 @@
// Made by Luting ^-^
.emoji[aria-label="check\\ mark"],
.emoji[aria-label="currency\\ exchange"],
.emoji[aria-label="TOP\\ arrow"],
.emoji[aria-label="END\\ arrow"],
.emoji[aria-label="ON! arrow"],
.emoji[aria-label="SOON\\ arrow"],
.emoji[aria-label="heavy dollar sign"],
.emoji[aria-label="copyright"],
.emoji[aria-label="registered"],
.emoji[aria-label="trade\\ mark"],
.emoji[aria-label="multiply"],
.emoji[aria-label="plus"],
.emoji[aria-label="minus"],
.emoji[aria-label="divide"],
.emoji[aria-label="curly\\ loop"],
.emoji[aria-label="double curly loop"],
.emoji[aria-label="wavy\\ dash"],
.emoji[aria-label="paw\\ prints"],
.emoji[aria-label="musical\\ note"],
.emoji[aria-label="musical\\ notes"] {
filter: invert(100%) hue-rotate(180deg);
}

View File

@@ -0,0 +1,11 @@
// Made by Luting ^-^
.lines-num span:after {
color: var(--color-text);
}
.ui.cards > .card,
.ui.card {
> .extra a:not(.ui):hover {
color: var(--color-blue);
}
}

34
styles/public/input.scss Normal file
View File

@@ -0,0 +1,34 @@
// Made by Luting ^-^
input,
textarea,
.ui.input input,
.ui.form input:not([type]),
.ui.form select,
.ui.form textarea,
.ui.form input[type="date"],
.ui.form input[type="datetime-local"],
.ui.form input[type="email"],
.ui.form input[type="file"],
.ui.form input[type="number"],
.ui.form input[type="password"],
.ui.form input[type="search"],
.ui.form input[type="tel"],
.ui.form input[type="text"],
.ui.form input[type="time"],
.ui.form input[type="url"],
.ui.selection.dropdown {
background: unset;
&:hover {
background: unset;
}
&:focus,
&:focus-visible {
background: unset !important;
border-radius: var(--border-radius);
border-color: #1f6feb;
outline: none;
box-shadow: inset 0 0 0 1px #1f6feb;
}
}

154
styles/public/label.scss Normal file
View File

@@ -0,0 +1,154 @@
// Made by Luting ^-^
.repo-buttons .ui.basic.label {
color: #f0f6fc;
}
a.ui.basic.label:hover {
color: #f0f6fc;
background-color: #262c36;
border-color: var(--color-light-border);
}
span,
.org-visibility div {
&.ui.basic.label {
border-radius: 25px;
background-color: unset;
}
}
.badge.tw-bg-green,
.ui.green.label.issue-state-label {
background-color: #238636 !important;
}
.badge.tw-bg-red {
background-color: var(--color-purple) !important;
}
.ui.ui.ui {
&.purple.label {
border-radius: 25px !important;
}
&.green.label.issue-state-label {
background: var(--color-primary);
border-radius: 25px !important;
}
&.red.label.issue-state-label {
background: var(--color-purple);
border-radius: 25px !important;
}
&.primary.label {
color: var(--color-blue);
background-color: #388bfd33;
border: 1px solid var(--color-blue);
}
&.basic.primary.label {
color: var(--color-blue);
background-color: #388bfd33 !important;
border-color: #1f6feb !important;
}
// 发布&Runner 状态标签
&.green.label:not(.issue-state-label) {
background: unset;
border-color: #238636;
border-width: 1px;
border-style: solid;
border-radius: 25px;
color: #3fb950;
}
&.orange.label:not(.issue-state-label) {
background: unset;
border-color: #9e6a03;
border-width: 1px;
border-style: solid;
border-radius: 25px;
color: #d29922;
}
}
a.ui.ui.ui {
&.primary.label:hover {
color: #fff;
background: #1f6feb;
border-color: #1f6feb;
}
&.basic.primary.label:hover {
color: #79c0ff;
background-color: #3a83fd5c !important;
}
}
.issue-list .text.red {
color: #ab7df8 !important;
}
// Runner&软件包&提交 标签
.ui.label {
&.sha {
color: #919894;
background-color: var(--color-box-header);
&:hover {
background-color: var(--color-hover);
}
}
&:not(.basic, .sha, .commit-id-short, .commit-sign-badge) {
color: var(--color-blue);
background: #121d2f;
border-radius: 25px;
}
&.task-status-success {
color: var(--color-success-text);
border: 1px solid var(--color-success-border);
background: var(--color-success-bg);
}
&.task-status-failure {
color: var(--color-error-text);
border: 1px solid var(--color-error-border);
background: var(--color-error-bg);
}
&.task-status-running,
&.task-status-skipped {
color: var(--color-info-text);
border: 1px solid var(--color-info-border);
background: var(--color-info-bg);
}
&.task-status-cancelled,
&.task-status-blocked {
color: var(--color-warning-text);
border: 1px solid var(--color-warning-border);
background: var(--color-warning-bg);
}
> a {
opacity: 1;
}
}
a.ui.label:not(.basic, .sha, .commit-id-short, .commit-sign-badge):hover {
color: #fff;
background: #1f6feb;
border-radius: 25px;
}
.sha .ui.label.sha {
border: 0 !important;
}
.repository #commits-table .commit-list .sha .ui.label {
line-height: 18px;
margin-top: 0.375rem;
margin-bottom: 0.375rem;
margin-left: -2px;
}

45
styles/public/modal.scss Normal file
View File

@@ -0,0 +1,45 @@
// Made by Luting ^-^
.ui.modal {
border: 1.5px solid var(--color-light-border);
> .header {
background-color: var(--color-box-header);
border-bottom: 1.5px solid var(--color-light-border);
}
> .content,
form > .content {
background-color: var(--color-box-header);
}
> .actions,
.content + .actions,
.content + form > .actions {
background-color: var(--color-box-header);
border-top: 1.5px solid var(--color-light-border);
}
input,
textarea,
.ui.input input,
.ui.form input:not([type]),
.ui.form select,
.ui.form textarea,
.ui.form input[type="date"],
.ui.form input[type="datetime-local"],
.ui.form input[type="email"],
.ui.form input[type="file"],
.ui.form input[type="number"],
.ui.form input[type="password"],
.ui.form input[type="search"],
.ui.form input[type="tel"],
.ui.form input[type="text"],
.ui.form input[type="time"],
.ui.form input[type="url"],
.ui.selection.dropdown {
&:focus,
&:focus-visible {
background: #0d1117 !important;
}
}
}

98
styles/public/radius.scss Normal file
View File

@@ -0,0 +1,98 @@
.ui {
&.button,
&.basic.buttons .button,
&.basic.button,
&.dropdown .menu,
&.form input:not([type]),
&.form input[type="date"],
&.form input[type="datetime-local"],
&.form input[type="email"],
&.form input[type="number"],
&.form input[type="password"],
&.form input[type="search"],
&.form input[type="tel"],
&.form input[type="time"],
&.form input[type="text"],
&.form input[type="file"],
&.form input[type="url"],
&.form textarea,
&.input textarea,
&.ui.input > input,
&.label,
&.menu,
&.segment,
&.segments,
&.segments:not(.horizontal) > .segment:only-child,
&.secondary.menu .dropdown.item > .menu,
&.selection.dropdown,
&.selection.dropdown .menu,
&.table,
&.text.menu .dropdown.item > .menu {
border-radius: var(--border-radius);
}
.floating.dropdown > .menu {
border-radius: var(--border-radius) !important;
}
.repository.view.issue .comment-list .comment > .content > div:last-child {
border-bottom-right-radius: var(--border-radius);
border-bottom-left-radius: var(--border-radius);
}
}
/* 左边框圆角 */
.ui {
&.action.input > .dropdown:first-child,
&.action.input > .button:first-child,
&.action.input > .buttons:first-child > .button,
&.compact.menu:not(.secondary) .item:first-child,
&.horizontal.segments > .segment:first-child {
border-radius: var(--border-radius) 0 0 var(--border-radius);
}
}
/* 右边框圆角 */
.ui {
&.action.input > .dropdown:last-child,
&.action.input > .button:last-child,
&.action.input > .buttons:last-child > .button,
&.compact.menu:not(.secondary) .item:last-child,
&.horizontal.segments > .segment:last-child {
border-radius: 0 var(--border-radius) var(--border-radius) 0;
}
}
/* 上边框圆角 */
.ui.secondary.pointing.menu {
.active.item,
.item:hover {
border-radius: var(--border-radius) !important;
}
}
.ui.tabular.menu .active.item,
.repository.view.issue .comment-list .comment > .content > div:first-child {
border-top-left-radius: var(--border-radius) !important;
border-top-right-radius: var(--border-radius) !important;
}
/* 按钮边框圆角 */
.ui.active.selection.dropdown {
border-bottom-left-radius: var(--border-radius) !important;
border-bottom-right-radius: var(--border-radius) !important;
}
.ui.segment[class*="bottom attached"] {
border-radius: 0 0 var(--border-radius) var(--border-radius);
}
.ui.table > thead > tr:first-child > th {
&:first-child {
border-radius: var(--border-radius) 0 0;
}
&:last-child {
border-radius: 0 var(--border-radius) 0 0;
}
}

15
styles/public/svg.scss Normal file
View File

@@ -0,0 +1,15 @@
.text {
.purple {
color: #ab7df8 !important;
}
.green {
color: #3fb950 !important;
}
}
.svg {
&.octicon-issue-closed {
color: #ab7df8 !important;
}
}

View File

@@ -0,0 +1,45 @@
// Made by Luting ^-^
@keyframes overlay-appear {
0% {
opacity: 0;
transform: translateY(-12px);
}
100% {
opacity: 1;
transform: translateY(0);
}
}
#navbar .item,
.header-wrapper .ui.tabular.menu .item,
.job-step-summary,
.job-step-logs,
.job-brief-item,
.tippy-box .flex-items-block .item,
.clone-panel-tab .item,
.ui.form select,
.ui.label,
.ui.modal,
.ui.selection.dropdown,
.ui.checkbox label:before,
.ui.checkbox input:checked ~ label:before,
.ui.checkbox input:not([type="radio"]):indeterminate ~ label:before,
.ui.selection.active.dropdown,
.ui.selection.active.dropdown:hover,
.ui.selection.active.dropdown .menu,
.ui.selection.active.dropdown:hover .menu,
.ui.vertical.menu .header.item,
.ui.secondary.menu .item {
transition: 0.12s ease-out;
}
textarea,
.ui.form input,
.menu .item,
.ui.modal,
.job-step-summary,
.job-step-logs,
.job-brief-item {
animation: 200ms cubic-bezier(0.33, 1, 0.68, 1) 0s 1 normal none running overlay-appear;
}