reorganise assets and scripts

waydelyle · Sep 2, 2020 · f147700 · f147700
1 parent 8a7f7d9
commit f147700
Show file tree

Hide file tree

Showing 11 changed files with 24 additions and 14 deletions.
diff --git a/Makefile b/Makefile
@@ -9,7 +9,7 @@ install:
 	rm -rf tmp/pandoc-css && git clone https://gist.github.com/5917178.git tmp/pandoc-css
 
 index-page:
-	pandoc --from gfm --to html --standalone README.md --output .gh-pages/index.html --template src/index.template.html
+	pandoc --from gfm --to html --standalone README.md --output .gh-pages/index.html --template src/docs/index.template.html
 
 pages:
 	./src/scripts/build-gh-pages.sh

diff --git a/README.md b/README.md
@@ -41,7 +41,8 @@ You can check all available assets in the following [reference pages](https://it
 
 ---
 
-For fonts and audio reference, check the [`/assets/`](https://github.com/itsjavi/pokemon-assets/tree/master/assets) folder.
+For fonts and audio reference,
+check the [`/assets/`](https://github.com/itsjavi/pokemon-assets/tree/master/assets) folder.
 
 ---
 

diff --git a/src/index.template.html → src/docs/index.template.html b/src/index.template.html → src/docs/index.template.html
diff --git a/assets/sass/items.scss → src/sass/items.scss b/assets/sass/items.scss → src/sass/items.scss
@@ -11,7 +11,7 @@
 .pkitem {
   display: inline-block;
   vertical-align: middle;
-  background-image: url(../img/items.png);
+  background-image: url(../../assets/img/items.png);
   image-rendering: crisp-edges;
   image-rendering: -moz-crisp-edges;
   image-rendering: -webkit-crisp-edges;

diff --git a/assets/sass/marks.scss → src/sass/marks.scss b/assets/sass/marks.scss → src/sass/marks.scss
@@ -11,7 +11,7 @@
 .pkmark {
   display: inline-block;
   vertical-align: middle;
-  background-image: url(../img/marks.png);
+  background-image: url(../../assets/img/marks.png);
   image-rendering: crisp-edges;
   image-rendering: -moz-crisp-edges;
   image-rendering: -webkit-crisp-edges;

diff --git a/assets/sass/pokemon.scss → src/sass/pokemon.scss b/assets/sass/pokemon.scss → src/sass/pokemon.scss
@@ -1,5 +1,5 @@
 .pkm.shiny {
-  background-image: url(../img/pokemon-shiny.png);
+  background-image: url(../../assets/img/pokemon-shiny.png);
 }
 
 .pkm-wrapper {
@@ -15,7 +15,7 @@
 .pkm {
   display: inline-block;
   vertical-align: middle;
-  background-image: url(../img/pokemon.png);
+  background-image: url(../../assets/img/pokemon.png);
   image-rendering: crisp-edges;
   image-rendering: -moz-crisp-edges;
   image-rendering: -webkit-crisp-edges;

diff --git a/assets/sass/ribbons.scss → src/sass/ribbons.scss b/assets/sass/ribbons.scss → src/sass/ribbons.scss
@@ -11,7 +11,7 @@
 .pkribbon {
   display: inline-block;
   vertical-align: middle;
-  background-image: url(../img/ribbons.png);
+  background-image: url(../../assets/img/ribbons.png);
   image-rendering: crisp-edges;
   image-rendering: -moz-crisp-edges;
   image-rendering: -webkit-crisp-edges;

diff --git a/assets/sass/symbols.scss → src/sass/symbols.scss b/assets/sass/symbols.scss → src/sass/symbols.scss
@@ -11,7 +11,7 @@
 .pksymbol {
   display: inline-block;
   vertical-align: middle;
-  background-image: url(../img/symbols.png);
+  background-image: url(../../assets/img/symbols.png);
   image-rendering: crisp-edges;
   image-rendering: -moz-crisp-edges;
   image-rendering: -webkit-crisp-edges;

diff --git a/src/scripts/generate-spritesheet.sh b/src/scripts/generate-spritesheet.sh
@@ -66,22 +66,31 @@ HIGHEST=0
 WIDEST_ALL=0
 HIGHEST_ALL=0
 
-css="
-.${_CSS_PREFIX} {
+styles_base_main="
   display: inline-block;
   vertical-align: middle;
-  background-image: url(../img/${_OUT_NAME}.png);
   image-rendering: crisp-edges;
   image-rendering: -moz-crisp-edges;
   image-rendering: -webkit-crisp-edges;
   image-rendering: pixelated;
+"
+
+css="
+.${_CSS_PREFIX} {
+  background-image: url(../img/${_OUT_NAME}.png);
+${styles_base_main}
 }"
-scss="$css
+
+scss="
 @mixin sprite-rect (\$w, \$h, \$x, \$y) {
   width: \$w;
   height: \$h;
   background-position: \$x \$y;
 }
+.${_CSS_PREFIX} {
+  background-image: url(../../assets/img/${_OUT_NAME}.png);
+${styles_base_main}
+}
 "
 html="<!DOCTYPE html>
 <html lang=\"en\">

diff --git a/src/scripts/import-generated-spritesheet.sh b/src/scripts/import-generated-spritesheet.sh
@@ -4,5 +4,5 @@ name=$1
 
 rm -f "assets/css/${name}.css" "assets/sass/${name}.scss" "assets/img/${name}.png"
 cp "tmp/output-${name}/css/styles.css" "assets/css/${name}.css"
-cp "tmp/output-${name}/sass/styles.scss" "assets/sass/${name}.scss"
+cp "tmp/output-${name}/sass/styles.scss" "src/sass/${name}.scss"
 cp "tmp/output-${name}/img/sprites.png" "assets/img/${name}.png"
diff --git a/src/scripts/import-shiny-pokemon-spritesheet.sh b/src/scripts/import-shiny-pokemon-spritesheet.sh
@@ -5,4 +5,4 @@ cp "tmp/output-pokemon-shiny/img/sprites.png" "assets/img/pokemon-shiny.png"
 extraCss='.pkm.shiny { background-image: url(../img/pokemon-shiny.png); }'
 
 printf '%s\n%s\n' $extraCss "$(cat ./assets/css/pokemon.css)" >./assets/css/pokemon.css
-printf '%s\n%s\n' $extraCss "$(cat ./assets/sass/pokemon.scss)" >./assets/sass/pokemon.scss
+printf '%s\n%s\n' $extraCss "$(cat ./assets/sass/pokemon.scss)" >./src/sass/pokemon.scss
-Original file line number
+Diff line change
@@ Expand Up @@
     ---
-    For fonts and audio reference, check the [`/assets/`](https://github.com/itsjavi/pokemon-assets/tree/master/assets) folder.
+    For fonts and audio reference,
+    check the [`/assets/`](https://github.com/itsjavi/pokemon-assets/tree/master/assets) folder.
     ---
@@ Expand Down @@