mirror of
https://codeberg.org/forgejo/forgejo
synced 2024-11-22 09:54:24 +01:00
a579a0f318
1. Restore missing styles for message close icon 2. Move `code-line-button` so that it does not go off-screen on small viewports 3. Make `code-line-button` look and behave like other buttons 4. Make `code-line-button` work in blame 5. Make the active selection span the whole line, not just the code part 6. Tweak colors, make dark theme code bg darker, make line numbers same color in diff and file view. 7. Move code background to parent, fixing border radius and other problems 8. Enable code wrap in blame 9. Improve blame responsiveness 10. Remove `--color-code-sidebar-bg` in blame, now it uses same background as code 11. Rename `--color-active-line` to `--color-highlight-bg` 12. Add `--color-highlight-bg` 13. Fix button group borders on hover and border-right on last button. <img width="1343" alt="Screenshot 2024-03-23 at 22 34 13" src="https://github.com/go-gitea/gitea/assets/115237/fcbb919f-5dc3-43f0-97f6-870d6f412554"> <img width="1334" alt="Screenshot 2024-03-23 at 22 34 26" src="https://github.com/go-gitea/gitea/assets/115237/ca44c3b7-4328-4645-ba49-b0dc6a5ac06d"> <img width="1338" alt="Screenshot 2024-03-23 at 22 34 57" src="https://github.com/go-gitea/gitea/assets/115237/00eb0b5a-1ec7-4669-a94a-4602b9d1c1ac"> <img width="1337" alt="Screenshot 2024-03-23 at 22 34 42" src="https://github.com/go-gitea/gitea/assets/115237/752edc4a-064f-413c-9dff-c086187fcd85"> Fixes: https://github.com/go-gitea/gitea/issues/18074 --- Conflict resolution: Trivial. Ref: https://codeberg.org/forgejo/forgejo/issues/2776 (cherry picked from commit db01bf6cc88a8a7b5132b9306b3af1649566b10f)
115 lines
2.4 KiB
CSS
115 lines
2.4 KiB
CSS
/* based on Fomantic UI message module, with just the parts extracted that we use. If you find any
|
|
unused rules here after refactoring, please remove them. */
|
|
|
|
.ui.message {
|
|
background: var(--color-box-body);
|
|
color: var(--color-text);
|
|
border: 1px solid var(--color-secondary);
|
|
position: relative;
|
|
min-height: 1em;
|
|
margin: 1em 0;
|
|
padding: 1em 1.5em;
|
|
border-radius: var(--border-radius);
|
|
}
|
|
|
|
.ui.message:first-child {
|
|
margin-top: 0;
|
|
}
|
|
|
|
.ui.message:last-child {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.ui.attached.message {
|
|
margin-bottom: -1px;
|
|
border-radius: var(--border-radius) var(--border-radius) 0 0;
|
|
margin-left: -1px;
|
|
margin-right: -1px;
|
|
}
|
|
|
|
.ui.attached + .ui.attached.message:not(.top):not(.bottom) {
|
|
margin-top: -1px;
|
|
border-radius: 0;
|
|
}
|
|
|
|
.ui.bottom.attached.message {
|
|
margin-top: -1px;
|
|
border-radius: 0 0 var(--border-radius) var(--border-radius);
|
|
}
|
|
|
|
.ui.bottom.attached.message:not(:last-child) {
|
|
margin-bottom: 1em;
|
|
}
|
|
|
|
.ui.info.message .header,
|
|
.ui.blue.message .header {
|
|
color: var(--color-blue);
|
|
}
|
|
|
|
.ui.info.message,
|
|
.ui.attached.info.message,
|
|
.ui.blue.message,
|
|
.ui.attached.blue.message {
|
|
background: var(--color-info-bg);
|
|
color: var(--color-info-text);
|
|
border-color: var(--color-info-border);
|
|
}
|
|
|
|
.ui.success.message .header,
|
|
.ui.positive.message .header,
|
|
.ui.green.message .header {
|
|
color: var(--color-green);
|
|
}
|
|
|
|
.ui.success.message,
|
|
.ui.attached.success.message,
|
|
.ui.positive.message,
|
|
.ui.attached.positive.message {
|
|
background: var(--color-success-bg);
|
|
color: var(--color-success-text);
|
|
border-color: var(--color-success-border);
|
|
}
|
|
|
|
.ui.error.message .header,
|
|
.ui.negative.message .header,
|
|
.ui.red.message .header {
|
|
color: var(--color-red);
|
|
}
|
|
|
|
.ui.error.message,
|
|
.ui.attached.error.message,
|
|
.ui.red.message,
|
|
.ui.attached.red.message,
|
|
.ui.negative.message,
|
|
.ui.attached.negative.message {
|
|
background: var(--color-error-bg);
|
|
color: var(--color-error-text);
|
|
border-color: var(--color-error-border);
|
|
}
|
|
|
|
.ui.warning.message .header,
|
|
.ui.yellow.message .header {
|
|
color: var(--color-yellow);
|
|
}
|
|
|
|
.ui.warning.message,
|
|
.ui.attached.warning.message,
|
|
.ui.yellow.message,
|
|
.ui.attached.yellow.message {
|
|
background: var(--color-warning-bg);
|
|
color: var(--color-warning-text);
|
|
border-color: var(--color-warning-border);
|
|
}
|
|
|
|
.ui.message > .close.icon {
|
|
cursor: pointer;
|
|
position: absolute;
|
|
top: 9px;
|
|
right: 9px;
|
|
opacity: .7;
|
|
}
|
|
|
|
.ui.message > .close.icon:hover {
|
|
opacity: 1;
|
|
}
|