Tlačítko pro editaci receptu

sass/_tags.scss

@@ -1,5 +1,5 @@
 span.tag {
-	margin:$tag-margin;
+	margin-right:$tag-margin-right;
 	padding:$tag-padding;
 	background:$tag-background;
 	color:$tag-color;

sass/_variables.scss

@@ -19,7 +19,7 @@ $anchor-hover-color:lighten($primary, 20%);
 // tags
 $tag-background:$secondary;
 $tag-padding:.5em;
-$tag-margin:0 .4em .5em 0;
+$tag-margin-right:.4em;
 $tag-border-radius:5px;
 $tag-color:#000;
 $tag-font-size:.9rem;

sass/style.scss

@@ -75,7 +75,20 @@ main {
 	}
 
 	.meta {
-		margin-bottom:1.5em;
+		display: flex;
+		align-items: center;
+		margin-bottom: 1.5em;
+
+		&>.edit {
+			margin-left: auto;
+			font-size: 1.2em;
+		}
+	}
+
+	.taglist {
+		display: flex;
+		align-items: center;
+		margin-bottom: .5em;
 	}
 
 	.pagination {

static/fonts/icons.css

@@ -1,35 +1,39 @@
 @font-face {
-	font-family: 'icons';
-	src:
-		url('/fonts/icons.ttf?88dd9o') format('truetype'),
-		url('/fonts/icons.woff?88dd9o') format('woff'),
-		url('/fonts/icons.svg?88dd9o#icons') format('svg');
-	font-weight: normal;
-	font-style: normal;
-	font-display: block;
+  font-family: 'icons';
+  src:  url('icons.eot?3nfdne');
+  src:  url('icons.eot?3nfdne#iefix') format('embedded-opentype'),
+    url('icons.ttf?3nfdne') format('truetype'),
+    url('icons.woff?3nfdne') format('woff'),
+    url('icons.svg?3nfdne#icons') format('svg');
+  font-weight: normal;
+  font-style: normal;
+  font-display: block;
 }
 
 [class^="icon-"], [class*=" icon-"] {
-	/* use !important to prevent issues with browser extensions that change fonts */
-	font-family: 'icons' !important;
-	speak: never;
-	font-style: normal;
-	font-weight: normal;
-	font-variant: normal;
-	text-transform: none;
-	line-height: 1;
+  /* use !important to prevent issues with browser extensions that change fonts */
+  font-family: 'icons' !important;
+  speak: never;
+  font-style: normal;
+  font-weight: normal;
+  font-variant: normal;
+  text-transform: none;
+  line-height: 1;
 
-	/* Better Font Rendering =========== */
-	-webkit-font-smoothing: antialiased;
-	-moz-osx-font-smoothing: grayscale;
+  /* Better Font Rendering =========== */
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
 }
 
+.icon-pencil:before {
+  content: "\e905";
+}
 .icon-search:before {
-	content: "\e986";
+  content: "\e986";
 }
 .icon-info:before {
-	content: "\ea0c";
+  content: "\ea0c";
 }
 .icon-git:before {
-	content: "\eae7";
+  content: "\eae7";
 }

static/fonts/icons.svg

@@ -3,10 +3,11 @@
 <svg xmlns="http://www.w3.org/2000/svg">
 <metadata>Generated by IcoMoon</metadata>
 <defs>
-<font id="icommon" horiz-adv-x="1024">
+<font id="icons" horiz-adv-x="1024">
 <font-face units-per-em="1024" ascent="960" descent="-64" />
 <missing-glyph horiz-adv-x="1024" />
 <glyph unicode="&#x20;" horiz-adv-x="512" d="" />
+<glyph unicode="&#xe905;" glyph-name="pencil" d="M864 960c88.364 0 160-71.634 160-160 0-36.020-11.91-69.258-32-96l-64-64-224 224 64 64c26.742 20.090 59.978 32 96 32zM64 224l-64-288 288 64 592 592-224 224-592-592zM715.578 596.422l-448-448-55.156 55.156 448 448 55.156-55.156z" />
 <glyph unicode="&#xe986;" glyph-name="search" d="M992.262 88.604l-242.552 206.294c-25.074 22.566-51.89 32.926-73.552 31.926 57.256 67.068 91.842 154.078 91.842 249.176 0 212.078-171.922 384-384 384-212.076 0-384-171.922-384-384s171.922-384 384-384c95.098 0 182.108 34.586 249.176 91.844-1-21.662 9.36-48.478 31.926-73.552l206.294-242.552c35.322-39.246 93.022-42.554 128.22-7.356s31.892 92.898-7.354 128.22zM384 320c-141.384 0-256 114.616-256 256s114.616 256 256 256 256-114.616 256-256-114.614-256-256-256z" />
 <glyph unicode="&#xea0c;" glyph-name="info" d="M448 656c0 26.4 21.6 48 48 48h32c26.4 0 48-21.6 48-48v-32c0-26.4-21.6-48-48-48h-32c-26.4 0-48 21.6-48 48v32zM640 192h-256v64h64v192h-64v64h192v-256h64zM512 960c-282.77 0-512-229.23-512-512s229.23-512 512-512 512 229.23 512 512-229.23 512-512 512zM512 32c-229.75 0-416 186.25-416 416s186.25 416 416 416 416-186.25 416-416-186.25-416-416-416z" />
 <glyph unicode="&#xeae7;" glyph-name="git" d="M1004.692 493.606l-447.096 447.080c-25.738 25.754-67.496 25.754-93.268 0l-103.882-103.876 78.17-78.17c12.532 5.996 26.564 9.36 41.384 9.36 53.020 0 96-42.98 96-96 0-14.82-3.364-28.854-9.362-41.386l127.976-127.974c12.532 5.996 26.566 9.36 41.386 9.36 53.020 0 96-42.98 96-96s-42.98-96-96-96-96 42.98-96 96c0 14.82 3.364 28.854 9.362 41.386l-127.976 127.974c-3.042-1.456-6.176-2.742-9.384-3.876v-266.968c37.282-13.182 64-48.718 64-90.516 0-53.020-42.98-96-96-96s-96 42.98-96 96c0 41.796 26.718 77.334 64 90.516v266.968c-37.282 13.18-64 48.72-64 90.516 0 14.82 3.364 28.852 9.36 41.384l-78.17 78.17-295.892-295.876c-25.75-25.776-25.75-67.534 0-93.288l447.12-447.080c25.738-25.75 67.484-25.75 93.268 0l445.006 445.006c25.758 25.762 25.758 67.54-0.002 93.29z" />

templates/page.html

@@ -16,9 +16,10 @@
 	
 	{% if page.extra.image %}<img src="{{ page.extra.image }}" alt="Náhled">{% endif %}
 	<div class="meta">
-		{% if page.extra.portions %}<span class="tag">Porce: <strong>{{ page.extra.portions }}</strong></span>{% endif %}
-		{% if page.extra.time %}<span class="tag">Doba přípravy: <strong>{{ page.extra.time }} min</strong></span>{% endif %}
-		{% if page.extra.source %}<span class="tag">Zdroj: <strong>{{ page.extra.source }}</strong></span>{% endif %}
+		{% if page.extra.portions %}<span class="tag">Porce:&nbsp;<strong>{{ page.extra.portions }}</strong></span>{% endif %}
+		{% if page.extra.time %}<span class="tag">Doba přípravy:&nbsp;<strong>{{ page.extra.time }}&nbsp;min</strong></span>{% endif %}
+		{% if page.extra.source %}<span class="tag">Zdroj:&nbsp;<strong>{{ page.extra.source }}</strong></span>{% endif %}
+		<a href="{{ config.extra.git }}/_edit/master/content/{{ page.relative_path }}" class="edit" title="Upravit"><span class="icon-pencil"></span></a>
 	</div>
 	
 	{{ page.content | safe }}
@@ -27,8 +28,8 @@
 
 	{% if page.taxonomies.kategorie %}
 	{% set categories = page.taxonomies.kategorie %}
-	<div>
-		Kategorie &ndash; 
+	<div class="taglist">
+		Kategorie&nbsp;&ndash;&nbsp;
 		{% for term in categories %}
 			<span class="tag"><a href="{{ get_taxonomy_url(kind="kategorie", name=term) | safe }}">{{ term | capitalize() }}</a></span>
 		{% endfor %}
@@ -37,8 +38,8 @@
 
 	{% if page.taxonomies.tagy %}
 	{% set tags = page.taxonomies.tagy %}
-	<div>
-		Tagy &ndash; 
+	<div class="taglist">
+		Tagy&nbsp;&ndash;&nbsp;
 		{% for term in tags %}
 		 <span class="tag"><a href="{{ get_taxonomy_url(kind="tagy", name=term) | safe }}">{{ term | capitalize() }}</a></span>
 		{% endfor %}