luckyimnotanigger/forgejo
1
0
Fork 0
mirror of https://codeberg.org/forgejo/forgejo.git synced 2025-05-14 05:52:43 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 10

Rework focused comment styling (#13434)

Browse source 
Had to tweak a few borders to make it work properly in all cases, also
added .comment-body class to specifically target that body.
This commit is contained in:
silverwind 2020-11-05 20:34:04 +01:00 • committed by GitHub
parent 5b636bdec7
commit eba0ac5bf6
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 87 additions and 41 deletions
Download patch file Download diff file Expand all files Collapse all files

62
web_src/less/_repository.less
View file

@ -998,6 +998,9 @@
}
.content {
border: 1px solid var(--color-secondary);
border-radius: var(--border-radius);
> .merge-section {
background-color: #f7f7f7;
@ -1089,18 +1092,6 @@
}
}
&:target > .content {
box-shadow: 0 0 10px #8c8c8c;
}
&:target > .content > .code-comment-content {
padding: 4px;
}
&:target > .content > .code-comment-content > .text {
margin-bottom: 0;
}
.ui.form {
.field {
&:first-child {
@ -1127,6 +1118,15 @@
}
}
.code-comment {
border: 1px solid transparent;
padding: 6px 6px 3px;
.content {
border: none !important;
}
}
.event {
padding-left: 15px;
@ -2395,6 +2395,11 @@
.segment.reactions {
padding: 0;
display: flex;
border: none !important;
border-top: 1px solid var(--color-secondary) !important;
width: 100% !important;
max-width: 100% !important;
margin: 0 !important;
.ui.label {
max-height: 40px;
@ -2407,7 +2412,7 @@
margin: 0;
font-size: 14px;
font-weight: normal;
border-color: inherit !important;
border-color: var(--color-secondary) !important;
&.disabled {
cursor: default;
@ -2421,7 +2426,7 @@
.ui.label.basic.blue {
background-color: var(--color-primary-alpha-20) !important;
border-color: inherit !important;
border-color: var(--color-secondary) !important;
}
.reaction-count {
@ -2786,8 +2791,30 @@
}
}
.comment:target .content {
border-color: var(--color-primary) !important;
box-shadow: 0 0 0 3px var(--color-primary-alpha-30) !important;
}
.comment:target .header:before {
border-right-color: var(--color-primary) !important;
filter: drop-shadow(-3px 0 0 var(--color-primary-alpha-30)) !important;
}
.code-comment:target {
border-color: var(--color-primary) !important;
border-radius: var(--border-radius) !important;
box-shadow: 0 0 0 3px var(--color-primary-alpha-30) !important;
}
.code-comment:target .content {
box-shadow: none !important;
}
.comment-header {
#avatar-arrow;
border: none !important;
border-bottom: 1px solid var(--color-secondary) !important;
font-weight: normal !important;
padding: .5rem 1rem !important;
margin: 0 !important;
@ -2833,6 +2860,13 @@
margin-left: .25rem;
}
.comment-body {
border: none !important;
width: 100% !important;
max-width: 100% !important;
margin: 0 !important;
}
.edit-label.modal,
.new-label.segment {
.form {

4
web_src/less/themes/theme-arc-green.less
View file

@ -537,7 +537,7 @@ body {
.ui.attached.header {
background: var(--color-secondary);
border: 1px solid var(--color-secondary);
border-color: var(--color-secondary);
color: #dbdbdb;
}
@ -1039,7 +1039,7 @@ a.ui.basic.green.label:hover {
.ui.segment,
.ui.segments,
.ui.attached.segment {
border: 1px solid var(--color-secondary);
border-color: var(--color-secondary);
}
.ui.list > .item > .content {