feat: ✨ dark and light themes
This commit is contained in:
@ -2,7 +2,7 @@
|
||||
<defs>
|
||||
<style>
|
||||
.a {
|
||||
fill: #e373ff;
|
||||
fill: #a6c6f7;
|
||||
}
|
||||
</style>
|
||||
</defs>
|
||||
|
Before Width: | Height: | Size: 239 B After Width: | Height: | Size: 239 B |
@ -2,7 +2,7 @@
|
||||
<defs>
|
||||
<style>
|
||||
.a, .b {
|
||||
fill: #e373ff;
|
||||
fill: #a6c6f7;
|
||||
}
|
||||
|
||||
.a {
|
||||
|
Before Width: | Height: | Size: 502 B After Width: | Height: | Size: 502 B |
@ -2,7 +2,7 @@
|
||||
<defs>
|
||||
<style>
|
||||
.a {
|
||||
fill: #e373ff;
|
||||
fill: #a6c6f7;
|
||||
}
|
||||
</style>
|
||||
</defs>
|
||||
|
Before Width: | Height: | Size: 368 B After Width: | Height: | Size: 368 B |
@ -1,44 +1,46 @@
|
||||
@use '@lucas-labs/lui-micro' as lui;
|
||||
@use './utils/color-utils' as c;
|
||||
@use './gitea';
|
||||
@use './theme' as theme;
|
||||
|
||||
$is-dark: true;
|
||||
|
||||
$brand: #a6c6f7;
|
||||
|
||||
$colors: (
|
||||
theme: (
|
||||
'rosewater': c.variants(#f5e0dc, $is-dark, $dark: false),
|
||||
'flamingo': c.variants(#f2cdcd, $is-dark, $dark: false),
|
||||
'pink': c.variants(#f5c2e7, $is-dark, $dark: false),
|
||||
'mauve': c.variants(#cba6f7, $is-dark, $dark: false),
|
||||
'red': c.variants(#f38ba8, $is-dark, $dark: false),
|
||||
'maroon': c.variants(#eba0ac, $is-dark, $dark: false),
|
||||
'peach': c.variants(#fab387, $is-dark, $dark: false),
|
||||
'yellow': c.variants(#f9e2af, $is-dark, $dark: false),
|
||||
'green': c.variants(#a6e3a1, $is-dark, $dark: false),
|
||||
'teal': c.variants(#94e2d5, $is-dark, $dark: false),
|
||||
'sky': c.variants(#89dceb, $is-dark, $dark: false),
|
||||
'sapphire': c.variants(#74c7ec, $is-dark, $dark: false),
|
||||
'blue': c.variants(#89b4fa, $is-dark, $dark: false),
|
||||
'lavender': c.variants(#b4befe, $is-dark, $dark: false),
|
||||
'black': c.variants(#181825, $is-dark, $dark: false),
|
||||
'white': c.variants(#cdd6f4, $is-dark, $dark: false),
|
||||
'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),
|
||||
'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: #cdd6f4,
|
||||
primary: c.variants(#cba6f7, $is-dark),
|
||||
secondary: c.variants(#313244, $is-dark),
|
||||
text: #e6edf3,
|
||||
primary: c.variants($brand, $is-dark),
|
||||
secondary: c.variants(#5d5f7a, $is-dark),
|
||||
elevation: (
|
||||
'1': #11111b, // crust
|
||||
'2': #181825, // mantle
|
||||
'3': #1e1e2e, // base
|
||||
'4': #313244, // surface0
|
||||
'5': #45475a, // surface1
|
||||
'6': #585b70, // surface2
|
||||
'7': #6c7086, // overlay0
|
||||
'8': #7f849c, // overlay1
|
||||
'9': #9399b2, // overlay2
|
||||
'10': #a6adc8, // subtext0
|
||||
'11': #bac2de, // subtext1
|
||||
'12': #cdd6f4, // text
|
||||
'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, //
|
||||
)
|
||||
);
|
||||
|
||||
@ -47,9 +49,22 @@ $colors: (
|
||||
$theme: (
|
||||
colors: $colors,
|
||||
variables: (
|
||||
'base-font-size': 16px,
|
||||
'font-family': 'Inter, Roboto, sans-serif',
|
||||
'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,
|
||||
)
|
||||
),
|
||||
),
|
||||
|
||||
@ -61,6 +76,6 @@ $colors: (
|
||||
),
|
||||
);
|
||||
|
||||
@include gitea.make-theme(
|
||||
@include theme.make-theme(
|
||||
$is-dark: $is-dark,
|
||||
);
|
81
src/themes/scss/light.scss
Normal file
81
src/themes/scss/light.scss
Normal file
@ -0,0 +1,81 @@
|
||||
@use '@lucas-labs/lui-micro' as lui;
|
||||
@use './utils/color-utils' as c;
|
||||
@use './theme' as theme;
|
||||
|
||||
$is-dark: false;
|
||||
|
||||
$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),
|
||||
'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,
|
||||
);
|
@ -1,16 +1,16 @@
|
||||
@use '@lucas-labs/lui-micro/color' as color;
|
||||
@use './modules/chroma' as chroma;
|
||||
@use './modules/codemirror' as codemirror;
|
||||
|
||||
@use './modules/custom' as custom;
|
||||
@use '@lucas-labs/lui-micro/var' as var;
|
||||
|
||||
@mixin make-theme($is-dark: true) {
|
||||
$lvl1: if($is-dark, #{color.get('elevation/1')}, #{color.get('elevation/3')});
|
||||
$lvl1-rgb: if($is-dark, #{color.get('elevation/1', 'rgb')}, #{color.get('elevation/3', 'rgb')});
|
||||
$lvl1: #{color.get('elevation/3')};
|
||||
$lvl1-rgb: #{color.get('elevation/3', 'rgb')};
|
||||
$lvl2: #{color.get('elevation/2')};
|
||||
$lvl2-rgb: #{color.get('elevation/2', 'rgb')};
|
||||
$lvl3: if($is-dark, #{color.get('elevation/3')}, #{color.get('elevation/1')});
|
||||
$lvl3-rgb: if($is-dark, #{color.get('elevation/3', 'rgb')}, #{color.get('elevation/1', 'rgb')});
|
||||
$lvl3: #{color.get('elevation/1')};
|
||||
$lvl3-rgb: #{color.get('elevation/1', 'rgb')};
|
||||
|
||||
:root {
|
||||
* {
|
||||
@ -103,6 +103,31 @@
|
||||
--color-grey: #{color.get('elevation/9')};
|
||||
--color-black: #{color.get('elevation/1')};
|
||||
|
||||
/* dark variants */
|
||||
--color-red-dark-1: #{color.get('theme/red/dark/12%')};
|
||||
--color-orange-dark-1: #{color.get('theme/peach/dark/12%')};
|
||||
--color-yellow-dark-1: #{color.get('theme/yellow/dark/12%')};
|
||||
--color-olive-dark-1: #{color.get('theme/green/dark/12%')};
|
||||
--color-green-dark-1: #{color.get('theme/green/dark/12%')};
|
||||
--color-teal-dark-1: #{color.get('theme/teal/dark/12%')};
|
||||
--color-blue-dark-1: #{color.get('theme/blue/dark/12%')};
|
||||
--color-violet-dark-1: #{color.get('theme/lavender/dark/12%')};
|
||||
--color-purple-dark-1: #{color.get('theme/mauve/dark/12%')};
|
||||
--color-pink-dark-1: #{color.get('theme/pink/dark/12%')};
|
||||
--color-brown-dark-1: #{color.get('theme/flamingo/dark/12%')};
|
||||
|
||||
--color-red-dark-2: #{color.get('theme/red/dark/15%')};
|
||||
--color-orange-dark-2: #{color.get('theme/peach/dark/15%')};
|
||||
--color-yellow-dark-2: #{color.get('theme/yellow/dark/15%')};
|
||||
--color-olive-dark-2: #{color.get('theme/green/dark/15%')};
|
||||
--color-green-dark-2: #{color.get('theme/green/dark/15%')};
|
||||
--color-teal-dark-2: #{color.get('theme/teal/dark/15%')};
|
||||
--color-blue-dark-2: #{color.get('theme/blue/dark/15%')};
|
||||
--color-violet-dark-2: #{color.get('theme/lavender/dark/15%')};
|
||||
--color-purple-dark-2: #{color.get('theme/mauve/dark/15%')};
|
||||
--color-pink-dark-2: #{color.get('theme/pink/dark/15%')};
|
||||
--color-brown-dark-2: #{color.get('theme/flamingo/dark/15%')};
|
||||
|
||||
/* light variants */
|
||||
--color-red-light: #{color.get('theme/red/light/12%')};
|
||||
--color-orange-light: #{color.get('theme/peach/light/12%')};
|
||||
@ -135,13 +160,13 @@
|
||||
--color-diff-added-row-border: rgba(#{color.get('theme/green/base', 'rgb')}, 0.07);
|
||||
--color-diff-inactive: #{color.get('elevation/9')};
|
||||
--color-error-border: #{color.get('theme/red/base')};
|
||||
--color-error-bg: #{color.get('theme/red/base')};
|
||||
--color-error-bg: rgba(#{color.get('theme/red/base', 'rgb')}, 0.15);
|
||||
--color-error-bg-active: #{color.get('theme/red/light/6%')};
|
||||
--color-error-bg-hover: #{color.get('theme/red/light/12%')};
|
||||
--color-error-text: #{$lvl1};
|
||||
--color-error-text: #{color.get('theme/red/base')};
|
||||
--color-success-border: #{color.get('theme/green/light/12%')};
|
||||
--color-success-bg: #{color.get('theme/green/base')};
|
||||
--color-success-text: #{$lvl1};
|
||||
--color-success-bg: rgba(#{color.get('theme/green/base', 'rgb')}, 0.15);
|
||||
--color-success-text: #{color.get('text')};
|
||||
--color-warning-border: #{color.get('theme/yellow/light/12%')};
|
||||
--color-warning-bg: #{color.get('theme/yellow/base')};
|
||||
--color-warning-text: #{$lvl1};
|
||||
@ -161,19 +186,20 @@
|
||||
--color-orange-badge-bg: #{$lvl1};
|
||||
--color-orange-badge-hover-bg: #{color.get('theme/peach/light/6%')};
|
||||
--color-git: #{color.get('theme/peach/base')};
|
||||
--color-label-bg: #{color.get('primary/base')};
|
||||
|
||||
/* target-based colors */
|
||||
--color-body: #{$lvl1};
|
||||
--color-box-header: #{$lvl2};
|
||||
--color-box-body: #{$lvl2};
|
||||
--color-box-header: #{rgba(color.get('elevation/2', 'rgb'), .8)};
|
||||
--color-box-body: transparent;
|
||||
--color-box-body-highlight: #{color.get('elevation/4')};
|
||||
--color-text-dark: #{color.get('elevation/10')};
|
||||
--color-text: #{color.get('text')};
|
||||
--color-text-light: #{color.get('elevation/11')};
|
||||
--color-text-light: #{color.get('elevation/12')};
|
||||
--color-text-light-1: #{color.get('elevation/11')};
|
||||
--color-text-light-2: #{color.get('elevation/11')};
|
||||
--color-text-light-3: #{color.get('elevation/11')};
|
||||
--color-footer: #{$lvl2};
|
||||
--color-text-light-2: #{color.get('elevation/10')};
|
||||
--color-text-light-3: #{color.get('elevation/9')};
|
||||
--color-footer: rgba(#{color.get('elevation/2', 'rgb')}, 0.2);
|
||||
--color-timeline: #{color.get('elevation/4')};
|
||||
--color-input-text: #{color.get('text')};
|
||||
--color-input-background: #{color.get('elevation/4')};
|
||||
@ -192,12 +218,12 @@
|
||||
--color-light-border: #{color.get('elevation/6')};
|
||||
--color-hover: rgba(#{color.get('elevation/6', 'rgb')}, 0.1);
|
||||
--color-active: rgba(#{color.get('text', 'rgb')}, 0.1);
|
||||
--color-menu: #{color.get('elevation/4')};
|
||||
--color-card: #{color.get('elevation/4')};
|
||||
--color-menu: #{color.get('elevation/3')};
|
||||
--color-card: #{color.get('elevation/3')};
|
||||
--color-markup-table-row: rgba(#{color.get('text', 'rgb')}, 0.02);
|
||||
--color-markup-code-block: rgba(#{color.get('text', 'rgb')}, 0.05);
|
||||
--color-button: #{color.get('elevation/4')};
|
||||
--color-code-bg: #{color.get('elevation/3')};
|
||||
--color-code-bg: #{color.get('elevation/2')};
|
||||
--color-code-sidebar-bg: #{color.get('elevation/4')};
|
||||
--color-shadow: rgba(#{$lvl1-rgb}, 0.1);
|
||||
--color-secondary-bg: #{color.get('elevation/4')};
|
||||
@ -256,10 +282,32 @@
|
||||
}
|
||||
}
|
||||
|
||||
.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.grey.labels .label, .ui.ui.ui.grey.label {
|
||||
background-color: color.get('primary/base');
|
||||
border-color: color.get('primary/base');
|
||||
color: $lvl1;
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
.ui.label, .ui.menu .item>.label {
|
||||
background: var(--color-label-bg);
|
||||
color: var(--color-label-text);
|
||||
}
|
||||
|
||||
.ui.basic.modal {
|
||||
background-color: $lvl3;
|
||||
}
|
||||
|
||||
.ui.error.message .header, .ui.negative.message .header, .ui.red.message .header {
|
||||
color: var(--color-error-text);
|
||||
}
|
||||
|
||||
// link color for signed commits
|
||||
.ui.commit-header-row .svg.gitea-lock ~ a {
|
||||
color: $lvl1;
|
||||
@ -290,6 +338,27 @@
|
||||
font-size: var.get('base-font-size');
|
||||
}
|
||||
|
||||
footer {
|
||||
justify-content: flex-end !important;
|
||||
|
||||
.right-links {
|
||||
justify-content: space-around !important;
|
||||
}
|
||||
|
||||
.right-links>a {
|
||||
border-left: none !important;
|
||||
padding-left: 0px !important;
|
||||
margin-left: 0px !important;
|
||||
}
|
||||
|
||||
.ui.dropdown .menu {
|
||||
left: -50% !important;
|
||||
margin-bottom: 16px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@include chroma.make-chroma-styles;
|
||||
@include codemirror.make-code-mirror-styles;
|
||||
|
||||
@include custom.apply-custom-styles;
|
||||
}
|
77
src/themes/scss/theme/modules/custom/_repo-header.scss
Normal file
77
src/themes/scss/theme/modules/custom/_repo-header.scss
Normal file
@ -0,0 +1,77 @@
|
||||
@use '@lucas-labs/lui-micro/var' as var;
|
||||
@use '@lucas-labs/lui-micro/color' as color;
|
||||
|
||||
@mixin apply-styles {
|
||||
.header-wrapper {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-bottom: var.get('measure/1x');
|
||||
|
||||
.ui.container {
|
||||
margin: 0 0 0 0 !important;
|
||||
max-width: unset !important;
|
||||
width: 100% !important;
|
||||
padding: 0 var.get('measure/1x');
|
||||
}
|
||||
|
||||
.repo-header {
|
||||
margin: 0 0 var.get('measure/1x') 0;
|
||||
}
|
||||
|
||||
.ui.tabs.divider {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.ui.tabular.menu.navbar {
|
||||
.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;
|
||||
|
||||
svg {
|
||||
color: var(--color-text-light-3);
|
||||
margin-right: var.get('measure/.5x');
|
||||
}
|
||||
|
||||
&.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;
|
||||
}
|
||||
}
|
||||
|
||||
.small.label {
|
||||
background-color: color.get('elevation/7');
|
||||
border: 1px solid color.get('elevation/7');
|
||||
border-radius: var.get('measure/2x');
|
||||
color: var(--color-text);
|
||||
font-weight: var(--base-text-weight-medium, 500);
|
||||
min-width: calc(var.get('measure/1.25x') + 6px);
|
||||
padding: 6px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: color.get('elevation/4');
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
7
src/themes/scss/theme/modules/custom/index.scss
Normal file
7
src/themes/scss/theme/modules/custom/index.scss
Normal file
@ -0,0 +1,7 @@
|
||||
@use './repo-header';
|
||||
@use './repo';
|
||||
|
||||
@mixin apply-custom-styles {
|
||||
@include repo-header.apply-styles();
|
||||
@include repo.apply-styles();
|
||||
}
|
166
src/themes/scss/theme/modules/custom/repo/_file-list.scss
Normal file
166
src/themes/scss/theme/modules/custom/repo/_file-list.scss
Normal file
@ -0,0 +1,166 @@
|
||||
@use '@lucas-labs/lui-micro/var' as var;
|
||||
@use '@lucas-labs/lui-micro/color' as color;
|
||||
|
||||
@mixin apply-styles {
|
||||
|
||||
.ui.table>tr>td, .ui.table>tbody>tr>td {
|
||||
border-top-color: rgba(#{color.get('theme/blue/base', 'rgb')}, 0.04);
|
||||
}
|
||||
|
||||
.page-content.repository.file.list > .ui.container.lugit-repo-list-view {
|
||||
display: flex;
|
||||
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%;
|
||||
margin: 0;
|
||||
padding: 0 var.get('measure/2x');
|
||||
|
||||
.lugit-repo-header-data {
|
||||
min-width: calc(#{var.get('repo-home/sidebar-width')} * 0.87) !important;
|
||||
max-width: calc(#{var.get('repo-home/sidebar-width')} * 0.87) !important;
|
||||
width: calc(#{var.get('repo-home/sidebar-width')} * 0.87) !important;
|
||||
}
|
||||
|
||||
.repo-button-row {
|
||||
.gt-gap-y-3 {
|
||||
column-gap: var.get('measure/.5x');
|
||||
|
||||
#new-pull-request {
|
||||
display: none;
|
||||
}
|
||||
|
||||
[role=menu] {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
#clone-panel {
|
||||
#repo-clone-url {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
flex-direction: column;
|
||||
column-gap: 0;
|
||||
row-gap: 24px;
|
||||
|
||||
.lugit-repo-header-data {
|
||||
min-width: 100%!important;
|
||||
max-width: 100%!important;
|
||||
width: 100%!important;
|
||||
}
|
||||
|
||||
#repo-topics {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
#repo-desc {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
font-size: 1em;
|
||||
row-gap: var.get('measure/1x');
|
||||
|
||||
h5 {
|
||||
display: none;
|
||||
}
|
||||
|
||||
span {
|
||||
font-size: 1.2em !important;
|
||||
font-style: italic !important;
|
||||
color: var(--color-text-light-3);
|
||||
}
|
||||
|
||||
a {
|
||||
font-size: 1.1em;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.repo-button-row {
|
||||
.gt-gap-y-3 {
|
||||
column-gap: var.get('measure/.5x');
|
||||
}
|
||||
|
||||
#clone-panel {
|
||||
#repo-clone-url {
|
||||
width: unset;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.lugit-repo-header-data {
|
||||
min-width: var.get('repo-home/sidebar-width');
|
||||
max-width: var.get('repo-home/sidebar-width');
|
||||
width: var.get('repo-home/sidebar-width');
|
||||
|
||||
#repo-desc {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
font-size: 1em;
|
||||
row-gap: var.get('measure/1x');
|
||||
|
||||
* {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
h5 {
|
||||
font-size: 1.1em;
|
||||
}
|
||||
|
||||
span {
|
||||
font-size: 1.1em;
|
||||
}
|
||||
|
||||
a {
|
||||
font-size: 1.1em;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.lugit-repo-content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
row-gap: var.get('measure/1x');
|
||||
}
|
||||
|
||||
#topic_edit {
|
||||
flex-direction: column;
|
||||
row-gap: var.get('measure/1x');
|
||||
|
||||
.field.gt-f1.gt-mr-3 {
|
||||
margin: 0px !important;
|
||||
|
||||
+div {
|
||||
display: flex;
|
||||
column-gap: var.get('measure/1x');
|
||||
|
||||
button {
|
||||
display: block !important;
|
||||
margin: 0px !important;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#repo-topics {
|
||||
margin-top: var.get('measure/1x') !important;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
5
src/themes/scss/theme/modules/custom/repo/index.scss
Normal file
5
src/themes/scss/theme/modules/custom/repo/index.scss
Normal file
@ -0,0 +1,5 @@
|
||||
@use './file-list';
|
||||
|
||||
@mixin apply-styles {
|
||||
@include file-list.apply-styles();
|
||||
}
|
Reference in New Issue
Block a user