candifloss/Gitea-Theme
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

languages css tweak

Browse Source
This commit is contained in:
Candifloss 2024-11-13 23:49:02 +05:30
parent dd0aaf2875
commit 018f492478
2 changed files with 49 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
test/css/repo-home.css
View File

@ -86,6 +86,7 @@ header .header-section.header-right a:hover {
padding: 0; padding: 0;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
max-height: 90vh;
} }
.sidebar-right .repo-info { .sidebar-right .repo-info {
display: flex; display: flex;
@ -182,6 +183,7 @@ header .header-section.header-right a:hover {
} }
.sidebar-right .repo-languages { .sidebar-right .repo-languages {
padding: 8px 12px; padding: 8px 12px;
overflow-y: scroll;
} }
.sidebar-right .repo-languages .repo-languages-title { .sidebar-right .repo-languages .repo-languages-title {
width: 100%; width: 100%;
@ -217,7 +219,19 @@ header .header-section.header-right a:hover {
margin-right: 0; margin-right: 0;
} }
.sidebar-right .repo-languages .repo-lang-list .repo-lang-list-item.lang1 { .sidebar-right .repo-languages .repo-lang-list .repo-lang-list-item.lang1 {
background-color: #1b97ff; background: linear-gradient(to left, rgb(188, 33, 21) 0%, rgb(188, 33, 21) 40%, rgba(0, 0, 0, 0) 0%);
}
.sidebar-right .repo-languages .repo-lang-list .repo-lang-list-item.lang2 {
background: linear-gradient(to left, rgb(73, 103, 114) 0%, rgb(73, 103, 114) 10%, rgba(0, 0, 0, 0) 0%);
}
.sidebar-right .repo-languages .repo-lang-list .repo-lang-list-item.lang3 {
background: linear-gradient(to left, rgb(194, 59, 59) 0%, rgb(194, 59, 59) 15%, rgba(0, 0, 0, 0) 0%);
}
.sidebar-right .repo-languages .repo-lang-list .repo-lang-list-item.lang4 {
background: linear-gradient(to left, rgb(172, 58, 3) 0%, rgb(172, 58, 3) 20%, rgba(0, 0, 0, 0) 0%);
}
.sidebar-right .repo-languages .repo-lang-list .repo-lang-list-item.lang5 {
background: linear-gradient(to left, rgb(84, 160, 74) 0%, rgb(84, 160, 74) 90%, rgba(0, 0, 0, 0) 0%);
} }
.sidebar-right .settings-link { .sidebar-right .settings-link {
display: flex; display: flex;

35
test/scss/repo-home/_sidebar-right.scss
View File

@ -1,3 +1,5 @@
@use 'sass:math';
// Color Variables // Color Variables
$sidebar-bg-color: #1a1a1a; $sidebar-bg-color: #1a1a1a;
$sidebar-text-color: #f0f0f0; $sidebar-text-color: #f0f0f0;
@ -9,6 +11,22 @@ $stat-text-color: #f0f0f0;
$stat-count-color: #f0f0f0; $stat-count-color: #f0f0f0;
$settings-link-hover-bg-color: #333; $settings-link-hover-bg-color: #333;
@function random_col() {
$r: (random($limit: 128) + random($limit: 128));
$g: random($limit: (255 - $r));
$b: random($limit: (255 - math.max($r, $g)));
@return rgb($r, $g, $b);
}
@function lang_bg($col, $perc) {
@return linear-gradient(
to left,
$col 0%,
$col $perc,
rgba(0,0,0,0) 0%
);
}
@mixin sidbar-left-nav-links { @mixin sidbar-left-nav-links {
display: flex; display: flex;
align-items: center; align-items: center;
@ -39,6 +57,7 @@ $settings-link-hover-bg-color: #333;
padding: 0; padding: 0;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
max-height: 90vh;
.repo-info { .repo-info {
display: flex; display: flex;
@ -144,12 +163,14 @@ $settings-link-hover-bg-color: #333;
.repo-languages { .repo-languages {
//background-color: black; //background-color: black;
padding: 8px 12px; padding: 8px 12px;
overflow-y: scroll;
.repo-languages-title { .repo-languages-title {
width: 100%; width: 100%;
font-size: 16px; font-size: 16px;
height: 1.7em; height: 1.7em;
display: block; display: block;
//position: absolute;
} }
.repo-lang-list { .repo-lang-list {
@ -182,7 +203,19 @@ $settings-link-hover-bg-color: #333;
} }
&.lang1 { &.lang1 {
background-color: #1b97ff; background: lang_bg(random_col(), 40%);
}
&.lang2 {
background: lang_bg(random_col(), 10%);
}
&.lang3 {
background: lang_bg(random_col(), 15%);
}
&.lang4 {
background: lang_bg(random_col(), 20%);
}
&.lang5 {
background: lang_bg(random_col(), 90%);
} }
} }
} }