forked from mirrors/Gitea-Modern
Merge pull request '1.0.3' (#6) from dev into main
Reviewed-on: https://codeberg.org/Freeplay/CSS-Styles/pulls/6
This commit is contained in:
Free
commit
990a35c242
3 changed files with 1887 additions and 1871 deletions
|
|
@ -1,4 +1,8 @@
|
|||
/* This code should work with any preprocessor that supports nesting and the use of "&", like "Stylus" (Recommended) and "Less". */
|
||||
/* Update 1.0.3
|
||||
- Fixed table stretching due to the grid
|
||||
- Better keyboard accessability
|
||||
- Fixed Codeberg dropdown
|
||||
*/
|
||||
:root {
|
||||
--base-border-radius: 6px;
|
||||
}
|
||||
|
|
@ -13,6 +17,17 @@ a[rel*="nofollow"]:not(.ui):focus,
|
|||
text-decoration: underline;
|
||||
text-underline-offset: 5px;
|
||||
}
|
||||
* {
|
||||
outline: 0px dashed var(--color-primary);
|
||||
outline-offset: -2px;
|
||||
transition: outline-color 0.5s, outline-offset 0.5s;
|
||||
}
|
||||
:focus-visible:not(input) {
|
||||
box-shadow: 0 0 18px 0px var(--color-primary) !important;
|
||||
border-radius: 2px;
|
||||
outline: 2px solid var(--color-primary) !important;
|
||||
outline-offset: 2px;
|
||||
}
|
||||
/*** Change Border Radius's ***/
|
||||
.ui.buttons .ui.basic.button {
|
||||
border-radius: 0;
|
||||
|
|
@ -139,6 +154,31 @@ a[rel*="nofollow"]:not(.ui):focus,
|
|||
.page-content:not(.home) > .middle > .column {
|
||||
padding: 0 !important;
|
||||
}
|
||||
/* No Script Message */
|
||||
.full.height > span[style="display: inline !important;"]:first-child {
|
||||
margin: auto;
|
||||
line-height: 40px;
|
||||
padding: 30px;
|
||||
text-align: center;
|
||||
/* Remove stuff that isn't needed when JS is disabled */
|
||||
}
|
||||
.full.height > span[style="display: inline !important;"]:first-child::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: 40px;
|
||||
background: var(--color-navbar);
|
||||
border-bottom: 1px solid var(--color-secondary);
|
||||
z-index: -1;
|
||||
}
|
||||
.full.height > span[style="display: inline !important;"]:first-child ~ .page-content #app,
|
||||
.full.height > span[style="display: inline !important;"]:first-child ~ .page-content #user-heatmap,
|
||||
.full.height > span[style="display: inline !important;"]:first-child ~ .page-content #user-heatmap + .divider {
|
||||
display: none !important;
|
||||
}
|
||||
/*** Popups ***/
|
||||
/* Tooltips */
|
||||
.popup.tiny.inverted {
|
||||
background: var(--color-body);
|
||||
|
|
@ -176,30 +216,6 @@ a[rel*="nofollow"]:not(.ui):focus,
|
|||
.settings > .ui.container {
|
||||
max-width: 1150px !important;
|
||||
}
|
||||
/* No Script Message */
|
||||
.full.height > span[style="display: inline !important;"]:first-child {
|
||||
margin: auto;
|
||||
line-height: 40px;
|
||||
padding: 30px;
|
||||
text-align: center;
|
||||
/* Remove stuff that isn't needed when JS is disabled */
|
||||
}
|
||||
.full.height > span[style="display: inline !important;"]:first-child::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: 40px;
|
||||
background: var(--color-navbar);
|
||||
border-bottom: 1px solid var(--color-secondary);
|
||||
z-index: -1;
|
||||
}
|
||||
.full.height > span[style="display: inline !important;"]:first-child ~ .page-content #app,
|
||||
.full.height > span[style="display: inline !important;"]:first-child ~ .page-content #user-heatmap,
|
||||
.full.height > span[style="display: inline !important;"]:first-child ~ .page-content #user-heatmap + .divider {
|
||||
display: none !important;
|
||||
}
|
||||
/** Other Elements **/
|
||||
#user-heatmap {
|
||||
overflow: auto hidden;
|
||||
|
|
@ -231,6 +247,20 @@ a[rel*="nofollow"]:not(.ui):focus,
|
|||
.label:not(.basic) svg {
|
||||
margin-right: 4px;
|
||||
}
|
||||
/* Alerts */
|
||||
.alert-primary.p-10 {
|
||||
border: 0 !important;
|
||||
padding: 20px !important;
|
||||
}
|
||||
.alert-primary.p-10 .close span {
|
||||
font-size: 1.7em;
|
||||
font-weight: 200;
|
||||
padding-right: 6px;
|
||||
}
|
||||
.alert-primary.p-10 h4 {
|
||||
margin-right: 1.7em;
|
||||
font-weight: 600;
|
||||
}
|
||||
/*** Menu's ***/
|
||||
.ui.tabular.menu,
|
||||
.ui.tight.menu {
|
||||
|
|
@ -376,6 +406,12 @@ html {
|
|||
box-sizing: border-box;
|
||||
transition: border 0.5s, padding 0.7s;
|
||||
}
|
||||
#navbar > .item:not(.brand) > span,
|
||||
#navbar > .right > .item > span {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
#navbar > .item:not(.brand):hover,
|
||||
#navbar > .right > .item:hover,
|
||||
#navbar > .item:not(.brand).active,
|
||||
|
|
@ -509,6 +545,7 @@ html {
|
|||
background: none;
|
||||
color: var(--color-text);
|
||||
opacity: 0.7;
|
||||
border-radius: 12px !important;
|
||||
}
|
||||
.page-content.repository:not(.issues.repository.milestones):not(.new:not(.issue)) .header-wrapper .tabs .tabular .item svg {
|
||||
margin: 0;
|
||||
|
|
@ -732,7 +769,6 @@ html {
|
|||
}
|
||||
.page-content.repository:not(.milestones) > .ui.container #repo-files-table {
|
||||
margin-top: 0;
|
||||
overflow: hidden;
|
||||
background: none !important;
|
||||
}
|
||||
.page-content.repository:not(.milestones) > .ui.container #repo-files-table thead {
|
||||
|
|
@ -769,6 +805,15 @@ html {
|
|||
display: inline-flex !important;
|
||||
transform: translateY(1px);
|
||||
}
|
||||
.page-content.repository:not(.milestones) > .ui.container #repo-files-table thead .message-wrapper {
|
||||
overflow: visible;
|
||||
display: inline-flex;
|
||||
}
|
||||
.page-content.repository:not(.milestones) > .ui.container #repo-files-table thead .message-wrapper a {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
max-width: 100%;
|
||||
}
|
||||
.page-content.repository:not(.milestones) > .ui.container #repo-files-table thead .commit-body {
|
||||
padding: 6px;
|
||||
padding-right: 0;
|
||||
|
|
@ -789,7 +834,15 @@ html {
|
|||
.page-content.repository:not(.milestones) > .ui.container #repo-files-table tr:focus-within td:nth-child(2)::before {
|
||||
opacity: 0.1;
|
||||
}
|
||||
.page-content.repository:not(.milestones) > .ui.container #repo-files-table .truncate {
|
||||
overflow: visible;
|
||||
display: inline-flex;
|
||||
}
|
||||
.page-content.repository:not(.milestones) > .ui.container #repo-files-table .truncate a {
|
||||
margin: -8px 0;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
max-width: 100%;
|
||||
width: 100%;
|
||||
color: var(--color-text);
|
||||
}
|
||||
|
|
@ -842,6 +895,8 @@ html {
|
|||
max-width: 100% !important;
|
||||
display: grid;
|
||||
grid-template-columns: calc(100% - 100px) 100px;
|
||||
grid-template-rows: min-content !important;
|
||||
align-items: flex-start;
|
||||
}
|
||||
.page-content.repository:not(.milestones).file > .ui.container > *,
|
||||
.page-content.repository:not(.milestones).commits > .ui.container > *,
|
||||
|
|
@ -852,7 +907,7 @@ html {
|
|||
.page-content.repository:not(.milestones).commits > .ui.container .repository-summary,
|
||||
.page-content.repository:not(.milestones).branches > .ui.container .repository-summary {
|
||||
grid-column: 2;
|
||||
grid-row: 1/span 6;
|
||||
grid-row: 1/span 50;
|
||||
border: 0;
|
||||
margin-top: 12px !important;
|
||||
margin-left: 30px;
|
||||
|
|
@ -1407,6 +1462,9 @@ html {
|
|||
.ui.repository.list .item:focus-within {
|
||||
box-shadow: var(--lm-shadow);
|
||||
}
|
||||
.ui.repository.list .item:focus-within {
|
||||
outline: 1px solid var(--color-primary) !important;
|
||||
}
|
||||
.ui.repository.list .item .header {
|
||||
display: contents !important;
|
||||
}
|
||||
|
|
@ -1695,15 +1753,6 @@ html {
|
|||
margin-right: 0 !important;
|
||||
margin-bottom: 1rem !important;
|
||||
}
|
||||
.dashboard > .ui.container #app codeberg-announcement-widget > div .close span {
|
||||
font-size: 1.7em;
|
||||
font-weight: 200;
|
||||
margin-right: 2px;
|
||||
}
|
||||
.dashboard > .ui.container #app codeberg-announcement-widget > div h4 {
|
||||
margin-right: 1.7em;
|
||||
font-weight: 600;
|
||||
}
|
||||
.dashboard > .ui.container #app .tabable {
|
||||
background: none;
|
||||
margin-right: 0 !important;
|
||||
|
|
|
|||
|
|
@ -1,7 +1,14 @@
|
|||
/* This code should work with any preprocessor that supports nesting and the use of "&", like "Stylus" (Recommended) and "Less". */
|
||||
|
||||
|
||||
/* Update 1.0.3
|
||||
- Fixed table stretching due to the grid
|
||||
- Better keyboard accessability
|
||||
- Fixed Codeberg dropdown
|
||||
*/
|
||||
|
||||
:root {
|
||||
--base-border-radius: 6px;
|
||||
|
||||
}
|
||||
html.theme-gitea, html.theme-arc-green {
|
||||
--fonts-override: var(--fonts-regular);
|
||||
|
|
@ -12,6 +19,17 @@ a[rel*="nofollow"]:not(.ui), .link:not(.ui) {
|
|||
text-underline-offset: 5px;
|
||||
}
|
||||
}
|
||||
* {
|
||||
outline: 0px dashed var(--color-primary);
|
||||
outline-offset: -2px;
|
||||
transition: outline-color .5s, outline-offset .5s;
|
||||
}
|
||||
:focus-visible:not(input) {
|
||||
box-shadow: 0 0 18px 0px var(--color-primary) !important;
|
||||
border-radius: 2px;
|
||||
outline: 2px solid var(--color-primary) !important;
|
||||
outline-offset: 2px;
|
||||
}
|
||||
|
||||
@keyframes slideInY {
|
||||
from { opacity: 0; transform: scale(.97); }
|
||||
|
|
@ -145,6 +163,37 @@ a[rel*="nofollow"]:not(.ui), .link:not(.ui) {
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
/* No Script Message */
|
||||
.full.height > span[style="display: inline !important;"]:first-child {
|
||||
margin: auto;
|
||||
line-height: 40px;
|
||||
padding: 30px;
|
||||
text-align: center;
|
||||
&::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: 40px;
|
||||
background: var(--color-navbar);
|
||||
border-bottom: 1px solid var(--color-secondary);
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
/* Remove stuff that isn't needed when JS is disabled */
|
||||
& ~ .page-content {
|
||||
#app, #user-heatmap, #user-heatmap + .divider {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
/*** Popups ***/
|
||||
/* Tooltips */
|
||||
.popup.tiny.inverted {
|
||||
background: var(--color-body);
|
||||
|
|
@ -186,32 +235,8 @@ a[rel*="nofollow"]:not(.ui), .link:not(.ui) {
|
|||
}
|
||||
|
||||
|
||||
/* No Script Message */
|
||||
.full.height > span[style="display: inline !important;"]:first-child {
|
||||
margin: auto;
|
||||
line-height: 40px;
|
||||
padding: 30px;
|
||||
text-align: center;
|
||||
&::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: 40px;
|
||||
background: var(--color-navbar);
|
||||
border-bottom: 1px solid var(--color-secondary);
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
/* Remove stuff that isn't needed when JS is disabled */
|
||||
& ~ .page-content {
|
||||
#app, #user-heatmap, #user-heatmap + .divider {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/** Other Elements **/
|
||||
#user-heatmap {
|
||||
|
|
@ -248,6 +273,26 @@ a[rel*="nofollow"]:not(.ui), .link:not(.ui) {
|
|||
}
|
||||
|
||||
|
||||
|
||||
/* Alerts */
|
||||
.alert-primary.p-10 {
|
||||
border: 0 !important;
|
||||
padding: 20px !important;
|
||||
.close {
|
||||
// padding: 10px;
|
||||
span {
|
||||
font-size: 1.7em;
|
||||
font-weight: 200;
|
||||
padding-right: 6px;
|
||||
}
|
||||
}
|
||||
h4 {
|
||||
margin-right: 1.7em;
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/*** Menu's ***/
|
||||
.ui.tabular.menu, .ui.tight.menu {
|
||||
position: relative;
|
||||
|
|
@ -402,6 +447,11 @@ html {
|
|||
background: none !important;
|
||||
box-sizing: border-box;
|
||||
transition: border .5s, padding .7s;
|
||||
& > span {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
&:hover, &.active, &:focus {
|
||||
border-bottom: 1px solid var(--color-primary);
|
||||
transition: border .1s;
|
||||
|
|
@ -532,6 +582,7 @@ html {
|
|||
background: none;
|
||||
color: var(--color-text);
|
||||
opacity: .7;
|
||||
border-radius: 12px !important;
|
||||
svg {
|
||||
margin: 0;
|
||||
width: 22px;
|
||||
|
|
@ -762,7 +813,6 @@ html {
|
|||
|
||||
#repo-files-table {
|
||||
margin-top: 0;
|
||||
overflow: hidden;
|
||||
background: none !important;
|
||||
thead {
|
||||
position: relative;
|
||||
|
|
@ -798,6 +848,16 @@ html {
|
|||
transform: translateY(1px);
|
||||
}
|
||||
|
||||
.message-wrapper {
|
||||
overflow: visible;
|
||||
display: inline-flex;
|
||||
a {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.commit-body {
|
||||
padding: 6px;
|
||||
padding-right: 0;
|
||||
|
|
@ -821,7 +881,13 @@ html {
|
|||
}
|
||||
|
||||
.truncate {
|
||||
overflow: visible;
|
||||
display: inline-flex;
|
||||
a {
|
||||
margin: -8px 0;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
max-width: 100%;
|
||||
width: 100%;
|
||||
color: var(--color-text);
|
||||
&:hover, &:focus {
|
||||
|
|
@ -885,12 +951,14 @@ html {
|
|||
max-width: 100% !important;
|
||||
display: grid;
|
||||
grid-template-columns: calc(100% - 100px) 100px;
|
||||
grid-template-rows: min-content !important;
|
||||
align-items: flex-start;
|
||||
& > * {
|
||||
grid-column: 1;
|
||||
}
|
||||
.repository-summary {
|
||||
grid-column: 2;
|
||||
grid-row: 1 / span 6;
|
||||
grid-row: 1 / span 50;
|
||||
border: 0;
|
||||
margin-top: 12px !important;
|
||||
margin-left: 30px;
|
||||
|
|
@ -1330,6 +1398,9 @@ html {
|
|||
&:hover, &:focus-within {
|
||||
box-shadow: var(--lm-shadow);
|
||||
}
|
||||
&:focus-within {
|
||||
outline: 1px solid var(--color-primary) !important;
|
||||
}
|
||||
|
||||
.header {
|
||||
display: contents !important;
|
||||
|
|
@ -1625,15 +1696,6 @@ html {
|
|||
margin-top: 0 !important;
|
||||
margin-right: 0 !important;
|
||||
margin-bottom: 1rem !important;
|
||||
.close span {
|
||||
font-size: 1.7em;
|
||||
font-weight: 200;
|
||||
margin-right: 2px;
|
||||
}
|
||||
h4 {
|
||||
margin-right: 1.7em;
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -1732,3 +1794,4 @@ footer {
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load diff
Loading…
Reference in a new issue