aboutsummaryrefslogtreecommitdiff
path: root/scss
diff options
context:
space:
mode:
Diffstat (limited to 'scss')
-rw-r--r--scss/main.scss22
-rw-r--r--scss/tree.scss399
2 files changed, 420 insertions, 1 deletions
diff --git a/scss/main.scss b/scss/main.scss
index e0fecf1..a98c0a2 100644
--- a/scss/main.scss
+++ b/scss/main.scss
@@ -12,7 +12,7 @@ $btn-border-radius: 0;
// basic functionality
@import "bootstrap/scss/_functions.scss";
@import "bootstrap/scss/_variables.scss";
-@import "bootstrap/scss/_variables-dark.scss";
+//@import "bootstrap/scss/_variables-dark.scss";
@import "bootstrap/scss/_maps.scss";
@import "bootstrap/scss/_mixins.scss";
@import "bootstrap/scss/_utilities.scss";
@@ -27,6 +27,7 @@ $navbar-nav-link-padding-x: $spacer;
@import "bootstrap/scss/_grid.scss";
@import "bootstrap/scss/_forms.scss";
@import "bootstrap/scss/_buttons.scss";
+@import "bootstrap/scss/mixins/_color-mode.scss";
@import "tree.scss";
// overwrite to reduce the ammount of css generated by loading all utilities
@@ -80,6 +81,12 @@ body {
margin: 0;
}
+@include color-mode(dark) {
+ body {
+ background: #212529;
+ }
+}
+
// prevert wierd input overflowing 100%
input {
width: 100%;
@@ -116,6 +123,12 @@ a[href]:not([href=""]):not(.nav-link) {
background: #f8f9fa;
}
+@include color-mode(dark) {
+ .event {
+ background: #131618;
+ }
+}
+
.event-commit {
background: #dadada;
padding: 5px;
@@ -136,6 +149,13 @@ a[href]:not([href=""]):not(.nav-link) {
}
+@include color-mode(dark) {
+ .event-commit {
+ background: #000;
+ }
+}
+
+
.selected {
text-decoration: underline;
}
diff --git a/scss/tree.scss b/scss/tree.scss
index 05828dc..58258bd 100644
--- a/scss/tree.scss
+++ b/scss/tree.scss
@@ -53,6 +53,20 @@
color: $gray-700;
}
+ @media(prefers-color-scheme: dark) {
+ .name.blob a {
+ color: inherit;
+ }
+
+ .mode,
+ .commit,
+ .commit a,
+ .date,
+ .size {
+ color: inherit;
+ }
+ }
+
.name.blob {
text-overflow: ellipsis;
white-space: nowrap;
@@ -85,7 +99,392 @@
// Striped rows
&:nth-child(10n+#{$i}) {
background: rgba(0, 0, 0, .05);
+
+ @media(prefers-color-scheme: dark) {
+ background: lighten($gray-900, 5);
+ }
+ }
+ }
+ }
+}
+
+.code-view {
+ display: grid;
+ grid-template-columns: auto auto auto 1fr;
+ grid-template-rows: auto;
+
+ .blame-user {
+ grid-column-start: 1;
+ grid-row-start: 1;
+ background: #ddd;
+
+ @media(prefers-color-scheme: dark) {
+ background: $gray-900;
+ }
+
+ .hunk {
+ padding-left: 0.5rem;
+ }
+ }
+
+ .blame-time {
+ grid-column-start: 2;
+ grid-row-start: 1;
+ background: #ddd;
+ border-right: 1px solid #444;
+ text-align: right;
+
+ @media(prefers-color-scheme: dark) {
+ background: $gray-900;
+ }
+
+ .hunk {
+ padding-right: 0.5rem;
+ }
+ }
+
+ .hunk:nth-child(2n) {
+ background: #eee;
+
+ @media(prefers-color-scheme: dark) {
+ background: lighten($gray-900, 5);
+ }
+ }
+
+ .lines {
+ grid-column-start: 3;
+ grid-row-start: 1;
+ text-align: right;
+ padding-left: 0.5rem;
+ padding-right: 0.5rem;
+
+ background: #eee;
+ border-right: 1px solid #444;
+
+ @media(prefers-color-scheme: dark) {
+ background: lighten($gray-900, 5);
+ }
+
+ a:target::before,
+ a.selected::before {
+ display: block;
+ content: "";
+ // +6px to connect multiple selected lines
+ height: calc(1rem + 6px);
+ width: 100%;
+ z-index: -1;
+ position: absolute;
+ left: 0;
+ background: lighten($blue, 35);
+
+ @media(prefers-color-scheme: dark) {
+ background: $black;
+ }
+ }
+ }
+
+ .highlight {
+ grid-column-start: 4;
+ grid-row-start: 1;
+ padding-left: 1rem;
+ background: transparent;
+ overflow-x: hidden;
+
+ pre {
+ background: transparent;
+ }
+ }
+
+ .ruler {
+ background: transparent;
+ grid-column-start: 4;
+ grid-row-start: 1;
+ display: block;
+ padding-left: calc(1rem + 4px);
+ height: 100%;
+ pointer-events: none;
+ overflow-x: hidden;
+
+ pre {
+ background: transparent;
+ }
+
+ &>span {
+ height: 100%;
+ display: inline-block;
+ border-right: 1px solid $gray-200;
+
+ @media(prefers-color-scheme: dark) {
+ border-right: 1px solid #343a40;
}
}
}
}
+
+.ref {
+ border-width: 1px;
+ border-style: solid;
+ padding: 0.1rem 0.2rem;
+
+ &.branch {
+ border-color: darken($info, 20);
+ background: $info;
+ color: $white !important;
+ }
+
+ &.tag {
+ border-color: darken($primary, 20);
+ background: $primary;
+ color: $white;
+ }
+
+ &.tag.annotated {
+ border-color: darken($success, 20);
+ background: $success;
+ color: $white;
+ }
+}
+
+.diff {
+ .lineno {
+ text-decoration: none;
+ }
+
+ .text-success {
+ color: color_adjust_contrast_AERT(darken($success, 10), white) !important;
+ }
+
+ .text-danger {
+ color: color_adjust_contrast_AERT(darken($danger, 10), white) !important;
+ }
+
+ pre {
+ background: transparent;
+ }
+
+ @media(prefers-color-scheme: dark) {
+ $success-dark: #2bb34b;
+ $danger-dark: #ff3e3e;
+
+ .text-success {
+ color: $success-dark !important;
+ }
+
+ .text-danger {
+ color: $danger-dark !important;
+ }
+ }
+}
+
+img {
+ max-width: 100%;
+}
+
+.prepare-patchset {
+ legend {
+ font-weight: bold;
+ }
+
+ label {
+ margin-right: 1rem;
+ cursor: pointer;
+ }
+
+ details {
+ display: inline;
+ color: $gray-600;
+
+ &[open] {
+ display: block;
+ color: $black;
+
+ summary {
+ color: $black;
+ }
+ }
+
+ ul {
+ list-style: none;
+ padding-left: 0;
+ }
+
+ li {
+ margin-top: 1rem;
+ }
+
+ @media(prefers-color-scheme: dark) {
+ color: $gray-500;
+
+ &[open] {
+ color: $gray-100;
+
+ summary {
+ color: $gray-100;
+ }
+ }
+ }
+ }
+
+ .event-list {
+ display: flex;
+ flex-direction: column;
+
+ &.reverse {
+ flex-direction: column-reverse;
+ }
+
+ input[type="radio"] {
+ display: none;
+ }
+
+ &>.commit-diff {
+ margin-top: 1rem;
+ order: -2;
+ }
+
+ &>.form-controls {
+ order: -1;
+ margin-top: 1rem;
+ align-self: flex-end;
+
+ &.last {
+ order: -3;
+ }
+ }
+
+ &>details {
+ order: 0;
+ }
+
+ &>.event {
+ order: 1;
+ display: block;
+ margin: 0.25rem 0;
+
+ // Because the order is reversed
+ &:last-child {
+ margin: 0.25rem 0;
+ }
+
+ &:first-child {
+ margin: 0;
+ }
+ }
+
+ input[type="radio"]:checked~.event {
+ background: lighten($info, 50) !important;
+ }
+
+ input[type="radio"]:checked+.event {
+ background: lighten($info, 45) !important;
+ }
+
+ @media(prefers-color-scheme: dark) {
+ input[type="radio"]:checked~.event {
+ background: #131a3c !important;
+ }
+
+ input[type="radio"]:checked+.event {
+ background: #003038 !important;
+ }
+ }
+ }
+}
+
+.markdown-nav {
+ padding-left: 0;
+ padding-right: 0;
+
+ .nav-tabs {
+ padding-left: 0;
+ margin-bottom: 0;
+ border-left: 1rem #ddd solid;
+ }
+}
+
+.blob-nav {
+ display: inline-block;
+ padding-left: 0;
+ padding-right: 0;
+
+ .nav-item:hover {
+ background: #fff;
+ }
+
+ @media(prefers-color-scheme: dark) {
+ .nav-item:hover {
+ background: inherit;
+ }
+ }
+
+ .nav-tabs {
+ padding-left: 0;
+ margin-bottom: -3px;
+ border-bottom: 3px transparent solid;
+
+ .nav-link {
+ padding: 0 0.5rem;
+
+ &:hover {
+ color: black;
+ }
+
+ &.active {
+ border-bottom: 3px #fff solid;
+ background: #fff;
+ }
+
+ @media(prefers-color-scheme: dark) {
+ color: $gray-400;
+
+ &.active,
+ &:hover {
+ border-bottom: 3px $gray-900 solid;
+ background: $gray-900;
+ color: $white;
+ }
+ }
+ }
+ }
+}
+
+.tree-header {
+ display: flex;
+
+ .breadcrumb {
+ flex-grow: 1;
+ width: 100%;
+ }
+
+ .commit-info {
+ margin-left: 1rem;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+ overflow: hidden;
+ min-width: 0;
+ }
+}
+
+dl {
+ dd {
+ text-overflow: ellipsis;
+ overflow-x: hidden;
+ }
+}
+
+@include media-breakpoint-up(md) {
+ .blob {
+ padding-left: 2rem;
+
+ .commit {
+ float: right;
+ }
+ }
+}
+
+.code-viewport {
+ display: flex;
+ flex: 1 0 auto;
+ padding-left: 0;
+ padding-right: 0;
+}
generated by cgit v1.2.3 (git 2.25.1) at 2025-11-04 03:58:28 +0000