mirror of
https://github.com/go-gitea/gitea.git
synced 2025-06-01 20:45:54 +00:00
Clean up "file-view" related styles (#34558)
Move "file-view" and "code-view" related styles to their own file, remove unnecessary `!important`
This commit is contained in:
parent
4cb0c641ce
commit
c6e2093f42
@ -815,10 +815,6 @@ overflow-menu .ui.label {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.code-view .lines-num span::after {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.lines-type-marker {
|
||||
vertical-align: top;
|
||||
white-space: nowrap;
|
||||
@ -855,39 +851,13 @@ overflow-menu .ui.label {
|
||||
.lines-escape {
|
||||
width: 0;
|
||||
white-space: nowrap;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.lines-code {
|
||||
padding-left: 5px;
|
||||
}
|
||||
|
||||
.file-view tr.active {
|
||||
color: inherit !important;
|
||||
background: inherit !important;
|
||||
}
|
||||
|
||||
.file-view tr.active .lines-num,
|
||||
.file-view tr.active .lines-code {
|
||||
background: var(--color-highlight-bg) !important;
|
||||
}
|
||||
|
||||
.file-view tr.active:last-of-type .lines-code {
|
||||
border-bottom-right-radius: var(--border-radius);
|
||||
}
|
||||
|
||||
.file-view tr.active .lines-num {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.file-view tr.active .lines-num::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 0;
|
||||
width: 2px;
|
||||
height: 100%;
|
||||
background: var(--color-highlight-fg);
|
||||
}
|
||||
|
||||
.code-inner {
|
||||
font: 12px var(--fonts-monospace);
|
||||
white-space: pre-wrap;
|
||||
@ -938,12 +908,12 @@ overflow-menu .ui.label {
|
||||
margin-right: 4px;
|
||||
}
|
||||
|
||||
.top-line-blame {
|
||||
tr.top-line-blame {
|
||||
border-top: 1px solid var(--color-secondary);
|
||||
}
|
||||
|
||||
.code-view tr.top-line-blame:first-of-type {
|
||||
border-top: none;
|
||||
tr.top-line-blame:first-of-type {
|
||||
border-top: none; /* merge code lines belonging to the same commit into one block */
|
||||
}
|
||||
|
||||
.lines-code .bottom-line,
|
||||
@ -951,15 +921,6 @@ overflow-menu .ui.label {
|
||||
border-bottom: 1px solid var(--color-secondary);
|
||||
}
|
||||
|
||||
.code-view {
|
||||
background: var(--color-code-bg);
|
||||
border-radius: var(--border-radius);
|
||||
}
|
||||
|
||||
.code-view table {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.migrate .svg.gitea-git {
|
||||
color: var(--color-git);
|
||||
}
|
||||
|
@ -62,7 +62,7 @@
|
||||
@import "./repo/issue-label.css";
|
||||
@import "./repo/issue-list.css";
|
||||
@import "./repo/list-header.css";
|
||||
@import "./repo/linebutton.css";
|
||||
@import "./repo/file-view.css";
|
||||
@import "./repo/wiki.css";
|
||||
@import "./repo/header.css";
|
||||
@import "./repo/home.css";
|
||||
|
@ -309,10 +309,18 @@
|
||||
box-sizing: initial;
|
||||
}
|
||||
|
||||
.file-view.markup {
|
||||
padding: 1em 2em;
|
||||
}
|
||||
|
||||
.file-view.markup:has(.file-not-rendered-prompt) {
|
||||
padding: 0; /* let the file-not-rendered-prompt layout itself */
|
||||
}
|
||||
|
||||
/* this background ensures images can break <hr>. We can only do this on
|
||||
cases where the background is known and not transparent. */
|
||||
.markup.file-view img,
|
||||
.markup.file-view video,
|
||||
.file-view.markup img,
|
||||
.file-view.markup video,
|
||||
.comment-body .markup img, /* regular comment */
|
||||
.comment-body .markup video,
|
||||
.comment-content .markup img, /* code comment */
|
||||
|
@ -1238,21 +1238,6 @@ td .commit-summary {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.file-view.markup {
|
||||
padding: 1em 2em;
|
||||
}
|
||||
|
||||
.file-view.markup:has(.file-not-rendered-prompt) {
|
||||
padding: 0; /* let the file-not-rendered-prompt layout itself */
|
||||
}
|
||||
|
||||
.file-not-rendered-prompt {
|
||||
padding: 1rem;
|
||||
text-align: center;
|
||||
font-size: 1rem !important; /* use consistent styles for various containers (code, markup, etc) */
|
||||
line-height: var(--line-height-default) !important; /* same as above */
|
||||
}
|
||||
|
||||
.repository .activity-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
58
web_src/css/repo/file-view.css
Normal file
58
web_src/css/repo/file-view.css
Normal file
@ -0,0 +1,58 @@
|
||||
.file-view tr.active {
|
||||
background: var(--color-highlight-bg);
|
||||
}
|
||||
|
||||
.file-view tr.active:last-of-type .lines-code {
|
||||
border-bottom-right-radius: var(--border-radius);
|
||||
}
|
||||
|
||||
.file-view tr.active .lines-num {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.file-view tr.active .lines-num::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 0;
|
||||
width: 2px;
|
||||
height: 100%;
|
||||
background: var(--color-highlight-fg);
|
||||
}
|
||||
|
||||
.file-view .file-not-rendered-prompt {
|
||||
padding: 1rem;
|
||||
text-align: center;
|
||||
font-size: 1rem !important; /* use consistent styles for various containers (code, markup, etc) */
|
||||
line-height: var(--line-height-default) !important; /* same as above */
|
||||
}
|
||||
|
||||
/* ".code-view" is always used with ".file-view", to show the code of a file */
|
||||
.file-view.code-view {
|
||||
background: var(--color-code-bg);
|
||||
border-radius: var(--border-radius);
|
||||
}
|
||||
|
||||
.file-view.code-view table {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.file-view.code-view .lines-num span::after {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.file-view.code-view .lines-num:hover {
|
||||
color: var(--color-text-dark);
|
||||
}
|
||||
|
||||
.file-view.code-view .ui.button.code-line-button {
|
||||
border: 1px solid var(--color-secondary);
|
||||
padding: 1px 4px;
|
||||
margin: 0;
|
||||
min-height: 0;
|
||||
position: absolute;
|
||||
left: 6px;
|
||||
}
|
||||
|
||||
.file-view.code-view .ui.button.code-line-button:hover {
|
||||
background: var(--color-secondary);
|
||||
}
|
@ -1,16 +0,0 @@
|
||||
.code-view .lines-num:hover {
|
||||
color: var(--color-text-dark) !important;
|
||||
}
|
||||
|
||||
.ui.button.code-line-button {
|
||||
border: 1px solid var(--color-secondary);
|
||||
padding: 1px 4px;
|
||||
margin: 0;
|
||||
min-height: 0;
|
||||
position: absolute;
|
||||
left: 6px;
|
||||
}
|
||||
|
||||
.ui.button.code-line-button:hover {
|
||||
background: var(--color-secondary);
|
||||
}
|
Loading…
Reference in New Issue
Block a user