From 39e1f0920ac4eb96812f4a62a38efa51466c6092 Mon Sep 17 00:00:00 2001 From: gilbN Date: Sun, 11 Jul 2021 15:55:32 +0200 Subject: [PATCH] gitea dracula theme --- CSS/themes/gitea/aquamarine.css | 26 ++---- CSS/themes/gitea/dark.css | 26 ++---- CSS/themes/gitea/dracula.css | 27 ++++++ CSS/themes/gitea/gitea-base.css | 134 ++++++++++++++++------------- CSS/themes/gitea/hotline.css | 26 ++---- CSS/themes/gitea/organizr-dark.css | 26 ++---- CSS/themes/gitea/plex.css | 26 ++---- CSS/themes/gitea/space-gray.css | 27 ++---- 8 files changed, 153 insertions(+), 165 deletions(-) create mode 100644 CSS/themes/gitea/dracula.css diff --git a/CSS/themes/gitea/aquamarine.css b/CSS/themes/gitea/aquamarine.css index 74dd6f86..fc3b55a5 100644 --- a/CSS/themes/gitea/aquamarine.css +++ b/CSS/themes/gitea/aquamarine.css @@ -14,22 +14,14 @@ /* GITEA AQUAMARINE THEME */ @import url(https://theme-park.dev/CSS/themes/gitea/gitea-base.css); @import url(https://theme-park.dev/CSS/themes/gitea/chroma.css); -:root { - --main-bg-color: radial-gradient(ellipse at center, #47918a 0%, #0b3161 100%) center center/cover no-repeat fixed; - --modal-bg-color: radial-gradient(ellipse at top, #47918a 0%, #0b3161 100%) center center/cover no-repeat fixed; - --button-color: #009688; - --button-color-hover: #12afa0; - --button-text: #eee; - --accent-color: #12afa0; - --accent-color-hover: #fff; - --text: #eee; - --text-hover: #fff; - --text-muted: #bbb; - --link-color: #12afa0; +@import url(https://theme-park.dev/CSS/variables/aquamarine.css); - --heatmap-color-1: #002D24; - --heatmap-color-2: #004B40; - --heatmap-color-3: #006B5F; - --heatmap-color-4: #008C7E; - --heatmap-color-5: #12AFA0; +/* APP VARS */ +:root { + --color-secondary-alpha-70: rgba(0, 0, 0, 0.35); + --color-primary-light-4: #002D24; + --color-primary-light-2: #004B40; + --color-primary: #006B5F; + --color-primary-dark-2: #008C7E; + --color-primary-dark-4: #12AFA0; } \ No newline at end of file diff --git a/CSS/themes/gitea/dark.css b/CSS/themes/gitea/dark.css index c3274e9c..80b0c478 100644 --- a/CSS/themes/gitea/dark.css +++ b/CSS/themes/gitea/dark.css @@ -14,22 +14,14 @@ /* GITEA DARK THEME */ @import url(https://theme-park.dev/CSS/themes/gitea/gitea-base.css); @import url(https://theme-park.dev/CSS/themes/gitea/chroma.css); -:root { - --main-bg-color: radial-gradient(circle, #3a3a3a, #2d2d2d, #202020, #141414, #000000) center center/cover no-repeat fixed; - --modal-bg-color: radial-gradient(circle , #3a3a3a, #2d2d2d, #202020, #141414, #000000) center center/cover no-repeat fixed; - --button-color: hsla(0,0%,100%,.15); - --button-color-hover: hsla(0,0%,100%,.30); - --button-text: #eee; - --accent-color: #646464; - --accent-color-hover: #ffffff73; - --text: #b7b7b7; - --text-hover: #fff; - --text-muted: #bbb; - --link-hover: rgba(255, 255, 255, 0.45); +@import url(https://theme-park.dev/CSS/variables/dark.css); - --heatmap-color-1: #303030; - --heatmap-color-2: #5E5E5E; - --heatmap-color-3: #919191; - --heatmap-color-4: #C6C6C6; - --heatmap-color-5: #FFFFFF; +/* APP VARS */ +:root { + --color-secondary-alpha-70: rgba(0, 0, 0, 0.35); + --color-primary-light-4: #303030; + --color-primary-light-2: #5E5E5E; + --color-primary: #919191; + --color-primary-dark-2: #C6C6C6; + --color-primary-dark-4: #FFFFFF; } \ No newline at end of file diff --git a/CSS/themes/gitea/dracula.css b/CSS/themes/gitea/dracula.css new file mode 100644 index 00000000..2cc2af48 --- /dev/null +++ b/CSS/themes/gitea/dracula.css @@ -0,0 +1,27 @@ + +/* dP dP dP */ +/* 88 88 88 */ +/* d8888P 88d888b. .d8888b. 88d8b.d8b. .d8888b. 88d888b. .d8888b. 88d888b. 88 .dP */ +/* 88 88' `88 88ooood8 88'`88'`88 88ooood8 88' `88 88' `88 88' `88 88888" */ +/* 88 88 88 88. ... 88 88 88 88. ... 88. .88 88. .88 88 88 `8b. */ +/* dP dP dP `88888P' dP dP dP `88888P' 88 88Y888P' `88888P8 dP dP `YP */ +/* 88 */ +/* dP */ + +/* Made by @gilbN */ +/* https://github.com/gilbN/theme.park */ + +/* GITEA DRACULA THEME */ +@import url(https://theme-park.dev/CSS/themes/gitea/gitea-base.css); +@import url(https://theme-park.dev/CSS/themes/gitea/chroma.css); +@import url(https://theme-park.dev/CSS/variables/dracula.css); + +/* APP VARS */ +:root { + --color-secondary-alpha-70: rgba(0, 0, 0, 0.35); + --color-primary-light-4: #003B00; + --color-primary-light-2: #006700; + --color-primary: #00961D; + --color-primary-dark-2: #00C74D; + --color-primary-dark-4: #50FA7B; +} \ No newline at end of file diff --git a/CSS/themes/gitea/gitea-base.css b/CSS/themes/gitea/gitea-base.css index 3d5c3f57..c5c49a69 100644 --- a/CSS/themes/gitea/gitea-base.css +++ b/CSS/themes/gitea/gitea-base.css @@ -48,7 +48,7 @@ a:hover, .ui.cards>.card>.content>a.header:hover, .ui.card>.extra a:not(.ui):hover, .ui.cards>.card>.extra a:not(.ui):hover { - color: #fff; + color: var(--link-color-hover); } /* LINKS IMPORTANT */ @@ -64,7 +64,7 @@ a:hover, .ui .text.blue a:hover, .ui .text.grey a:hover, .ui .migrate a:hover { - color: #fff !important; + color: var(--link-color-hover) !important; } /* SCROLLBAR */ @@ -109,12 +109,6 @@ a:hover, /* TEXT */ body, -h1, -h2, -h3, -h4, -h5, -h6, p, /*strong,*/ footer, @@ -124,9 +118,7 @@ footer, .issue.list>.item .title, .ui.accordion .title:not(.ui), .ui.checkbox label, -.ui.header, .ui .text.black, -.ui.header .sub.header, .ui.form .inline.field>label, .form .help, .ui.form .field>label, @@ -150,6 +142,22 @@ footer, color: var(--text); } +.issue.list>.item .desc { + color: var(--text-muted); +} + +h1, +h2, +h3, +h4, +h5, +h6, +.ui.header, +.ui.header .sub.header + { + color: var(--text-hover); +} + /* TEXT IMPORTANT */ .ui .text.grey { color: var(--text) !important; @@ -189,7 +197,7 @@ b:hover, .following.bar.lightui.secondary.menu .active.item:hover { box-shadow: none; background: rgba(0, 0, 0, .25) !important; - color: var(--accent-color); + color: rgb(var(--accent-color)); } .ui.secondary.menu .dropdown.item:hover, @@ -221,7 +229,7 @@ b:hover, .organization.settings .ui.vertical.menu { display: block; flex-direction: column; - background: rgb(255 255 255 / 8%); + background: rgb(0 0 0 / 15%); box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.15); } @@ -234,7 +242,7 @@ b:hover, } .ui.segment { - background: rgb(255 255 255 / 8%) !important; + background: rgb(0 0 0 / 15%) !important; } .ui.attached.segment, @@ -256,7 +264,7 @@ b:hover, } .ui.info.message { - background-color: rgb(255 255 255 / 8%); + background-color: rgb(0 0 0 / 15%); color: #276f86; } @@ -315,7 +323,7 @@ b:hover, } .ui.secondary.pointing.menu .item { - color: var(--text-muted); + color: var(--text); } .ui.repository.list .item:not(:first-child) { @@ -384,7 +392,7 @@ b:hover, .ui.secondary.pointing.menu .active.item, .ui.secondary.pointing.menu .active.item:hover { border-color: currentColor; - color: var(--accent-color); + color: rgb(var(--accent-color)); } .ui.tabular.menu .item { @@ -413,7 +421,7 @@ b:hover, .ui.menu .ui.dropdown .menu>.active.item { background: rgb(0 0 0 / 10%) !important; - color: var(--accent-color) !important; + color: rgb(var(--accent-color)) !important; } .ui.menu .ui.dropdown .menu>.item:hover, @@ -452,7 +460,7 @@ b:hover, } .ui.dropdown .menu .active.item { - color: var(--accent-color); + color: rgb(var(--accent-color)); outline: none !important; } @@ -546,7 +554,7 @@ svg.vch__wrapper .vch__months__labels__wrapper text.vch__month__label[data-v-a9c #app .ui.item.menu, .ui.item.menu .item { - background: rgb(255 255 255 / 8%); + background: rgb(0 0 0 / 15%); border-color: rgb(255 255 255 / 10%); } @@ -569,7 +577,7 @@ svg.vch__wrapper .vch__months__labels__wrapper text.vch__month__label[data-v-a9c .ui.menu a.item:hover { color: var(--text-hover); - background: rgb(255 255 255 / 8%); + background: rgb(0 0 0 / 15%); } #app .ui.link.menu .item:hover, @@ -581,13 +589,13 @@ svg.vch__wrapper .vch__months__labels__wrapper text.vch__month__label[data-v-a9c } #app .ui.secondary.segment { - background: rgb(255 255 255 / 8%); + background: rgb(0 0 0 / 15%); color: rgba(0, 0, 0, .6); } /* COMMIT CALENDAR */ svg.vch__wrapper rect.vch__day__square[data-v-a9cfea66]:hover { - stroke: var(--accent-color); + stroke: rgb(var(--accent-color)); stroke-width: 1px; } @@ -668,7 +676,7 @@ svg.vch__wrapper rect.vch__day__square[data-v-a9cfea66]:hover { } .repository .segment.reactions .ui.label.basic { - color: var(--accent-color) !important; + color: rgb(var(--accent-color)) !important; } .repository .diff-file-box .code-diff-split tbody tr.add-code td:first-child, @@ -721,7 +729,7 @@ td.blob-excerpt { } .repo-header .ui.breadcrumb a { - color: var(--accent-color); + color: rgb(var(--accent-color)); } .repo-header .ui.breadcrumb a:hover { @@ -749,13 +757,13 @@ td.blob-excerpt { .ui.tabular.menu .item:hover, .ui.tabular.menu .active.item, .ui.tabular.menu .active.item:hover { - color: var(--text-hover) !important; + color: rgb(var(--accent-color)) !important; border-radius: .28571429rem .28571429rem 0 0 !important; } .ui.card, .ui.cards>.card { - background: rgb(255 255 255 / 8%); + background: rgb(0 0 0 / 15%); box-shadow: none; } @@ -852,7 +860,7 @@ a.ui.card:hover { } #git-graph-container li .author { - color: var(--accent-color); + color: rgb(var(--accent-color)); } .repository .ui.segment.sub-menu .list .item a, @@ -874,17 +882,18 @@ a.ui.card:hover { } .ui.blue.labels .label, -.ui.ui.ui.blue.label { - background-color: var(--accent-color) !important; - border-color: var(--accent-color) !important; - color: var(--text-hover); +.ui.ui.ui.blue.label, +.ui.grey.labels .label, .ui.ui.ui.grey.label { + background-color: rgb(var(--accent-color)) !important; + border-color: rgb(var(--accent-color)) !important; + color: var(--label-text-color); } .ui.black.labels .label, .ui.ui.ui.black.label { - background-color: var(--accent-color); - border-color: var(--accent-color); - color: var(--button-text); + background-color: rgb(var(--accent-color)); + border-color: rgb(var(--accent-color)); + color: var(--label-text-color); } .repository #commits-table.ui.basic.striped.table tbody tr:nth-child(2n) { @@ -937,7 +946,7 @@ a.ui.card:hover { } .ui.form .dropzone { - border: 2px dashed var(--accent-color) !important; + border: 2px dashed rgb(var(--accent-color)) !important; box-shadow: none !important; padding: 0; min-height: 5rem; @@ -969,11 +978,11 @@ a.ui.card:hover { } .repository.view.issue .comment-list .comment .content>.header .actions a:hover { - color: var(--accent-color); + color: rgb(var(--accent-color)); } .repository.view.issue .pull-desc code { - color: var(--accent-color); + color: rgb(var(--accent-color)); } .repository .segment.reactions .ui.label.basic.blue { @@ -986,8 +995,8 @@ a.ui.card:hover { } .repository.view.issue .comment-list .timeline-item .badge { - background-color: var(--accent-color); - border: 2px solid var(--accent-color); + background-color: rgb(var(--accent-color)); + border: 2px solid rgb(var(--accent-color)); color: #fff; } @@ -1050,8 +1059,8 @@ footer { } .ui.checkbox input:checked~label:after { - color: #fff !important; - background: var(--accent-color); + color: var(--label-text-color) !important; + background: rgb(var(--accent-color)); } .ui.toggle.checkbox input:checked~label:before { @@ -1060,7 +1069,7 @@ footer { .ui.toggle.checkbox input:checked~label, .ui.toggle.checkbox label { - color: var(--text) !important; + color: var(--label-text-color) !important; } .ui.toggle.checkbox label:before, @@ -1072,7 +1081,7 @@ footer { .ui.toggle.checkbox input:focus:checked~label, .ui.checkbox input:focus~label, .ui.checkbox input:focus~label:after { - color: var(--text-hover) !important; + color: var(--label-text-color) !important; } .ui.blue.button, @@ -1167,7 +1176,7 @@ footer { .ui.basic.blue.button, .ui.basic.blue.buttons .button { - box-shadow: inset 0 0 0 1px var(--accent-color) !important; + box-shadow: inset 0 0 0 1px rgb(var(--accent-color)) !important; color: var(--button-text) !important; } @@ -1195,7 +1204,7 @@ footer { .ui.basic.button:hover, .ui.basic.buttons .button:focus, .ui.basic.buttons .button:hover { - background: rgb(255 255 255 / 8%); + background: rgb(0 0 0 / 15%); color: var(--button-text); } @@ -1224,14 +1233,14 @@ footer { .ui.basic.labels .label { background: none var(--button-color); border: 1px solid rgba(34, 36, 38, .15); - color: var(--button-text); + color: var(--label-text-color); } .repo-buttons .ui.basic.labels a.label:hover, a.ui.basic.label:hover { text-decoration: none; background: none var(--button-color-hover); - color: var(--button-text); + color: var(--label-text-color); box-shadow: none; } @@ -1253,9 +1262,10 @@ a.ui.basic.label:hover { color: var(--button-text); } */ -.ui.label { - background-color: rgb(255 255 255 / 10%); - color: #fff; +.ui.label, +.ui.menu .item>.label { + background-color: rgb(var(--accent-color)); + color: var(--label-text-color); } .ui.labels a.label:hover, @@ -1266,14 +1276,14 @@ a.ui.label:hover { .ui .sha.label { background: var(--button-color) !important; - color: var(--button-text) !important; + color: var(--label-text-color) !important; border: 1px solid var(--button-color) !important; } a.ui.label:hover, a.ui.labels .label:hover { background: var(--button-color-hover); - color: var(--button-text); + color: var(--label-text-color); } .repository #commits-table td.sha .sha.label, @@ -1296,7 +1306,7 @@ a.ui.labels .label:hover { .repository.file.list #repo-files-table tbody .svg.octicon-file-directory, .repository.file.list #repo-files-table tbody .svg.octicon-file-submodule { - color: var(--accent-color); + color: rgb(var(--accent-color)); } /* FORMS */ @@ -1339,7 +1349,7 @@ input { .ui.form input[type=time]:focus, .ui.form input[type=url]:focus { color: var(--text); - border-color: rgb(255 255 255 / 8%); + border-color: rgb(0 0 0 / 15%); border-radius: .28571429rem; background: rgb(0 0 0 / 50%); box-shadow: inset 0 0 0 0 rgba(34, 36, 38, .35); @@ -1402,7 +1412,7 @@ textarea:hover { } .ui.action.input:not([class*="left action"])>input:focus { - border-right-color: var(--accent-color); + border-right-color: rgb(var(--accent-color)); } /* MARKDOWN */ @@ -1448,41 +1458,41 @@ textarea:hover { /* HIGHLIGHTING */ ::-webkit-selection { - background-color: var(--accent-color) !important; + background-color: rgb(var(--accent-color)) !important; color: var(--text-hover) !important; } ::-moz-selection { - background-color: var(--accent-color) !important; + background-color: rgb(var(--accent-color)) !important; color: var(--text-hover) !important; } ::selection { - background-color: var(--accent-color) !important; + background-color: rgb(var(--accent-color)) !important; color: var(--text-hover) !important; } textarea::-webkit-selection, input::-webkit-selection { - background-color: var(--accent-color) !important; + background-color: rgb(var(--accent-color)) !important; color: var(--text-hover) !important; } textarea::-moz-selection, input::-moz-selection { - background-color: var(--accent-color) !important; + background-color: rgb(var(--accent-color)) !important; color: var(--text-hover) !important; } textarea::-moz-selection, input::-moz-selection { - background-color: var(--accent-color) !important; + background-color: rgb(var(--accent-color)) !important; color: var(--text-hover) !important; } textarea::selection, input::selection { - background-color: var(--accent-color) !important; + background-color: rgb(var(--accent-color)) !important; color: var(--text-hover) !important; } diff --git a/CSS/themes/gitea/hotline.css b/CSS/themes/gitea/hotline.css index d221bea2..56897d27 100644 --- a/CSS/themes/gitea/hotline.css +++ b/CSS/themes/gitea/hotline.css @@ -14,22 +14,14 @@ /* GITEA HOTLINE THEME */ @import url(https://theme-park.dev/CSS/themes/gitea/gitea-base.css); @import url(https://theme-park.dev/CSS/themes/gitea/chroma.css); -:root { - --main-bg-color: radial-gradient(ellipse at center, #F44336 0%, #0b3161 100%) center center/cover no-repeat fixed; - --modal-bg-color: radial-gradient(ellipse at top, #F44336 0%, #0b3161 100%) center center/cover no-repeat fixed; - --button-color: hsla(0,0%,100%,.15); - --button-color-hover: hsla(0,0%,100%,.30); - --button-text: #eee; - --accent-color: #F44336; - --accent-color-hover: #0b3161; - --text: #eee; - --text-hover: #fff; - --text-muted: #bbb; - --link-hover: #F44336; +@import url(https://theme-park.dev/CSS/variables/hotline.css); - --heatmap-color-1: #690000; - --heatmap-color-2: #890000; - --heatmap-color-3: #AC0002; - --heatmap-color-4: #D0191D; - --heatmap-color-5: #F44336; +/* APP VARS */ +:root { + --color-secondary-alpha-70: rgba(0, 0, 0, 0.35); + --color-primary-light-4: #690000; + --color-primary-light-2: #890000; + --color-primary: #AC0002; + --color-primary-dark-2: #D0191D; + --color-primary-dark-4: #F44336; } \ No newline at end of file diff --git a/CSS/themes/gitea/organizr-dark.css b/CSS/themes/gitea/organizr-dark.css index c9e1bae3..2cfaad15 100644 --- a/CSS/themes/gitea/organizr-dark.css +++ b/CSS/themes/gitea/organizr-dark.css @@ -14,22 +14,14 @@ /* GITEA ORGANIZR-DARK THEME */ @import url(https://theme-park.dev/CSS/themes/gitea/gitea-base.css); @import url(https://theme-park.dev/CSS/themes/gitea/chroma.css); -:root { - --main-bg-color: #1f1f1f; - --modal-bg-color: #1b1b1b; - --button-color: #2cabe3; - --button-color-hover: rgb(44 171 227 / .8); - --button-text: #eee; - --accent-color:#2cabe3; - --accent-color-hover: #fff; - --text: #96a2b4; - --text-hover: #fff; - --text-muted: #bbb; - --link-color: #2cabe3; +@import url(https://theme-park.dev/CSS/variables/organizr-dark.css); - --heatmap-color-1: #002A57; - --heatmap-color-2: #004878; - --heatmap-color-3: #00679A; - --heatmap-color-4: #0088BE; - --heatmap-color-5: #2CABE3; +/* APP VARS */ +:root { + --color-secondary-alpha-70: rgba(0, 0, 0, 0.35); + --color-primary-light-4: #002A57; + --color-primary-light-2: #004878; + --color-primary: #00679A; + --color-primary-dark-2: #0088BE; + --color-primary-dark-4: #2CABE3; } \ No newline at end of file diff --git a/CSS/themes/gitea/plex.css b/CSS/themes/gitea/plex.css index a1c5c6a7..675f8283 100644 --- a/CSS/themes/gitea/plex.css +++ b/CSS/themes/gitea/plex.css @@ -14,22 +14,14 @@ /* GITEA PLEX THEME */ @import url(https://theme-park.dev/CSS/themes/gitea/gitea-base.css); @import url(https://theme-park.dev/CSS/themes/gitea/chroma.css); -:root { - --main-bg-color: url("https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/blur-noise.png"), url("https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/preset-light2.png") center center/cover no-repeat fixed; - --modal-bg-color: url("https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/blur-noise.png"), url("https://raw.githubusercontent.com/gilbN/theme.park/master/Resources/preset-dark2.png") center center/cover no-repeat fixed; - --button-color: #cc7b19; - --button-color-hover: #e59029; - --button-text: #eee; - --accent-color: #e5a00d; - --accent-color-hover: #ffc107; - --text: #eee; - --text-hover: #fff; - --text-muted: #bbb; - --link-color:#fff; +@import url(https://theme-park.dev/CSS/variables/plex.css); - --heatmap-color-1: #492000; - --heatmap-color-2: #6E4500; - --heatmap-color-3: #9B6C00; - --heatmap-color-4: #CC9500; - --heatmap-color-5: #FFC107; +/* APP VARS */ +:root { + --color-secondary-alpha-70: rgba(0, 0, 0, 0.35); + --color-primary-light-4: #492000; + --color-primary-light-2: #6E4500; + --color-primary: #9B6C00; + --color-primary-dark-2: #CC9500; + --color-primary-dark-4: #FFC107; } \ No newline at end of file diff --git a/CSS/themes/gitea/space-gray.css b/CSS/themes/gitea/space-gray.css index e8b1ea42..6ce3907f 100644 --- a/CSS/themes/gitea/space-gray.css +++ b/CSS/themes/gitea/space-gray.css @@ -14,23 +14,14 @@ /* GITEA SPACE GRAY THEME */ @import url(https://theme-park.dev/CSS/themes/gitea/gitea-base.css); @import url(https://theme-park.dev/CSS/themes/gitea/chroma.css); -:root { - --main-bg-color: radial-gradient( ellipse at center, rgba(87,108,117,1) 0%, rgba(37,50,55,1) 100.2% ) center center/cover no-repeat fixed; - --modal-bg-color: radial-gradient( ellipse at top, rgba(87,108,117,1) 0%, rgba(37,50,55,1) 100.2% ) center center/cover no-repeat fixed; - --button-color: #607D8B; - --button-color-hover: #81a6b7; - --button-text: #eee; - --accent-color: #81a6b7; - --accent-color-hover: #81a6b7; - --text: #eee; - --text-hover: #fff; - --text-muted: #bbb; - --link-color: #81a6b7; +@import url(https://theme-park.dev/CSS/variables/space-gray.css); - --heatmap-color-1: #002634; - --heatmap-color-2: #1D4352; - --heatmap-color-3: #3E6272; - --heatmap-color-4: #5F8394; - --heatmap-color-5: #81A6B7; - +/* APP VARS */ +:root { + --color-secondary-alpha-70: rgba(0, 0, 0, 0.35); + --color-primary-light-4: #002634; + --color-primary-light-2: #1D4352; + --color-primary: #3E6272; + --color-primary-dark-2: #5F8394; + --color-primary-dark-4: #81A6B7; } \ No newline at end of file