Issue sidebar and misc css fixes (#15524)

- Replace remaining font icons with SVG in issue sidebar
- Rework issue due date display
- Realign avatar in timeline
- Fix font size in repo search and code explore
- Consolidate active button styles
- Fix loading form on arc-green
- Align time tracker buttons vertically

Fixes: https://github.com/go-gitea/gitea/issues/15896

web_src/less/_base.less

@@ -669,10 +669,16 @@ a.ui.card:hover,
   height: auto;
 }
 
-.ui.loading.segment::before {
+.ui.loading.segment::before,
+.ui.loading.form::before {
   background: none;
 }
 
+.ui.loading.form > *,
+.ui.loading.segment > * {
+  opacity: .35;
+}
+
 .ui.loading.loading.input > i.icon svg {
   visibility: hidden;
 }
@@ -1589,11 +1595,19 @@ a.ui.label:hover {
   box-shadow: none !important;
 }
 
+.ui.button:focus,
 .ui.button:hover {
   background: var(--color-hover);
   color: var(--color-text);
 }
 
+.ui.button:active,
+.ui.active.button:active,
+.ui.active.button:hover {
+  background: var(--color-active);
+  color: var(--color-text);
+}
+
 .ui.button.no-text .icon {
   margin: 0 !important;
 }

web_src/less/_editor.less

@@ -55,6 +55,10 @@
   background: var(--color-active);
 }
 
+.editor-statusbar {
+  color: var(--color-text-light);
+}
+
 .editor-loading {
   padding: 1rem;
   text-align: center;

web_src/less/_repository.less

@@ -815,7 +815,7 @@
         .avatar.image img {
           width: 20px;
           height: 20px;
-          margin-right: .5rem;
+          margin: 0 .25rem;
         }
 
         &:first-child:not(.commit) {

web_src/less/helpers.less

@@ -24,7 +24,6 @@
 
 .word-break {
   word-wrap: break-word !important;
-  word-break: break-all !important;
 }
 
 .full-screen-width { width: 100vw !important; }

web_src/less/themes/theme-arc-green.less

@@ -98,7 +98,7 @@
   --color-menu: #2e323e;
   --color-card: #2e323e;
   --color-markup-table-row: #ffffff06;
-  --color-markup-code-block: #2a2e3a;
+  --color-markup-code-block: #292d39;
   --color-button: #353846;
   --color-code-bg: #2a2e3a;
   --color-shadow: #00000060;
@@ -317,19 +317,6 @@ a.ui.basic.green.label:hover {
   color: var(--color-secondary-dark-6) !important;
 }
 
-.ui.active.button:active,
-.ui.button:active,
-.ui.button:focus,
-.ui.active.button {
-  background-color: #2e3e4e;
-  color: #dbdbdb;
-}
-
-.ui.active.button:hover {
-  background-color: #475e75;
-  color: #dbdbdb;
-}
-
 .repository .navbar .active.item,
 .repository .navbar .active.item:hover {
   border-color: transparent !important;