This commit is contained in:
Free 2021-08-22 02:37:34 +02:00
parent a8dc351755
commit 57e3ad4c39

View file

@ -1,6 +1,6 @@
/* ==UserStyle== /* ==UserStyle==
@name Gitea Modern @name Gitea Modern
@version 1.0.4 @version 1.0.5
@description A modern style for Gitea and Codeberg! @description A modern style for Gitea and Codeberg!
@updateURL https://codeberg.org/Freeplay/CSS-Styles/raw/branch/main/Gitea/theme-gitea-modern.user.css @updateURL https://codeberg.org/Freeplay/CSS-Styles/raw/branch/main/Gitea/theme-gitea-modern.user.css
@homepageURL https://codeberg.org/Freeplay/CSS-Styles @homepageURL https://codeberg.org/Freeplay/CSS-Styles
@ -29,16 +29,16 @@
text-decoration: underline; text-decoration: underline;
text-underline-offset: 5px; text-underline-offset: 5px;
} }
* { *:not(input) {
outline: 0px dashed var(--color-primary); outline: 0px dashed var(--color-primary);
outline-offset: -2px; outline-offset: -3px;
transition: outline-color 0.5s, outline-offset 0.5s; transition: outline-color 0.5s, outline-offset 0.5s;
} }
:focus-visible:not(input) { :focus-visible:not(input) {
box-shadow: 0 0 18px 0px var(--color-primary) !important; box-shadow: 0 0 5px 0px var(--color-primary) !important;
border-radius: 2px; border-radius: 2px;
outline: 2px solid var(--color-primary) !important; outline: 2px solid var(--color-primary) !important;
outline-offset: 2px; outline-offset: 0px;
} }
.ui.buttons .ui.basic.button { .ui.buttons .ui.basic.button {
border-radius: 0; border-radius: 0;
@ -114,8 +114,7 @@
border: 0 !important; border: 0 !important;
} }
.input.action.fluid:focus-within { .input.action.fluid:focus-within {
outline: 1px solid var(--color-primary); border-color: var(--color-primary) !important;
outline-offset: -1px;
} }
.ui.form + .ui.divider { .ui.form + .ui.divider {
display: none; display: none;
@ -520,6 +519,17 @@
align-self: flex-end; align-self: flex-end;
align-content: flex-start; align-content: flex-start;
min-height: calc(100vh - 40px); min-height: calc(100vh - 40px);
z-index: 2;
}
.page-content.repository:not(.issues.repository.milestones):not(.new:not(.issue)) .header-wrapper .tabs::before {
content: "";
position: absolute;
inset: 0;
left: 20px;
right: 50px;
background-color: var(--color-body);
box-shadow: 0 0 20px 20px var(--color-body);
opacity: 0.8;
} }
.page-content.repository:not(.issues.repository.milestones):not(.new:not(.issue)) .header-wrapper .tabs .tabular { .page-content.repository:not(.issues.repository.milestones):not(.new:not(.issue)) .header-wrapper .tabs .tabular {
flex-direction: column !important; flex-direction: column !important;
@ -592,6 +602,33 @@
.page-content.repository:not(.issues.repository.milestones):not(.new:not(.issue)) > .ui.container { .page-content.repository:not(.issues.repository.milestones):not(.new:not(.issue)) > .ui.container {
width: 100%; width: 100%;
} }
#project-board {
width: calc(100vw + 10px);
max-width: unset;
justify-self: center;
margin-left: -100px;
margin-bottom: calc(-100vh + 350px);
overflow-x: auto;
scrollbar-color: var(--color-primary) transparent;
}
#project-board > .board {
overflow: visible;
margin: 0 auto;
padding-left: 100px;
box-sizing: content-box;
width: 1227px;
}
#project-board > .board::after {
content: "";
display: flex;
min-width: 100px;
}
#project-board > .board .board-column {
height: calc(100vh - 150px);
}
#project-board > .board .card {
box-sizing: border-box;
}
} }
.page-content.repository:not(.milestones) { .page-content.repository:not(.milestones) {
width: 1300px; width: 1300px;
@ -870,6 +907,13 @@
.page-content.repository:not(.milestones) > .ui.container .issue.list { .page-content.repository:not(.milestones) > .ui.container .issue.list {
margin-top: -8px !important; margin-top: -8px !important;
} }
.page-content.repository:not(.milestones) > .ui.container .diff-box.sticky {
margin: 0 -1px;
border-bottom: 0;
}
.page-content.repository:not(.milestones) > .ui.container .sticky-2nd-row {
box-shadow: 0 -2px 0 2px var(--color-body);
}
.page-content.repository:not(.milestones) > .ui.container .ui.grid > .eleven { .page-content.repository:not(.milestones) > .ui.container .ui.grid > .eleven {
margin-left: 1rem; margin-left: 1rem;
} }
@ -1073,9 +1117,21 @@
padding-bottom: 6px !important; padding-bottom: 6px !important;
position: relative; position: relative;
} }
.issue.list li:hover, .issue.list li:hover:before,
.milestone.list li:hover { .milestone.list li:hover:before,
box-shadow: inset 0 0 600px -300px var(--color-primary); .issue.list li:focus-within:before,
.milestone.list li:focus-within:before {
content: "";
position: absolute;
inset: 0;
background-color: var(--color-primary);
z-index: 0;
opacity: 0.07;
pointer-events: none;
}
.issue.list li > *,
.milestone.list li > * {
z-index: 1;
} }
.issue.list li .issue-item-left, .issue.list li .issue-item-left,
.milestone.list li .issue-item-left { .milestone.list li .issue-item-left {
@ -1308,9 +1364,9 @@
margin: 0 -2px; margin: 0 -2px;
margin-bottom: 1.5rem; margin-bottom: 1.5rem;
position: sticky; position: sticky;
top: 0px !important; top: -2px !important;
margin-top: -40px; margin-top: -42px;
height: 40px; height: 42px;
z-index: 9999; z-index: 9999;
background-color: var(--color-body); background-color: var(--color-body);
} }
@ -1338,7 +1394,7 @@
position: sticky; position: sticky;
margin: 0 !important; margin: 0 !important;
margin-left: -100vw !important; margin-left: -100vw !important;
margin-top: 40px !important; margin-top: 42px !important;
width: 200vw; width: 200vw;
display: block; display: block;
border-bottom: 1px solid var(--color-secondary); border-bottom: 1px solid var(--color-secondary);
@ -1466,6 +1522,7 @@
} }
.ui.container > .news .ui.grid ul, .ui.container > .news .ui.grid ul,
.feeds > .news .ui.grid ul { .feeds > .news .ui.grid ul {
margin-top: 0;
border-left: 4px solid var(--color-secondary); border-left: 4px solid var(--color-secondary);
} }
.ui.container > .news .divider, .ui.container > .news .divider,
@ -1502,7 +1559,7 @@
} }
.ui.repository.list .item:focus-within, .ui.repository.list .item:focus-within,
.ui.user.list .item:focus-within { .ui.user.list .item:focus-within {
outline: 1px solid var(--color-primary) !important; border-color: var(--color-primary) !important;
} }
.ui.repository.list .item .header, .ui.repository.list .item .header,
.ui.user.list .item .header { .ui.user.list .item .header {
@ -1592,18 +1649,28 @@
overflow-x: auto; overflow-x: auto;
scrollbar-width: none; scrollbar-width: none;
margin-top: 8px; margin-top: 8px;
border-radius: 100px;
}
.ui.repository.list .item .description .tags::-webkit-scrollbar,
.ui.user.list .item .description .tags::-webkit-scrollbar {
display: none;
} }
.ui.repository.list .item .description .tags a > div, .ui.repository.list .item .description .tags a > div,
.ui.user.list .item .description .tags a > div { .ui.user.list .item .description .tags a > div {
width: max-content !important; width: max-content !important;
} }
.ui.repository.list .item .description .tags a:last-child,
.ui.user.list .item .description .tags a:last-child {
padding-right: 100px;
}
.ui.repository.list .item .description .tags::after, .ui.repository.list .item .description .tags::after,
.ui.user.list .item .description .tags::after { .ui.user.list .item .description .tags::after {
content: ""; content: "";
min-width: 100px; min-width: 100px;
margin-left: 100px; margin-left: -100px;
height: 100%; height: 100%;
position: sticky; position: sticky;
display: flex;
right: 0px; right: 0px;
background: linear-gradient(to right, transparent, var(--color-box-body)); background: linear-gradient(to right, transparent, var(--color-box-body));
pointer-events: none; pointer-events: none;
@ -1637,7 +1704,7 @@
margin: auto; margin: auto;
max-width: 100%; max-width: 100%;
padding: 30px 0; padding: 30px 0;
width: 1300px; width: 1400px;
margin-bottom: -45px; margin-bottom: -45px;
/* Move Navbar to the side */ /* Move Navbar to the side */
/* Main Content */ /* Main Content */
@ -1742,6 +1809,7 @@
flex-grow: 1; flex-grow: 1;
z-index: 1; z-index: 1;
padding: 15px var(--container-padding-x) !important; padding: 15px var(--container-padding-x) !important;
padding-bottom: var(--container-padding-x) !important;
margin: 0 auto !important; margin: 0 auto !important;
} }
.dashboard > .ui.container > .ui.stackable.grid > .column { .dashboard > .ui.container > .ui.stackable.grid > .column {
@ -1749,6 +1817,9 @@
margin: 0 auto; margin: 0 auto;
flex-grow: 1; flex-grow: 1;
} }
.dashboard > .ui.container > .ui.stackable.grid > .column #user-heatmap + .divider {
border-bottom: 0;
}
.dashboard > .ui.container > .ui.stackable.grid > .column .ui.secondary.menu, .dashboard > .ui.container > .ui.stackable.grid > .column .ui.secondary.menu,
.dashboard > .ui.container > .ui.stackable.grid > .column .ui.stackable.grid { .dashboard > .ui.container > .ui.stackable.grid > .column .ui.stackable.grid {
margin-left: 0 !important; margin-left: 0 !important;
@ -1766,7 +1837,7 @@
} }
.dashboard > .ui.container > .ui.stackable.grid .four.wide.column > .menu a { .dashboard > .ui.container > .ui.stackable.grid .four.wide.column > .menu a {
display: flex; display: flex;
flex: 1 0 max-content; flex: 1 0 auto;
min-width: 200px; min-width: 200px;
max-width: calc(100% - 12px); max-width: calc(100% - 12px);
border: 1px solid var(--color-secondary); border: 1px solid var(--color-secondary);
@ -1911,14 +1982,19 @@
.dashboard > .ui.container #app .dashboard-orgs li a .item-name { .dashboard > .ui.container #app .dashboard-orgs li a .item-name {
display: flex; display: flex;
align-items: center; align-items: center;
max-width: unset;
margin-right: 10px;
} }
.dashboard > .ui.container #app .dashboard-repos li a .item-name svg, .dashboard > .ui.container #app .dashboard-repos li a .item-name svg,
.dashboard > .ui.container #app .dashboard-orgs li a .item-name svg { .dashboard > .ui.container #app .dashboard-orgs li a .item-name svg {
margin-right: 8px !important; margin-right: 8px !important;
min-width: 16px;
} }
.dashboard > .ui.container #app .dashboard-repos li a strong, .dashboard > .ui.container #app .dashboard-repos li a strong,
.dashboard > .ui.container #app .dashboard-orgs li a strong { .dashboard > .ui.container #app .dashboard-orgs li a strong {
font-weight: 700; font-weight: 700;
text-overflow: ellipsis;
overflow: hidden;
} }
footer { footer {
border: 0; border: 0;
@ -2014,3 +2090,10 @@
} }
} }
} }
@-moz-document domain("codeberg.org") {
.item.brand a {
border-radius: 100px;
background-color: var(--color-primary) !important;
box-shadow: 0 1px 2px var(--color-primary);
}
}