21 次代码提交 d15f932d20 ... 2a5aa65665

作者 SHA1 备注 提交日期
  Danilo Gómez Gómez 2a5aa65665 Give eye movement in Y axis 5 年之前
  Danilo Gómez Gómez 3523bac16c Parametrize background color 5 年之前
  Danilo Gómez Gómez 86f962d025 Animate figcaption disappearance 5 年之前
  Danilo Gómez Gómez 13581444d6 Implement navigation in carousel 5 年之前
  Danilo Gómez Gómez e8c0204695 Add wget script to render the local website in the local filesystem 5 年之前
  Danilo Gómez Gómez 2f207afdb5 Add buggy burger 5 年之前
  Danilo Gómez Gómez be251a9ced Add sections `poster` and `illustration` 5 年之前
  Danilo Gómez Gómez e330b97b29 Remove Mac cache files 5 年之前
  Danilo Gómez Gómez 733bc39aa6 Add basic carousel 5 年之前
  Danilo Gómez Gómez 016d233c34 Reduce font-size inside the figcaption 5 年之前
  Danilo Gómez Gómez 190e8d13c7 Hide top tile margin under the header 5 年之前
  Danilo Gómez Gómez 5ba08997fc Ignore Mac file system index files 5 年之前
  Danilo Gómez Gómez 1864bffb43 Add static images 5 年之前
  Danilo Gómez Gómez f76187dec8 Update templates to new image format 5 年之前
  Danilo Gómez Gómez cd16dc9472 Mock news page 5 年之前
  Danilo Gómez Gómez b795a3739b Update sitename in webmanifest 5 年之前
  Danilo Gómez Gómez 5c463ba2ca Update language dict 5 年之前
  Danilo Gómez Gómez 91f3e88b39 Mock about & contact page 5 年之前
  Danilo Gómez Gómez 630f5a018a Add social network logos to the footer 5 年之前
  Danilo Gómez Gómez 13ece2cea2 Add support for many browsers in figcaption animation 5 年之前
  Danilo Gómez Gómez 66ae9eee93 Fix caption hover transition 5 年之前
共有 100 个文件被更改,包括 784 次插入78 次删除
  1. 3 0
      .gitignore
  2. 4 3
      languages/es.txt
  3. 52 14
      layout/_base.html
  4. 14 0
      layout/about-and-contact.html
  5. 0 7
      layout/about.html
  6. 0 6
      layout/contact.html
  7. 17 1
      layout/news.html
  8. 3 3
      layout/work.html
  9. 6 4
      layout/work/illustration.html
  10. 11 5
      layout/work/poster.html
  11. 19 4
      plugins/alucho_images.py
  12. 2 0
      render-local.sh
  13. 2 2
      root/site.webmanifest
  14. 17 1
      sitegen.py
  15. 284 0
      static/css/hamburger.css
  16. 39 0
      static/css/image-modal.css
  17. 65 28
      static/css/main.css
  18. 二进制
      static/image/work/all/Artes de Cuba/Artes de Cuba.jpg
  19. 6 0
      static/image/work/all/Artes de Cuba/_metadata.json
  20. 二进制
      static/image/work/all/Artesanos hoy/Artesanos hoy.jpg
  21. 6 0
      static/image/work/all/Artesanos hoy/_metadata.json
  22. 二进制
      static/image/work/all/Celia Cruz/Celia Cruz.jpg
  23. 6 0
      static/image/work/all/Celia Cruz/_metadata.json
  24. 二进制
      static/image/work/all/Cimarrón/Cimarrón.jpg
  25. 6 0
      static/image/work/all/Cimarrón/_metadata.json
  26. 二进制
      static/image/work/all/Club de jazz/Club de jazz.jpg
  27. 6 0
      static/image/work/all/Club de jazz/_metadata.json
  28. 二进制
      static/image/work/all/Come come/Come come.jpg
  29. 6 0
      static/image/work/all/Come come/_metadata.json
  30. 二进制
      static/image/work/all/Cuba/Cuba.jpg
  31. 6 0
      static/image/work/all/Cuba/_metadata.json
  32. 二进制
      static/image/work/all/Dale lengua/Dale lengua.jpg
  33. 6 0
      static/image/work/all/Dale lengua/_metadata.json
  34. 二进制
      static/image/work/all/Free at Lincoln Center/Free at Lincoln Center.jpg
  35. 6 0
      static/image/work/all/Free at Lincoln Center/_metadata.json
  36. 二进制
      static/image/work/all/La Habana quinientos/La Habana quinientos.jpg
  37. 6 0
      static/image/work/all/La Habana quinientos/_metadata.json
  38. 二进制
      static/image/work/all/Pensamos Cuba/Pensamos Cuba.jpg
  39. 6 0
      static/image/work/all/Pensamos Cuba/_metadata.json
  40. 二进制
      static/image/work/all/Premio de musicología/Premio de musicología.jpg
  41. 6 0
      static/image/work/all/Premio de musicología/_metadata.json
  42. 二进制
      static/image/work/all/The year of tolerance/The year of tolerance.jpg
  43. 6 0
      static/image/work/all/The year of tolerance/_metadata.json
  44. 二进制
      static/image/work/all/Unicornio/Unicornio.jpg
  45. 二进制
      static/image/work/illustration/1 - El gato y la luna - 15_08_2009/El gato y la luna - 450 x 785 px.jpg
  46. 8 0
      static/image/work/illustration/1 - El gato y la luna - 15_08_2009/_metadata.json
  47. 二进制
      static/image/work/illustration/10 - Mi tío el empleado - 01_11_2012/Mi tío el empleado - 450 x 785 px.jpg
  48. 8 0
      static/image/work/illustration/10 - Mi tío el empleado - 01_11_2012/_metadata.json
  49. 二进制
      static/image/work/illustration/11 - El cuento del cuento - 14_07_2015/El cuento del cuento - 450 x 785 px.jpg
  50. 8 0
      static/image/work/illustration/11 - El cuento del cuento - 14_07_2015/_metadata.json
  51. 二进制
      static/image/work/illustration/12 - Mi gato alfonsino - 19_06_2016/Mi gato alfonsino - 450 x 785 px.jpg
  52. 8 0
      static/image/work/illustration/12 - Mi gato alfonsino - 19_06_2016/_metadata.json
  53. 二进制
      static/image/work/illustration/2 - La Jiribilla de Papel - 03_05_2009 al 12_04_2013/La Jiribilla de Papel - 450 x 785 px.jpg
  54. 8 0
      static/image/work/illustration/2 - La Jiribilla de Papel - 03_05_2009 al 12_04_2013/_metadata.json
  55. 二进制
      static/image/work/illustration/3 - Un pueblo de antes - 20_04_2010/Un pueblo de antes - 450 x 785 px.jpg
  56. 8 0
      static/image/work/illustration/3 - Un pueblo de antes - 20_04_2010/_metadata.json
  57. 二进制
      static/image/work/illustration/4 - Mónica caida del cielo - 03_03_2011/Mónica caída del cielo - 450 x 785 px.jpg
  58. 8 0
      static/image/work/illustration/4 - Mónica caida del cielo - 03_03_2011/_metadata.json
  59. 二进制
      static/image/work/illustration/5 - La abuela llora en el patio - 28_03_2012/La abuela llora en el patio - 450 x 785 px.jpg
  60. 8 0
      static/image/work/illustration/5 - La abuela llora en el patio - 28_03_2012/_metadata.json
  61. 二进制
      static/image/work/illustration/6 - Quién les pone el cascabel - 15_06_2012/Quién les pone el cascabel - 450 x 785 px.jpg
  62. 8 0
      static/image/work/illustration/6 - Quién les pone el cascabel - 15_06_2012/_metadata.json
  63. 二进制
      static/image/work/illustration/7 - Cuentos rusos - 28_06_2012/Cuentos rusos - 450 x 785 px.jpg
  64. 8 0
      static/image/work/illustration/7 - Cuentos rusos - 28_06_2012/_metadata.json
  65. 二进制
      static/image/work/illustration/8 - Zambilé - 07_07_2012/Zambilé - 450 x 785 px.jpg
  66. 8 0
      static/image/work/illustration/8 - Zambilé - 07_07_2012/_metadata.json
  67. 二进制
      static/image/work/illustration/9 - Una isla en el tiempo - 22_05_2013/Una isla en el tiempo - 450 x 785 px.jpg
  68. 8 0
      static/image/work/illustration/9 - Una isla en el tiempo - 22_05_2013/_metadata.json
  69. 二进制
      static/image/work/poster/1 - Llueven - 19_09_2008/._Llueven - 450 x 643 px.jpg
  70. 二进制
      static/image/work/poster/1 - Llueven - 19_09_2008/._Llueven - 696 x 995 px.jpg
  71. 二进制
      static/image/work/poster/1 - Llueven - 19_09_2008/.__metadata.json
  72. 二进制
      static/image/work/poster/1 - Llueven - 19_09_2008/Llueven - 450 x 643 px.jpg
  73. 二进制
      static/image/work/poster/1 - Llueven - 19_09_2008/Llueven - 696 x 995 px.jpg
  74. 8 0
      static/image/work/poster/1 - Llueven - 19_09_2008/_metadata.json
  75. 二进制
      static/image/work/poster/10 - Pájaros - 19_11_2013/Pájaros - 450 x 643 px.jpg
  76. 二进制
      static/image/work/poster/10 - Pájaros - 19_11_2013/Pájaros - 696 x 995 px.jpg
  77. 8 0
      static/image/work/poster/10 - Pájaros - 19_11_2013/_metadata.json
  78. 二进制
      static/image/work/poster/11 - Crisis financiera - 21_11_2013/Crisis financiera global - 450 x 643 px.jpg
  79. 二进制
      static/image/work/poster/11 - Crisis financiera - 21_11_2013/Crisis financiera global - 696 x 995 px.jpg
  80. 8 0
      static/image/work/poster/11 - Crisis financiera - 21_11_2013/_metadata.json
  81. 二进制
      static/image/work/poster/12 - Vinicius - 25_11_2013/Vinicius - 450 x 643 px.jpg
  82. 二进制
      static/image/work/poster/12 - Vinicius - 25_11_2013/Vinicius - 696 x 995 px.jpg
  83. 8 0
      static/image/work/poster/12 - Vinicius - 25_11_2013/_metadata.json
  84. 二进制
      static/image/work/poster/13 - Buey - 24_02_2014/Buey - 450 x 643 px.jpg
  85. 二进制
      static/image/work/poster/13 - Buey - 24_02_2014/Buey - 696 x 995 px.jpg
  86. 8 0
      static/image/work/poster/13 - Buey - 24_02_2014/_metadata.json
  87. 二进制
      static/image/work/poster/14 - Homenaje a Chaplin - 18_07_2014/Homenaje a Chaplin - 450 x 643 px.jpg
  88. 二进制
      static/image/work/poster/14 - Homenaje a Chaplin - 18_07_2014/Homenaje a Chaplin - 696 x 995 px.jpg
  89. 8 0
      static/image/work/poster/14 - Homenaje a Chaplin - 18_07_2014/_metadata.json
  90. 二进制
      static/image/work/poster/15 - Come come - 15_10_2014/Come come - 450 x 643 px.jpg
  91. 二进制
      static/image/work/poster/15 - Come come - 15_10_2014/Come come - 696 x 995 px.jpg
  92. 8 0
      static/image/work/poster/15 - Come come - 15_10_2014/_metadata.json
  93. 二进制
      static/image/work/poster/16 - Crepúsculo - 29_10_2014/Crepúsculo - 450 x 643 px.jpg
  94. 二进制
      static/image/work/poster/16 - Crepúsculo - 29_10_2014/Crepúsculo - 696 x 995 px.jpg
  95. 8 0
      static/image/work/poster/16 - Crepúsculo - 29_10_2014/_metadata.json
  96. 二进制
      static/image/work/poster/17 - El robo del cochino - 17_01_2015/El robo del cochino - 450 x 643 px.jpg
  97. 二进制
      static/image/work/poster/17 - El robo del cochino - 17_01_2015/El robo del cochino - 696 x 995 px.jpg
  98. 8 0
      static/image/work/poster/17 - El robo del cochino - 17_01_2015/_metadata.json
  99. 二进制
      static/image/work/poster/18 - Kikiriki - 21_01_2015/Kikiriki - 450 x 643 px.jpg
  100. 0 0
      static/image/work/poster/18 - Kikiriki - 21_01_2015/Kikiriki - 696 x 995 px.jpg

+ 3 - 0
.gitignore

@@ -1,3 +1,6 @@
 build/
 .vscode/
 __pycache__/
+._.DS_Store
+.DS_Store
+.*

+ 4 - 3
languages/es.txt

@@ -1,13 +1,14 @@
 graphic designer:diseñador gráfico
-work:trabajo
+work:trabajos
 news:noticias
 about:acerca de
 contact:contacto
 shop:tienda
 all:todos
-poster:poster
+poster:cartel
 illustration:ilustración
 editorial:editorial
 branding:marca
 other:otros
-About Alejandro:Sobre Alejandro
+About Alejandro:Acerca de Alejandro
+about & contact:acerca de & contacto

+ 52 - 14
layout/_base.html

@@ -13,8 +13,10 @@
 	<meta name="viewport" content="width=device-width, initial-scale=1.0">
 	<meta http-equiv="X-UA-Compatible" content="ie=edge">
 	<title>Alucho Portfolio</title>
+	<link rel="stylesheet" href="{{ 'css/hamburger.css' | static }}">
 	<link rel="stylesheet" href="{{ 'css/main.css' | static }}">
 	<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
+	<link rel="icon" type="image/x-icon" href="/favicon.ico">
 	<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
 	<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
 	<link rel="manifest" href="/site.webmanifest">
@@ -24,14 +26,34 @@
 	<script src="{{ 'js/eye.js' | static }}"></script>
 </head>
 <body id="body">
-	<header>
+	<header id="mobile-header">
+		<!-- This checkbox will give us the toggle behavior, it will be hidden, but functional -->
+		<input id="toggle" type="checkbox">
+
+		<!-- IMPORTANT: Any element that we want to modify when the checkbox state changes go here, being "sibling" of the checkbox element -->
+
+		<!-- This label is tied to the checkbox, and it will contain the toggle "buttons" -->
+		<label class="toggle-container" for="toggle">
+				<!-- If menu is open, it will be the "X" icon, otherwise just a clickable area behind the hamburger menu icon -->
+				<span class="button button-toggle"></span>
+		</label>
+
+		<!-- The nav menu -->
+		<nav class="nav">
+				<a class="nav-item" href="https://lmgonzalves.github.io/morphing-hamburger-menu/">Dashboard</a>
+				<a class="nav-item" href="https://lmgonzalves.github.io/morphing-hamburger-menu/">History</a>
+				<a class="nav-item" href="https://lmgonzalves.github.io/morphing-hamburger-menu/">Statistics</a>
+				<a class="nav-item" href="https://lmgonzalves.github.io/morphing-hamburger-menu/">Settings</a>
+		</nav>
+	</header>
+	<header id="wide-header">
 		<div class="header-box">
 			<div class="lbox">
 				<div id="lang-chooser" class="vbox">
-					<a class="first en {% if en %}selected{% endif %}" href="{{ 'en' | lang_url }}">en</a>
-					<a class="first {% if es %}selected{% endif %}" href="{{ 'es' | lang_url }}">es</a>
+					<a class="first en {% if lang == 'en' %}selected{% endif %}" href="{{ 'en' | lang_url }}">en</a>
+					<a class="first {% if lang == 'es' %}selected{% endif %}" href="{{ 'es' | lang_url }}">es</a>
 				</div>
-				<object id="logo" type="image/svg+xml" data="{{ 'svg/alucho-logo.svg' | static }}"></object>
+				<div id="logo">{{ 'alucho-logo' | svg }}</div>
 				<div class="vbox">
 					<div id="alucho-title" class="hbox"><h1 class="header-title"><a>Alejandro Rodríguez</a></h1></div>
 					<div id="designer-subtitle" class="hbox"><a>{{ 'graphic designer' | lang }}</a></div>
@@ -43,7 +65,7 @@
 							<h1 class="header-title">
 								<div><a href="{{ '/work' | cur_lang }}" {% if work_selected %}class="selected"{% endif %}>{{ 'work' | lang }}</a></div> /
 								<div><a href="{{ '/news' | cur_lang }}" {% if news_selected %}class="selected"{% endif %}>{{ 'news' | lang }}</a></div> /
-								<div><a href="{{ '/about-and-contact' | cur_lang }}" class="last{% if contact_selected %} selected{% endif %}">{{ 'about & contact' | lang }}</a></div>
+								<div><a href="{{ '/about-and-contact' | cur_lang }}" class="last{% if about_selected %} selected{% endif %}">{{ 'about & contact' | lang }}</a></div>
 							</h1>
 						</div>
 						<div class="hbox">
@@ -60,18 +82,20 @@
 			</div>
 		</div>
 	</header>
-	<main>
+	<main class="main-layout">
 		{% block main %}
 		{% endblock %}
 	</main>
 	<footer>
-		<div class="copyright">
-			<a class=>copyright</a> / <a href="/">www.alucho.com</a> / <a>2019</a> / <a href="/contact">{{ 'contact' | lang }}</a>
-		</div>
-		<div class="hbox">
-			Fb
-			Tw
-			In
+		<div class="footer-content">
+			<div class="copyright">
+				<a class="first">© Alejandro Rodríguez Fornés</a> / <a>2019</a>
+			</div>
+			<div class="hbox social">	
+				<a href="https://www.facebook.com/alucho">{{ 'facebook' | svg }}</a>
+				<a href="https://www.linkedin.com/alucho">{{ 'linkedin' | svg }}</a>
+				<a href="https://www.instagram.com/alucho">{{ 'instagram' | svg }}</a>
+			</div>
 		</div>
 	</footer>
 
@@ -86,6 +110,20 @@
 		<input name="next" type="hidden" value="{{ path }}"/>
 		<input type="hidden" name="language" value="es"/>
 	</form>
-
+  <dialog class="hidden" id="dialog-image-modal" data-work="" data-variant="">
+		<div id="modal-image-container" class="vbox">
+			<div class="hbox">
+				<div id="img-prev">{{ 'prev' | svg}}</div>
+				<div class="vbox">
+					<div id="close-modal">{{ 'close' | svg}}</div>
+					<img id="modal-image" src="{{ list(images('work/poster'))[1].filenames[0] | static }}" alt="Ejemplo">
+				</div>
+				<div id="img-next">{{ 'next' | svg}}</div>
+			</div>
+		</div>
+		<select id="image-select" class="hidden"></select>
+	</dialog>
+	<script src="{{ 'js/image-modal.js' | static }}"></script>
+	<link rel="stylesheet" href="{{ 'css/image-modal.css' | static }}">
 </body>
 </html>

+ 14 - 0
layout/about-and-contact.html

@@ -0,0 +1,14 @@
+{% extends "_base.html"%}
+
+{% set about_selected = True %}
+
+{% block main %}
+<style>
+	:root {
+		--columns: 1;
+	}
+	</style>
+<figure>
+<svg width="3px" height="1px" style="background-color: gray"></svg>
+</figure>
+{% endblock %}

+ 0 - 7
layout/about.html

@@ -1,7 +0,0 @@
-{% extends "_base.html"%}
-
-{% set about_selected = True %}
-
-{% block main %}
-{{ "About Alejandro" | lang }}
-{% endblock %}

+ 0 - 6
layout/contact.html

@@ -1,6 +0,0 @@
-{% extends "_base.html"%}
-
-{% set contact_selected = True %}
-
-{% block main %}
-{% endblock %}

+ 17 - 1
layout/news.html

@@ -3,4 +3,20 @@
 {% set news_selected = True %}
 
 {% block main %}
-{% endblock %}
+<style>
+	:root {
+		--columns: 3;
+	}
+</style>
+{% for _ in range(15) %}
+	<figure>
+		<svg width="16px" height="9px" style="background-color: gray"></svg>
+		<figcaption class="hbox">
+			<div class="caption">
+				<h1>News Title Here / Date</h1>
+				news
+			</div>
+		</figcaption>
+	</figure>
+{% endfor %}
+{% endblock %}

+ 3 - 3
layout/work.html

@@ -2,12 +2,12 @@
 
 {% set work_selected = True %}
 {% set all_selected = False if no_all_selected else True %}
+{% set work_path = "work/all" %}
 
 {% block main %}
-{% for image in images('work/all') %}
+{% for image in images(work_path) %}
 	<figure>
-		<img src="{{ image.filenames[0] | static }}" alt="Ejemplo">
-		<!-- <svg width="1px" height="1px" style="background-color: gray"></svg> -->
+		<img class="tile" src="{{ image.main or image.filenames[0] | static }}">
 		<figcaption class="hbox">
 			<div class="caption">
 				<h1>{{ image.name }} / {{ image.year }}</h1>

+ 6 - 4
layout/work/illustration.html

@@ -1,19 +1,21 @@
 {% extends "_work_no_all.html"%}
 
 {% set illustration_selected = True %}
+{% set work_path = "work/illustration" %}
+
 {% block main %}
 <style>
 	:root {
 		--columns: 3;
 	}
 </style>
-{% for _ in range(15) %}
+{% for image in sorted(images("work/illustration"), reverse=True) %}
 	<figure>
-		<svg width="1.75px" height="1px" style="background-color: gray"></svg>
+		<img class="tile" src="{{ (image.main or image.filenames[0]) | static }}">
 		<figcaption class="hbox">
 			<div class="caption">
-				<h1>Work Name Here / Year</h1>
-				illustration
+				<h1>{{ image.name }} / {{ image.year }}</h1>
+				{{ image.category }}
 			</div>
 		</figcaption>
 	</figure>

+ 11 - 5
layout/work/poster.html

@@ -1,17 +1,23 @@
 {% extends "_work_no_all.html"%}
 
 {% set poster_selected = True %}
+{% set work_path = "work/poster" %}
 
 {% block main %}
-{% for _ in range(15) %}
-	<figure>
-		<svg width="1px" height="1.4px" style="background-color: gray"></svg>
+{% for image in sorted(images("work/poster"), reverse=True) %}
+	<figure class="work-item">
+		<img class="tile" src="{{ (image.main or image.filenames[0]) | static }}">
 		<figcaption class="hbox">
 			<div class="caption">
-				<h1>Work Name Here / Year</h1>
-				poster
+				<h1>{{ image.name }} / {{ image.year }}</h1>
+				{{ image.category }}
 			</div>
 		</figcaption>
+		<datalist>
+		{% for variant in image.filenames %}
+			<option value="{{ variant | static }}"></option>
+		{% endfor %}
+		</datalist>
 	</figure>
 {% endfor %}
 {% endblock %}

+ 19 - 4
plugins/alucho_images.py

@@ -1,6 +1,7 @@
 from collections import namedtuple
 from json import loads as from_json
 from pathlib import Path
+from unicodedata import normalize
 
 '''
 This plugin helps loading images for each section.
@@ -32,7 +33,7 @@ Along with the image files which should be called
 IMAGE_PATH = 'image' # relative to the static path
 STATIC = ''
 
-Image = namedtuple('Image', ['name', 'year', 'category', 'description', 'filenames'])
+Image = namedtuple('Image', ['key', 'name', 'year', 'category', 'description', 'main', 'filenames'])
 
 # Functions
 
@@ -45,17 +46,31 @@ def images(section):
         if metafile.exists():
             img_base = path.relative_to(STATIC)
             metadata = from_json(metafile.read_text())
+            key = path.name.split()[0]
+            key = int(key) if key.isnumeric() else 0
             img = Image(
+                # key should always be the first field to sort images
+                key,
                 metadata.get('name'),
                 metadata.get('year'),
                 metadata.get('category'),
                 metadata.get('description'),
-                [img_base.joinpath(img_name) for img_name in metadata.get('images', [])])
-            print(img)
+                img_base.joinpath(normalize('NFC', metadata.get('main'))) if 'main' in metadata else None,
+                [img_base.joinpath(normalize('NFC', img_name)) for img_name in metadata.get('images', [])])
             yield img
 
 
 def init_plugin(env, config):
     global STATIC
+    # update var STATIC
     STATIC = config['STATIC']
-    env.globals['images'] = images
+
+    functions = [
+        images,
+        sorted,
+        map,
+        str,
+        list
+    ]
+    for f in functions:
+        env.globals[f.__name__] = f

+ 2 - 0
render-local.sh

@@ -0,0 +1,2 @@
+#!/bin/sh
+wget -EFkdrc http://localhost:8001

+ 2 - 2
root/site.webmanifest

@@ -1,6 +1,6 @@
 {
-    "name": "",
-    "short_name": "",
+    "name": "Alucho Portfolio",
+    "short_name": "Alucho Portfolio",
     "icons": [
         {
             "src": "/android-chrome-192x192.png",

+ 17 - 1
sitegen.py

@@ -8,6 +8,7 @@ from os.path import join, exists, splitext, split, islink, isdir
 from shutil import rmtree, copy2, copystat, ignore_patterns, Error
 from time import sleep
 from traceback import print_exc
+from urllib.parse import quote
 import os
 
 #TODO: load from config file (and watch it too)
@@ -15,6 +16,7 @@ LANGUAGES = 'languages'
 PLUGINS = 'plugins'
 ROOT = 'root'
 STATIC = 'static'
+STATIC_URL = '/static'
 DEFAULT_LANG = 'en'
 OTHER_LANGS = set(['es'])
 WATCH_INTERVAL = 1 # in secs
@@ -194,7 +196,18 @@ def cur_lang(ctx, path):
     return add_lang_prefix(lang, path)
 
 def static(value):
-    return f"/static/{value}"
+    parts = value.parts if isinstance(value, Path) else value.split('/')
+    sub_path = '/'.join(map(lambda s: quote(s), parts))
+    return f"{STATIC_URL}/{sub_path}"
+
+def svg(resource):
+    with Path(STATIC, 'svg', f'{resource}.svg').open() as f:
+        f.readline()
+        f.readline()
+        return f.read()
+
+def inline(file_name):
+    return Path(file_name).read_text()
 
 # Compiler
 
@@ -238,12 +251,15 @@ def init_gen(args):
 
     # Init gobals
     env.globals['lang'] = DEFAULT_LANG
+    env.globals['list'] = list
 
     # Add filters
     env.filters['lang'] = lang
     env.filters['lang_url'] = lang_url
     env.filters['cur_lang'] = cur_lang
     env.filters['static'] = static
+    env.filters['svg'] = svg
+    env.filters['inline'] = inline
 
     # Load plugins
     for mod_path in Path(PLUGINS).glob('*.py'):

+ 284 - 0
static/css/hamburger.css

@@ -0,0 +1,284 @@
+/* Basic styles */
+
+#mobile-header {
+	font-family: sans-serif;
+	right: 0;
+}
+#mobile-header {
+	position: absolute;
+	font-family: sans-serif;
+}
+
+/* Toggle functionality */
+#toggle {
+  position: absolute;
+  left: -100%;
+  top: -100%;
+}
+
+#toggle:focus ~ .toggle-container .button-toggle {
+  box-shadow: 0 0 0 8px rgba(0, 0, 0, 0.1), inset 0 0 0 8px rgba(0, 0, 0, 0.1);
+}
+
+#toggle:checked ~ .toggle-container .button-toggle {
+  box-shadow: 0 0 0 8px rgba(0, 0, 0, 0.1), inset 0 0 0 8px rgba(0, 0, 0, 0.1);
+}
+
+#toggle:checked ~ .toggle-container .button-toggle:hover {
+  box-shadow: 0 0 0 8px rgba(0, 0, 0, 0.1), inset 0 0 0 8px rgba(0, 0, 0, 0.1), 0 0 0 8px rgba(0, 0, 0, 0.1), inset 0 0 0 8px rgba(0, 0, 0, 0.1);
+}
+
+#toggle:checked ~ .toggle-container .button-toggle:before {
+  -webkit-transform: translateY(-50%) rotate(45deg) scale(1);
+      -ms-transform: translateY(-50%) rotate(45deg) scale(1);
+          transform: translateY(-50%) rotate(45deg) scale(1);
+}
+
+#toggle:checked ~ .toggle-container .button-toggle:after {
+  -webkit-transform: translateY(-50%) rotate(-45deg) scale(1);
+      -ms-transform: translateY(-50%) rotate(-45deg) scale(1);
+          transform: translateY(-50%) rotate(-45deg) scale(1);
+}
+
+#toggle:checked:focus ~ .toggle-container .button-toggle {
+  box-shadow: 0 0 0 8px rgba(0, 0, 0, 0.1), inset 0 0 0 8px rgba(0, 0, 0, 0.1), 0 0 0 8px rgba(0, 0, 0, 0.1), inset 0 0 0 8px rgba(0, 0, 0, 0.1);
+}
+
+#toggle:checked ~ .nav {
+  margin-bottom: 100px;
+  pointer-events: auto;
+  -webkit-transform: translate(0px, 50px);
+      -ms-transform: translate(0px, 50px);
+          transform: translate(0px, 50px);
+}
+
+/* 
+#toggle:check ~ .nav .nav-item {
+} */
+
+#toggle:checked ~ .nav .nav-item {
+	/* margin-right: calc(var(--body-margin) + var(--tile-margin)); */
+	font-family: 'akrobat-regular';
+  color: black;
+  letter-spacing: 0;
+  height: 40px;
+	line-height: 40px;
+	float: none;
+	text-align: right;
+	/* margin-top: 0; */
+	margin: 0;
+  opacity: 1;
+  -webkit-transform: scaleY(1);
+      -ms-transform: scaleY(1);
+          transform: scaleY(1);
+  -webkit-transition: 0.5s, opacity 0.1s;
+  transition: 0.5s, opacity 0.1s;
+}
+
+#toggle:checked ~ .nav .nav-item:nth-child(1) {
+  -webkit-transition-delay: 0.15s;
+          transition-delay: 0.15s;
+}
+
+#toggle:checked ~ .nav .nav-item:nth-child(1):before {
+  -webkit-transition-delay: 0.15s;
+          transition-delay: 0.15s;
+}
+
+#toggle:checked ~ .nav .nav-item:nth-child(2) {
+  -webkit-transition-delay: 0.1s;
+          transition-delay: 0.1s;
+}
+
+#toggle:checked ~ .nav .nav-item:nth-child(2):before {
+  -webkit-transition-delay: 0.1s;
+          transition-delay: 0.1s;
+}
+
+#toggle:checked ~ .nav .nav-item:nth-child(3) {
+  -webkit-transition-delay: 0.05s;
+          transition-delay: 0.05s;
+}
+
+#toggle:checked ~ .nav .nav-item:nth-child(3):before {
+  -webkit-transition-delay: 0.05s;
+          transition-delay: 0.05s;
+}
+
+#toggle:checked ~ .nav .nav-item:nth-child(4) {
+  -webkit-transition-delay: 0s;
+          transition-delay: 0s;
+}
+
+#toggle:checked ~ .nav .nav-item:nth-child(4):before {
+  -webkit-transition-delay: 0s;
+          transition-delay: 0s;
+}
+
+#toggle:checked ~ .nav .nav-item:before {
+  opacity: 0;
+}
+
+/* Toggle button */
+.button-toggle {
+  position: absolute;
+	display: inline-block;
+	right: 0;
+  width: 20px;
+  height: 20px;
+  margin: 25px 0;
+  box-shadow: 0 0 0 8px rgba(0, 0, 0, 0.1), inset 0 0 0 8px rgba(0, 0, 0, 0.1);	
+  border: none;
+  cursor: pointer;
+  border-radius: 100%;
+  -webkit-transition: 0.6s;
+  transition: 0.6s;
+}
+/* button X container (toggled) */
+.button-toggle:before, .button-toggle:after {
+  position: absolute;
+  content: '';
+  top: 50%;
+	/* left: 0; */
+	right: 0;
+  width: 100%;
+  height: 2px;
+  background-color: black;
+  border-radius: 5px;
+  -webkit-transition: 0.5s;
+  transition: 0.5s;
+}
+/* button \ container  */
+.button-toggle:before {
+  -webkit-transform: translateY(-50%) rotate(45deg) scale(0);
+      -ms-transform: translateY(-50%) rotate(45deg) scale(0);
+					transform: translateY(-50%) rotate(45deg) scale(0);
+}
+/* button / container  */
+.button-toggle:after {
+  -webkit-transform: translateY(-50%) rotate(-45deg) scale(0);
+      -ms-transform: translateY(-50%) rotate(-45deg) scale(0);
+          transform: translateY(-50%) rotate(-45deg) scale(0);
+}
+
+/* Menu */
+.nav {
+	display: block;
+  margin: 25px 0;
+  pointer-events: none;
+  -webkit-transition: 0.5s;
+	transition: 0.5s;
+}
+
+.nav-item {
+  position: relative;
+	display: block;
+	/* float: right; */
+	/* text-align: right; */
+  clear: both;
+  color: transparent;
+  font-size: 14px;
+  letter-spacing: -6.2px;
+  height: 7px;
+  line-height: 7px;
+  text-transform: uppercase;
+  white-space: nowrap;
+  -webkit-transform: scaleY(0.2);
+      -ms-transform: scaleY(0.2);
+          transform: scaleY(0.2);
+  -webkit-transition: 0.5s, opacity 1s;
+  transition: 0.5s, opacity 1s;
+}
+
+.nav-item:nth-child(1) {
+  -webkit-transition-delay: 0s;
+          transition-delay: 0s;
+}
+
+.nav-item:nth-child(1):before {
+  -webkit-transition-delay: 0s;
+          transition-delay: 0s;
+}
+
+.nav-item:nth-child(2) {
+  -webkit-transition-delay: 0.05s;
+          transition-delay: 0.05s;
+}
+
+.nav-item:nth-child(2):before {
+  -webkit-transition-delay: 0.05s;
+          transition-delay: 0.05s;
+}
+
+.nav-item:nth-child(3) {
+  -webkit-transition-delay: 0.1s;
+          transition-delay: 0.1s;
+}
+
+.nav-item:nth-child(3):before {
+  -webkit-transition-delay: 0.1s;
+          transition-delay: 0.1s;
+}
+
+.nav-item:nth-child(4) {
+  -webkit-transition-delay: 0.15s;
+          transition-delay: 0.15s;
+}
+
+.nav-item:nth-child(4):before {
+  -webkit-transition-delay: 0.15s;
+          transition-delay: 0.15s;
+}
+
+.nav-item:nth-child(1) {
+  letter-spacing: -8px;
+}
+
+.nav-item:nth-child(2) {
+  letter-spacing: -7px;
+}
+
+.nav-item:nth-child(n + 4) {
+  letter-spacing: -8px;
+  margin-top: -7px;
+  opacity: 0;
+}
+
+.nav-item:before {
+  position: absolute;
+  content: '';
+  top: 50%;
+	/* left: 0; */
+  width: 100%;
+  height: 2px;
+  background-color: black;
+  -webkit-transform: translateY(-50%) scaleY(5);
+      -ms-transform: translateY(-50%) scaleY(5);
+          transform: translateY(-50%) scaleY(5);
+  -webkit-transition: 0.5s;
+  transition: 0.5s;
+}
+/* .main-layout {
+  -webkit-transition: 0.5s;
+  transition: 0.5s;
+}
+
+.main-layout:before {
+  position: absolute;
+  content: '';
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background-color: transparent;
+  z-index: 2;
+  -webkit-transition: 0.5s;
+  transition: 0.5s;
+}
+#toggle:checked ~ .main-layout {
+  padding-top: 30px;
+}
+
+#toggle:checked ~ .main-layout:before {
+  background-color: rgba(0, 0, 0, 0.3);
+} */

+ 39 - 0
static/css/image-modal.css

@@ -0,0 +1,39 @@
+#dialog-image-modal {
+	position: fixed;
+	background-color: rgba(255, 255, 255, .8);
+	width: 100%;
+	height: 100%;
+	margin: 0;
+	border: 0;
+	padding: 0;
+}
+#dialog-image-modal::backdrop {
+	background: #ffffff00;
+}
+#modal-image-container {
+	margin-top: var(--header-space);
+}
+#modal-image {
+	object-fit: cover;
+	height: calc(100vh - var(--header-space) - var(--body-margin) - var(--tile-margin));
+}
+#img-prev {
+	margin-right: calc(2 * var(--tile-margin))
+}
+#img-next {
+	margin-left: calc(2 * var(--tile-margin))
+}
+#img-prev, #img-next {
+	width: var(--tile-margin);
+}
+#close-modal {
+	position: absolute;
+	align-self: flex-end;
+	transform: translate(50%, -50%);
+	width: calc(2.5 * var(--tile-margin));
+	transition: .3s ease;
+}
+#close-modal:hover {
+	transform: translate(50%, -50%) rotate(90deg);
+	transition: .3s ease;
+}

+ 65 - 28
static/css/main.css

@@ -2,13 +2,14 @@
 :root {
 	--tile-margin: .9vw;
 	--caption-hmargin: calc(2 * var(--tile-margin));
-	--caption-vmargin: calc(1 * var(--tile-margin));
+	--caption-vmargin: calc(1.5 * var(--tile-margin));
 	--body-margin: 3.6vw;
 	--theme-color: #46c8a5;
+	--bgcolor: white;
 	/* --tile-margin: 12.75px; */
 	/* --body-margin: 66px; */
 	--header-inner-space: calc(8 * var(--tile-margin));
-	--header-space: calc(10 * var(--tile-margin) - 10px);
+	--header-space: calc(10 * var(--tile-margin) - 10px + var(--tile-margin));
 }
 /* Columns */
 @media (min-width: 1501px) {
@@ -57,8 +58,14 @@ h1 {
 	}
 } */
 /* Header */
-@media (max-width: 935px) {
-	#menu { visibility: hidden; }
+@media (max-width: 600px) {
+	#mobile-header { visibility: visible; }
+	#wide-header { visibility: hidden; }
+	:root { --header-space: 100px; }
+}
+@media (min-width: 601px) {
+	#mobile-header { visibility: hidden; }
+	#wide-header { visibility: visible; }
 }
 #logo {
 	width: 10vw;
@@ -79,7 +86,8 @@ h1 {
 /* Rules */
 :root {
 	font-family: 'akrobat-regular';
-	letter-spacing: 1.5px;
+	/* letter-spacing: 1.5px; */
+	letter-spacing: .07rem;
 }
 .sec-div {
 	font-weight: bold;
@@ -91,12 +99,13 @@ a {
 	text-decoration: none;
 }
 a.en {
-	margin-bottom: .5em;
+	margin-bottom: .3em;
 }
 h1 {
 	font-size: 1.1em;
 	text-align: center;
-	letter-spacing: 1px;
+	/* letter-spacing: 1px; */
+	letter-spacing: .05rem;
 	font-weight: 100;
 	font-family: 'akrobat-bold';
 	text-decoration: none;
@@ -109,9 +118,6 @@ h2 {
 	text-decoration: none;
 	text-transform: uppercase;
 }
-figure figcaption {
-	font-size: .9em;
-}
 a.selected, a[href]:hover {
 	/* cursor: default; */
 	/* display: inline-block; */
@@ -128,8 +134,12 @@ body {
 	/* width: calc(100% - 2*var(--body-margin)); */
 	/* margin: 0 var(--body-margin); */
 	position: absolute;
+	background-color: var(--bgcolor);
+}
+#logo #background {
+	fill: var(--bgcolor) !important;
 }
-header {
+#wide-header {
 	width: calc(100% - 2*(var(--body-margin)));
 	margin: 0;
 	/* width: calc(100% - 2*(var(--body-margin) + var(--tile-margin))); */
@@ -144,7 +154,7 @@ header {
 	justify-content: flex-end;
 	position: fixed;
 	/* width: calc(100% - 2*var(--body-margin) - 2*var(--tile-margin)); */
-	background-color: white;
+	background-color: var(--bgcolor);
 	/* padding-bottom: calc(2*var(--tile-margin)); */
 	/* border-bottom: calc(2*var(--tile-margin)); */
 	height: var(--header-space);
@@ -218,7 +228,7 @@ header {
 	align-items: center;
 	/* margin-bottom: 8px; */
 }
-/* header > a, header > h1 {
+/* #wide-header > a, #wide-header > h1 {
 	margin: 0 3px;
 } */
 /* .header-subtitle > a {
@@ -235,10 +245,11 @@ main {
 	flex-direction: row;
 	flex-wrap: wrap;
 	justify-content: flex-start;
-	margin-top: var(--header-space);
+	margin-top: calc(var(--header-space) - var(--tile-margin));
 	/* margin: 0; */
 	/* margin-top: calc(var(--header-space) + var(--body-margin)); */
 	position: static;
+	/* position: absolute; */
 }
 figure {
 	position: relative;
@@ -247,31 +258,35 @@ figure {
 	margin: var(--tile-margin);
 	overflow: hidden;
 }
-figure img, svg {
+figure img.tile, svg {
 	display: flex;
 	width: 100%;
 	height: 100%;
+	cursor: pointer;
 }
 figure figcaption {
-	font-size: 0;
-	padding: 0 var(--caption-hmargin);
+	font-size: .7em;
+	padding: var(--caption-vmargin) var(--caption-hmargin);
 	display: flex;
 	flex-direction: column;
 	position: absolute;
-	background-color: white;
+	background-color: var(--bgcolor);
 	bottom: 0;
 	width: calc(100% - 2 * var(--caption-hmargin));
-	opacity: 1;
-	height: 0;
+  -webkit-transform: translateY(100%);
+      -ms-transform: translateY(100%);
+					transform: translateY(100%);
+	transition: .3s ease;	
 }
 figure:hover figcaption {
-	font-size: .9em;
-	padding: var(--caption-vmargin) var(--caption-hmargin);
+  -webkit-transform: translateY(0);
+      -ms-transform: translateY(0);
+          transform: translateY(0);
 	transition: .3s ease;
-	height: auto;
 }
 figcaption h1 {
 	margin: 0;
+	/* font-family: 'akrobat-regular'; */
 }
 .caption {
 	display: flex;
@@ -279,15 +294,26 @@ figcaption h1 {
 	align-items: flex-start;
 }
 footer {
+	display: flex;
+	flex-direction: column;
+	margin: 0 var(--tile-margin);
+	height: var(--body-margin);
+	font-size: .7em;
+	font-weight: 900;
+}
+footer::after {
+	content: " ";
+	height: var(--tile-margin);
+	bottom: 0;
+}
+.footer-content {
+	height: calc(var(--body-margin) - var(--tile-margin));
 	display: flex;
 	flex-direction: row;
 	flex-wrap: wrap;
 	justify-content: space-between;
-	margin: 0 var(--tile-margin) calc(2*var(--tile-margin)) var(--tile-margin);
-	font-size: .7em;
-	font-weight: 900;
 }
-footer .copyright {
+footer .copyright, footer .social {
 	align-items: center;
 }
 footer a.first {
@@ -295,4 +321,15 @@ footer a.first {
 }
 footer a.last {
 	margin-right: 0;
-}
+}
+footer svg {
+	width: auto;
+	height: 1.5em;
+	margin-left: .75em;
+}
+.social a {
+	margin: 0;
+}
+.hidden {
+	visibility: hidden;
+}

二进制
static/image/work/all/Artes de Cuba/Artes de Cuba.jpg


+ 6 - 0
static/image/work/all/Artes de Cuba/_metadata.json

@@ -0,0 +1,6 @@
+{
+    "name": "Artes de Cuba",
+    "year": "2018",
+    "category": "poster",
+    "images": ["Artes de Cuba.jpg"]
+}

二进制
static/image/work/all/Artesanos hoy/Artesanos hoy.jpg


+ 6 - 0
static/image/work/all/Artesanos hoy/_metadata.json

@@ -0,0 +1,6 @@
+{
+    "name": "Artesanos hoy",
+    "year": "2017",
+    "category": "poster",
+    "images": ["Artesanos hoy.jpg"]
+}

二进制
static/image/work/all/Celia Cruz/Celia Cruz.jpg


+ 6 - 0
static/image/work/all/Celia Cruz/_metadata.json

@@ -0,0 +1,6 @@
+{
+    "name": "Celia Cruz",
+    "year": "2017",
+    "category": "poster",
+    "images": ["Celia Cruz.jpg"]
+}

二进制
static/image/work/all/Cimarrón/Cimarrón.jpg


+ 6 - 0
static/image/work/all/Cimarrón/_metadata.json

@@ -0,0 +1,6 @@
+{
+    "name": "Cimarrón",
+    "year": "2017",
+    "category": "branding",
+    "images": ["Cimarrón.jpg"]
+}

二进制
static/image/work/all/Club de jazz/Club de jazz.jpg


+ 6 - 0
static/image/work/all/Club de jazz/_metadata.json

@@ -0,0 +1,6 @@
+{
+    "name": "Club de jazz",
+    "year": "2018",
+    "category": "poster",
+    "images": ["Club de jazz.jpg"]
+}

二进制
static/image/work/all/Come come/Come come.jpg


+ 6 - 0
static/image/work/all/Come come/_metadata.json

@@ -0,0 +1,6 @@
+{
+    "name": "Come come",
+    "year": "2016",
+    "category": "poster",
+    "images": ["Come come.jpg"]
+}

二进制
static/image/work/all/Cuba/Cuba.jpg


+ 6 - 0
static/image/work/all/Cuba/_metadata.json

@@ -0,0 +1,6 @@
+{
+    "name": "Cuba",
+    "year": "2019",
+    "category": "other",
+    "images": ["Cuba.jpg"]
+}

二进制
static/image/work/all/Dale lengua/Dale lengua.jpg


+ 6 - 0
static/image/work/all/Dale lengua/_metadata.json

@@ -0,0 +1,6 @@
+{
+    "name": "Dale lengua",
+    "year": "2019",
+    "category": "other",
+    "images": ["Dale lengua.jpg"]
+}

二进制
static/image/work/all/Free at Lincoln Center/Free at Lincoln Center.jpg


+ 6 - 0
static/image/work/all/Free at Lincoln Center/_metadata.json

@@ -0,0 +1,6 @@
+{
+    "name": "Free at Lincoln Center",
+    "year": "2019",
+    "category": "other",
+    "images": ["Free at Lincoln Center.jpg"]
+}

二进制
static/image/work/all/La Habana quinientos/La Habana quinientos.jpg


+ 6 - 0
static/image/work/all/La Habana quinientos/_metadata.json

@@ -0,0 +1,6 @@
+{
+    "name": "La Habana quinientos",
+    "year": "2019",
+    "category": "poster",
+    "images": ["La Habana quinientos.jpg"]
+}

二进制
static/image/work/all/Pensamos Cuba/Pensamos Cuba.jpg


+ 6 - 0
static/image/work/all/Pensamos Cuba/_metadata.json

@@ -0,0 +1,6 @@
+{
+    "name": "Pensamos Cuba",
+    "year": "2019",
+    "category": "poster",
+    "images": ["Pensamos Cuba.jpg"]
+}

二进制
static/image/work/all/Premio de musicología/Premio de musicología.jpg


+ 6 - 0
static/image/work/all/Premio de musicología/_metadata.json

@@ -0,0 +1,6 @@
+{
+    "name": "Premio de musicología",
+    "year": "2018",
+    "category": "poster",
+    "images": ["Premio de musicología.jpg"]
+}

二进制
static/image/work/all/The year of tolerance/The year of tolerance.jpg


+ 6 - 0
static/image/work/all/The year of tolerance/_metadata.json

@@ -0,0 +1,6 @@
+{
+    "name": "The year of tolerance",
+    "year": "2019",
+    "category": "poster",
+    "images": ["The year of tolerance.jpg"]
+}

二进制
static/image/work/all/Unicornio/Unicornio.jpg


二进制
static/image/work/illustration/1 - El gato y la luna - 15_08_2009/El gato y la luna - 450 x 785 px.jpg


+ 8 - 0
static/image/work/illustration/1 - El gato y la luna - 15_08_2009/_metadata.json

@@ -0,0 +1,8 @@
+{
+    "name": "El gato y la luna",
+    "priority": 1,
+    "year": "2009",
+    "category": "illustration",
+    "main": "El gato y la luna - 450 x 785 px.jpg",
+    "images": ["El gato y la luna - 450 x 785 px.jpg"]
+}

二进制
static/image/work/illustration/10 - Mi tío el empleado - 01_11_2012/Mi tío el empleado - 450 x 785 px.jpg


+ 8 - 0
static/image/work/illustration/10 - Mi tío el empleado - 01_11_2012/_metadata.json

@@ -0,0 +1,8 @@
+{
+    "name": "Mi tío el empleado",
+    "priority": 10,
+    "year": "2013",
+    "category": "illustration",
+    "main": "Mi tío el empleado - 450 x 785 px.jpg",
+    "images": ["Mi tío el empleado - 450 x 785 px.jpg"]
+}

二进制
static/image/work/illustration/11 - El cuento del cuento - 14_07_2015/El cuento del cuento - 450 x 785 px.jpg


+ 8 - 0
static/image/work/illustration/11 - El cuento del cuento - 14_07_2015/_metadata.json

@@ -0,0 +1,8 @@
+{
+    "name": "El cuento del cuento",
+    "priority":11,
+    "year": "2015",
+    "category": "illustration",
+    "main": "El cuento del cuento - 450 x 785 px.jpg",
+    "images": ["El cuento del cuento - 450 x 785 px.jpg"]
+}

二进制
static/image/work/illustration/12 - Mi gato alfonsino - 19_06_2016/Mi gato alfonsino - 450 x 785 px.jpg


+ 8 - 0
static/image/work/illustration/12 - Mi gato alfonsino - 19_06_2016/_metadata.json

@@ -0,0 +1,8 @@
+{
+    "name": "Mi gato alfonsino",
+    "priority": 12,
+    "year": "2016",
+    "category": "illustration",
+    "main": "Mi gato alfonsino - 450 x 785 px.jpg",
+    "images": ["Mi gato alfonsino - 450 x 785 px.jpg"]
+}

二进制
static/image/work/illustration/2 - La Jiribilla de Papel - 03_05_2009 al 12_04_2013/La Jiribilla de Papel - 450 x 785 px.jpg


+ 8 - 0
static/image/work/illustration/2 - La Jiribilla de Papel - 03_05_2009 al 12_04_2013/_metadata.json

@@ -0,0 +1,8 @@
+{
+    "name": "La Jiribilla de Papel",
+    "priority": 2,
+    "year": "2009",
+    "category": "illustration",
+    "main": "La Jiribilla de Papel - 450 x 785 px.jpg",
+    "images": ["La Jiribilla de Papel - 450 x 785 px.jpg"]
+}

二进制
static/image/work/illustration/3 - Un pueblo de antes - 20_04_2010/Un pueblo de antes - 450 x 785 px.jpg


+ 8 - 0
static/image/work/illustration/3 - Un pueblo de antes - 20_04_2010/_metadata.json

@@ -0,0 +1,8 @@
+{
+    "name": "Un pueblo de antes",
+    "priority": 3,
+    "year": "2010",
+    "category": "illustration",
+    "main": "Un pueblo de antes - 450 x 785 px.jpg",
+    "images": ["Un pueblo de antes - 450 x 785 px.jpg"]
+}

二进制
static/image/work/illustration/4 - Mónica caida del cielo - 03_03_2011/Mónica caída del cielo - 450 x 785 px.jpg


+ 8 - 0
static/image/work/illustration/4 - Mónica caida del cielo - 03_03_2011/_metadata.json

@@ -0,0 +1,8 @@
+{
+    "name": "Mónica caída del cielo",
+    "priority": 4,
+    "year": "2011",
+    "category": "illustration",
+    "main": "Mónica caída del cielo - 450 x 785 px.jpg",
+    "images": ["Mónica caída del cielo - 450 x 785 px.jpg"]
+}

二进制
static/image/work/illustration/5 - La abuela llora en el patio - 28_03_2012/La abuela llora en el patio - 450 x 785 px.jpg


+ 8 - 0
static/image/work/illustration/5 - La abuela llora en el patio - 28_03_2012/_metadata.json

@@ -0,0 +1,8 @@
+{
+    "name": "La abuela llora en el patio",
+    "priority": 5,
+    "year": "2012",
+    "category": "illustration",
+    "main": "La abuela llora en el patio - 450 x 785 px.jpg",
+    "images": ["La abuela llora en el patio - 450 x 785 px.jpg"]
+}

二进制
static/image/work/illustration/6 - Quién les pone el cascabel - 15_06_2012/Quién les pone el cascabel - 450 x 785 px.jpg


+ 8 - 0
static/image/work/illustration/6 - Quién les pone el cascabel - 15_06_2012/_metadata.json

@@ -0,0 +1,8 @@
+{
+    "name": "Quién les pone el cascabel",
+    "priority": 6,
+    "year": "2012",
+    "category": "illustration",
+    "main": "Quién les pone el cascabel - 450 x 785 px.jpg",
+    "images": ["Quién les pone el cascabel - 450 x 785 px.jpg"]
+}

二进制
static/image/work/illustration/7 - Cuentos rusos - 28_06_2012/Cuentos rusos - 450 x 785 px.jpg


+ 8 - 0
static/image/work/illustration/7 - Cuentos rusos - 28_06_2012/_metadata.json

@@ -0,0 +1,8 @@
+{
+    "name": "Cuentos rusos",
+    "priority": 7,
+    "year": "2012",
+    "category": "illustration",
+    "main": "Cuentos rusos - 450 x 785 px.jpg",
+    "images": ["Cuentos rusos - 450 x 785 px.jpg"]
+}

二进制
static/image/work/illustration/8 - Zambilé - 07_07_2012/Zambilé - 450 x 785 px.jpg


+ 8 - 0
static/image/work/illustration/8 - Zambilé - 07_07_2012/_metadata.json

@@ -0,0 +1,8 @@
+{
+    "name": "Zambilé",
+    "priority": 8,
+    "year": "2012",
+    "category": "illustration",
+    "main": "Zambilé - 450 x 785 px.jpg",
+    "images": ["Zambilé - 450 x 785 px.jpg"]
+}

二进制
static/image/work/illustration/9 - Una isla en el tiempo - 22_05_2013/Una isla en el tiempo - 450 x 785 px.jpg


+ 8 - 0
static/image/work/illustration/9 - Una isla en el tiempo - 22_05_2013/_metadata.json

@@ -0,0 +1,8 @@
+{
+    "name": "Una isla en el tiempo",
+    "priority": 9,
+    "year": "2013",
+    "category": "illustration",
+    "main": "Una isla en el tiempo - 450 x 785 px.jpg",
+    "images": ["Una isla en el tiempo - 450 x 785 px.jpg"]
+}

二进制
static/image/work/poster/1 - Llueven - 19_09_2008/._Llueven - 450 x 643 px.jpg


二进制
static/image/work/poster/1 - Llueven - 19_09_2008/._Llueven - 696 x 995 px.jpg


二进制
static/image/work/poster/1 - Llueven - 19_09_2008/.__metadata.json


二进制
static/image/work/poster/1 - Llueven - 19_09_2008/Llueven - 450 x 643 px.jpg


二进制
static/image/work/poster/1 - Llueven - 19_09_2008/Llueven - 696 x 995 px.jpg


+ 8 - 0
static/image/work/poster/1 - Llueven - 19_09_2008/_metadata.json

@@ -0,0 +1,8 @@
+{
+    "name": "Llueven",
+    "priority": 1,
+    "year": "2008",
+    "category": "poster",
+    "main": "Llueven - 450 x 643 px.jpg",
+    "images": ["Llueven - 696 x 995 px.jpg"]
+}

二进制
static/image/work/poster/10 - Pájaros - 19_11_2013/Pájaros - 450 x 643 px.jpg


二进制
static/image/work/poster/10 - Pájaros - 19_11_2013/Pájaros - 696 x 995 px.jpg


+ 8 - 0
static/image/work/poster/10 - Pájaros - 19_11_2013/_metadata.json

@@ -0,0 +1,8 @@
+{
+    "name": "Pájaros",
+    "priority": 10,
+    "year": "2013",
+    "category": "poster",
+    "main": "Pájaros - 450 x 643 px.jpg",
+    "images": ["Pájaros - 696 x 995 px.jpg"]
+}

二进制
static/image/work/poster/11 - Crisis financiera - 21_11_2013/Crisis financiera global - 450 x 643 px.jpg


二进制
static/image/work/poster/11 - Crisis financiera - 21_11_2013/Crisis financiera global - 696 x 995 px.jpg


+ 8 - 0
static/image/work/poster/11 - Crisis financiera - 21_11_2013/_metadata.json

@@ -0,0 +1,8 @@
+{
+    "name": "Crisis financiera",
+    "priority": 11,
+    "year": "2013",
+    "category": "poster",
+    "main": "Crisis financiera global - 450 x 643 px.jpg",
+    "images": ["Crisis financiera global - 696 x 995 px.jpg"]
+}

二进制
static/image/work/poster/12 - Vinicius - 25_11_2013/Vinicius - 450 x 643 px.jpg


二进制
static/image/work/poster/12 - Vinicius - 25_11_2013/Vinicius - 696 x 995 px.jpg


+ 8 - 0
static/image/work/poster/12 - Vinicius - 25_11_2013/_metadata.json

@@ -0,0 +1,8 @@
+{
+    "name": "Vinicius",
+    "priority": 12,
+    "year": "2013",
+    "category": "poster",
+    "main": "Vinicius - 450 x 643 px.jpg",
+    "images": ["Vinicius - 696 x 995 px.jpg"]
+}

二进制
static/image/work/poster/13 - Buey - 24_02_2014/Buey - 450 x 643 px.jpg


二进制
static/image/work/poster/13 - Buey - 24_02_2014/Buey - 696 x 995 px.jpg


+ 8 - 0
static/image/work/poster/13 - Buey - 24_02_2014/_metadata.json

@@ -0,0 +1,8 @@
+{
+    "name": "Buey",
+    "priority": 13,
+    "year": "2014",
+    "category": "poster",
+    "main": "Buey - 450 x 643 px.jpg",
+    "images": ["Buey - 696 x 995 px.jpg"]
+}

二进制
static/image/work/poster/14 - Homenaje a Chaplin - 18_07_2014/Homenaje a Chaplin - 450 x 643 px.jpg


二进制
static/image/work/poster/14 - Homenaje a Chaplin - 18_07_2014/Homenaje a Chaplin - 696 x 995 px.jpg


+ 8 - 0
static/image/work/poster/14 - Homenaje a Chaplin - 18_07_2014/_metadata.json

@@ -0,0 +1,8 @@
+{
+    "name": "Homenaje a Chaplin",
+    "priority": 14,
+    "year": "2014",
+    "category": "poster",
+    "main": "Homenaje a Chaplin - 450 x 643 px.jpg",
+    "images": ["Homenaje a Chaplin - 696 x 995 px.jpg"]
+}

二进制
static/image/work/poster/15 - Come come - 15_10_2014/Come come - 450 x 643 px.jpg


二进制
static/image/work/poster/15 - Come come - 15_10_2014/Come come - 696 x 995 px.jpg


+ 8 - 0
static/image/work/poster/15 - Come come - 15_10_2014/_metadata.json

@@ -0,0 +1,8 @@
+{
+    "name": "Come come",
+    "priority": 15,
+    "year": "2014",
+    "category": "poster",
+    "main": "Come come - 450 x 643 px.jpg",
+    "images": ["Come come - 696 x 995 px.jpg"]
+}

二进制
static/image/work/poster/16 - Crepúsculo - 29_10_2014/Crepúsculo - 450 x 643 px.jpg


二进制
static/image/work/poster/16 - Crepúsculo - 29_10_2014/Crepúsculo - 696 x 995 px.jpg


+ 8 - 0
static/image/work/poster/16 - Crepúsculo - 29_10_2014/_metadata.json

@@ -0,0 +1,8 @@
+{
+    "name": "Crepúsculo",
+    "priority": 16,
+    "year": "2014",
+    "category": "poster",
+    "main": "Crepúsculo - 450 x 643 px.jpg",
+    "images": ["Crepúsculo - 696 x 995 px.jpg"]
+}

二进制
static/image/work/poster/17 - El robo del cochino - 17_01_2015/El robo del cochino - 450 x 643 px.jpg


二进制
static/image/work/poster/17 - El robo del cochino - 17_01_2015/El robo del cochino - 696 x 995 px.jpg


+ 8 - 0
static/image/work/poster/17 - El robo del cochino - 17_01_2015/_metadata.json

@@ -0,0 +1,8 @@
+{
+    "name": "El robo del cochino",
+    "priority": 17,
+    "year": "2015",
+    "category": "poster",
+    "main": "El robo del cochino - 450 x 643 px.jpg",
+    "images": ["El robo del cochino - 696 x 995 px.jpg"]
+}

二进制
static/image/work/poster/18 - Kikiriki - 21_01_2015/Kikiriki - 450 x 643 px.jpg


+ 0 - 0
static/image/work/poster/18 - Kikiriki - 21_01_2015/Kikiriki - 696 x 995 px.jpg


部分文件因为文件数量过多而无法显示