forked from mirrors/Gitea-Modern
Merge pull request '1.0.4' (#7) from dev into main
Reviewed-on: https://codeberg.org/Freeplay/CSS-Styles/pulls/7
This commit is contained in:
Free
commit
3dc7092835
3 changed files with 2247 additions and 1920 deletions
|
|
@ -1,7 +1,7 @@
|
|||
/* Update 1.0.3
|
||||
- Fixed table stretching due to the grid
|
||||
- Better keyboard accessability
|
||||
- Fixed Codeberg dropdown
|
||||
/* Update 1.0.4
|
||||
- Combined feed list to make it more compact, while still looking nice.
|
||||
- Styled User / Organization lists
|
||||
- Added minor blur to tabs in User page
|
||||
*/
|
||||
:root {
|
||||
--base-border-radius: 6px;
|
||||
|
|
@ -970,10 +970,9 @@ html {
|
|||
.page-content.repository:not(.milestones).file > .ui.container .repository-summary .language-stats,
|
||||
.page-content.repository:not(.milestones).commits > .ui.container .repository-summary .language-stats,
|
||||
.page-content.repository:not(.milestones).branches > .ui.container .repository-summary .language-stats {
|
||||
border-radius: 100px !important;
|
||||
border-radius: var(--base-border-radius) !important;
|
||||
overflow: hidden !important;
|
||||
pointer-events: none;
|
||||
top: 0;
|
||||
}
|
||||
.page-content.repository:not(.milestones).file > .ui.container .repository-summary .horizontal.list:not(.two),
|
||||
.page-content.repository:not(.milestones).commits > .ui.container .repository-summary .horizontal.list:not(.two),
|
||||
|
|
@ -1126,7 +1125,7 @@ html {
|
|||
}
|
||||
/*** USER PROFILES & EXPLORE PAGES ***/
|
||||
.explore,
|
||||
.user:not(.list),
|
||||
.page-content.user,
|
||||
.profile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
|
@ -1134,20 +1133,20 @@ html {
|
|||
/* Responsive explore page */
|
||||
}
|
||||
.explore.explore > .ui.container,
|
||||
.user:not(.list).explore > .ui.container,
|
||||
.page-content.user.explore > .ui.container,
|
||||
.profile.explore > .ui.container {
|
||||
max-width: calc(100vw - 40px);
|
||||
width: 3000px !important;
|
||||
padding: 0 calc(10vw - 80px);
|
||||
}
|
||||
.explore.organization > .ui.container:first-child,
|
||||
.user:not(.list).organization > .ui.container:first-child,
|
||||
.page-content.user.organization > .ui.container:first-child,
|
||||
.profile.organization > .ui.container:first-child {
|
||||
padding-top: 30px;
|
||||
padding-bottom: 30px;
|
||||
}
|
||||
.explore.organization > .ui.container:first-child #org-info,
|
||||
.user:not(.list).organization > .ui.container:first-child #org-info,
|
||||
.page-content.user.organization > .ui.container:first-child #org-info,
|
||||
.profile.organization > .ui.container:first-child #org-info {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
|
@ -1155,60 +1154,60 @@ html {
|
|||
justify-content: center;
|
||||
}
|
||||
.explore.organization > .ui.container:first-child #org-info > p,
|
||||
.user:not(.list).organization > .ui.container:first-child #org-info > p,
|
||||
.page-content.user.organization > .ui.container:first-child #org-info > p,
|
||||
.profile.organization > .ui.container:first-child #org-info > p {
|
||||
margin: 0 !important;
|
||||
margin-bottom: 0.2rem !important;
|
||||
}
|
||||
.explore.organization > .ui.container:first-child #org-info .item,
|
||||
.user:not(.list).organization > .ui.container:first-child #org-info .item,
|
||||
.page-content.user.organization > .ui.container:first-child #org-info .item,
|
||||
.profile.organization > .ui.container:first-child #org-info .item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.explore.organization > .ui.container:first-child #org-info .item a,
|
||||
.user:not(.list).organization > .ui.container:first-child #org-info .item a,
|
||||
.page-content.user.organization > .ui.container:first-child #org-info .item a,
|
||||
.profile.organization > .ui.container:first-child #org-info .item a {
|
||||
margin-left: 4px;
|
||||
}
|
||||
.explore.organization .ui.eleven.wide.column::before,
|
||||
.user:not(.list).organization .ui.eleven.wide.column::before,
|
||||
.page-content.user.organization .ui.eleven.wide.column::before,
|
||||
.profile.organization .ui.eleven.wide.column::before {
|
||||
content: unset !important;
|
||||
}
|
||||
.explore > .ui.container,
|
||||
.user:not(.list) > .ui.container,
|
||||
.page-content.user > .ui.container,
|
||||
.profile > .ui.container {
|
||||
max-width: 1350px;
|
||||
width: 100% !important;
|
||||
padding: 0 20px;
|
||||
}
|
||||
.explore > .ui.container[class="ui container"] .five.wide.column,
|
||||
.user:not(.list) > .ui.container[class="ui container"] .five.wide.column,
|
||||
.page-content.user > .ui.container[class="ui container"] .five.wide.column,
|
||||
.profile > .ui.container[class="ui container"] .five.wide.column {
|
||||
width: 320px !important;
|
||||
flex: 1 0 320px !important;
|
||||
position: sticky;
|
||||
bottom: 0;
|
||||
bottom: 10px;
|
||||
align-self: flex-end;
|
||||
min-height: 100vh;
|
||||
}
|
||||
.explore > .ui.container[class="ui container"] .five.wide.column .card,
|
||||
.user:not(.list) > .ui.container[class="ui container"] .five.wide.column .card,
|
||||
.page-content.user > .ui.container[class="ui container"] .five.wide.column .card,
|
||||
.profile > .ui.container[class="ui container"] .five.wide.column .card {
|
||||
width: 100%;
|
||||
border: 0;
|
||||
background: none !important;
|
||||
}
|
||||
.explore > .ui.container[class="ui container"] .five.wide.column .card #profile-avatar,
|
||||
.user:not(.list) > .ui.container[class="ui container"] .five.wide.column .card #profile-avatar,
|
||||
.page-content.user > .ui.container[class="ui container"] .five.wide.column .card #profile-avatar,
|
||||
.profile > .ui.container[class="ui container"] .five.wide.column .card #profile-avatar {
|
||||
padding-left: 0.7rem;
|
||||
padding-right: 2rem !important;
|
||||
padding-top: 0.5rem;
|
||||
}
|
||||
.explore > .ui.container[class="ui container"] .five.wide.column .card #profile-avatar .avatar,
|
||||
.user:not(.list) > .ui.container[class="ui container"] .five.wide.column .card #profile-avatar .avatar,
|
||||
.page-content.user > .ui.container[class="ui container"] .five.wide.column .card #profile-avatar .avatar,
|
||||
.profile > .ui.container[class="ui container"] .five.wide.column .card #profile-avatar .avatar {
|
||||
border-radius: calc(var(--base-border-radius) * 2) !important;
|
||||
box-shadow: 0 4px 12px rgba(0,0,0,0.1);
|
||||
|
|
@ -1218,13 +1217,13 @@ html {
|
|||
max-height: 80vh;
|
||||
}
|
||||
.explore > .ui.container[class="ui container"] .five.wide.column .card .profile-avatar-name,
|
||||
.user:not(.list) > .ui.container[class="ui container"] .five.wide.column .card .profile-avatar-name,
|
||||
.page-content.user > .ui.container[class="ui container"] .five.wide.column .card .profile-avatar-name,
|
||||
.profile > .ui.container[class="ui container"] .five.wide.column .card .profile-avatar-name {
|
||||
font-size: 2rem;
|
||||
display: contents;
|
||||
}
|
||||
.explore > .ui.container[class="ui container"] .five.wide.column .card .profile-avatar-name span,
|
||||
.user:not(.list) > .ui.container[class="ui container"] .five.wide.column .card .profile-avatar-name span,
|
||||
.page-content.user > .ui.container[class="ui container"] .five.wide.column .card .profile-avatar-name span,
|
||||
.profile > .ui.container[class="ui container"] .five.wide.column .card .profile-avatar-name span {
|
||||
text-align: left;
|
||||
font-weight: 600;
|
||||
|
|
@ -1232,12 +1231,12 @@ html {
|
|||
margin: 1.5rem 0;
|
||||
}
|
||||
.explore > .ui.container[class="ui container"] .five.wide.column .card .profile-avatar-name span.header,
|
||||
.user:not(.list) > .ui.container[class="ui container"] .five.wide.column .card .profile-avatar-name span.header,
|
||||
.page-content.user > .ui.container[class="ui container"] .five.wide.column .card .profile-avatar-name span.header,
|
||||
.profile > .ui.container[class="ui container"] .five.wide.column .card .profile-avatar-name span.header {
|
||||
font-weight: 500;
|
||||
letter-spacing: 0.1em;
|
||||
height: 44px;
|
||||
line-height: 50px;
|
||||
height: 39px;
|
||||
line-height: 40px;
|
||||
margin-bottom: -1.2em;
|
||||
margin-top: 0;
|
||||
background: var(--color-body);
|
||||
|
|
@ -1247,17 +1246,17 @@ html {
|
|||
box-shadow: 0 -5px 5px var(--color-body);
|
||||
}
|
||||
.explore > .ui.container[class="ui container"] .five.wide.column .card .profile-avatar-name span.username,
|
||||
.user:not(.list) > .ui.container[class="ui container"] .five.wide.column .card .profile-avatar-name span.username,
|
||||
.page-content.user > .ui.container[class="ui container"] .five.wide.column .card .profile-avatar-name span.username,
|
||||
.profile > .ui.container[class="ui container"] .five.wide.column .card .profile-avatar-name span.username {
|
||||
z-index: 2;
|
||||
}
|
||||
.explore > .ui.container[class="ui container"] .five.wide.column .card .extra,
|
||||
.user:not(.list) > .ui.container[class="ui container"] .five.wide.column .card .extra,
|
||||
.page-content.user > .ui.container[class="ui container"] .five.wide.column .card .extra,
|
||||
.profile > .ui.container[class="ui container"] .five.wide.column .card .extra {
|
||||
border: 0 !important;
|
||||
}
|
||||
.explore > .ui.container[class="ui container"] .five.wide.column .card .extra li,
|
||||
.user:not(.list) > .ui.container[class="ui container"] .five.wide.column .card .extra li,
|
||||
.page-content.user > .ui.container[class="ui container"] .five.wide.column .card .extra li,
|
||||
.profile > .ui.container[class="ui container"] .five.wide.column .card .extra li {
|
||||
border: 0 !important;
|
||||
padding: 0.3rem 0.7rem;
|
||||
|
|
@ -1265,91 +1264,108 @@ html {
|
|||
align-items: center;
|
||||
}
|
||||
.explore > .ui.container[class="ui container"] .five.wide.column .card .extra li svg,
|
||||
.user:not(.list) > .ui.container[class="ui container"] .five.wide.column .card .extra li svg,
|
||||
.page-content.user > .ui.container[class="ui container"] .five.wide.column .card .extra li svg,
|
||||
.profile > .ui.container[class="ui container"] .five.wide.column .card .extra li svg {
|
||||
margin-right: 8px;
|
||||
}
|
||||
.explore > .ui.container[class="ui container"] .five.wide.column .card .extra li .user-orgs,
|
||||
.user:not(.list) > .ui.container[class="ui container"] .five.wide.column .card .extra li .user-orgs,
|
||||
.page-content.user > .ui.container[class="ui container"] .five.wide.column .card .extra li .user-orgs,
|
||||
.profile > .ui.container[class="ui container"] .five.wide.column .card .extra li .user-orgs {
|
||||
justify-content: center;
|
||||
margin-top: 1rem !important;
|
||||
}
|
||||
.explore > .ui.container[class="ui container"] .five.wide.column .card .extra li .user-orgs li,
|
||||
.user:not(.list) > .ui.container[class="ui container"] .five.wide.column .card .extra li .user-orgs li,
|
||||
.page-content.user > .ui.container[class="ui container"] .five.wide.column .card .extra li .user-orgs li,
|
||||
.profile > .ui.container[class="ui container"] .five.wide.column .card .extra li .user-orgs li {
|
||||
flex-grow: 1 !important;
|
||||
}
|
||||
.explore > .ui.container[class="ui container"] .five.wide.column .card .extra li .user-orgs li a,
|
||||
.user:not(.list) > .ui.container[class="ui container"] .five.wide.column .card .extra li .user-orgs li a,
|
||||
.page-content.user > .ui.container[class="ui container"] .five.wide.column .card .extra li .user-orgs li a,
|
||||
.profile > .ui.container[class="ui container"] .five.wide.column .card .extra li .user-orgs li a {
|
||||
width: 100%;
|
||||
}
|
||||
.explore > .ui.container[class="ui container"] .five.wide.column .card .extra li .user-orgs li a img,
|
||||
.user:not(.list) > .ui.container[class="ui container"] .five.wide.column .card .extra li .user-orgs li a img,
|
||||
.page-content.user > .ui.container[class="ui container"] .five.wide.column .card .extra li .user-orgs li a img,
|
||||
.profile > .ui.container[class="ui container"] .five.wide.column .card .extra li .user-orgs li a img {
|
||||
width: 35px;
|
||||
height: 35px;
|
||||
}
|
||||
.explore > .ui.container[class="ui container"] .five.wide.column .card .extra li .render-content p,
|
||||
.user:not(.list) > .ui.container[class="ui container"] .five.wide.column .card .extra li .render-content p,
|
||||
.page-content.user > .ui.container[class="ui container"] .five.wide.column .card .extra li .render-content p,
|
||||
.profile > .ui.container[class="ui container"] .five.wide.column .card .extra li .render-content p {
|
||||
padding: 0.6rem 0;
|
||||
padding-bottom: 0.7rem !important;
|
||||
word-break: normal !important;
|
||||
}
|
||||
.explore > .ui.container[class="ui container"] .five.wide.column .card .extra .follow form,
|
||||
.user:not(.list) > .ui.container[class="ui container"] .five.wide.column .card .extra .follow form,
|
||||
.page-content.user > .ui.container[class="ui container"] .five.wide.column .card .extra .follow form,
|
||||
.profile > .ui.container[class="ui container"] .five.wide.column .card .extra .follow form {
|
||||
margin-top: 1rem;
|
||||
width: 100%;
|
||||
}
|
||||
.explore > .ui.container .eleven.wide.column,
|
||||
.user:not(.list) > .ui.container .eleven.wide.column,
|
||||
.page-content.user > .ui.container .eleven.wide.column,
|
||||
.profile > .ui.container .eleven.wide.column {
|
||||
flex-grow: 100;
|
||||
width: 500px !important;
|
||||
max-width: 100%;
|
||||
}
|
||||
.explore > .ui.container .eleven.wide.column .ui.secondary.stackable.pointing.tight.menu,
|
||||
.user:not(.list) > .ui.container .eleven.wide.column .ui.secondary.stackable.pointing.tight.menu,
|
||||
.page-content.user > .ui.container .eleven.wide.column .ui.secondary.stackable.pointing.tight.menu,
|
||||
.profile > .ui.container .eleven.wide.column .ui.secondary.stackable.pointing.tight.menu {
|
||||
margin: 0 -2px;
|
||||
margin-bottom: 1.5rem;
|
||||
position: sticky;
|
||||
top: 0px !important;
|
||||
margin-top: -45px;
|
||||
height: 45px;
|
||||
margin-top: -40px;
|
||||
height: 40px;
|
||||
z-index: 9999;
|
||||
background-color: var(--color-body);
|
||||
}
|
||||
@supports (backdrop-filter: blur(10px)) {
|
||||
.explore > .ui.container .eleven.wide.column .ui.secondary.stackable.pointing.tight.menu,
|
||||
.page-content.user > .ui.container .eleven.wide.column .ui.secondary.stackable.pointing.tight.menu,
|
||||
.profile > .ui.container .eleven.wide.column .ui.secondary.stackable.pointing.tight.menu {
|
||||
backdrop-filter: blur(10px);
|
||||
background-color: transparent;
|
||||
}
|
||||
.explore > .ui.container .eleven.wide.column .ui.secondary.stackable.pointing.tight.menu::before,
|
||||
.page-content.user > .ui.container .eleven.wide.column .ui.secondary.stackable.pointing.tight.menu::before,
|
||||
.profile > .ui.container .eleven.wide.column .ui.secondary.stackable.pointing.tight.menu::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
background-color: var(--color-body);
|
||||
opacity: 0.8;
|
||||
}
|
||||
}
|
||||
.explore > .ui.container .eleven.wide.column::before,
|
||||
.user:not(.list) > .ui.container .eleven.wide.column::before,
|
||||
.page-content.user > .ui.container .eleven.wide.column::before,
|
||||
.profile > .ui.container .eleven.wide.column::before {
|
||||
content: "";
|
||||
position: sticky;
|
||||
margin: 0 !important;
|
||||
margin-left: -100vw !important;
|
||||
margin-top: 45px !important;
|
||||
margin-top: 40px !important;
|
||||
width: 200vw;
|
||||
display: block;
|
||||
border-bottom: 1px solid var(--color-secondary);
|
||||
top: 44px;
|
||||
top: 39px;
|
||||
z-index: -1;
|
||||
}
|
||||
.explore > .ui.container .item .meta,
|
||||
.user:not(.list) > .ui.container .item .meta,
|
||||
.page-content.user > .ui.container .item .meta,
|
||||
.profile > .ui.container .item .meta {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.explore > .ui.container .item .meta svg,
|
||||
.user:not(.list) > .ui.container .item .meta svg,
|
||||
.page-content.user > .ui.container .item .meta svg,
|
||||
.profile > .ui.container .item .meta svg {
|
||||
margin-right: 4px;
|
||||
}
|
||||
.explore > .ui.container .item .meta a,
|
||||
.user:not(.list) > .ui.container .item .meta a,
|
||||
.page-content.user > .ui.container .item .meta a,
|
||||
.profile > .ui.container .item .meta a {
|
||||
max-width: calc(100% - 20px);
|
||||
white-space: nowrap;
|
||||
|
|
@ -1360,12 +1376,39 @@ html {
|
|||
.ui.container > .news,
|
||||
.feeds > .news {
|
||||
border: 1px solid var(--color-secondary) !important;
|
||||
border-bottom: none !important;
|
||||
background: var(--color-box-body);
|
||||
margin-bottom: 1rem;
|
||||
border-radius: var(--base-border-radius);
|
||||
border-radius: var(--base-border-radius) var(--base-border-radius) 0 0;
|
||||
padding: 10px 12px !important;
|
||||
position: relative;
|
||||
}
|
||||
.ui.container > .news + .news,
|
||||
.feeds > .news + .news {
|
||||
border-radius: 0 !important;
|
||||
}
|
||||
.ui.container > .news:last-child,
|
||||
.feeds > .news:last-child {
|
||||
border-radius: 0 0 var(--base-border-radius) var(--base-border-radius) !important;
|
||||
border-bottom: 1px solid var(--color-secondary) !important;
|
||||
}
|
||||
.ui.container > .news::before,
|
||||
.feeds > .news::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
background: var(--color-primary);
|
||||
opacity: 0;
|
||||
}
|
||||
.ui.container > .news:hover::before,
|
||||
.feeds > .news:hover::before,
|
||||
.ui.container > .news:focus-within::before,
|
||||
.feeds > .news:focus-within::before {
|
||||
opacity: 0.05;
|
||||
}
|
||||
.ui.container > .news .ui.left,
|
||||
.feeds > .news .ui.left {
|
||||
width: 40px;
|
||||
}
|
||||
.ui.container > .news .ui.left img,
|
||||
.feeds > .news .ui.left img {
|
||||
margin: 0 !important;
|
||||
|
|
@ -1377,6 +1420,7 @@ html {
|
|||
.feeds > .news .ui.grid {
|
||||
margin: 0 !important;
|
||||
padding: 0 !important;
|
||||
padding-top: 1px !important;
|
||||
}
|
||||
.ui.container > .news .ui.grid > .column,
|
||||
.feeds > .news .ui.grid > .column {
|
||||
|
|
@ -1438,13 +1482,15 @@ html {
|
|||
display: none;
|
||||
}
|
||||
/* REPOSITORY LIST */
|
||||
.ui.repository.list {
|
||||
.ui.repository.list,
|
||||
.ui.user.list {
|
||||
margin-top: 16px !important;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
|
||||
grid-gap: 16px;
|
||||
}
|
||||
.ui.repository.list .item {
|
||||
.ui.repository.list .item,
|
||||
.ui.user.list .item {
|
||||
width: 400px;
|
||||
width: 100%;
|
||||
min-height: unset !important;
|
||||
|
|
@ -1459,35 +1505,44 @@ html {
|
|||
align-content: flex-start;
|
||||
}
|
||||
.ui.repository.list .item:hover,
|
||||
.ui.repository.list .item:focus-within {
|
||||
.ui.user.list .item:hover,
|
||||
.ui.repository.list .item:focus-within,
|
||||
.ui.user.list .item:focus-within {
|
||||
box-shadow: var(--lm-shadow);
|
||||
}
|
||||
.ui.repository.list .item:focus-within {
|
||||
.ui.repository.list .item:focus-within,
|
||||
.ui.user.list .item:focus-within {
|
||||
outline: 1px solid var(--color-primary) !important;
|
||||
}
|
||||
.ui.repository.list .item .header {
|
||||
.ui.repository.list .item .header,
|
||||
.ui.user.list .item .header {
|
||||
display: contents !important;
|
||||
}
|
||||
.ui.repository.list .item .header .repo-title {
|
||||
.ui.repository.list .item .header .repo-title,
|
||||
.ui.user.list .item .header .repo-title {
|
||||
display: contents;
|
||||
position: relative;
|
||||
font-size: 1.2rem;
|
||||
line-height: 1.4em;
|
||||
}
|
||||
.ui.repository.list .item .header .repo-title a {
|
||||
.ui.repository.list .item .header .repo-title a,
|
||||
.ui.user.list .item .header .repo-title a {
|
||||
white-space: normal !important;
|
||||
word-break: normal !important;
|
||||
}
|
||||
.ui.repository.list .item .header .repo-title > * {
|
||||
.ui.repository.list .item .header .repo-title > *,
|
||||
.ui.user.list .item .header .repo-title > * {
|
||||
grid-column: 2/span 4;
|
||||
}
|
||||
.ui.repository.list .item .header .repo-title .labels {
|
||||
.ui.repository.list .item .header .repo-title .labels,
|
||||
.ui.user.list .item .header .repo-title .labels {
|
||||
grid-column: 3;
|
||||
grid-row: 2;
|
||||
margin-left: 0 !important;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.ui.repository.list .item .header .repo-title a::before {
|
||||
.ui.repository.list .item .header .repo-title a::before,
|
||||
.ui.user.list .item .header .repo-title a::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
|
|
@ -1495,7 +1550,8 @@ html {
|
|||
height: 80px;
|
||||
width: 100%;
|
||||
}
|
||||
.ui.repository.list .item .header .avatar {
|
||||
.ui.repository.list .item .header .avatar,
|
||||
.ui.user.list .item .header .avatar {
|
||||
height: 50px !important;
|
||||
width: 50px !important;
|
||||
margin-right: 12px !important;
|
||||
|
|
@ -1504,25 +1560,31 @@ html {
|
|||
grid-row: 1/span 2;
|
||||
border-radius: 12px;
|
||||
}
|
||||
.ui.repository.list .item .header .metas {
|
||||
.ui.repository.list .item .header .metas,
|
||||
.ui.user.list .item .header .metas {
|
||||
grid-column: 2;
|
||||
grid-row: 2;
|
||||
width: 100%;
|
||||
}
|
||||
.ui.repository.list .item .description {
|
||||
.ui.repository.list .item .description,
|
||||
.ui.user.list .item .description {
|
||||
display: contents;
|
||||
}
|
||||
.ui.repository.list .item .description > p:first-child {
|
||||
.ui.repository.list .item .description > p:first-child,
|
||||
.ui.user.list .item .description > p:first-child {
|
||||
padding-top: 4px;
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
.ui.repository.list .item .description > * {
|
||||
.ui.repository.list .item .description > *,
|
||||
.ui.user.list .item .description > * {
|
||||
grid-column: 1/span 4;
|
||||
}
|
||||
.ui.repository.list .item .description > *:nth-last-child(2) {
|
||||
.ui.repository.list .item .description > *:nth-last-child(2),
|
||||
.ui.user.list .item .description > *:nth-last-child(2) {
|
||||
margin-bottom: 0 !important;
|
||||
}
|
||||
.ui.repository.list .item .description .time {
|
||||
.ui.repository.list .item .description .time,
|
||||
.ui.user.list .item .description .time {
|
||||
grid-row: 2;
|
||||
grid-column: 4;
|
||||
padding-top: 7px;
|
||||
|
|
@ -1534,16 +1596,19 @@ html {
|
|||
z-index: 3;
|
||||
direction: rtl;
|
||||
}
|
||||
.ui.repository.list .item .description .tags {
|
||||
.ui.repository.list .item .description .tags,
|
||||
.ui.user.list .item .description .tags {
|
||||
display: flex;
|
||||
overflow-x: auto;
|
||||
scrollbar-width: none;
|
||||
margin-top: 8px;
|
||||
}
|
||||
.ui.repository.list .item .description .tags a > div {
|
||||
.ui.repository.list .item .description .tags a > div,
|
||||
.ui.user.list .item .description .tags a > div {
|
||||
width: max-content !important;
|
||||
}
|
||||
.ui.repository.list .item .description .tags::after {
|
||||
.ui.repository.list .item .description .tags::after,
|
||||
.ui.user.list .item .description .tags::after {
|
||||
content: "";
|
||||
min-width: 100px;
|
||||
margin-left: 100px;
|
||||
|
|
@ -1553,13 +1618,35 @@ html {
|
|||
background: linear-gradient(to right, transparent, var(--color-box-body));
|
||||
pointer-events: none;
|
||||
}
|
||||
.ui.repository.list .item .content,
|
||||
.ui.user.list .item .content {
|
||||
padding-left: 12px;
|
||||
margin-bottom: -0.4em;
|
||||
}
|
||||
.ui.repository.list .item .content .header a,
|
||||
.ui.user.list .item .content .header a {
|
||||
font-weight: 600;
|
||||
text-transform: capitalize;
|
||||
}
|
||||
.ui.repository.list .item .content .description,
|
||||
.ui.user.list .item .content .description {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding-left: 22px;
|
||||
line-height: 1.8em;
|
||||
margin-top: 0.5em;
|
||||
}
|
||||
.ui.repository.list .item .content .description svg,
|
||||
.ui.user.list .item .content .description svg {
|
||||
margin-bottom: -1.45em !important;
|
||||
margin-left: -22px !important;
|
||||
}
|
||||
/*** DASHBOARD ***/
|
||||
.dashboard {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
margin: auto;
|
||||
max-width: 100%;
|
||||
padding: 30px 10px;
|
||||
padding: 30px 0;
|
||||
width: 1300px;
|
||||
margin-bottom: -45px;
|
||||
|
|
@ -1597,7 +1684,7 @@ html {
|
|||
.dashboard .dashboard-navbar > .ui > .item,
|
||||
.dashboard .dashboard-navbar > .ui > .right > .item {
|
||||
flex-direction: column;
|
||||
margin: 0 20px !important;
|
||||
margin: 0px !important;
|
||||
text-align: center;
|
||||
flex-grow: 1;
|
||||
display: flex !important;
|
||||
|
|
|
|||
|
|
@ -1,11 +1,13 @@
|
|||
// main: theme-gitea-modern.user.styl, out: theme-gitea-modern.css
|
||||
|
||||
|
||||
/* Update 1.0.3
|
||||
- Fixed table stretching due to the grid
|
||||
- Better keyboard accessability
|
||||
- Fixed Codeberg dropdown
|
||||
/* Update 1.0.4
|
||||
- Combined feed list to make it more compact, while still looking nice.
|
||||
- Styled User / Organization lists
|
||||
- Added minor blur to tabs in User page
|
||||
*/
|
||||
|
||||
|
||||
:root {
|
||||
--base-border-radius: 6px;
|
||||
|
||||
|
|
@ -1006,10 +1008,17 @@ html {
|
|||
border: 0 !important;
|
||||
}
|
||||
.language-stats {
|
||||
border-radius: 100px !important;
|
||||
border-radius: var(--base-border-radius) !important;
|
||||
overflow: hidden !important;
|
||||
pointer-events: none;
|
||||
top: 0;
|
||||
// top: unset;
|
||||
// position: absolute;
|
||||
// bottom: 0;
|
||||
// height: 10px;
|
||||
// width: 80vh;
|
||||
// transform: rotate(90deg) translate(-60%, -55px);
|
||||
// max-width: 500px;
|
||||
// width: 100px;
|
||||
}
|
||||
.horizontal.list:not(.two) {
|
||||
padding-top: 1rem;
|
||||
|
|
@ -1130,7 +1139,7 @@ html {
|
|||
}
|
||||
|
||||
/*** USER PROFILES & EXPLORE PAGES ***/
|
||||
.explore, .user:not(.list), .profile {
|
||||
.explore, .page-content.user, .profile {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
|
|
@ -1176,7 +1185,7 @@ html {
|
|||
width: 320px !important;
|
||||
flex: 1 0 320px !important;
|
||||
position: sticky;
|
||||
bottom: 0;
|
||||
bottom: 10px;
|
||||
align-self: flex-end;
|
||||
min-height: 100vh;
|
||||
.card {
|
||||
|
|
@ -1209,8 +1218,8 @@ html {
|
|||
&.header {
|
||||
font-weight: 500;
|
||||
letter-spacing: .1em;
|
||||
height: 44px;
|
||||
line-height: 50px;
|
||||
height: 39px;
|
||||
line-height: 40px;
|
||||
margin-bottom: -1.2em;
|
||||
margin-top: 0;
|
||||
background: var(--color-body);
|
||||
|
|
@ -1271,21 +1280,32 @@ html {
|
|||
margin-bottom: 1.5rem;
|
||||
position: sticky;
|
||||
top: 0px !important;
|
||||
margin-top: -45px;
|
||||
height: 45px;
|
||||
margin-top: -40px;
|
||||
height: 40px;
|
||||
z-index: 9999;
|
||||
background-color: var(--color-body);
|
||||
@supports (backdrop-filter: blur(10px)) {
|
||||
backdrop-filter: blur(10px);
|
||||
background-color: transparent;
|
||||
&::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
background-color: var(--color-body);
|
||||
opacity: .8;
|
||||
}
|
||||
}
|
||||
}
|
||||
&::before {
|
||||
content: "";
|
||||
position: sticky;
|
||||
margin: 0 !important;
|
||||
margin-left: -100vw !important;
|
||||
margin-top: 45px !important;
|
||||
margin-top: 40px !important;
|
||||
width: 200vw;
|
||||
display: block;
|
||||
border-bottom: 1px solid var(--color-secondary);
|
||||
top: 44px;
|
||||
top: 39px;
|
||||
z-index: -1;
|
||||
}
|
||||
}
|
||||
|
|
@ -1309,13 +1329,32 @@ html {
|
|||
/* DASHBOARD / USER FEEDS */
|
||||
.ui.container > .news, .feeds > .news {
|
||||
border: 1px solid var(--color-secondary) !important;
|
||||
border-bottom: none !important;
|
||||
background: var(--color-box-body);
|
||||
margin-bottom: 1rem;
|
||||
border-radius: var(--base-border-radius);
|
||||
// margin-bottom: 1rem;
|
||||
border-radius: var(--base-border-radius) var(--base-border-radius) 0 0;
|
||||
padding: 10px 12px !important;
|
||||
position: relative;
|
||||
|
||||
& + .news {
|
||||
border-radius: 0 !important;
|
||||
}
|
||||
&:last-child {
|
||||
border-radius: 0 0 var(--base-border-radius) var(--base-border-radius) !important;
|
||||
border-bottom: 1px solid var(--color-secondary) !important;
|
||||
}
|
||||
&::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
background: var(--color-primary);
|
||||
opacity: 0;
|
||||
// z-index: -1;
|
||||
}
|
||||
&:hover::before, &:focus-within::before {
|
||||
opacity: .05;
|
||||
}
|
||||
.ui.left {
|
||||
width: 40px;
|
||||
img {
|
||||
margin: 0 !important;
|
||||
margin-top: 2px !important;
|
||||
|
|
@ -1326,6 +1365,7 @@ html {
|
|||
.ui.grid {
|
||||
margin: 0 !important;
|
||||
padding: 0 !important;
|
||||
padding-top: 1px !important;
|
||||
& > .column {
|
||||
padding: 0 !important;
|
||||
width: 100% !important;
|
||||
|
|
@ -1376,7 +1416,8 @@ html {
|
|||
}
|
||||
|
||||
/* REPOSITORY LIST */
|
||||
.ui.repository.list {
|
||||
.ui.repository.list,
|
||||
.ui.user.list {
|
||||
margin-top: 16px !important;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
|
||||
|
|
@ -1491,6 +1532,30 @@ html {
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
// User & Organization cards
|
||||
.content {
|
||||
padding-left: 12px;
|
||||
margin-bottom: -.4em;
|
||||
.header {
|
||||
a {
|
||||
font-weight: 600;
|
||||
text-transform: capitalize;
|
||||
}
|
||||
}
|
||||
.description {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding-left: 22px;
|
||||
line-height: 1.8em;
|
||||
margin-top: .5em;
|
||||
svg {
|
||||
margin-bottom: -1.45em !important;
|
||||
margin-left: -22px !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -1501,7 +1566,6 @@ html {
|
|||
flex-wrap: wrap;
|
||||
margin: auto;
|
||||
max-width: 100%;
|
||||
padding: 30px 10px;
|
||||
padding: 30px 0;
|
||||
width: 1300px;
|
||||
margin-bottom: -45px;
|
||||
|
|
@ -1539,7 +1603,7 @@ html {
|
|||
& > .item, & > .right > .item {
|
||||
|
||||
flex-direction: column;
|
||||
margin: 0 20px !important;
|
||||
margin: 0px !important;
|
||||
text-align: center;
|
||||
flex-grow: 1;
|
||||
display: flex !important;
|
||||
|
|
@ -1793,5 +1857,3 @@ footer {
|
|||
padding: 0 40px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load diff
Loading…
Reference in a new issue