add contributors list in readme

Modify effects / added install script

README.md

@@ -17,6 +17,7 @@ If you find something not displayed good  , feel free to contribute
  - ````mv ./GogsThemes/themes/ custom/public/css/````
  - ````cp -r  GogsThemes/img/ custom/public/````
  - ```rm -r ./GogsThemes```
+ - ``` Restart Gogs service : service gogs restart ```
 
  ## Dark
  - ````cd $GOGS_ROOT```` 
@@ -27,6 +28,20 @@ If you find something not displayed good  , feel free to contribute
  - ````mv ./GogsThemes/themes/ custom/public/css/````
  - ````cp -r  GogsThemes/img/ custom/public/````
  - ```rm -r ./GogsThemes```
+ - ``` Restart Gogs service : service gogs restart ```
+
+## Note: Running GOGS in Docker
+If you are running gogs in Docker, the "custom" folder path will actually be in a volume or bind mount, depending on how you set up your container at creation time.
+
+If you set up a bind mount for ```/data```, then your "custom" folder will be . For example, if your initial command to create the container looks like this:
+
+ - ```docker run --name=gogs -p 10022:22 -p 10080:3000 -v /var/gogs:/data gogs/gogs```
+
+...then your custom folder is ```/var/gogs/gogs``` (on the Docker host) and ```/data/gogs``` (in the container).
+
+If you did not specify any parameters for ```/data```, then Docker will have created a volume for you in ```/var/lib/docker/volumes/```. A quick and dirty way to identify the volume is ```docker inspect $yourgogscontainer | grep volume```, although there are probably better ways to do this.
+
+Source: https://github.com/gogs/gogs/tree/main/docker#custom-directory
 
 ## ScreensShots
 
@@ -67,3 +82,23 @@ Creating new theme:
 - update README.md with activate instructions and screenshots for new theme.
 - commit & push to your fork 
 - create a pull request.
+
+## Bonus - Cron Auto Switch Theme (Example)
+ - Requires GogsThemes installed ( see above , steps )
+ - Create tmpl file called `night.tmpl`  in our GOGS_ROOT/custom/templates/inject/night.tmpl
+ - add for example dark theme 
+ ```css 
+ <link rel="stylesheet" href="/css/themes/dark_theme.css">
+ ```
+  - > crontab -e
+  - Enter bellow code:
+```cron
+30 17 * * *  sudo  cat  /home/git/gogs/custom/templates/inject/night.tmpl > /home/git/gogs/custom/templates/inject/head.tmpl ; sudo  service gogs restart
+0 7  * * *  cd /home/git/gogs/custom/templates/inject/; sudo echo "" >  head.tmpl ; sudo service gogs restart
+```
+*in above example GOGS_ROOT  is `/home/git/gogs/`
+
+  ## > Contributors <
+<a  href="https://github.com/Kos-M/GogsThemes/graphs/contributors">
+<img  src="https://contrib.rocks/image?repo=Kos-M/GogsThemes"  />
+</a>

install.sh

@@ -0,0 +1,6 @@
+mkdir -p ../custom/templates/inject/
+mkdir -p ../custom/public/css/
+rm ../custom/templates/inject/head.tmpl
+echo '<link rel="stylesheet" href="/css/themes/dark_theme.css">' >> ../custom/templates/inject/head.tmpl
+cp -r ./themes/ ../custom/public/css/
+cp -r ./img/ ../custom/public/

themes/dark_theme.css

@@ -1,4 +1,10 @@
 /**** Syntax Highlighting ****/
+* {
+  outline: none;
+  transition: .2s cubic-bezier(0.3, 0, 0.5, 1);
+  transition-property: color,background-color,border-color,box-shadow;
+}
+
 body:not(.full-width) {
   background-color: #111;
   background-image: url("/img/grad1.png");
@@ -15,6 +21,10 @@ body:not(.full-width) {
   top: 0;
 }
 
+.ui.menu .dropdown.item .menu {
+  background: #1d1d1d;
+}
+
 @media (max-width: 1199px) {
   .ui.container:not(.fluid) {
     width: 85% !important;
@@ -42,6 +52,10 @@ h5,
   color: #197474;
 }
 
+.ui.info.segment.top {
+    background-color: #1d1d1d!important;
+}
+
 #file-content h1,
 #file-content h2,
 #file-content h3,
@@ -840,8 +854,11 @@ tr:hover a {
   border-color: transparent;
   border-radius: 0;
   background: #111;
-  -webkit-box-shadow: 0px 0px 8px 2px #c8c183;
-  box-shadow: 0px 0px 8px 2px #c8c183;
+  -webkit-box-shadow: 0 0 0px 1px #605d5d;
+  box-shadow: 0 0 0px 1px #605d5d;
+
+  transition: .2s cubic-bezier(0.3, 0, 0.5, 1);
+  transition-property: color,background-color,border-color,box-shadow;
 }
 
 .ui.action.input:not([class*="left action"]) > input:focus {
@@ -871,16 +888,22 @@ tr:hover a {
   background: #1c1c1c none !important;
   color: silver !important;
   font-weight: 600;
-  -webkit-box-shadow: 0 0 8px 0px #c8c183;
-  box-shadow: 0 0 8px 0px #c8c183;
+  -webkit-box-shadow: 0 0 0px 1px #2b2b2b;
+  box-shadow: 0 0 0px 1px #2b2b2b;
+
+  transition: .2s cubic-bezier(0.3, 0, 0.5, 1);
+  transition-property: color,background-color,border-color,box-shadow;
 }
 
 .ui.basic.button:hover,
 .ui.basic.buttons .button:hover {
   background: #1c1c1c !important;
   color: rgba(196, 45, 45, 0.95) !important;
-  -webkit-box-shadow: 0 0 8px 0px #c8c183;
-  box-shadow: 0 0 8px 0px #c8c183;
+  -webkit-box-shadow: 0 0 0px 1px #605d5d;
+  box-shadow: 0 0 0px 1px #605d5d;
+
+  transition: .2s cubic-bezier(0.3, 0, 0.5, 1);
+  transition-property: color,background-color,border-color,box-shadow;
 }
 
 .ui.label {
@@ -912,8 +935,11 @@ tr:hover a {
 
 .ui.buttons:not(.basic):not(.inverted) > .button,
 .ui.buttons > .ui.button:not(.basic):not(.inverted) {
-  -webkit-box-shadow: 0 0 8px 0px #c8c183;
-  box-shadow: 0 0 8px 0px #c8c183;
+  -webkit-box-shadow: 0 0 0px 1px #2b2b2b;
+  box-shadow: 0 0 0px 1px #2b2b2b;
+
+  transition: .2s cubic-bezier(0.3, 0, 0.5, 1);
+  transition-property: color,background-color,border-color,box-shadow;
 }
 
 .ui.button {
@@ -928,6 +954,9 @@ tr:hover a {
 .ui.card,
 .ui.cards > .card {
   box-shadow: 0px -1px 22px 10px #151124;
+
+  transition: .2s cubic-bezier(0.3, 0, 0.5, 1);
+  transition-property: color,background-color,border-color,box-shadow;
 }
 
 a {

themes/dark_theme.scss

@@ -8,7 +8,7 @@ $accentBase-dark    : #4682b485;
 $active             : rgba(196, 45, 45, 0.95);
 $link               : #193c9b;
 $btnColor           : #122940;
-$btnShadow          : #c8c183;
+$btnShadow          : #2b2b2b;
 $userCardShadow     : #151124;
 $RepoFilesBg        : #0a294878;
 $codeBg             : #111;
@@ -43,6 +43,10 @@ body:not(.full-width) {
     top: 0;
 }
 
+.ui.menu .dropdown.item .menu {
+  background: #1d1d1d;
+}
+
 @media (max-width: 1199px) {
  .ui.container:not(.fluid) {
     width: 85% !important;
@@ -72,6 +76,10 @@ h5,
     color: $accentBase;
 }
 
+.ui.info.segment.top {
+    background-color: #1d1d1d!important;
+}
+
 #file-content h1,
 #file-content h2,
 #file-content h3,
@@ -873,8 +881,8 @@ tr:hover a {
     border-color: transparent;
     border-radius: 0;
     background: $mainBgColor;
-    -webkit-box-shadow: 0px 0px 8px 2px $btnShadow;
-    box-shadow: 0px 0px 8px 2px $btnShadow;
+    -webkit-box-shadow: 0 0 0px 1px $btnShadow;
+    box-shadow: 0 0 0px 1px $btnShadow;
 }
 
 .ui.action.input:not([class*="left action"])>input:focus {
@@ -904,16 +912,16 @@ tr:hover a {
     background: $secondBgColor none !important;
     color: $mainTextColor!important;
     font-weight: 600;
-    -webkit-box-shadow: 0 0 8px 0px $btnShadow;
-    box-shadow: 0 0 8px 0px $btnShadow;
+    -webkit-box-shadow: 0 0 0px 1px $btnShadow;
+    box-shadow: 0 0 0px 1px $btnShadow;
 }
 
 .ui.basic.button:hover,
 .ui.basic.buttons .button:hover {
     background: $secondBgColor !important;
     color: $active !important;
-    -webkit-box-shadow: 0 0 8px 0px $btnShadow;
-    box-shadow: 0 0 8px 0px $btnShadow;
+    -webkit-box-shadow: 0 0 0px 1px $btnShadow;
+    box-shadow: 0 0 0px 1px $btnShadow;
 }
 
 .ui.label {
@@ -945,8 +953,8 @@ tr:hover a {
 
 .ui.buttons:not(.basic):not(.inverted)>.button,
 .ui.buttons>.ui.button:not(.basic):not(.inverted) {
-    -webkit-box-shadow: 0 0 8px 0px $btnShadow;
-    box-shadow: 0 0 8px 0px $btnShadow;
+    -webkit-box-shadow: 0 0 0px 1px $btnShadow;
+    box-shadow: 0 0 0px 1px $btnShadow;
 }
 
 .ui.button {