From e57e1e94a743ce72ea6bf50d6d2316cf606d9f80 Mon Sep 17 00:00:00 2001
From: Free <freeplayg@tutanota.com>
Date: Wed, 18 Aug 2021 19:43:34 +0200
Subject: [PATCH] 1.0.4

---
 Gitea/theme-gitea-modern.css | 227 ++++++++++++++++++++++++-----------
 1 file changed, 157 insertions(+), 70 deletions(-)

diff --git a/Gitea/theme-gitea-modern.css b/Gitea/theme-gitea-modern.css
index f32752b..19a3820 100644
--- a/Gitea/theme-gitea-modern.css
+++ b/Gitea/theme-gitea-modern.css
@@ -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;
@@ -1936,4 +2023,4 @@ footer .container {
     opacity: 0;
     transform: scale(0.97);
   }
-}
\ No newline at end of file
+}