infrastructure/gitea-custom
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: 🚑 some css customizations not showing after 1.22.3 gitea update

Browse Source
This commit is contained in:
Lucas Colombo
2024-10-19 17:10:14 -03:00
parent 1569eacdcf
commit ecd34de22f
44 changed files with 478 additions and 912 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/templates/repo/home.tmpl
View File

@ -1,7 +1,7 @@
{{template "base/head" .}}
<div role="main" aria-label="{{.Title}}" class="page-content repository file list {{if .IsBlame}}blame{{end}}">
{{template "repo/header" .}}
<div class="ui container {{if .IsBlame}}fluid padded{{end}} {{if and (not .IsViewFile) (not .IsBlame)}}lugit-repo-list-view{{end}}">
<div class="ui container {{if .IsBlame}}fluid padded{{end}} {{if and (not .IsViewFile) (not .IsBlame) (not .HideRepoInfo)}}lugit-repo-list-view{{end}}">
<div class="lugit-repo-header-data">
{{template "base/alert" .}}
{{template "repo/code/recently_pushed_new_branches" .}}

163
src/themes/scss/dark.scss
View File

@ -1,82 +1,83 @@
@use '@lucas-labs/lui-micro' as lui;
@use './utils/color-utils' as c;
@use './theme' as theme;
$is-dark: true;
$brand: #a6c6f7;
$colors: (
theme: (
'rosewater': c.variants(#f5e0dc, $is-dark),
'flamingo': c.variants(#f2cdcd, $is-dark),
'pink': c.variants(#f5c2e7, $is-dark),
'mauve': c.variants($brand, $is-dark),
'red': c.variants(#f38ba8, $is-dark),
'maroon': c.variants(#eba0ac, $is-dark),
'peach': c.variants(#fab387, $is-dark),
'yellow': c.variants(#f9e2af, $is-dark),
'green': c.variants($brand, $is-dark),
'dark-green': c.variants(#00E676, $is-dark),
'teal': c.variants(#94e2d5, $is-dark),
'sky': c.variants(#89dceb, $is-dark),
'sapphire': c.variants(#74c7ec, $is-dark),
'blue': c.variants(#89b4fa, $is-dark),
'lavender': c.variants(#b4befe, $is-dark),
'black': c.variants(#181825, $is-dark),
'white': c.variants(#e6edf3, $is-dark),
),
text: #e6edf3,
primary: c.variants($brand, $is-dark),
secondary: c.variants(#5d5f7a, $is-dark),
elevation: (
'1': #000000, // crust
'2': #040407, // mantle
'3': #07070f, // base
'4': #161720, // surface0
'5': #1a1a25, // surface1
'6': #222330, // surface2
'7': #393c4d, // overlay0
'8': #515569, // overlay1
'9': #6b7188, // overlay2
'10': #868ca5, // subtext0
'11': #9aa2c2, // subtext1
'12': #b6c0e0, //
)
);
// init lui-micro, css-vars only (no reboot, no basic)
@include lui.init(
$theme: (
colors: $colors,
variables: (
'base-font-size': 14px,
'font-family': '"Outfit", Inter, Roboto, sans-serif',
'code-font-family': '"Source Code Pro", "Roboto Mono", Consolas, monospace',
'measure': (
'.25x': 4px,
'.5x': 8px,
'1x': 16px,
'1.25x': 20px,
'1.5x': 24px,
'2x': 32px,
'3x': 48px,
'4x': 64px,
),
'repo-home': (
'sidebar-width': 296px,
)
),
),
$options: (
reboot: false,
basic: false,
fg-var-name: 'text',
bg-var-name: 'elevation/1',
),
);
@include theme.make-theme(
$is-dark: $is-dark,
@use '@lucas-labs/lui-micro' as lui;
@use './utils/color-utils' as c;
@use './theme' as theme;
$is-dark: true;
$brand: #a6c6f7;
$colors: (
theme: (
'rosewater': c.variants(#f5e0dc, $is-dark),
'flamingo': c.variants(#f2cdcd, $is-dark),
'pink': c.variants(#f5c2e7, $is-dark),
'mauve': c.variants(#9b6bf5, $is-dark),
'red': c.variants(#f38ba8, $is-dark),
'maroon': c.variants(#eba0ac, $is-dark),
'peach': c.variants(#fab387, $is-dark),
'yellow': c.variants(#f9e2af, $is-dark),
'green': c.variants($brand, $is-dark),
'dark-green': c.variants(#00E676, $is-dark),
'teal': c.variants(#94e2d5, $is-dark),
'sky': c.variants(#89dceb, $is-dark),
'sapphire': c.variants(#74c7ec, $is-dark),
'blue': c.variants(#89b4fa, $is-dark),
'lavender': c.variants(#b4befe, $is-dark),
'black': c.variants(#181825, $is-dark),
'white': c.variants(#e6edf3, $is-dark),
),
text: #e6edf3,
primary: c.variants($brand, $is-dark),
secondary: c.variants(#5d5f7a, $is-dark),
elevation: (
'1': #000000, // crust
'2': #040407, // mantle
'3': #07070f, // base
'4': #161720, // surface0
'5': #1a1a25, // surface1
'6': #222330, // surface2
'7': #393c4d, // overlay0
'8': #515569, // overlay1
'9': #6b7188, // overlay2
'10': #868ca5, // subtext0
'11': #9aa2c2, // subtext1
'12': #b6c0e0, //
)
);
// init lui-micro, css-vars only (no reboot, no basic)
@include lui.init(
$theme: (
colors: $colors,
variables: (
'small-font-size': 12px,
'base-font-size': 14px,
'font-family': '"Outfit", Inter, Roboto, "Segoe UI", sans-serif',
'code-font-family': '"Source Code Pro", "Roboto Mono", Consolas, monospace',
'measure': (
'.25x': 4px,
'.5x': 8px,
'1x': 16px,
'1.25x': 20px,
'1.5x': 24px,
'2x': 32px,
'3x': 48px,
'4x': 64px,
),
'repo-home': (
'sidebar-width': 296px,
)
),
),
$options: (
reboot: false,
basic: false,
fg-var-name: 'text',
bg-var-name: 'elevation/1',
),
);
@include theme.make-theme(
$is-dark: $is-dark,
);

163
src/themes/scss/light.scss
View File

@ -1,82 +1,83 @@
@use '@lucas-labs/lui-micro' as lui;
@use './utils/color-utils' as c;
@use './theme' as theme;
$is-dark: true;
$brand: #6296e2;
$colors: (
theme: (
'rosewater': c.variants(#dc8a78, $is-dark),
'flamingo': c.variants(#dd7878, $is-dark),
'pink': c.variants(#ea76cb, $is-dark),
'mauve': c.variants($brand, $is-dark),
'red': c.variants(#d20f39, $is-dark),
'maroon': c.variants(#e64553, $is-dark),
'peach': c.variants(#fe640b, $is-dark),
'yellow': c.variants(#df8e1d, $is-dark),
'green': c.variants($brand, $is-dark),
'dark-green': c.variants(#11752d, $is-dark),
'teal': c.variants(#179299, $is-dark),
'sky': c.variants(#04a5e5, $is-dark),
'sapphire': c.variants(#209fb5, $is-dark),
'blue': c.variants(#1e66f5, $is-dark),
'lavender': c.variants(#7287fd, $is-dark),
'black': c.variants(#181825, $is-dark),
'white': c.variants(#e6edf3, $is-dark),
),
text: #4c4f69,
primary: c.variants($brand, $is-dark),
secondary: c.variants(#5d5f7a, $is-dark),
elevation: (
'1': #dce0e8, // crust
'2': #e6e9ef, // mantle
'3': #eff1f5, // base
'4': #ccd0da, // surface0
'5': #bcc0cc, // surface1
'6': #acb0be, // surface2
'7': #9ca0b0, // overlay0
'8': #8c8fa1, // overlay1
'9': #7c7f93, // overlay2
'10': #6c6f85, // subtext0
'11': #5c5f77, // subtext1
'12': #4c4f69, //
)
);
// init lui-micro, css-vars only (no reboot, no basic)
@include lui.init(
$theme: (
colors: $colors,
variables: (
'base-font-size': 14px,
'font-family': '"Outfit", Inter, Roboto, sans-serif',
'code-font-family': '"Source Code Pro", "Roboto Mono", Consolas, monospace',
'measure': (
'.25x': 4px,
'.5x': 8px,
'1x': 16px,
'1.25x': 20px,
'1.5x': 24px,
'2x': 32px,
'3x': 48px,
'4x': 64px,
),
'repo-home': (
'sidebar-width': 296px,
)
),
),
$options: (
reboot: false,
basic: false,
fg-var-name: 'text',
bg-var-name: 'elevation/1',
),
);
@include theme.make-theme(
$is-dark: $is-dark,
@use '@lucas-labs/lui-micro' as lui;
@use './utils/color-utils' as c;
@use './theme' as theme;
$is-dark: true;
$brand: #6296e2;
$colors: (
theme: (
'rosewater': c.variants(#dc8a78, $is-dark),
'flamingo': c.variants(#dd7878, $is-dark),
'pink': c.variants(#ea76cb, $is-dark),
'mauve': c.variants($brand, $is-dark),
'red': c.variants(#d20f39, $is-dark),
'maroon': c.variants(#e64553, $is-dark),
'peach': c.variants(#fe640b, $is-dark),
'yellow': c.variants(#df8e1d, $is-dark),
'green': c.variants($brand, $is-dark),
'dark-green': c.variants(#11752d, $is-dark),
'teal': c.variants(#179299, $is-dark),
'sky': c.variants(#04a5e5, $is-dark),
'sapphire': c.variants(#209fb5, $is-dark),
'blue': c.variants(#1e66f5, $is-dark),
'lavender': c.variants(#7287fd, $is-dark),
'black': c.variants(#181825, $is-dark),
'white': c.variants(#e6edf3, $is-dark),
),
text: #4c4f69,
primary: c.variants($brand, $is-dark),
secondary: c.variants(#5d5f7a, $is-dark),
elevation: (
'1': #dce0e8, // crust
'2': #e6e9ef, // mantle
'3': #eff1f5, // base
'4': #ccd0da, // surface0
'5': #bcc0cc, // surface1
'6': #acb0be, // surface2
'7': #9ca0b0, // overlay0
'8': #8c8fa1, // overlay1
'9': #7c7f93, // overlay2
'10': #6c6f85, // subtext0
'11': #5c5f77, // subtext1
'12': #4c4f69, //
)
);
// init lui-micro, css-vars only (no reboot, no basic)
@include lui.init(
$theme: (
colors: $colors,
variables: (
'small-font-size': 12px,
'base-font-size': 14px,
'font-family': '"Outfit", Inter, Roboto, "Segoe UI", sans-serif',
'code-font-family': '"Source Code Pro", "Roboto Mono", Consolas, monospace',
'measure': (
'.25x': 4px,
'.5x': 8px,
'1x': 16px,
'1.25x': 20px,
'1.5x': 24px,
'2x': 32px,
'3x': 48px,
'4x': 64px,
),
'repo-home': (
'sidebar-width': 296px,
)
),
),
$options: (
reboot: false,
basic: false,
fg-var-name: 'text',
bg-var-name: 'elevation/1',
),
);
@include theme.make-theme(
$is-dark: $is-dark,
);

10
src/themes/scss/theme/index.scss
View File

@ -58,6 +58,9 @@
--color-primary-alpha-80: rgba(#{color.get('primary/base', 'rgb')}, 0.8);
--color-primary-alpha-90: rgba(#{color.get('primary/base', 'rgb')}, 0.9);
--color-primary-hover: #{color.get('primary/light/3%')};
--color-primary-active: #{color.get('primary/light/6%')};
--color-secondary: #{color.get('elevation/5')};
--color-secondary-dark-1: #{color.get('secondary/light/3%')};
@ -231,13 +234,17 @@
--color-secondary-bg: #{color.get('elevation/4')};
--color-text-focus: #{color.get('text')};
--color-expand-button: #{color.get('elevation/6')};
--color-placeholder-text: #{color.get('elevation/6')};
--color-placeholder-text: #{color.get('elevation/9')};
--color-editor-line-highlight: var(--color-primary-light-5);
--color-project-board-bg: #{color.get('elevation/2')};
--color-caret: var(--color-text);
--color-reaction-bg: rgba(#{color.get('text', 'rgb')}, 0.07);
--color-reaction-active-bg: var(--color-primary-alpha-40);
--color-tooltip-text: #{color.get('primary/base')};
--color-tooltip-bg: #{color.get('primary/base', 'contrast')};
--color-nav-bg: #{$lvl2};
--color-secondary-nav-bg: #{$lvl2};
--color-nav-text: #{color.get('text')};
--color-nav-hover-bg: #{color.get('elevation/6')};
--color-label-active-bg: #{color.get('elevation/6')};
--color-label-text: #{color.get('primary/base', 'contrast')};
@ -405,6 +412,5 @@
@include chroma.make-chroma-styles;
@include codemirror.make-code-mirror-styles;
@include monaco.make-monaco-styles($is-dark: true);
@include custom.apply-custom-styles;
}

9
src/themes/scss/theme/modules/custom/_issue-content.scss
View File

@ -4,4 +4,13 @@
max-width: 100%;
}
}
.issue-content, .issue-list {
.labels-list {
.label {
}
}
}
}

58
src/themes/scss/theme/modules/custom/_repo-header.scss
View File

@ -2,7 +2,7 @@
@use '@lucas-labs/lui-micro/color' as color;
@mixin apply-styles {
.header-wrapper {
.secondary-nav {
display: flex;
flex-direction: column;
margin-bottom: var.get('measure/1x');
@ -21,40 +21,34 @@
.ui.tabs.divider {
margin-bottom: 0;
}
.ui.tabular.menu.navbar {
overflow-menu {
.item {
--item-margin-bottom: #{var.get('measure/1x')};
margin: var(--item-margin-bottom) var.get('measure/.5x');
border-radius: var.get('measure/.25x');
padding: var.get('measure/.5x') var.get('measure/.5x');
color: var(--color-text);
border: none;
--item-margin-bottom: #{var.get('measure/.5x')} !important;
margin: 0 var.get('measure/.5x') var(--item-margin-bottom) !important;
border-radius: var.get('measure/.25x') !important;
padding: var.get('measure/.5x') var.get('measure/.5x') !important;
color: var(--color-text) !important;
border: none !important;
position: relative; // Make the parent element positioned
svg {
color: var(--color-text-light-3);
margin-right: var.get('measure/.5x');
color: var(--color-text-light-3) !important;
margin-right: var.get('measure/.5x') !important;
}
&:hover {
background-color: color.get('elevation/4') !important;
}
&.active {
background-color: transparent;
color: var(--color-text);
border-radius: var.get('measure/.25x') !important;
font-weight: normal;
// border-bottom: 4px solid color.get('primary/base');;
&::after {
background: color.get('primary/base');
border-radius: 6px;
bottom: calc(0px - var(--item-margin-bottom));
content: "";
height: 2px;
position: absolute;
right: 50%;
transform: translate(50%, -50%);
width: 100%;
z-index: 1;
}
background-color: transparent !important;
color: var(--color-text) !important;
border-radius: 0 !important;
// font-weight: normal !important;
border-bottom: calc(var(--item-margin-bottom) - 1px) solid var(--color-secondary-nav-bg) !important;
margin-bottom: 1px !important;
box-shadow: 0px 2px 0px 0px color.get('primary/base') !important;
}
.small.label {
@ -69,11 +63,7 @@
align-items: center;
justify-content: center;
}
&:hover {
background-color: color.get('elevation/4');
}
}
}
}
}
}

60
src/themes/scss/theme/modules/custom/repo/_file-list.scss
View File

@ -3,9 +3,24 @@
@mixin apply-styles {
#repo-topics {
#repo-topics, #topic_edit, .label-list {
row-gap: var.get('measure/.5x');
margin-top: 0 !important;
.label:not(.basic) {
font-size: var.get('small-font-size') !important;
background-color: rgba(#{color.get('theme/blue/base', 'rgb')}, 0.1);
color: color.get('primary/base');
border-radius: var.get('measure/2x');
line-height: 14px;
transition: background-color 0.2s ease;
&:hover {
background-color: rgba(#{color.get('theme/blue/base', 'rgb')}, 0.3) !important;
color: color.get('primary/base') !important;
}
}
}
.ui.table>tr>td, .ui.table>tbody>tr>td {
@ -17,14 +32,6 @@
flex-direction: row-reverse;
column-gap: 24px;
.ui.repo-topic.large.label.topic {
background-color: rgba(#{color.get('theme/blue/base', 'rgb')}, 0.3);
color: color.get('primary/base');
border-radius: var.get('measure/2x');
border: 1px solid rgba(#{color.get('theme/blue/base', 'rgb')}, 0.4);
line-height: 14px;
}
@media (max-width: 1100px) {
width: 100%;
min-width: 100%;
@ -58,7 +65,7 @@
}
}
@media (max-width: 1200px) {
@media (max-width: 1280px) {
flex-direction: column;
column-gap: 0;
row-gap: 24px;
@ -149,39 +156,6 @@
.field.gt-f1.gt-mr-3 {
margin: 0px !important;
// topic selection editing (task list
div.fluid.multiple.search.selection.dropdown {
display: flex;
flex-wrap: wrap;
box-shadow: none;
padding: var.get('measure/.25x') var.get('measure/.5x');
.item {
border: none;
}
.menu {
top: calc(100% + 1px);
}
}
.dropdown {
display: none;
}
// Cancel, Save buttons
+div {
display: flex;
column-gap: var.get('measure/1x');
button {
display: block !important;
margin: 0px !important;
width: 100%;
}
}
}
}