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

minor css fixes

Browse Source
This commit is contained in:
Candifloss 2024-11-11 21:41:30 +05:30
parent e4f0aa7679
commit 4a8d867e59
5 changed files with 129 additions and 130 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -83,7 +83,7 @@ header .header-section.header-right a:hover {
width: 250px; width: 250px;
background-color: #1a1a1a; background-color: #1a1a1a;
color: #f0f0f0; color: #f0f0f0;
padding: 20px 0; padding: 0;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
} }
@ -91,15 +91,16 @@ header .header-section.header-right a:hover {
display: flex; display: flex;
align-items: center; align-items: center;
gap: 10px; gap: 10px;
padding: 0 12px 10px; padding: 8px 12px;
border-bottom: 2px solid cadetblue; border-bottom: 2px solid cadetblue;
} }
.sidebar-right .repo-info .repo-logo { .sidebar-right .repo-info .repo-logo {
width: 35px; width: 39px;
height: 35px; height: 39px;
border-radius: 50%; border-radius: 50%;
display: flex; display: flex;
border: 2px solid #7390df; padding: 2px;
background-color: black;
} }
.sidebar-right .repo-info .repo-logo img { .sidebar-right .repo-info .repo-logo img {
width: 35px; width: 35px;
@ -125,7 +126,7 @@ header .header-section.header-right a:hover {
display: block; display: block;
} }
.sidebar-right .repo-info:hover .repo-logo { .sidebar-right .repo-info:hover .repo-logo {
border: 2px solid #9b9b9b; background-color: #9b9b9b;
} }
.sidebar-right .repo-nav { .sidebar-right .repo-nav {
display: flex; display: flex;
@ -137,14 +138,13 @@ header .header-section.header-right a:hover {
gap: 10px; gap: 10px;
color: #f0f0f0; color: #f0f0f0;
text-decoration: none; text-decoration: none;
font-size: 0.95rem; font-size: 15px;
padding: 0.5em 12px; padding: 0.75em 12px;
border-right: 2px solid rgba(0, 0, 0, 0); border-left: 2px solid rgba(0, 0, 0, 0);
height: 3em;
} }
.sidebar-right .repo-nav .nav-link:hover { .sidebar-right .repo-nav .nav-link:hover {
background-color: #333; background-color: #333;
border-right: 2px solid wheat; border-left: 2px solid wheat;
} }
.sidebar-right .repo-nav .nav-link i { .sidebar-right .repo-nav .nav-link i {
font-size: 1em; font-size: 1em;
@ -186,15 +186,14 @@ header .header-section.header-right a:hover {
gap: 10px; gap: 10px;
color: #f0f0f0; color: #f0f0f0;
text-decoration: none; text-decoration: none;
font-size: 0.95rem; font-size: 15px;
padding: 0.5em 12px; padding: 0.75em 12px;
border-right: 2px solid rgba(0, 0, 0, 0); border-left: 2px solid rgba(0, 0, 0, 0);
height: 3em;
margin-top: auto; margin-top: auto;
} }
.sidebar-right .settings-link:hover { .sidebar-right .settings-link:hover {
background-color: #333; background-color: #333;
border-right: 2px solid wheat; border-left: 2px solid wheat;
} }
.sidebar-right .settings-link i { .sidebar-right .settings-link i {
font-size: 1em; font-size: 1em;

2
test/html/repo-home.html
View File

@ -40,7 +40,7 @@
<!-- Repo Info --> <!-- Repo Info -->
<div class="repo-info"> <div class="repo-info">
<div class="repo-logo"> <div class="repo-logo">
<img src="../images/repo-icon.png" alt="&#xf02e;" /> <img src="../images/repo_icon.png" alt="&#xf02e;" />
</div> </div>
<div class="repo-details"> <div class="repo-details">
<a class="repo-author" href="/author_page">Author Name</a> <a class="repo-author" href="/author_page">Author Name</a>

BIN
test/images/repo_icon.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 20 KiB

BIN
test/images/repo_icon.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 20 KiB

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

@ -10,138 +10,138 @@ $stat-count-color: #f0f0f0;
$settings-link-hover-bg-color: #333; $settings-link-hover-bg-color: #333;
@mixin sidbar-left-nav-links { @mixin sidbar-left-nav-links {
display: flex; display: flex;
align-items: center; align-items: center;
gap: 10px; gap: 10px;
color: $sidebar-text-color; color: $sidebar-text-color;
text-decoration: none; text-decoration: none;
font-size: 0.95rem; font-size: 15px;
padding: 0.5em 12px; padding: 0.75em 12px;
border-right: 2px solid rgba(0,0,0,0); border-left: 2px solid rgba(0,0,0,0);
height: 3em;
&:hover { &:hover {
background-color: $sidebar-link-hover-bg-color; background-color: $sidebar-link-hover-bg-color;
border-right: 2px solid wheat; border-left: 2px solid wheat;
} }
i { i {
font-size: 1em; font-size: 1em;
width: 1em; width: 1em;
height: 1em; height: 1em;
text-align: center; text-align: center;
} }
} }
.sidebar-right { .sidebar-right {
width: 250px; width: 250px;
background-color: $sidebar-bg-color; background-color: $sidebar-bg-color;
color: $sidebar-text-color; color: $sidebar-text-color;
padding: 20px 0; padding: 0;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
//gap: 1rem;
.repo-info { .repo-info {
display: flex; display: flex;
align-items: center; align-items: center;
gap: 10px; gap: 10px;
padding: 0 12px 10px; padding: 8px 12px;
border-bottom: 2px solid cadetblue; border-bottom: 2px solid cadetblue;
.repo-logo { .repo-logo {
//background-color: #f0f0f0; //background-color: #f0f0f0;
width: 35px; width: 39px;
height: 35px; height: 39px;
border-radius: 50%; border-radius: 50%;
display: flex; display: flex;
border: 2px solid #7390df; padding: 2px;
background-color: black;
img { img {
width: 35px; width: 35px;
height: 35px; height: 35px;
border-radius: 50%; border-radius: 50%;
//color: green; //color: green;
line-height: 35px; line-height: 35px;
text-align: center; text-align: center;
font-size: 23px; font-size: 23px;
font-family: 'Font Awesome 6 Free'; font-family: 'Font Awesome 6 Free';
font-style: normal; font-style: normal;
font-weight: 400; font-weight: 400;
font-display: block; font-display: block;
src: url('../fonts/fa-regular-400.woff2') format('woff2'), src: url('../fonts/fa-regular-400.woff2') format('woff2'),
url('../fonts/fa-regular-400.ttf') format('truetype'); url('../fonts/fa-regular-400.ttf') format('truetype');
} }
} }
.repo-details { .repo-details {
.repo-author { .repo-author {
font-size: 0.9rem; font-size: 0.9rem;
color: $sidebar-author-color; color: $sidebar-author-color;
display: block; display: block;
} }
.repo-name { .repo-name {
font-size: 1.1rem; font-size: 1.1rem;
font-weight: bold; font-weight: bold;
display: block; display: block;
} }
} }
&:hover { &:hover {
.repo-logo { .repo-logo {
border: 2px solid #9b9b9b; //border: 2px solid #9b9b9b;
} background-color: #9b9b9b;
} }
} }
}
.repo-nav { .repo-nav {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
//gap: 0.3rem; //gap: 0.3rem;
.nav-link { .nav-link {
@include sidbar-left-nav-links; @include sidbar-left-nav-links;
} }
} }
.repo-stats { .repo-stats {
display: flex; display: flex;
gap: 0.5rem; gap: 0.5rem;
padding: 7px 12px; padding: 7px 12px;
.stat-item { .stat-item {
display: flex; display: flex;
align-items: center; align-items: center;
gap: 3px; gap: 3px;
background-color: $stat-bg-color; background-color: $stat-bg-color;
padding: 0.3rem 0.5rem; padding: 0.3rem 0.5rem;
border-radius: 1rem; border-radius: 1rem;
color: $stat-text-color; color: $stat-text-color;
font-size: 0.8rem; font-size: 0.8rem;
height: 1.4rem; height: 1.4rem;
.stat-icon { .stat-icon {
font-size: 0.9em; font-size: 0.9em;
} }
.stat-count { .stat-count {
color: $stat-count-color; color: $stat-count-color;
min-width: 4ch; min-width: 4ch;
text-align: right; text-align: right;
} }
&:hover {
background-color: #444;
color:#1b97ff;
}
}
}
.settings-link { &:hover {
@include sidbar-left-nav-links; background-color: #444;
margin-top: auto; color:#1b97ff;
}
}
}
} .settings-link {
@include sidbar-left-nav-links;
margin-top: auto;
}
} }