simplify styling

README.md

@@ -41,7 +41,7 @@ The `custom/` folder maps to `/home/git/gitea/custom/` on the server. Its conten
 
 ```bash
 npm i
-gulp deploy
+npm run deploy
 ```
 
 [Gitea Docs: Customizing Gitea](https://docs.gitea.io/en-us/customizing-gitea/)

custom/templates/custom/header.tmpl

@@ -1,54 +1,27 @@
 <link rel="mask-icon" href="/img/gitea-safari.svg" color="#BA5B81">
 
 <style>
-    a,
+    :root {
-    .ui.breadcrumb a,
+        --color-primary: #BA5B81;
-    .repository.file.list #repo-files-table tbody .octicon.octicon-file-directory,
+        --color-primary-light-1: #d76995;
-    .repository.file.list #repo-files-table tbody .octicon.octicon-file-submodule,
+        --color-primary-light-2: #ef8cb4;
-    .ui.labeled.button:not([class*="left labeled"])>.label, 
+        --color-primary-light-3: #f4a1c2;
-    .ui[class*="left labeled"].button>.button,
+        --color-primary-light-4: #f8c5da;
-    .ui.card>.extra a:not(.ui),
+        --color-primary-light-5: #fcdbe9;
-    .ui.cards>.card>.extra a:not(.ui) { 
+        --color-primary-light-6: #fdecf3;
-        color: #BA5B81;
+        --color-primary-light-7: #fff5f9;
+        --color-primary-dark-1: #ad4b72;
+        --color-primary-dark-2: #a03c64;
+        --color-primary-dark-3: #8f2b53;
+        --color-primary-dark-4: #7b1d43;
+        --color-primary-dark-5: #6d1236;
+        --color-primary-dark-6: #510825;
+        --color-primary-dark-7: #2b0212;
+        --color-primary-hover: var(--color-primary-light-2);
+        --fonts-proportional: 'Avenir Next', Avenir, "Helvetica Neue", Helvetica, Arial, sans-serif;
     }
 
-    a:hover,
+    #navbar .item {
-    .ui.breadcrumb a:hover,
+        font-weight: 500;
-    .ui.card>.extra a:not(.ui):hover,
-    .ui.cards>.card>.extra a:not(.ui):hover {
-        color: #BA5B81;
-        text-decoration: underline;
-    }
-
-    .ui.green.button,
-    .ui.green.buttons .button,
-    .ui.blue.button, 
-    .ui.blue.buttons .button,
-    .ui.green.button:hover,
-    .ui.green.buttons .button:hover,
-    .ui.blue.button:hover, 
-    .ui.blue.buttons .button:hover,
-    .ui.pagination.menu .active.item {
-        background-color: #BA5B81;
-    }
-
-    .ui.basic.blue.button,
-    .ui.basic.blue.buttons .button {
-        box-shadow: 0 0 0 1px #BA5B81 inset !important;
-        color: #BA5B81 !important;
-    }
-
-    .feeds .list ul li.private {
-        background: rgba(186, 91, 129, 0.1);
-    }
-
-    @media only screen and (max-width: 1200px) {
-        .ui.menu.new-menu:after {
-            background-image: linear-gradient(to right,rgba(42,46,58,0),rgba(42,46,58,1) 100%);
-        }
-    }
-
-    #repo-files-table .message a {
-        color: #9e9e9e;
     }
 </style>

custom/templates/home.tmpl

@@ -34,14 +34,6 @@
                 color: #6b7f88;
 
                 padding: 2rem 0;
-                -moz-display: flex;
-                -moz-align-items: center;
-                -moz-justify-content: center;
-                -moz-flex-wrap: wrap;
-                -webkit-display: flex;
-                -webkit-align-items: center;
-                -webkit-justify-content: center;
-                -webkit-flex-wrap: wrap;
                 display: flex;
                 align-items: center;
                 justify-content: center;

gulpfile.js

@@ -27,7 +27,7 @@ gulp.task('deploy', () => {
         .pipe(rsync({
             root: DIST,
             hostname: 'git',
-            username: 'ubuntu',
+            username: 'git',
             destination: '/home/git/gitea/custom',
             chown: 'git:git'
         }))

package.json

@@ -12,9 +12,10 @@
     "deploy": "gulp deploy"
   },
   "devDependencies": {
-    "browser-sync": "^2.27.10",
+    "browser-sync": "^3.0.2",
-    "gulp": "^4.0.0",
+    "gulp": "^4.0.2",
-    "gulp-rsync": "0.0.8"
+    "gulp-rsync": "0.1.0",
+    "gulp-util": "^3.0.8"
   },
   "engines": {
     "node": "16"