From 2bf6fcdd2a03abf9d46ce349f7ca809bd77d0fb5 Mon Sep 17 00:00:00 2001
From: Vrifox <gitea@vrifox.cc>
Date: Mon, 5 Oct 2020 18:43:50 +0200
Subject: [PATCH] =?UTF-8?q?added=20repository=20issues;=20added=20$nojavas?=
 =?UTF-8?q?cript=20icons;=20modified=20user=20.secondary.menu;=20=E2=80=A6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 public/css/theme-gitea-vrifox-backend.css  | 156 ++++++++++--
 public/css/theme-gitea-vrifox-frontend.css | 216 ++++++++++++++--
 source/partials/_footer.scss               |  22 +-
 source/partials/repository.scss            | 274 ++++++++++++++++++++-
 source/partials/user.scss                  |  21 +-
 source/theme-gitea-vrifox-backend.scss     |   5 +
 source/theme-gitea-vrifox-frontend.scss    |   5 +
 7 files changed, 639 insertions(+), 60 deletions(-)

diff --git a/public/css/theme-gitea-vrifox-backend.css b/public/css/theme-gitea-vrifox-backend.css
index 1961a35..c336a6e 100644
--- a/public/css/theme-gitea-vrifox-backend.css
+++ b/public/css/theme-gitea-vrifox-backend.css
@@ -108,19 +108,22 @@ body > .full.height::first-line,
       background: #28283c;
       color: white; }
   .repository .header-wrapper .tabs.container .menu.navbar .item {
+    border-bottom: 2px solid transparent;
+    border-radius: 5px 5px 0 0;
     color: #d7d7e1;
-    transition: color .2s;
+    transition: background .2s, color .2s;
     font-family: monospace, "Lucida Console", "Monaco"; }
     .repository .header-wrapper .tabs.container .menu.navbar .item:hover {
+      background: #3c3c5a !important;
       color: white; }
     .repository .header-wrapper .tabs.container .menu.navbar .item.active {
-      background: #3c3c5a;
+      background: transparent;
       border: 0;
+      border-bottom: 2px solid;
       color: #f5f5ff; }
-      .repository .header-wrapper .tabs.container .menu.navbar .item.active span.label {
-        background: #32324b; }
     .repository .header-wrapper .tabs.container .menu.navbar .item span.label {
-      background: #3c3c5a; }
+      background: #f5f5ff;
+      color: #3c3c5a; }
 
 .repository .container .repo-description {
   color: #f5f5ff; }
@@ -259,6 +262,101 @@ body > .full.height::first-line,
     border: 0;
     color: #f5f5ff; }
 
+/* repository: issues */
+.repository .container .grid .column .left.small.menu {
+  background: transparent;
+  border: 0; }
+  .repository .container .grid .column .left.small.menu .item {
+    background: #3c3c5a;
+    color: #f5f5ff; }
+    .repository .container .grid .column .left.small.menu .item:first-child {
+      border-radius: 5px 0 0 5px; }
+    .repository .container .grid .column .left.small.menu .item:hover {
+      background: #32324b; }
+    .repository .container .grid .column .left.small.menu .item:last-child {
+      border-radius: 0 5px 5px 0; }
+
+.repository .container .grid .column form.form .input input {
+  background: #28283c;
+  border: 2px solid #3c3c5a;
+  color: #f5f5ff; }
+  .repository .container .grid .column form.form .input input:focus {
+    background: #32324b;
+    border: 2px solid #3c3c5a;
+    color: white; }
+
+.repository .container .grid .column form.form .input .button {
+  background: #3c3c5a;
+  border: 0; }
+  .repository .container .grid .column form.form .input .button:hover {
+    background: #32324b; }
+
+.repository .container .grid .column .green.button {
+  background: #64c882;
+  box-shadow: none;
+  color: white; }
+  .repository .container .grid .column .green.button:hover {
+    background: #50b46e; }
+
+.repository .container .ui.divider {
+  border: 0;
+  border-top: 1px solid #3c3c5a; }
+
+.repository .container .grid .column .basic.button:not(.active) {
+  background: #3c3c5a;
+  color: #f5f5ff; }
+  .repository .container .grid .column .basic.button:not(.active):hover {
+    background: #32324b; }
+
+.repository .container .grid .column .basic.button.red {
+  background: #ff8282;
+  box-shadow: none;
+  color: white; }
+  .repository .container .grid .column .basic.button.red:hover {
+    background: #eb6e6e; }
+
+.repository .container .grid .column .filter.menu .item {
+  background: #3c3c5a;
+  color: #f5f5ff; }
+  .repository .container .grid .column .filter.menu .item:first-of-type {
+    margin-left: auto; }
+  .repository .container .grid .column .filter.menu .item:hover {
+    background: #32324b; }
+  .repository .container .grid .column .filter.menu .item .menu {
+    background: #3c3c5a;
+    border: 1px solid #32324b;
+    box-shadow: none;
+    margin-top: 0; }
+    .repository .container .grid .column .filter.menu .item .menu .item {
+      color: #f5f5ff !important; }
+      .repository .container .grid .column .filter.menu .item .menu .item:hover {
+        background: #32324b; }
+
+.repository .container .issue.list .item {
+  border-bottom: 1px dashed #464669; }
+  .repository .container .issue.list .item .label {
+    background: #f5f5ff;
+    color: #3c3c5a; }
+  .repository .container .issue.list .item .title {
+    border-bottom: 1px solid transparent;
+    color: #f5f5ff;
+    transition: border .2s, color .2s; }
+    .repository .container .issue.list .item .title:hover {
+      border-bottom: 1px solid #ff8282;
+      color: #ff8282; }
+  .repository .container .issue.list .item .desc {
+    color: #d7d7e1; }
+
+/* repository: issues view issue */
+.repository.view.issue .container div .grid .column.title .grid h1 .index {
+  color: #d7d7e1; }
+
+.repository.view.issue .container div .grid .column.title .grid h1 #issue-title {
+  color: white; }
+
+.repository.view.issue .container div .grid .column.title .label.green {
+  background: #64c882; }
+
 /* repository: releases */
 .repository.release .container .header {
   background: transparent;
@@ -375,6 +473,8 @@ body > .full.height::first-line,
 
 .repository.diff .container .diff-file-box .diff-file-header .diff-counter .bar {
   background: #ff8282; }
+  .repository.diff .container .diff-file-box .diff-file-header .diff-counter .bar .pull-left.add {
+    background: #64c882; }
 
 .repository.diff .container .diff-file-box .diff-file-header .file {
   color: #f5f5ff; }
@@ -401,14 +501,14 @@ body > .full.height::first-line,
   border-color: #ff6464 !important;
   color: white; }
   .repository.diff .container .diff-file-box .diff-file-body .file-body table tbody .del-code td .removed-code {
-    background: #ff6464; }
+    background: #ff6e6e; }
 
 .repository.diff .container .diff-file-box .diff-file-body .file-body table tbody .add-code td {
-  background: #82dc96 !important;
+  background: #64c882 !important;
   border-color: #64dc78 !important;
   color: white; }
   .repository.diff .container .diff-file-box .diff-file-body .file-body table tbody .add-code td .added-code {
-    background: #50c878; }
+    background: #50b46e; }
 
 /* repository: files */
 .repository.file .container .secondary.menu .item .repo-path a {
@@ -522,20 +622,35 @@ body > .full.height::first-line,
       .user .container .grid .card .extra.content ul a:hover {
         color: #ff8282; }
 
-.user .container .grid .secondary.menu {
+.user .container .grid .secondary.pointing.menu {
+  background: #464669;
+  border: 0;
+  border-radius: 0 0 5px 5px;
+  border-top: 15px solid #464669;
+  margin-top: -15px;
   overflow-x: auto;
-  overflow-y: hidden; }
-  .user .container .grid .secondary.menu .item {
-    color: #d7d7e1;
-    font-family: monospace, "Lucida Console", "Monaco"; }
-    .user .container .grid .secondary.menu .item:hover {
+  overflow-y: hidden;
+  padding: 0 20px 2px 20px;
+  position: sticky;
+  top: -5px;
+  z-index: 100; }
+  .user .container .grid .secondary.pointing.menu .item {
+    border-bottom: 2px solid transparent;
+    border-radius: 5px 5px 0 0;
+    color: #f5f5ff;
+    font-family: monospace, "Lucida Console", "Monaco";
+    transform: background .2s, color .2s; }
+    .user .container .grid .secondary.pointing.menu .item:hover {
+      background: #3c3c5a;
       color: white; }
-    .user .container .grid .secondary.menu .item.active {
+    .user .container .grid .secondary.pointing.menu .item.active {
+      border-bottom: 2px solid #f5f5ff;
       color: #f5f5ff; }
-      .user .container .grid .secondary.menu .item.active:hover {
+      .user .container .grid .secondary.pointing.menu .item.active:hover {
         color: white; }
-    .user .container .grid .secondary.menu .item .label {
-      background: #3c3c5a; }
+    .user .container .grid .secondary.pointing.menu .item .label {
+      background: #f5f5ff;
+      color: #464669; }
 
 .user .container .grid form.form .input input {
   background: #28283c;
@@ -614,7 +729,8 @@ body > .full.height::first-line,
 footer {
   background: #1e1e2d;
   border-top: 1px solid #28283c;
-  color: #d7d7e1; }
+  color: #d7d7e1;
+  text-transform: lowercase; }
   footer .ui.container {
     display: flex;
     align-items: center;
@@ -630,3 +746,5 @@ footer {
         border: 0;
         padding: 0;
         margin-left: 30px; }
+      footer .ui.container .links a[href*="gitea.io"]:not(.customlink) {
+        display: none; }
diff --git a/public/css/theme-gitea-vrifox-frontend.css b/public/css/theme-gitea-vrifox-frontend.css
index e5cbb3e..3ac276d 100644
--- a/public/css/theme-gitea-vrifox-frontend.css
+++ b/public/css/theme-gitea-vrifox-frontend.css
@@ -1,3 +1,4 @@
+@charset "UTF-8";
 /* ------------------------------------------------ */
 /* DON'T EDIT THIS FILE; EDIT THE SCSS/SASS INSTEAD */
 /* ------------------------------------------------ */
@@ -114,21 +115,24 @@ body > .full.height::first-line,
         background: #28283c;
         color: white; }
   .repository .header-wrapper .tabs.container .menu.navbar .item {
+    border-bottom: 2px solid transparent;
+    border-radius: 5px 5px 0 0;
     color: #d7d7e1;
-    transition: color .2s;
+    transition: background .2s, color .2s;
     font-family: monospace, "Lucida Console", "Monaco"; }
     .repository .header-wrapper .tabs.container .menu.navbar .item:hover {
+      background: #3c3c5a !important;
       color: white; }
     .repository .header-wrapper .tabs.container .menu.navbar .item.active {
-      background: #3c3c5a;
+      background: transparent;
       border: 0;
+      border-bottom: 2px solid;
       color: #f5f5ff; }
-      .repository .header-wrapper .tabs.container .menu.navbar .item.active span.label {
-        background: #32324b; }
     .repository .header-wrapper .tabs.container .menu.navbar .item svg {
       display: none; }
     .repository .header-wrapper .tabs.container .menu.navbar .item span.label {
-      background: #3c3c5a; }
+      background: #f5f5ff;
+      color: #3c3c5a; }
 
 .repository .container .repo-description {
   color: #f5f5ff; }
@@ -260,9 +264,22 @@ body > .full.height::first-line,
     .repository .container .table tbody tr:hover {
       background-color: #28283c !important; }
     .repository .container .table tbody tr .svg.octicon-file-directory, .repository .container .table tbody tr .svg.octicon-file-submodule {
-      fill: #ff8282; }
+      fill: #ff8282;
+      background: #ff8282;
+      border-radius: 0 1px 2px 2px;
+      box-shadow: -4px -7px 0px -4px #ff8282;
+      height: 10px;
+      margin-left: 5px !important;
+      margin-top: 4px;
+      width: 14px; }
     .repository .container .table tbody tr .svg.octicon-file {
-      fill: #d7d7e1; }
+      fill: #d7d7e1;
+      border: 1px solid #d7d7e1;
+      border-radius: 0 5px 0 0;
+      height: 13px;
+      margin-left: 7px !important;
+      margin-right: 6px !important;
+      width: 10px; }
     .repository .container .table tbody tr .jumpable-path {
       color: #d7d7e1 !important; }
   .repository .container .table .commit-list .sha.label {
@@ -286,6 +303,119 @@ body > .full.height::first-line,
     border: 0;
     color: #f5f5ff; }
 
+/* repository: issues */
+.repository .container .grid .column .left.small.menu {
+  background: transparent;
+  border: 0; }
+  .repository .container .grid .column .left.small.menu .item {
+    background: #3c3c5a;
+    color: #f5f5ff; }
+    .repository .container .grid .column .left.small.menu .item:first-child {
+      border-radius: 5px 0 0 5px; }
+    .repository .container .grid .column .left.small.menu .item:hover {
+      background: #32324b; }
+    .repository .container .grid .column .left.small.menu .item:last-child {
+      border-radius: 0 5px 5px 0; }
+
+.repository .container .grid .column form.form .input input {
+  background: #28283c;
+  border: 2px solid #3c3c5a;
+  color: #f5f5ff; }
+  .repository .container .grid .column form.form .input input:focus {
+    background: #32324b;
+    border: 2px solid #3c3c5a;
+    color: white; }
+
+.repository .container .grid .column form.form .input .button {
+  background: #3c3c5a;
+  border: 0; }
+  .repository .container .grid .column form.form .input .button:hover {
+    background: #32324b; }
+
+.repository .container .grid .column .green.button {
+  background: #64c882;
+  box-shadow: none;
+  color: white; }
+  .repository .container .grid .column .green.button:hover {
+    background: #50b46e; }
+  .repository .container .grid .column .green.button[href*="issues/new"] {
+    display: none; }
+
+.repository .container .ui.divider {
+  border: 0;
+  border-top: 1px solid #3c3c5a; }
+
+.repository .container .grid .column .basic.button:not(.active) {
+  background: #3c3c5a;
+  color: #f5f5ff; }
+  .repository .container .grid .column .basic.button:not(.active):hover {
+    background: #32324b; }
+
+.repository .container .grid .column .basic.button.red {
+  background: #ff8282;
+  box-shadow: none;
+  color: white; }
+  .repository .container .grid .column .basic.button.red:hover {
+    background: #eb6e6e; }
+
+.repository .container .grid .column .basic.button .svg {
+  display: none; }
+
+.repository .container .grid .column .filter.menu .item {
+  background: #3c3c5a;
+  color: #f5f5ff; }
+  .repository .container .grid .column .filter.menu .item:first-of-type {
+    margin-left: auto; }
+  .repository .container .grid .column .filter.menu .item:hover {
+    background: #32324b; }
+    .repository .container .grid .column .filter.menu .item:hover .menu {
+      display: block; }
+  .repository .container .grid .column .filter.menu .item.label-filter .menu .info {
+    display: none; }
+  .repository .container .grid .column .filter.menu .item.label-filter .menu .item.label-filter-item {
+    padding-left: 25px !important; }
+  .repository .container .grid .column .filter.menu .item.label-filter .menu .item .label.color {
+    display: none; }
+  .repository .container .grid .column .filter.menu .item .menu {
+    background: #3c3c5a;
+    border: 1px solid #32324b;
+    box-shadow: none;
+    margin-top: 0; }
+    .repository .container .grid .column .filter.menu .item .menu .item {
+      color: #f5f5ff !important; }
+      .repository .container .grid .column .filter.menu .item .menu .item:hover {
+        background: #32324b; }
+
+.repository .container .issue.list .item {
+  border-bottom: 1px dashed #464669; }
+  .repository .container .issue.list .item .label {
+    background: #f5f5ff;
+    color: #3c3c5a; }
+  .repository .container .issue.list .item .title {
+    border-bottom: 1px solid transparent;
+    color: #f5f5ff;
+    transition: border .2s, color .2s; }
+    .repository .container .issue.list .item .title:hover {
+      border-bottom: 1px solid #ff8282;
+      color: #ff8282; }
+  .repository .container .issue.list .item .desc {
+    color: #d7d7e1; }
+
+/* repository: issues view issue */
+.repository.view.issue .container div .grid .column.title .grid h1 .index {
+  color: #d7d7e1; }
+
+.repository.view.issue .container div .grid .column.title .grid h1 #issue-title {
+  color: white; }
+
+.repository.view.issue .container div .grid .column.title .grid h1 #edit-title-input {
+  display: none; }
+
+.repository.view.issue .container div .grid .column.title .label.green {
+  background: #64c882; }
+  .repository.view.issue .container div .grid .column.title .label.green .svg {
+    display: none; }
+
 /* repository: releases */
 .repository.release .container .header {
   background: transparent;
@@ -395,6 +525,19 @@ body > .full.height::first-line,
     color: #f5f5ff; }
     .repository.diff .container .diff-detail-box .button:hover {
       background: #3c3c5a; }
+      .repository.diff .container .diff-detail-box .button:hover .menu {
+        display: block; }
+    .repository.diff .container .diff-detail-box .button.dropdown {
+      padding-right: 37px; }
+      .repository.diff .container .diff-detail-box .button.dropdown::after {
+        content: '⏷';
+        position: absolute;
+        right: 17px;
+        top: 10px;
+        font-size: 11px;
+        color: #d7d7e1; }
+    .repository.diff .container .diff-detail-box .button .dropdown.icon {
+      display: none; }
     .repository.diff .container .diff-detail-box .button .menu {
       background: #464669;
       border: 1px solid #3c3c5a;
@@ -403,9 +546,15 @@ body > .full.height::first-line,
         color: #f5f5ff; }
         .repository.diff .container .diff-detail-box .button .menu .item:hover {
           background: #3c3c5a; }
+        .repository.diff .container .diff-detail-box .button .menu .item[data-target*="#diff-files"] {
+          display: none; }
+  .repository.diff .container .diff-detail-box.diff-stats {
+    display: block; }
 
 .repository.diff .container .diff-file-box .diff-file-header .diff-counter .bar {
   background: #ff8282; }
+  .repository.diff .container .diff-file-box .diff-file-header .diff-counter .bar .pull-left.add {
+    background: #64c882; }
 
 .repository.diff .container .diff-file-box .diff-file-header .file {
   color: #f5f5ff; }
@@ -432,14 +581,14 @@ body > .full.height::first-line,
   border-color: #ff6464 !important;
   color: white; }
   .repository.diff .container .diff-file-box .diff-file-body .file-body table tbody .del-code td .removed-code {
-    background: #ff6464; }
+    background: #ff6e6e; }
 
 .repository.diff .container .diff-file-box .diff-file-body .file-body table tbody .add-code td {
-  background: #82dc96 !important;
+  background: #64c882 !important;
   border-color: #64dc78 !important;
   color: white; }
   .repository.diff .container .diff-file-box .diff-file-body .file-body table tbody .add-code td .added-code {
-    background: #50c878; }
+    background: #50b46e; }
 
 /* repository: files */
 .repository.file .container .secondary.menu .item .repo-path a {
@@ -556,23 +705,38 @@ body > .full.height::first-line,
       .user .container .grid .card .extra.content ul a:hover {
         color: #ff8282; }
 
-.user .container .grid .secondary.menu {
+.user .container .grid .secondary.pointing.menu {
+  background: #464669;
+  border: 0;
+  border-radius: 0 0 5px 5px;
+  border-top: 15px solid #464669;
+  margin-top: -15px;
   overflow-x: auto;
-  overflow-y: hidden; }
-  .user .container .grid .secondary.menu .item {
-    color: #d7d7e1;
-    font-family: monospace, "Lucida Console", "Monaco"; }
-    .user .container .grid .secondary.menu .item:hover {
+  overflow-y: hidden;
+  padding: 0 20px 2px 20px;
+  position: sticky;
+  top: -5px;
+  z-index: 100; }
+  .user .container .grid .secondary.pointing.menu .item {
+    border-bottom: 2px solid transparent;
+    border-radius: 5px 5px 0 0;
+    color: #f5f5ff;
+    font-family: monospace, "Lucida Console", "Monaco";
+    transform: background .2s, color .2s; }
+    .user .container .grid .secondary.pointing.menu .item:hover {
+      background: #3c3c5a;
       color: white; }
-    .user .container .grid .secondary.menu .item.active {
+    .user .container .grid .secondary.pointing.menu .item.active {
+      border-bottom: 2px solid #f5f5ff;
       color: #f5f5ff; }
-      .user .container .grid .secondary.menu .item.active:hover {
+      .user .container .grid .secondary.pointing.menu .item.active:hover {
         color: white; }
-    .user .container .grid .secondary.menu .item svg {
+    .user .container .grid .secondary.pointing.menu .item svg {
       display: none; }
-    .user .container .grid .secondary.menu .item .label {
-      background: #3c3c5a; }
-    .user .container .grid .secondary.menu .item[href*="stars"], .user .container .grid .secondary.menu .item[href*="following"], .user .container .grid .secondary.menu .item[href*="followers"] {
+    .user .container .grid .secondary.pointing.menu .item .label {
+      background: #f5f5ff;
+      color: #464669; }
+    .user .container .grid .secondary.pointing.menu .item[href*="stars"], .user .container .grid .secondary.pointing.menu .item[href*="following"], .user .container .grid .secondary.pointing.menu .item[href*="followers"] {
       display: none; }
 
 .user .container .grid .filter.menu {
@@ -657,7 +821,8 @@ body > .full.height::first-line,
 footer {
   background: #1e1e2d;
   border-top: 1px solid #28283c;
-  color: #d7d7e1; }
+  color: #d7d7e1;
+  text-transform: lowercase; }
   footer .ui.container {
     display: flex;
     align-items: center;
@@ -673,7 +838,10 @@ footer {
         border: 0;
         padding: 0;
         margin-left: 30px; }
-      footer .ui.container .links a[href~="/api/swagger"],
+      footer .ui.container .links a[href*="/api/swagger"] {
+        display: none; }
+      footer .ui.container .links a[href*="gitea.io"]:not(.customlink) {
+        display: none; }
       footer .ui.container .links .version {
         display: none; }
       footer .ui.container .links .language {
diff --git a/source/partials/_footer.scss b/source/partials/_footer.scss
index 2305922..b78363f 100644
--- a/source/partials/_footer.scss
+++ b/source/partials/_footer.scss
@@ -2,6 +2,7 @@ footer {
   background: rgb(30, 30, 45);
   border-top: 1px solid rgb(40, 40, 60);
   color: rgb(215, 215, 225);
+  text-transform: lowercase;
   .ui.container {
     display: flex;
     align-items: center;
@@ -20,13 +21,24 @@ footer {
         padding: 0;
         margin-left: 30px;
       }
-      @if $singleuser == true {
-        a[href~="/api/swagger"], 
-        .version {
-          display:none;
+      a {
+        &[href*="/api/swagger"] {
+          @if $vrifoxcustomization == true and $type == frontend {
+            display: none;
+          }
+        }
+        &[href*="gitea.io"]:not(.customlink) {
+          @if $vrifoxcustomization == true {
+            display: none;
+          }
         }
       }
-      @if $nojavascript == true {
+      .version {
+        @if $vrifoxcustomization == true and $type == frontend {
+          display: none;
+        }
+      }
+      @if $disablelanguagebutton == true {
         .language {
           display: none;
         }
diff --git a/source/partials/repository.scss b/source/partials/repository.scss
index f018f57..2f4739c 100644
--- a/source/partials/repository.scss
+++ b/source/partials/repository.scss
@@ -50,19 +50,20 @@
       &.container {
         .menu.navbar {
           .item {
+            border-bottom: 2px solid transparent;
+            border-radius: $border-radius $border-radius 0 0;
             color: rgb(215, 215, 225);
-            transition: color .2s;
+            transition: background .2s, color .2s;
             font-family: $font-family;
             &:hover {
+              background: rgb(60, 60, 90) !important;
               color: rgb(255, 255, 255);
             }
             &.active {
-              background: rgb(60, 60, 90);
+              background: transparent;
               border: 0;
+              border-bottom: 2px solid;
               color: rgb(245, 245, 255);
-              span.label {
-                background: rgb(50, 50, 75);
-              }
             }
             svg {
               @if $nojavascript == true {
@@ -70,7 +71,8 @@
               }
             }
             span.label {
-              background: rgb(60, 60, 90);
+              background: rgb(245, 245, 255);
+              color: rgb(60, 60, 90);
             }
           }
         }
@@ -279,9 +281,26 @@
             &.octicon-file-directory, 
             &.octicon-file-submodule {
               fill: rgb(255, 130, 130);
+              @if $nojavascript == true {
+                background: rgb(255, 130, 130);
+                border-radius: 0 1px 2px 2px;
+                box-shadow: -4px -7px 0px -4px rgb(255, 130, 130);
+                height: 10px;
+                margin-left: 5px !important;
+                margin-top: 4px;
+                width: 14px;
+              }
             }
             &.octicon-file {
               fill: rgb(215, 215, 225);
+              @if $nojavascript == true {
+                border: 1px solid rgb(215, 215, 225);
+                border-radius: 0 5px 0 0;
+                height: 13px;
+                margin-left: 7px !important;
+                margin-right: 6px !important;
+                width: 10px;
+              }
             }
           }
           .jumpable-path {
@@ -319,6 +338,207 @@
   }
 }
 
+/* repository: issues */
+
+.repository {
+  .container {
+    .grid {
+      .column {
+        .left.small.menu {
+          background: transparent;
+          border: 0;
+          .item {
+            background: rgb(60, 60, 90);
+            color: rgb(245, 245, 255);
+            &:first-child {
+              border-radius: $border-radius 0 0 $border-radius;
+            }
+            &:hover {
+              background: rgb(50, 50, 75);
+            }
+            &:last-child {
+              border-radius: 0 $border-radius $border-radius 0;
+            }
+          }
+        }
+        form.form {
+          .input {
+            input {
+              background: rgb(40, 40, 60);
+              border: 2px solid rgb(60, 60, 90);
+              color: rgb(245, 245, 255);
+              &:focus {
+                background: rgb(50, 50, 75);
+                border: 2px solid rgb(60, 60, 90);
+                color: rgb(255, 255, 255);
+              }
+            }
+            .button {
+              background: rgb(60, 60, 90);
+              border: 0;
+              &:hover {
+                background: rgb(50, 50, 75);
+              }
+            }
+          }
+        }
+        .green.button {
+          background: rgb(100, 200, 130);
+          box-shadow: none;
+          color: rgb(255, 255, 255);
+          &:hover {
+            background: rgb(80, 180, 110);
+          }
+          &[href*="issues/new"] {
+            @if $type == frontend {
+              display: none;
+            }
+          }
+        }
+      }
+    }
+    .ui.divider {
+      border: 0;
+      border-top: 1px solid rgb(60, 60, 90);
+    }
+    .grid {
+      .column {
+        .basic.button {
+          &:not(.active) {
+            background: rgb(60, 60, 90);
+            color: rgb(245, 245, 255);
+            &:hover {
+              background: rgb(50, 50, 75);
+            }
+          }
+          &.red {
+            background: rgb(255, 130, 130);
+            box-shadow: none;
+            color: rgb(255, 255, 255);
+            &:hover {
+              background: rgb(235, 110, 110);
+            }
+          }
+          .svg {
+            @if $nojavascript == true {
+              display: none;
+            }
+          }
+        }
+        .filter.menu {
+          .item {
+            background: rgb(60, 60, 90);
+            color: rgb(245, 245, 255);
+            &:first-of-type {
+              margin-left: auto;
+            }
+            &:hover {
+              background: rgb(50, 50, 75);
+              .menu {
+                @if $nojavascript == true {
+                  display: block;
+                }
+              }
+            }
+            &.label-filter {
+              .menu {
+                .info {
+                  @if $nojavascript == true {
+                    display: none;
+                  }
+                }
+                .item {
+                  &.label-filter-item {
+                    @if $nojavascript == true {
+                      padding-left: 25px !important;
+                    }
+                  }
+                  .label.color {
+                    @if $nojavascript == true {
+                      display: none;
+                    }
+                  }
+                }
+              }
+            }
+            .menu {
+              background: rgb(60, 60, 90);
+              border: 1px solid rgb(50, 50, 75);
+              box-shadow: none;
+              margin-top: 0;
+              .item {
+                color: rgb(245, 245, 255) !important;
+                &:hover {
+                  background: rgb(50, 50, 75);
+                }
+              }
+            }
+          }
+        }
+      }
+    }
+    .issue.list {
+      .item {
+        border-bottom: 1px dashed rgb(70, 70, 105);
+        .label {
+          background: rgb(245, 245, 255);
+          color: rgb(60, 60, 90);
+        }
+        .title {
+          border-bottom: 1px solid transparent;
+          color: rgb(245, 245, 255);
+          transition: border .2s, color .2s;
+          &:hover {
+            border-bottom: 1px solid rgb(255, 130, 130);
+            color: rgb(255, 130, 130);
+          }
+        }
+        .desc {
+          color: rgb(215, 215, 225);
+        }
+      }
+    }
+  }
+}
+
+/* repository: issues view issue */
+
+.repository.view.issue {
+  .container {
+    div {
+      .grid {
+        .column {
+          &.title {
+            .grid {
+              h1 {
+                .index {
+                  color: rgb(215, 215, 225);
+                }
+                #issue-title {
+                  color: rgb(255, 255, 255);
+                }
+                #edit-title-input {
+                  @if $nojavascript == true {
+                    display: none;
+                  }
+                }
+              }
+            }
+            .label.green {
+              background: rgb(100, 200, 130);
+              .svg {
+                @if $nojavascript == true {
+                  display: none;
+                }
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+}
+
 /* repository: releases */
 
 .repository.release {
@@ -511,6 +731,29 @@
         color: rgb(245, 245, 255);
         &:hover {
           background: rgb(60, 60, 90);
+          .menu {
+            @if $nojavascript == true {
+              display: block;
+            }
+          }
+        }
+        &.dropdown {
+          @if $nojavascript == true {
+            padding-right: 37px;
+            &::after {
+              content: '⏷';
+              position: absolute;
+              right: 17px;
+              top: 10px;
+              font-size: 11px;
+              color: rgb(215, 215, 225);
+            }
+          }
+        }
+        .dropdown.icon {
+          @if $nojavascript == true {
+            display: none;
+          }
         }
         .menu {
           background: rgb(70, 70, 105);
@@ -521,15 +764,28 @@
             &:hover {
               background: rgb(60, 60, 90);
             }
+            &[data-target*="#diff-files"] {
+              @if $nojavascript == true {
+                display: none;
+              }
+            }
           }
         }
       }
+      &.diff-stats {
+        @if $nojavascript == true {
+          display: block;
+        }
+      }
     }
     .diff-file-box {
       .diff-file-header {
         .diff-counter {
           .bar {
             background: rgb(255, 130, 130);
+            .pull-left.add {
+              background: rgb(100, 200, 130);
+            }
           }
         }
         .file {
@@ -568,17 +824,17 @@
                   border-color: rgb(255, 100, 100) !important;
                   color: rgb(255, 255, 255);
                   .removed-code {
-                    background: rgb(255, 100, 100);
+                    background: rgb(255, 110, 110);
                   }
                 }
               }
               .add-code {
                 td {
-                  background: rgb(130, 220, 150) !important;
+                  background: rgb(100, 200, 130) !important;
                   border-color: rgb(100, 220, 120) !important;
                   color: rgb(255, 255, 255);
                   .added-code {
-                    background: rgb(80, 200, 120);
+                    background: rgb(80, 180, 110);
                   }
                 }
               }
diff --git a/source/partials/user.scss b/source/partials/user.scss
index 5b32d7c..78edd32 100644
--- a/source/partials/user.scss
+++ b/source/partials/user.scss
@@ -28,16 +28,30 @@
           }
         }
       }
-      .secondary.menu {
+      .secondary.pointing.menu {
+        background: rgb(70, 70, 105);
+        border: 0;
+        border-radius: 0 0 5px 5px;
+        border-top: 15px solid #464669;
+        margin-top: -15px;
         overflow-x: auto;
         overflow-y: hidden;
+        padding: 0 20px 2px 20px;
+        position: sticky;
+        top: -5px;
+        z-index: 100;
         .item {
-          color: rgb(215, 215, 225);
+          border-bottom: 2px solid transparent;
+          border-radius: 5px 5px 0 0;
+          color: rgb(245, 245, 255);
           font-family: $font-family;
+          transform: background .2s, color .2s;
           &:hover {
+            background: rgb(60, 60, 90);
             color: rgb(255, 255, 255);
           }
           &.active {
+            border-bottom: 2px solid rgb(245, 245, 255);
             color: rgb(245, 245, 255);
             &:hover {
               color: rgb(255, 255, 255);
@@ -49,7 +63,8 @@
             }
           }
           .label {
-            background: rgb(60, 60, 90);
+            background: rgb(245, 245, 255);
+            color: rgb(70, 70, 105);
           }
           @if $singleuser == true {
             &[href*="stars"], 
diff --git a/source/theme-gitea-vrifox-backend.scss b/source/theme-gitea-vrifox-backend.scss
index 6d1c160..574bdf8 100644
--- a/source/theme-gitea-vrifox-backend.scss
+++ b/source/theme-gitea-vrifox-backend.scss
@@ -6,10 +6,15 @@
 //  Settings
 //
 
+$type: backend;
+
 $singleuser: false; // disables functions, that are not necessary if you are the only user (or at least as »frontend«)
 $nojavascript: false; // disables or corrects functions, that would not work with disabled javascript (e.g. throught content security policy)
+$vrifoxcustomization: true; // my personal customizations
+$disablelanguagebutton: false; // if cookies are disabled, the language will have to be chosen on every page again
 
 $font-family: monospace, 'Lucida Console', 'Monaco';
+$border-radius: 5px;
 
 //
 //
diff --git a/source/theme-gitea-vrifox-frontend.scss b/source/theme-gitea-vrifox-frontend.scss
index d3d7f3b..e33a4a4 100644
--- a/source/theme-gitea-vrifox-frontend.scss
+++ b/source/theme-gitea-vrifox-frontend.scss
@@ -6,10 +6,15 @@
 //  Settings
 //
 
+$type: frontend;
+
 $singleuser: true; // disables functions, that are not necessary if you are the only user (or at least as »frontend«)
 $nojavascript: true; // disables or corrects functions, that would not work with disabled javascript (e.g. throught content security policy)
+$vrifoxcustomization: true; // my personal customizations
+$disablelanguagebutton: true; // if cookies are disabled, the language will have to be chosen on every page again
 
 $font-family: monospace, 'Lucida Console', 'Monaco';
+$border-radius: 5px;
 
 //
 //