From 940b40688a7cf595eee061b696187e2fe4a578e2 Mon Sep 17 00:00:00 2001 From: Jieiku Date: Mon, 22 May 2023 22:31:34 -0700 Subject: Json-Index and config.toml optional --- templates/base.html | 19 +++- templates/index.html | 3 +- templates/macros/head.html | 240 +++++++++++++++++++------------------------ templates/macros/macros.html | 20 ++-- templates/macros/social.html | 2 +- templates/page.html | 3 +- 6 files changed, 139 insertions(+), 148 deletions(-) (limited to 'templates') diff --git a/templates/base.html b/templates/base.html index 0177ea1..642239b 100644 --- a/templates/base.html +++ b/templates/base.html @@ -51,20 +51,27 @@
{%- if config.build_search_index %} + {%- set icon_search=config.extra.icon_search | default(value="svgs search") -%}
@@ -91,7 +98,9 @@
{%- endif %}
+ {%- if config.extra.social %} {{- social_macros::social_links(social_config=config.extra.social, config=config) }} + {%- endif %} {#- Copyright START #} {%- set copyright_start_year=config.extra.copyright_start_year | default(value="") %} @@ -99,6 +108,7 @@ {%- set copyright_end_year=config.extra.copyright_end_year | default(value=now() | date(format="%Y")) %} Copyright © {{ copyright_start_year ~ copyright_end_year }} {{ config.title }}

{#- Copyright END #} + {%- if config.extra.menu_footer %} + {%- endif %} {%- if config.extra.footer_credit | default(value=true) %} {%- if config.extra.footer_credit_override %} {{ config.extra.footer_credit_override | safe }} @@ -119,4 +130,4 @@ {%- block gotop %} {%- endblock gotop %} - \ No newline at end of file + diff --git a/templates/index.html b/templates/index.html index 7c8c45a..4702e16 100644 --- a/templates/index.html +++ b/templates/index.html @@ -59,7 +59,8 @@

Recent Posts

- {%- for page in section_item.pages | slice(end=config.extra.recent_items) %} + {%- set recent_items=config.extra.recent_items | default(value=9) -%} + {%- for page in section_item.pages | slice(end=recent_items) %} {{- page_macros::page_listing(page=page, config=config) }} {%- endfor %}
diff --git a/templates/macros/head.html b/templates/macros/head.html index 528577a..3767a16 100644 --- a/templates/macros/head.html +++ b/templates/macros/head.html @@ -1,20 +1,24 @@ {#- Theme Switcher Button to toggle between dark/light #} {%- macro theme(config) %} - {%- if config.extra.js_theme %} - {%- if config.extra.js_themeButton or config.extra.js_bundle %} - + {%- if config.extra.js_switcher | default(value=true) %} + {%- set js_theme=config.extra.js_theme | default(value="theme.min.js") -%} + {%- if js_theme %} + {%- endif %} {%- endif %} {%- endmacro %} -{%- macro stylesheets(config) %} - {%- if config.extra.stylesheets %}{%- for i in config.extra.stylesheets %} + +{%- macro stylesheets(config) %} + {%- set stylesheets=config.extra.stylesheets | default(value=[ "abridge.css" ]) -%} + {%- if stylesheets %}{%- for i in stylesheets %} {%- endfor %}{%- endif %} - {%- endmacro %} + + {%- macro stylesheets_preload(config) %} {%- if config.extra.fonts %}{%- for i in config.extra.fonts %} @@ -31,10 +35,11 @@ {%- if config.extra.math or page.extra.math %} - {%- if config.extra.katex_css %}{%- if config.extra.katex_css is matching("^http[s]?://") %} - + {%- set katex_css=config.extra.katex_css | default(value="katex.min.css") -%} + {%- if katex_css %}{%- if katex_css is matching("^http[s]?://") %} + {%- else %} - + {%- endif %}{%- endif %} {%- endif %} @@ -51,7 +56,21 @@ + + + + + + + + + + + + + {%- macro js(config) %} + {%- set search_library=config.extra.search_library | default(value="elasticlunr") -%} {%- set preStyle = false %} @@ -66,141 +85,60 @@ {%- endif %} {%- if config.extra.math or page.extra.math %} - {%- if config.extra.katex_css %} + {%- set katex_css=config.extra.katex_css | default(value="katex.min.css") -%} + {%- if katex_css %} {%- set preStyle = true %} {%- endif %} {%- endif %} -{%- if config.extra.js_bundle and config.build_search_index or config.extra.js_bundle and config.extra.search_library %} - - {%- if config.extra.js_search_facade %} - {#- dont load the index #} - {%- elif config.extra.search_library == "tinysearch" or config.extra.search_library == "stork" %} - {#- dont load the index #} - {%- elif config.extra.js_search_index %} - - {%- endif %} - - {%- if not config.extra.js_search_facade %} +{%- if config.extra.js_bundle %} + - {%- if config.extra.js_switcher %} - - {%- else %} - - {%- endif %} - - {%- elif config.extra.search_library == "tinysearch" %} - - {%- elif config.extra.search_library == "stork" %} - - {%- else %} - - {%- if config.extra.js_switcher %} - - {%- else %} - - {%- endif %} - - {%- endif %} - - -{%- elif config.build_search_index or config.extra.search_library %} - - {#- no bundle #} +{%- else %} {%- if preStyle == true %} - {%- if config.extra.js_prestyle %} - + {%- set js_prestyle=config.extra.js_prestyle | default(value="prestyle.js") -%} + {%- if js_prestyle %} + {%- endif %} {%- endif %} - {%- if config.extra.js_theme %} - {%- if config.extra.js_themeButton %} - + {%- if config.extra.js_switcher | default(value=true) %} + {%- set js_theme=config.extra.js_theme | default(value="theme.min.js") -%} + {%- if js_theme %} + {%- set js_themeButton=config.extra.js_themeButton | default(value="theme_button.js") -%} + {%- if js_themeButton %} + {%- endif %} {%- endif %} - - {%- if config.extra.js_email %} - {%- if config.extra.social.mail_encode %} - - {%- endif %} - {%- endif %} - - {%- if config.extra.js_codecopy %} - {%- endif %} - {%- if config.extra.js_search_facade %} - {%- if config.extra.search_library %} - {%- if config.extra.search_library == "tinysearch" %} - - {%- elif config.extra.search_library == "stork" %} - + {%- set js_email=config.extra.js_email | default(value="email.js") -%} + {%- if js_email %} + {%- if config.extra.social.mail_encode | default(value=true) %} + {%- endif %} {%- endif %} - - {%- endif %} - {%- if config.extra.js_search_facade or config.extra.search_library %} - {#- dont load the index/search #} - {%- elif config.extra.js_search_index %} - + {%- set js_codecopy=config.extra.js_codecopy | default(value="codecopy.js") -%} + {%- if js_codecopy %} + {%- endif %} - {%- if config.extra.js_search_facade %} - {#- dont load the index/search #} - {%- else %} - {%- if config.extra.search_library == "tinysearch" %} - - {%- elif config.extra.search_library == "stork" %} - + {%- if search_library == "tinysearch" %} + + {%- elif search_library == "stork" %} + {%- else %} - - - {%- endif %} + + {%- endif %} -{%- elif config.extra.js_bundle %} - - {#- no search #} - - {%- if config.extra.js_switcher %} - - - {%- else %} - - - {%- endif %} - -{%- else %} - - {#- no bundle or search #} - - {%- if preStyle == true %} - {%- if config.extra.js_prestyle %} - - {%- endif %} - {%- endif %} - - {%- if config.extra.js_theme %} - {%- if config.extra.js_themeButton or config.extra.js_bundle %} - - {%- endif %} - {%- endif %} - - {%- if config.extra.js_email %} - {%- if config.extra.social.mail_encode %} - - {%- endif %} - {%- endif %} +{%- endif %} - {%- if config.extra.js_codecopy %} - - {%- endif %} -{%- endif %} {#- https://katex.org/docs/autorender.html #} @@ -208,31 +146,38 @@ {#- https://github.com/KaTeX/KaTeX/tree/main/contrib/mathtex-script-type/ #} {%- if config.extra.math or page.extra.math %} -{%- if config.extra.katex_bundle %} - +{%- set katex_bundle=config.extra.katex_bundle | default(value="katexbundle.min.js") -%} +{%- if katex_bundle %} + {%- else %} - {%- if config.extra.katex_js %}{%- if config.extra.katex_js is matching("^http[s]?://") %} - + {%- set katex_js=config.extra.katex_js | default(value="katex.min.js") -%} + {%- if katex_js %}{%- if katex_js is matching("^http[s]?://") %} + {%- else %} - + {%- endif %}{%- endif %} - {%- if config.extra.mathtex_js %}{%- if config.extra.mathtex_js is matching("^http[s]?://") %} - + {%- set mathtex_js=config.extra.mathtex_js | default(value="mathtex-script-type.min.js") -%} + {%- if mathtex_js %}{%- if mathtex_js is matching("^http[s]?://") %} + {%- else %} - + {%- endif %}{%- endif %} {%- if config.extra.math_auto_render or page.extra.math_auto_render %} - {%- if config.extra.katex_autorender_js %} - {%- if config.extra.katex_autorender_js is matching("^http[s]?://") %} - + {%- set katex_autorender_js=config.extra.katex_autorender_js | default(value="auto-render.min.js") -%} + {%- if katex_autorender_js %} + {%- if katex_autorender_js is matching("^http[s]?://") %} + {%- else %} - + + {%- endif %} {%- endif %} + {%- set katex_options=config.extra.katex_options | default(value="katexoptions.js") -%} + {%- if katex_options %} + {%- endif %} - {%- endif %} {%- endif %} @@ -242,6 +187,33 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + {%- macro favicons(config) %} {%- if config.extra.favicon_theme_color %} @@ -321,9 +293,11 @@ {%- endif %} -{%- if page.extra.keywords %} +{%- if page.extra.keywords and config.extra.keywords %} -{%- else %} +{%- elif page.extra.keywords %} + +{%- elif config.extra.keywords %} {%- endif %} diff --git a/templates/macros/macros.html b/templates/macros/macros.html index 2c17530..95c922c 100644 --- a/templates/macros/macros.html +++ b/templates/macros/macros.html @@ -142,15 +142,19 @@ {%- endif %}
    - {%- set js_theme=config.extra.js_theme | default(value=true) -%} - {%- if config.extra.menu or js_theme %} + {%- set js_switcher=config.extra.js_switcher | default(value=true) -%} + {%- if config.extra.menu or js_switcher %} {%- if config.extra.menu %} {%- for i in config.extra.menu -%}
  • {{ i.name | safe }}

  • {%- endfor -%} {%- endif -%} - {%- if js_theme -%} + {%- if js_switcher -%} {%- set icon_adjust=config.extra.icon_adjust | default(value="svgs adjust") -%}
  • {%- if icon_adjust -%}{%- else -%}☀{%- endif -%}
  • {%- endif -%} diff --git a/templates/macros/create_tinysearch_json.html b/templates/macros/create_tinysearch_json.html index a28d9dc..0e6ece4 100644 --- a/templates/macros/create_tinysearch_json.html +++ b/templates/macros/create_tinysearch_json.html @@ -24,4 +24,4 @@ {{ self::from_section(section=subsection) }} {%- endfor -%} {%- endif -%}{%- endif -%} -{%- endmacro from_section -%} \ No newline at end of file +{%- endmacro from_section -%} diff --git a/templates/macros/head.html b/templates/macros/head.html index 3767a16..8da09cb 100644 --- a/templates/macros/head.html +++ b/templates/macros/head.html @@ -56,19 +56,6 @@ - - - - - - - - - - - - - {%- macro js(config) %} {%- set search_library=config.extra.search_library | default(value="elasticlunr") -%} @@ -129,7 +116,7 @@ {%- if search_library == "tinysearch" %} {%- elif search_library == "stork" %} - + {%- else %} @@ -166,7 +153,7 @@ {%- endif %}{%- endif %} {%- if config.extra.math_auto_render or page.extra.math_auto_render %} - {%- set katex_autorender_js=config.extra.katex_autorender_js | default(value="auto-render.min.js") -%} + {%- set katex_autorender_js=config.extra.katex_autorender_js | default(value="katex-auto-render.min.js") -%} {%- if katex_autorender_js %} {%- if katex_autorender_js is matching("^http[s]?://") %} @@ -187,33 +174,6 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - {%- macro favicons(config) %} {%- if config.extra.favicon_theme_color %} diff --git a/templates/robots.txt b/templates/robots.txt index 766e67f..09aba30 100644 --- a/templates/robots.txt +++ b/templates/robots.txt @@ -1,4 +1,9 @@ +{%- if config.extra.prod %} Sitemap: {{ get_url(path="sitemap.xml", trailing_slash=false) }} User-Agent: * Allow: / Host: {{ get_url(path="/", trailing_slash=false) }} +{%- else %} +User-Agent: * +Disallow: / +{%- endif %} -- cgit v1.3.1 From 2d0788c3981328f1fbd9de4274d2925bf9586e03 Mon Sep 17 00:00:00 2001 From: Jieiku Date: Mon, 22 May 2023 22:39:16 -0700 Subject: Add multi-lingual Support --- config.toml | 173 +++-- content/_index.fr.md | 4 + content/overview-abridge.fr.md | 26 + content/overview-code-blocks.fr.md | 295 ++++++++ content/overview-embedded-vimeo.fr.md | 29 + content/overview-embedded-youtube.fr.md | 28 + content/overview-images/index.fr.md | 107 +++ content/overview-markdown-and-style.fr.md | 286 ++++++++ content/overview-markdown-and-style.md | 2 +- content/overview-math.fr.md | 111 +++ content/overview-rich-content/index.fr.md | 82 +++ content/pages/about.fr.md | 21 + content/pages/contact.fr.md | 7 + content/pages/privacy.fr.md | 15 + content/posts/_index.fr.md | 4 + sass/fonts/_Lato.scss | 17 - sass/include/_nav.scss | 21 + static/font/Lato-Bold.woff2 | Bin 23040 -> 0 bytes static/font/Lato-Italic.woff2 | Bin 24408 -> 0 bytes static/font/Lato.woff2 | Bin 23580 -> 0 bytes static/lunr.da.js | 280 ++++++++ static/lunr.de.js | 380 ++++++++++ static/lunr.du.js | 444 ++++++++++++ static/lunr.es.js | 595 ++++++++++++++++ static/lunr.fi.js | 536 +++++++++++++++ static/lunr.fr.js | 698 +++++++++++++++++++ static/lunr.hu.js | 561 +++++++++++++++ static/lunr.it.js | 612 +++++++++++++++++ static/lunr.jp.js | 118 ++++ static/lunr.no.js | 253 +++++++ static/lunr.pt.js | 566 +++++++++++++++ static/lunr.ro.js | 554 +++++++++++++++ static/lunr.ru.js | 387 +++++++++++ static/lunr.stemmer.support.js | 295 ++++++++ static/lunr.sv.js | 252 +++++++ static/lunr.tr.js | 1070 +++++++++++++++++++++++++++++ static/lunr.zh.js | 156 +++++ static/search.js | 4 +- templates/404.html | 6 +- templates/base.html | 56 +- templates/categories/list.html | 2 +- templates/contact.fr.html | 49 ++ templates/index.html | 6 +- templates/macros/head.html | 17 +- templates/macros/macros.html | 30 +- templates/macros/social.html | 97 ++- templates/page.html | 2 +- templates/posts.html | 6 +- templates/tags/list.html | 2 +- 49 files changed, 9092 insertions(+), 170 deletions(-) create mode 100644 content/_index.fr.md create mode 100644 content/overview-abridge.fr.md create mode 100644 content/overview-code-blocks.fr.md create mode 100644 content/overview-embedded-vimeo.fr.md create mode 100644 content/overview-embedded-youtube.fr.md create mode 100644 content/overview-images/index.fr.md create mode 100644 content/overview-markdown-and-style.fr.md create mode 100644 content/overview-math.fr.md create mode 100644 content/overview-rich-content/index.fr.md create mode 100644 content/pages/about.fr.md create mode 100644 content/pages/contact.fr.md create mode 100644 content/pages/privacy.fr.md create mode 100644 content/posts/_index.fr.md delete mode 100644 sass/fonts/_Lato.scss delete mode 100644 static/font/Lato-Bold.woff2 delete mode 100644 static/font/Lato-Italic.woff2 delete mode 100644 static/font/Lato.woff2 create mode 100644 static/lunr.da.js create mode 100644 static/lunr.de.js create mode 100644 static/lunr.du.js create mode 100644 static/lunr.es.js create mode 100644 static/lunr.fi.js create mode 100644 static/lunr.fr.js create mode 100644 static/lunr.hu.js create mode 100644 static/lunr.it.js create mode 100644 static/lunr.jp.js create mode 100644 static/lunr.no.js create mode 100644 static/lunr.pt.js create mode 100644 static/lunr.ro.js create mode 100644 static/lunr.ru.js create mode 100644 static/lunr.stemmer.support.js create mode 100644 static/lunr.sv.js create mode 100644 static/lunr.tr.js create mode 100644 static/lunr.zh.js create mode 100644 templates/contact.fr.html (limited to 'templates') diff --git a/config.toml b/config.toml index e4cb885..09a7c0d 100644 --- a/config.toml +++ b/config.toml @@ -1,29 +1,63 @@ # do NOT include a trailing slash on the base URL for web urls base_url = "https://abridge.netlify.app" #base_url = "/home/jieiku/.dev/abridge/public/" # Usable site directly from disk, also set in [extra] uglyurls = true -title = "Abridge" -description = "Abridge is a fast and lightweight Zola theme using semantic html, abridge.css class-light CSS, and No Mandatory JS." default_language = "en" compile_sass = true minify_html = false +build_search_index = true + +title = "Abridge" +description = "Abridge is a fast and lightweight Zola theme using semantic html, abridge.css class-light CSS, and No Mandatory JS." generate_feed = true -feed_filename = "atom.xml" -output_dir = "public" -#ignored_content = ["*.{graphml,xlsx}", "temp.*"] -#hard_link_static = false # set to true to hard link instead of copying, useful for very large files. taxonomies = [ {name = "categories", feed = true}, {name = "tags", feed = true}, ] +#feed_filename = "atom.xml" +#output_dir = "public" +#ignored_content = ["*.{graphml,xlsx}", "temp.*"] +#hard_link_static = false # set to true to hard link instead of copying, useful for very large files. + #theme = "abridge" +[languages.fr] +title = "Abridge" +description = "Abridge est un thème Zola rapide et léger utilisant le html sémantique, le CSS abridge.css class-light et aucun JS obligatoire." +generate_feed = true build_search_index = true +taxonomies = [ + {name = "categories", feed = true}, + {name = "tags", feed = true}, +] + +[languages.fr.translations] +flag = "🇫🇷" +date_locale = "fr_FR" +Search = "Recherche" +Recent_Posts = "Articles Récents" +Index = "Indice" +Powered_by = "Propulsé" +and = "et" +About = "À propos" +Posts = "Articles" +Categories = "Catégories" +Tags = "Mots-clés" +Contact = "Contact" +Privacy = "Confidentialité" +Sitemap = "Plan du site" + +#[languages.es.translations] +#flag = "🇪🇸" +#about = "Acerca de" +#posts = "Publicaciones" +#categories = "Categorías" +#tags = "Etiquetas" [search] # Options specific to elasticlunr search. index_format = "elasticlunr_json" include_title = true # include title of page/section in index -include_description = true # include description of page/section in index +include_description = false # include description of page/section in index include_content = true # include rendered content of page/section in index # truncate_content_length = 100 # Truncate at nth character. May be useful if index is getting too large. @@ -40,22 +74,14 @@ smart_punctuation = false # `...` to `…`, `"quote"` to `“curly”` uglyurls = false # if set to true then links are generated with the full path. eg https://abridge.netlify.app/index.html ############################################################################### -### meta/seo/analytic tags -### To disable title_addition but keep built in page additions eg, Posts page: "Posts | Abridge" set title_addition to an empty string -### To always set the page title exactly eg "Abridge" then comment out title_addition or set to false (not recommend, bad for SEO) +### Language +### https://www.w3schools.com/tags/ref_country_codes.asp +### https://tera.netlify.app/docs#date ############################################################################### - -language_code = "en-US" -title_separator = "|" # Separator between title and title_addition, set as |, -, _, etc -title_addition = "Fast & Lightweight Zola Theme" # a default value for title addition -author = "Jake G" # Put Your Name here -keywords = "Abridge, Abridge.css, Zola, Theme, Zola Theme, getzola, Semantic Html, Fast, lightweight" # used for the primary site index -banner = "banner.png" # Used as default image for OpenGraph/Twitter if page specific image is undefined. -twitter = "your-user-name" # for SEO: twitter:site and twitter:creator -google = "Your Google Site verification code." -bing = "Your Bing Site verification code." -seo = true # enable or disable seo-related meta tags: opengraph, facebook, twitter - +date_locale = "en_US" +flag.en = "🇬🇧" +flag.fr = "🇫🇷" +#flag.es = "🇪🇸" ############################################################################### ### Layout & Format @@ -64,6 +90,19 @@ seo = true # enable or disable seo-related meta tags: opengraph, facebook, twit ### divider: " " "·" "•" ############################################################################### +menu = [ + {url = "about", name = "About", slash = true, blank = false}, + {url = "posts", name = "Posts", slash = true, blank = false}, + {url = "categories", name = "Categories", slash = true, blank = false}, + {url = "tags", name = "Tags", slash = true, blank = false}, +] +menu_footer = [ + {url = "about", name = "About", slash = true, blank = false}, + {url = "contact", name = "Contact", slash = true, blank = false}, + {url = "privacy", name = "Privacy", slash = true, blank = false}, + {url = "sitemap.xml", name = "Sitemap", slash = false, blank = true}, +] + recent = true # TOC / index recent_items = 9 @@ -86,18 +125,52 @@ sitedesc = false # enables or disables the display of the site description below headhr = false # show or hide horizontal rule below header foothr = true # show or hide horizontal rule above footer -menu = [ - {url = "/about/", name = "About", slash = true, blank = false}, - {url = "/posts/", name = "Posts", slash = true, blank = false}, - {url = "/categories/", name = "Categories", slash = true, blank = false}, - {url = "/tags/", name = "Tags", slash = true, blank = false}, -] -menu_footer = [ - {url = "/about/", name = "About", slash = true, blank = false}, - {url = "/contact/", name = "Contact", slash = true, blank = false}, - {url = "/privacy/", name = "Privacy", slash = true, blank = false}, - {url = "/sitemap.xml", name = "Sitemap", slash = false, blank = true}, -] + +############################################################################### +### meta/seo/analytic tags +### To disable title_addition but keep built in page additions eg, Posts page: "Posts | Abridge" set title_addition to an empty string +### To always set the page title exactly eg "Abridge" then comment out title_addition or set to false (not recommend, bad for SEO) +############################################################################### + +title_separator = "|" # Separator between title and title_addition, set as |, -, _, etc +title_addition = "Fast & Lightweight Zola Theme" # a default value for title addition +author = "Jake G" # Put Your Name here +keywords = "Abridge, Abridge.css, Zola, Theme, Zola Theme, getzola, Semantic Html, Fast, lightweight" # used for the primary site index +banner = "banner.png" # Used as default image for OpenGraph/Twitter if page specific image is undefined. +twitter_meta = "your-user-name" # for SEO: twitter:site and twitter:creator +google = "Your Google Site verification code." +bing = "Your Bing Site verification code." +seo = true # enable or disable seo-related meta tags: opengraph, facebook, twitter + + +############################################################################### +### Footer social links; these are used in macros/social.html +### https://github.com/Jieiku/abridge/blob/master/templates/macros/social.html +############################################################################### + +feed = true # this adds the RSS feed icon in the footer. +mail_encode = true # This obfuscates your email address, javascript is used to decode it at page load. +mail = "name@example.com" +mastodon = "@your-user-name" +element = "matrix.example.com" +buymeacoffee = "your-user-name" +discord = "your-discord" # Everything after https://discord.com/ eg: invite/my-server *or* servers/my-server-id +twitter = "your-user-name" +facebook = "your-user-name" +linkedin = "your-user-name" +gitlab = "your-user-name" +github = "your-user-name" +codeberg = "your-user-name" # Everything after https://codeberg.org/ eg: username *or* username/repository +github_sponsor = "your-user-name" +bitbucket = "your-user-name" +python = "your-user-name" +docker = "your-user-name" +stack = "your-user-name" +instagram = "your-user-name" +pinterest = "your-user-name" +twitch = "your-user-name" +youtube = "channel/your-channel-id" +researchgate = "your-profile-id" ############################################################################### @@ -173,38 +246,6 @@ favicon16 = "favicon-16x16.png" # favicon-16x16.png #icon_author = "svgs fa-solid fa-pen-fancy" # displayed in metadata on index and below title on page. -############################################################################### -### Footer social links; these are used in macros/social.html -### https://github.com/Jieiku/abridge/blob/master/templates/macros/social.html -############################################################################### - -#[extra.social] -#feed = true # this adds the RSS feed icon in the footer. -#mail_encode = true # This obfuscates your email address, javascript is used to decode it at page load. -#mail = "name@example.com" -#mastodon = "@your-user-name" -#element = "matrix.example.com" -#matrix = "matrix.example.com" -#buymeacoffee = "your-user-name" -#discord = "your-discord" # Everything after https://discord.com/ eg: invite/my-server *or* servers/my-server-id -#twitter = "your-user-name" -#facebook = "your-user-name" -#linkedin = "your-user-name" -#gitlab = "your-user-name" -#github = "your-user-name" -#codeberg = "your-user-name" # Everything after https://codeberg.org/ eg: username *or* username/repository -#github_sponsor = "your-user-name" -#bitbucket = "your-user-name" -#python = "your-user-name" -#docker = "your-user-name" -#stack = "your-user-name" -#instagram = "your-user-name" -#pinterest = "your-user-name" -#twitch = "your-user-name" -#youtube = "channel/your-channel-id" -#researchgate = "your-profile-id" - - ############################################################################### ### Security Settings ### Security Headers should preferably be set by your webserver (Nginx, Apache) diff --git a/content/_index.fr.md b/content/_index.fr.md new file mode 100644 index 0000000..3511f76 --- /dev/null +++ b/content/_index.fr.md @@ -0,0 +1,4 @@ ++++ +paginate_by = 3 +sort_by = "date" ++++ diff --git a/content/overview-abridge.fr.md b/content/overview-abridge.fr.md new file mode 100644 index 0000000..d38ced9 --- /dev/null +++ b/content/overview-abridge.fr.md @@ -0,0 +1,26 @@ ++++ +title = "Abridge Zola Thème" +date = 2022-05-17 +draft = false + +[taxonomies] +categories = ["Features"] +tags = ["config"] ++++ + +Abridge est un thème Zola rapide et léger utilisant du HTML sémantique, seulement ~6kb css avant les icônes svg et la coloration syntaxique, pas de JS obligatoire, et des scores parfaits [Lighthouse](https://pagespeed.web.dev/report?url=abridge.netlify.app), [YellowLabTools](https://yellowlab.tools/), et [Observatory](https://observatory.mozilla.org/analyze/abridge.netlify.app) scores. Voici une page [de références des thèmes Zola](https://github.com/Jieiku/zola-themes-benchmarks/blob/main/README.md). + +Pour une configuration rapide, copiez le fichier config.toml du thème abrégé à la racine de votre site zola, cela vous donnera une configuration de base avec toutes les valeurs de configuration utilisées. + +Vous pouvez ensuite modifier ou commenter les valeurs de ce fichier si nécessaire. + +Vous devez également décommenter la ligne #theme = "abridge" dans votre fichier racine zola config.toml. Cela indique à votre site racine zola d'utiliser le thème abrégé dans le dossier des thèmes. + +Vous pouvez définir le nombre d'éléments qui apparaissent sur la page d'accueil en modifiant `themes\abridge\content\_index.md` le fichier et en ajustant `paginate_by = 5` + +Vous pouvez définir la largeur globale de la page en éditant `themes\abridge\sass\_variables.scss` le fichier et en ajustant ces deux lignes: + +```scss +$mw:50% !default;// largeur maximale +$mb:1200px !default;// valeur à laquelle passer de la disposition fluide à l'utilisation de la largeur maximale +``` diff --git a/content/overview-code-blocks.fr.md b/content/overview-code-blocks.fr.md new file mode 100644 index 0000000..e527251 --- /dev/null +++ b/content/overview-code-blocks.fr.md @@ -0,0 +1,295 @@ ++++ +title = "Blocs de code et thèmes" +description = "Exemple d'article présentant la coloration syntaxique et la mise en forme des blocs de code avec un thème personnalisé." +date = 2022-05-16 +draft = false + +[taxonomies] +categories = ["Features"] +tags = ["Markdown"] +[extra] +toc = true +keywords = "Code, Code Blocks, Syntax, Syntax Highlighting, Theme" ++++ + +Cet article présente différents Code Blocks permettant de comparer facilement des thèmes sublimes. + +## Blocs de codes + +Blocs de code.. ❤️ avec coloration syntaxique automatique ✨‍ + +Voir [les docs](https://www.getzola.org/documentation/content/syntax-highlighting/) pour les options. + +### Bloc de code en ligne + +Si nous voulons, nous pouvons aussi `spécifier le code en ligne` ce qui est utile pour `les petites choses`. + +### rust +```rust,linenos,hl_lines=3 +//! jelly-actix-web-starter - Un modèle de démarrage pour les projets actix-web qui ressemble beaucoup à Django. Évitez les trucs ennuyeux et avancez plus vite. + +use jelly::actix_web; +use mainlib; +use std::io; + +#[actix_web::main] +async fn main() -> io::Result<()> { + mainlib::main().await +} + +let context = Context::new(); +``` + +### TOML +```toml,linenos,hl_lines=3 +base_url = "https://abridge.netlify.app/" +title = "Abridge" +description = "Abridge est un thème Zola rapide et léger utilisant le HTML sémantique, le CSS abridge.css class-light et aucun JS obligatoire." +default_language = "en" +#theme = "abridge" + +build_search_index = true +minify_html = false +feed_filename = "atom.xml" +taxonomies = [ + {name = "categories", feed = true}, + {name = "tags", feed = true}, +] +``` + +### html +```html + + + + + Example HTML5 Document + + + +

    Test

    + + +``` + +### javascript +```javascript +function closeSearch() {//close the search displaying the regular page. + const e = document.querySelector("main"); + e.innerHTML = window.main +} + +function goSearch() {// on enter key or search icon click display results to the page. + const e = document.querySelector("main"); + window.main || (window.main = e.innerHTML); + var t = document.getElementById("suggestions"), + n = ((ResultsClone = t.cloneNode(!0)).id = "results", document.createElement("div")), + o = '

    Results For: '.concat(document.getElementById("searchinput").value, "

    "); + return n.innerHTML = o, ResultsClone.insertBefore(n, ResultsClone.firstChild), e.innerHTML = ResultsClone.outerHTML, t.innerHTML = "", document.getElementById("searchinput").value = "", !1 +}! function() { + // search function code goes here +} +``` + +### php +```php +getAll(); + +if ($_SERVER['REQUEST_METHOD'] == "POST") { + if (!isset($_SESSION['PFA_token'])) { + die("Invalid token (session timeout; refresh the page and try again?)"); + } + $fUsername = trim(safepost('fUsername')); + if ($lang != check_language(false)) { # only set cookie if language selection was changed + setcookie('lang', $lang, time() + 60*60*24*30); # language cookie, lifetime 30 days + } +} + +$_SESSION['PFA_token'] = md5(uniqid("pfa" . rand(), true)); + +/* vim: set expandtab softtabstop=4 tabstop=4 shiftwidth=4: */ +``` + + +### json +```json +{ + "name": "Abridge Zola Theme", + "short_name": "Abridge", + "description": "Fast & Lightweight Zola Theme", + "start_url": "/index.html", + "scope": "/", + "background_color": "#111111", + "theme_color": "#222222", + "display": "standalone", + "icons": [ + { + "src": "/android-chrome-192x192.png", + "sizes": "192x192", + "type": "image/png" + }, + { + "src": "/android-chrome-512x512.png", + "sizes": "512x512", + "type": "image/png" + }, + { + "src": "/android-chrome-192x192m.png", + "sizes": "192x192", + "type": "image/png", + "purpose": "maskable" + } + ] +} +``` + +### SQL +```sql +-- jelly-actix-web-starter - Creates an accounts table, along with some associated helpers. + +create or replace function update_timestamp() returns trigger as $$ +begin + new.updated = now(); + return new; +end; +$$ language 'plpgsql'; + +create table if not exists accounts ( + id serial primary key, + name text not null, + email text not null unique, + password text not null, + profile jsonb not null default '{}', + plan integer not null default 0, + is_active boolean not null default true, + is_admin boolean not null default false, + has_verified_email boolean not null default false, + last_login timestamp with time zone, + created timestamp with time zone not null default now(), + updated timestamp with time zone not null default now() +); + +create unique index accounts_unique_lower_email_idx on accounts (lower(email)); + +create trigger user_updated before insert or update on accounts +for each row execute procedure update_timestamp(); +``` + +### Lua +```lua +function square(x) + return x * x +end + +print(square(2)) -- prints '4' + +function getPlayerInformation() + playerName = UnitName("player") + playerLevel = UnitLevel("player") + specId, specName = GetSpecializationInfo(GetSpecialization()) + + return "Hey, I'm " .. playerName .. " (Level " .. playerLevel .. "). I'm currently in spec " .. specName .. "." +end + +print(getPlayerInformation()) +``` + +### C +```c +#include +int main() { + int a; + /* actual initialization */ + a = 10; + printf("Hello, World!"); + return 0; +} +``` + +### C++ +```cpp +// Your First C++ Program + +#include + +int main() { + int a; + /* actual initialization */ + a = 10; + std::cout << "Hello World!"; + return 0; +} +``` + +### Go +```go +package main + +import "fmt" + +func main() { + var myvariable1 = 20 + var myvariable2 = "hello world" + fmt.Println("hello world") +} +``` + +### Python +```python +#!/usr/bin/env python3 +import smtplib, socket +from influxdb import InfluxDBClient + +while True: + send = 1 + later = time.time() + 25200 + iso = time.ctime(later) + tempF = round(bme280.temperature * 1.8 + 29, 3) #C to F formula is +32, difference is to correct bme280 temperature offset + humidity = round(bme280.humidity, 3) + pressure = round(bme280.pressure, 3) + # serialize data as JSON + data = [ + { + "measurement": measurement, + "tags": { + "location": location, + }, + "time": iso, + "fields": { + "temperature" : tempF, + "humidity": humidity, + "pressure": pressure + } + } + ] + # Send the JSON data to InfluxDB + try: + client.write_points(data) + except socket.error as e: + print("Could Not Connect to InfluxDB!") + if tempF > 90 and humidity > 55: + emailSubject = "Humidity>55: " + str(int(humidity)) + "%H , Temperature>90: " + str(int(tempF)) + "F" + emailContent = 'Humidity: ' + str(int(humidity)) + '%H , Temperature: ' + str(int(tempF)) + 'F Dashboard' + elif humidity > 55: + emailSubject = "Humidity>55: " + str(int(humidity)) + "%H" + emailContent = 'Humidity: ' + str(int(humidity)) + '%H , Temperature: ' + str(int(tempF)) + 'F Dashboard' + elif tempF > 90: + emailSubject = "Temperature>90: " + str(int(tempF)) + "F" + emailContent = 'Humidity: ' + str(int(humidity)) + '%H , Temperature: ' + str(int(tempF)) + 'F Dashboard' + else: + send = 0 + if send == 1: + try: + if time.time() > lastEmailTime or abs(lastTemp-int(tempF)) > 1: + lastEmailTime = time.time()+emailInterval + lastTemp = int(tempF) + sender.sendmail('jake@example.com', emailSubject, emailContent) + except socket.error as e: + print("Could Not Connect to SMTP server!") + time.sleep(interval) +``` diff --git a/content/overview-embedded-vimeo.fr.md b/content/overview-embedded-vimeo.fr.md new file mode 100644 index 0000000..ef29b86 --- /dev/null +++ b/content/overview-embedded-vimeo.fr.md @@ -0,0 +1,29 @@ ++++ +title = "Vidéos Vimeo intégrées" +description = "Exemple d'article présentant un code abrégé Zola personnalisé pour intégrer des vidéos Vimeo dans vos pages." +date = 2021-05-07 +draft = false + +[taxonomies] +categories = ["Features"] +tags = ["shortcodes","video"] +[extra] +keywords = "Video, Shortcodes, Embed, Embedded, Vimeo" ++++ + +Zola a de nombreux shortcodes, et de nouveaux sont facilement ajoutés, cet exemple montre vimeo. + + +## Vimeo + +with `vm(id="id_here")` + +- `id`: l'identifiant de la vidéo (obligatoire) +- `class`: une classe à ajouter au <div> entourant l'iframe (optionnel) +- `autoplay`: lorsqu'il est défini sur "true", la vidéo se lance automatiquement au chargement (facultatif) +- `loop`: lorsqu'il est défini sur "true", la vidéo est lue en boucle (optionnel) +- `noautopause`: lorsqu'il est défini sur "true", la vidéo ne s'arrêtera pas automatiquement (optionnel) +- `title` - définir le titre alt pour l'iframe (facultatif, par défaut sur "Vimeo") +- `cookie` - défini sur "true" si vous voulez des cookies de suivi, sinon il est par défaut sur false. + +{{ vm(id="514402648") }} diff --git a/content/overview-embedded-youtube.fr.md b/content/overview-embedded-youtube.fr.md new file mode 100644 index 0000000..b1c8cab --- /dev/null +++ b/content/overview-embedded-youtube.fr.md @@ -0,0 +1,28 @@ ++++ +title = "Vidéos Youtube intégrées" +description = "Exemple d'article présentant un code court Zola personnalisé pour intégrer des vidéos Youtube dans vos pages." +date = 2021-05-08 +draft = false + +[taxonomies] +categories = ["Features"] +tags = ["shortcodes","video"] +[extra] +keywords = "Video, Shortcodes, Embed, Embedded, Youtube" ++++ + +Zola a de nombreux shortcodes, et de nouveaux sont facilement ajoutés, cet exemple montre youtube. + + +## Youtube + +avec `yt(id="the_id_here")` + +- `id`: l'identifiant de la vidéo (obligatoire) +- `playlist`: l'identifiant de la playlist (optionnel) +- `class`: une classe à ajouter au <div> entourant l'iframe (optionnel) +- `autoplay`: lorsqu'il est défini sur "true", la vidéo se lance automatiquement au chargement (facultatif) +- `title` - définir le titre alt pour l'iframe (facultatif, par défaut sur "Youtube") +- `cookie` - défini sur "true" si vous voulez des cookies de suivi, sinon il est par défaut sur false. + +{{ yt(id="32gyFIWecuw") }} diff --git a/content/overview-images/index.fr.md b/content/overview-images/index.fr.md new file mode 100644 index 0000000..130b061 --- /dev/null +++ b/content/overview-images/index.fr.md @@ -0,0 +1,107 @@ ++++ +title = "Codes courts d'image" +description = "Les images peuvent être intégrées directement à l'aide de markdown `![Ferris](ferris.svg)`, mais l'utilisation d'un shortcode empêche CLS en définissant explicitement la largeur et la hauteur." +date = 2021-05-19 +draft = false + +[taxonomies] +categories = ["Features"] +tags = ["shortcodes","images"] +[extra] +toc = true +keywords = "Image, Markdown, Shortcodes, Hover" +thumbnail = "ferris-gesture.png" ++++ + +Cet article couvre les **shortcodes imghover et img**. Les images peuvent également être intégrées directement à l'aide de markdown `![Ferris](ferris.svg)`, mais il est préférable d'utiliser un shortcode afin de pouvoir définir explicitement la largeur et la hauteur, cela aidera à empêcher le changement de mise en page du contenu, ce qui améliore l'expérience utilisateur et le score Google Lighthouse. + + +# img Shortcode + +- src est le chemin et le nom de fichier de l'image. (obligatoire) +- class définit une classe pour l'image. (facultatif) +- alt définit la note alt pour l'image. (recommandé pour google phare) +- w est la largeur de l'image. (recommandé pour google phare) +- h est la hauteur de l'image. (recommandé pour google phare) + +## Utilisation (même chemin) +```rs +{{/* img(src="ferris-happy.svg" alt="Ferris est heureux" w=600 h=400) */}} +``` +**Sortir** +```html +{{ img(src="ferris-happy.svg" alt="Ferris est heureux" w=600 h=400) }} +``` +{{ img(src="ferris-happy.svg" alt="Ferris est heureux" w=600 h=400) }} + +## Utilisation (chemin relatif ./) +```rs +{{/* img(src="./img/ferris-gesture.svg" alt="Ferris dit bonjour" w=600 h=400) */}} +``` +**Sortir** +```html +{{ img(src="./img/ferris-gesture.svg" alt="Ferris dit bonjour" w=600 h=400) }} +``` +{{ img(src="./img/ferris-gesture.svg" alt="Ferris dit bonjour" w=600 h=400) }} + +## Utilisation (chemin racine /) +```rs +{{/* img(src="/overview-rich-content/ferris.svg" alt="Ferris le Rustacé" w=600 h=400) */}} +``` +**Sortir** +```html +{{ img(src="/overview-rich-content/ferris.svg" alt="Ferris le Rustacé" w=600 h=400) }} +``` +{{ img(src="/overview-rich-content/ferris.svg" alt="Ferris le Rustacé" w=600 h=400) }} + +# Image SVG directement dans le code : +```html + +``` + + + +# imghover Shortcode + +La première image du tableau src est celle comparée à toutes les autres. + +Lorsque vous passez votre souris sur une image, celle-ci affiche l'image à comparer. + +Cela peut être utilisé pour comparer une seule image avec une autre en passant seulement deux src dans le tableau. + +- src est un tableau de chemins et de noms de fichiers pour les images. (obligatoire) +- w est la largeur de l'image. +- h est la hauteur de l'image. +- p est la taille en pourcentage que vous souhaitez que l'image utilise sur la page. (50 est la valeur par défaut) + +*w et h ne sont utilisés que pour calculer le rapport d'aspect, la taille globale est définie par p* + +## Utilisation (même chemin) +```rs +{{/* imghover(src=["ferris.svg", "ferris-gesture.svg", "ferris-happy.svg"] w=600 h=400 p=45) */}} +``` +**Sortir** +```html +{{ imghover(src=["ferris.svg", "ferris-gesture.svg", "ferris-happy.svg"] w=600 h=400 p=45) }} +``` +{{ imghover(src=["ferris.svg", "ferris-gesture.svg", "ferris-happy.svg"] w=600 h=400 p=45) }} + +## Utilisation (chemin relatif ./) +```rs +{{/* imghover(src=["./img/ferris.svg", "./img/ferris-gesture.svg"] w=600 h=400 p=45) */}} +``` +**Sortir** +```html +{{ imghover(src=["./img/ferris.svg", "./img/ferris-gesture.svg"] w=600 h=400 p=45) }} +``` +{{ imghover(src=["./img/ferris.svg", "./img/ferris-gesture.svg"] w=600 h=400 p=45) }} + +## Utilisation (chemin racine /) +```rs +{{/* imghover(src=["/overview-rich-content/ferris.svg", "/overview-rich-content/ferris-gesture.svg"] w=600 h=400 p=45) */}} +``` +**Sortir** +```html +{{ imghover(src=["/overview-rich-content/ferris.svg", "/overview-rich-content/ferris-gesture.svg"] w=600 h=400 p=45) }} +``` +{{ imghover(src=["/overview-rich-content/ferris.svg", "/overview-rich-content/ferris-gesture.svg"] w=600 h=400 p=45) }} diff --git a/content/overview-markdown-and-style.fr.md b/content/overview-markdown-and-style.fr.md new file mode 100644 index 0000000..827c2e6 --- /dev/null +++ b/content/overview-markdown-and-style.fr.md @@ -0,0 +1,286 @@ ++++ +title = "Markdown et Style" +description = "Exemple d'article présentant la syntaxe et le formatage de base de Markdown pour les éléments HTML." +date = 2022-05-15 +draft = false + +[taxonomies] +categories = ["Features"] +tags = ["Markdown"] +[extra] +toc = true +keywords = "Markdown, Style, Syntax, Syntax Highlighting" ++++ + +Cet article propose un exemple de syntaxe Markdown de base pouvant être utilisée dans les fichiers de contenu Zola. Il indique également si les éléments HTML de base sont décorés avec CSS dans un thème Zola. + +# Rubriques + +Les éléments HTML `

    `—`

    ` suivants représentent six niveaux d'en-têtes de section. +`

    ` est le niveau de section le plus élevé alors qu'il `

    ` est le plus bas. + +# H1 +## H2 +### H3 +#### H4 +##### H5 +###### H6 + +# Paragraphe + +Xerum, quo qui aut unt expliquéam qui dolut labo. Aque venitatiusda cum, voluptionse latur sitiae dolessi aut parist aut dollo enim qui voluptate ma dolestendit peritin re plis aut quas inctum laceat est volestemque commosa as cus endigna tectur, offic to cor sequas etum rerum idem sintibus eiur ? Quianimin porecus evelectrur, cum que nis nust voloribus ratem aut omnimi, sitatur ? Quiatem. Nam, omnis sum am facea corem alique molestrunt et eos evelece arcillit ut aut eos eos nus, sin conecerem erum fuga. Ri oditatquam, ad quibus unda veliamenimin cusam et facea ipsamus es exerum sitate dolores editium rerore eost, temped molorro ratiae volorro te reribus dolorer sperchicium faceata tiustia prat. + +Itatur ? Quiatae cullecum rem ent aut odis in re eossequodi nonsequ idebis ne sapicia est sinveli squiatum, core et que aut hariosam ex eat. + +# Citations en bloc + +L'élément blockquote représente le contenu qui est cité à partir d'une autre source, éventuellement avec une citation qui doit être dans un élément `footer` ou `cite` et éventuellement avec des modifications en ligne telles que des annotations et des abréviations. + +## Blockquote sans attribution + +> Tiam, ad mint andaepu dandae nostion secatur sequo quae. +> **Notez** que vous pouvez utiliser *la syntaxe Markdown* dans un blockquote. + +## Blockquote avec attribution + +> Ne communiquez pas en partageant la mémoire, partagez la mémoire en communiquant.
    +> — Rob Pike[^1] + +> Tous les hommes, par nature, désirent savoir.
    +> ― Aristotle[^2] + +> Le pouvoir vient en réponse à un besoin, pas à un désir.
    +> — *Goku* + +# Les Tables + +Les tables ne font pas partie de la spécification principale de Markdown, mais Zola les prend en charge prêtes à l'emploi. + + Nom | Âge +--------|------ + Alice | 23 + Bob | 27 + Cody | 33 + John | 59 + Kerry | 23 + +## Tableau avec Markdown en ligne + +| Italique | Gras | Code | Barré | +| -------- | -------- | ------ | ----------------- | +| *italique* | **gras** | `code` | ~~barré~~ | + + +## Grand tableau dans l'étiquette de la figure + +Entourez les très grandes tables `
    ` pour qu'elles puissent défiler horizontalement. +
    + +| **Fabricant** | Volkswagen | Toyota | Ford | Honda | Chevrolet | BMW | Hyundai | Audi | Nissan | Kia | Mercedes | Tesla | Mitsubishi | Suzuki | Volvo | Subaru | Mazda | Jaguar | Buick | Lexus | GMC | Porsche | Cadillac | +| ---------- | ---- | ---- | ---- | ---- | ---- | ---- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | +| **Revenu $B** | $254 | $249 | $127 | $124 | $123 | $113 | $88 | $83 | $74 | $61 | $55 | $54 | $38 | $31 | $30 | $28 | $27 | $22 | $21 | $19 | $17 | $16 | $12 | + +
    +*valeurs de revenus trouvées sur le moteur de recherche et non vérifiées, uniquement à des fins de démonstration du tableau de défilement des figures.* + +# Texte pliable + +
    + Titre 1 +

    C'EST UN SECRET POUR TOUT LE MONDE.

    +
    + +
    + Titre 2 +

    Reste un moment et écoute!

    +
    + +# Blocs de codes + +Blocs de code.. ❤️ avec coloration syntaxique automatique ✨‍ + +Voir [les docs](https://www.getzola.org/documentation/content/syntax-highlighting/) pour les options. + +## Bloc de code avec backticks + +```html + + + + + Example HTML5 Document + + +

    Test

    + + +``` + +## Numéros de ligne, mise en surbrillance + +```html,linenos,hl_lines=5 7-9 + + + + + Example HTML5 Document + + +

    Test

    + + +``` + +## Bloc de code en ligne + +Si nous voulons, nous pouvons aussi `spécifier le code en ligne` ce qui est utile pour `les petites choses`. + +# Types de liste + +## Liste ordonnée + +1. Premier élément +2. Deuxième élément +3. Troisième élément + +## Liste non ordonnée + +- Élément de liste +- Un autre article +- Et un autre article + +## Liste imbriquée + +- Fruit + - Pomme + - Orange + - Banane +- Laitier + - Lait + - Fromage + +# Autres éléments — abbr, sub, sup, kbd, mark, link + +GIF est un format d'image bitmap. + +H2O + +Xn + Yn = Zn + +Appuyez sur pour terminer la session. CTRL+ALT+Delete + +La plupart salamanders sont nocturnes et chassent les insectes, les vers et autres petites créatures. + +--- + +[^1]: La citation ci-dessus est extraite du [discours](https://www.youtube.com/watch?v=PAAkCSZUG1c) +de Rob Pike lors du Gopherfest, le 18 novembre 2015. + +[^2]: La citation est la première phrase de [la Métaphysique](https://en.wikipedia.org/wiki/Metaphysics_(Aristotle)) d'Aristotle. + +## Navs + +Le menu principal du site est créé en imbriquant la navigation sous une balise d'en-tête. Reportez-vous au haut de ce site pour un exemple. + +Si la balise de navigation se trouve sous la balise principale au lieu de la balise d'en-tête, les liens auront une bordure : + +
    + +
    + +## Formes + +
    +

    + +

    +

    + +

    +

    + +

    +
    +

    +
    + + + + +
    + Taille + + + + +
    + +
    + + +
    + +
    + + +
    +
    + + + + + + + + + + + + +
    diff --git a/content/overview-markdown-and-style.md b/content/overview-markdown-and-style.md index befe1ed..78177db 100644 --- a/content/overview-markdown-and-style.md +++ b/content/overview-markdown-and-style.md @@ -1,5 +1,5 @@ +++ -title = "Markdown and Style Guide" +title = "Markdown and Style" description = "Sample article showcasing basic Markdown syntax and formatting for HTML elements." date = 2022-05-15 draft = false diff --git a/content/overview-math.fr.md b/content/overview-math.fr.md new file mode 100644 index 0000000..ed0720a --- /dev/null +++ b/content/overview-math.fr.md @@ -0,0 +1,111 @@ ++++ +title = "Notations mathématiques" +description = "Exemple d'article présentant l'affichage des notations mathématiques, rendu possible par la bibliothèque KaTeX." +date = 2021-05-05 +updated = 2022-01-01 +draft = false + +[taxonomies] +categories = ["Features"] +tags = ["shortcodes","Mathematics"] +[extra] +math = true +math_auto_render = true +keywords = "Math, Matematics, Notation, KaTeX, Mathematical Notation" ++++ + +Vous pouvez utiliser [KaTeX](https://katex.org) pour rendre des notations mathématiques. + +Vous pouvez activer le $\KaTeX$ prise en charge globale, par section ou par page. + + +## Activer globalement + +Pour activer le $\KaTeX$ prise en charge dans le monde entier, ajoutez `math = true` sous `[extra]` à la `config.toml` +racine de votre site. Maintenant, le shortcode katex sera rendu, vous pouvez également ajouter `math_auto_render = true` +et chaque section et page de votre site chargera l' [extension KaTeX autorender](https://katex.org/docs/autorender.html). + +```toml +[extra] +math = true +math_auto_render = false +``` + +## Base par section + +Pour activer le $\KaTeX$ support dans une section particulière, ajoutez `math = true` sous `[extra]` dans le fichier `[SECTION_NAME]/_index.md`. +Maintenant, le shortcode katex sera rendu, vous pouvez également ajouter `math_auto_render = true` +et la section de votre site chargera l' [extension KaTeX autorender](https://katex.org/docs/autorender.html). + +```toml ++++ +[extra] +math = true ++++ +``` + +## Base par page + +Pour activer le $\KaTeX$ support dans une page particulière, ajouter `math = true` sous `[extra]` dans le frontmatter de la page. +Maintenant, le shortcode katex sera rendu, vous pouvez également ajouter `math_auto_render = true` +et la page de votre site chargera l' [extension KaTeX autorender](https://katex.org/docs/autorender.html). + +```toml ++++ +[extra] +math = true +math_auto_render = true ++++ +``` + +C'est une bonne pratique de permettre $\KaTeX$ prise en charge par page, car cela ne chargera que les fichiers requis sur cette page particulière, sans affecter la vitesse de chargement des autres pages. Si votre site n'est pas lourd en mathématiques, veuillez ne PAS activer cette fonctionnalité globalement ou par section. + +## Usage + +Enveloppez tout [valide](https://katex.org/docs/supported.html) $\KaTeX$ syntaxe avec `$...$` pour les mathématiques en ligne et `$$...$$` pour les mathématiques par blocs. + +### Mathématiques en ligne + +C'est la plus belle équation que j'aie jamais vue : + +### Usage +```rs +{%/* katex(block=false) */%} e^{i\pi}+1=0 {%/* end */%} +``` +### Sortir +```html +{% katex(block=false) %} e^{i\pi}+1=0 {% end %} +``` +{% katex(block=false) %} e^{i\pi}+1=0 {% end %} + +### Bloc Mathématiques + +Quelques Mathématiques en mode affichage sont assez justes : + +### Usage +```rs +{%/* katex(block=true) */%} \int_0^1 x^2 dx {%/* end */%} +``` +### Sortir +```html +{% katex(block=true) %} \int_0^1 x^2 dx {% end %} +``` +{% katex(block=true) %} \int_0^1 x^2 dx {% end %} + +### Exemple de rendu automatique en ligne +``` +$ e^{i\pi}+1=0 $ +``` + +$ e^{i\pi}+1=0 $ + +### Exemple de bloc de rendu automatique +``` +$$ +f(x) = \int_{-\infty}^\infty\hat f(\xi)\,e^{2 \pi i \xi x}\,d\xi +$$ +``` + +$$ +f(x) = \int_{-\infty}^\infty\hat f(\xi)\,e^{2 \pi i \xi x}\,d\xi +$$ diff --git a/content/overview-rich-content/index.fr.md b/content/overview-rich-content/index.fr.md new file mode 100644 index 0000000..43425fa --- /dev/null +++ b/content/overview-rich-content/index.fr.md @@ -0,0 +1,82 @@ ++++ +title = "Contenu riche" +description = "Une brève description des Shortcodes personnalisés pour Zola qui implémentent des éléments html modernes : vidéo, image, gif, audio." +date = 2021-05-18 +draft = false + +[taxonomies] +categories = ["Features"] +tags = ["video", "audio", "images", "shortcodes"] +[extra] +toc = true +keywords = "Images, Videos, Audio, Gif, Rich Content, Shortcodes" ++++ + +Plusieurs codes abrégés personnalisés sont inclus pour augmenter CommonMark (avec l'aimable autorisation du [theme d3c3nt](https://d3c3nt.figbert.com/posts/rich-content/)), en plus de ceux [déjà fournis par Zola][built-in]. `video`, `image`, `gif`, et `audio` ont été créés pour vous aider à tirer parti des éléments HTML modernes dans votre écriture. + + + +## Vidéo + +Le `video` shortcode prend un `sources` paramètre (un tableau de chaînes) et renvoie une `
{%- if config.build_search_index %} - {%- set icon_search=config.extra.icon_search | default(value="svgs search") -%} + {%- set icon_search=config.extra.icon_search | default(value="svgs search") %}
+ {%- if lang == config.default_language %} {%- set section_item = get_section(path="_index.md") %} + {%- else %} + {%- set section_item = get_section(path="_index." ~ lang ~ ".md") %} + {%- endif %} {%- if config.extra.recent | default(value=true) %}
-

Recent Posts

+

{%- if lang != config.default_language %}{{ trans(key="Recent_Posts" | safe, lang=lang) }}{% else %}Recent Posts{% endif %}

{%- set recent_items=config.extra.recent_items | default(value=9) -%} {%- for page in section_item.pages | slice(end=recent_items) %} {{- page_macros::page_listing(page=page, config=config) }} diff --git a/templates/macros/head.html b/templates/macros/head.html index 8da09cb..0690bc1 100644 --- a/templates/macros/head.html +++ b/templates/macros/head.html @@ -103,7 +103,7 @@ {%- set js_email=config.extra.js_email | default(value="email.js") -%} {%- if js_email %} - {%- if config.extra.social.mail_encode | default(value=true) %} + {%- if config.extra.mail_encode | default(value=true) %} {%- endif %} {%- endif %} @@ -120,12 +120,15 @@ {%- else %} - {%- endif %} - -{%- endif %} + {%- if lang != "en" %} + + + {%- endif %} + {%- endif %} +{%- endif %} {#- https://katex.org/docs/autorender.html #} @@ -344,9 +347,9 @@ {%- endif %} -{%- if config.extra.social.twitter %} - - +{%- if config.extra.twitter_meta %} + + {%- endif %} diff --git a/templates/macros/macros.html b/templates/macros/macros.html index 95c922c..e909b06 100644 --- a/templates/macros/macros.html +++ b/templates/macros/macros.html @@ -36,16 +36,24 @@ {%- if config.extra.meta_post.divider %}{{ config.extra.meta_post.divider | safe }}{%- else %}   {%- endif %}{%- endif %}{%- endif %} {#- Date #} - {%- if config.extra.meta_post.date %} {%- if config.extra.icon_date %} {% endif %} {{ page.date | date(format="%B %d, %Y") }} + {%- if config.extra.meta_post.date %} {%- if config.extra.icon_date %} {% endif %} + {%- if config.extra.date_locale %} + {%- if lang != config.default_language -%} + {%- set lang_locale = trans(key="date_locale" | safe, lang=lang) -%} + {%- else -%} + {%- set lang_locale = config.extra.date_locale -%} + {%- endif -%} + {{ page.date | date(format="%B %d, %Y", locale=lang_locale) }} + {%- else %} {{ page.date | date(format="%B %d, %Y") }} {%- endif %} {#- divider #} {%- if config.extra.meta_post.categories_tags %} {%- if config.extra.meta_post.divider %}{{ config.extra.meta_post.divider | safe }}{%- else %}   {%- endif %}{%- endif %}{% endif %} {#- Categories #} - {%- if page.taxonomies.categories %} {%- if config.extra.icon_info %} {% endif %} [{% for cat in page.taxonomies.categories %}{{ cat }}{% endfor %}]{% endif %} + {%- if page.taxonomies.categories %} {%- if config.extra.icon_info %} {% endif %} [{% for cat in page.taxonomies.categories %}{{ cat }}{% endfor %}]{% endif %} {#- Tags #} - {%- if page.taxonomies.tags %} {%- for tag in page.taxonomies.tags %} #{{ tag }} {% endfor -%}{%- endif %} + {%- if page.taxonomies.tags %} {%- for tag in page.taxonomies.tags %} #{{ tag }} {% endfor -%}{%- endif %} {%- endmacro meta_post %} {%- macro title_index(page, config) %} @@ -60,7 +68,7 @@ {%- if page.taxonomies.authors and config.taxonomies %} {%- for author in page.taxonomies.authors %} {%- if author_flag %}, {% endif %} - {{ author }} + {{ author }} {%- set_global author_flag = true %} {%- endfor %} {%- elif page.extra.authors and config.extra.meta_index.author %} @@ -87,16 +95,24 @@ {%- if config.extra.meta_index.divider %}{{ config.extra.meta_index.divider | safe }}{%- else %}   {%- endif %}{%- endif %}{%- endif %} {#- Date #} - {%- if config.extra.meta_index.date %} {%- if config.extra.icon_date %} {% endif %} {{ page.date | date(format="%B %d, %Y") }} + {%- if config.extra.meta_index.date %} {%- if config.extra.icon_date %} {% endif %} + {%- if config.extra.date_locale %} + {%- if lang != config.default_language -%} + {%- set lang_locale = trans(key="date_locale" | safe, lang=lang) -%} + {%- else -%} + {%- set lang_locale = config.extra.date_locale -%} + {%- endif -%} + {{ page.date | date(format="%B %d, %Y", locale=lang_locale) }} + {%- else %} {{ page.date | date(format="%B %d, %Y") }} {%- endif %} {#- divider #} {%- if config.extra.meta_index.categories_tags %} {%- if config.extra.meta_index.divider %}{{ config.extra.meta_index.divider | safe }}{%- else %}   {%- endif %}{%- endif %}{% endif %} {#- Categories #} - {%- if page.taxonomies.categories %} {%- if config.extra.icon_info %} {% endif %} [{% for cat in page.taxonomies.categories %}{{ cat }}{% endfor %}]{% endif %} + {%- if page.taxonomies.categories %} {%- if config.extra.icon_info %} {% endif %} [{% for cat in page.taxonomies.categories %}{{ cat }}{% endfor %}]{% endif %} {#- Tags #} - {%- if page.taxonomies.tags %} {%- for tag in page.taxonomies.tags %} #{{ tag }} {% endfor -%}{%- endif %} + {%- if page.taxonomies.tags %} {%- for tag in page.taxonomies.tags %} #{{ tag }} {% endfor -%}{%- endif %} {%- endmacro meta_index %} diff --git a/templates/macros/social.html b/templates/macros/social.html index 67e05a3..1c4b3fd 100644 --- a/templates/macros/social.html +++ b/templates/macros/social.html @@ -1,59 +1,58 @@ -{%- macro social_links(social_config, config) %} +{%- macro social_links(config) %} {%- endmacro %} diff --git a/templates/page.html b/templates/page.html index da4fdd6..6d5188d 100644 --- a/templates/page.html +++ b/templates/page.html @@ -57,7 +57,7 @@ {%- if toc %}
- {%- set js_switcher=config.extra.js_switcher | default(value=true) -%} - {%- if config.extra.menu or js_switcher %} - {%- if config.extra.menu %} - {%- for i in config.extra.menu -%} - - {%- if lang != config.default_language %} {{ trans(key=i.name | safe, lang=lang) }} {% else %} {{ i.name | safe }} {% endif -%} - - {%- endfor -%} - {%- endif -%} - {%- if js_switcher -%} - {%- set icon_adjust=config.extra.icon_adjust | default(value="svgs adjust") -%} - {%- if icon_adjust -%}{%- else -%}☀{%- endif -%} + {% set js_switcher=config.extra.js_switcher | default(value=true) %} + {%- if config.extra.menu or js_switcher %} + {%- if config.extra.menu %} + {%- for i in config.extra.menu -%} + + {%- if lang != config.default_language %} {{ trans(key=i.name | safe, lang=lang) }} {% else %} {{ i.name | safe }} {% endif -%} + + {%- endfor -%} + {%- endif -%} + {%- if js_switcher -%} + {%- set icon_adjust=config.extra.icon_adjust | default(value="svgs adjust") -%} + {%- if icon_adjust -%}{%- else -%}☀{%- endif -%} + {%- endif -%} + {%- endif -%} + {%- if config.languages | length > 0 %} + {%- if config.build_search_index %} {%- set icon_search=config.extra.icon_search | default(value="svgs search") %} @@ -127,21 +127,21 @@ {#- Copyright END #} {%- if config.extra.menu_footer %} {%- endif %} {%- if config.extra.footer_credit | default(value=true) %} {%- if config.extra.footer_credit_override %} {{ config.extra.footer_credit_override | safe }} {%- else %} - {%- if lang != config.default_language %} {{ trans(key="Powered_by" | safe, lang=lang) }} {% else %} Powered by {% endif %} Zola {%- if lang != config.default_language %} {{ trans(key="and" | safe, lang=lang) }} {% else %} and {% endif %} Abridge

+ {% if lang != config.default_language -%} {{ trans(key="Powered_by" | safe, lang=lang) }} {% else -%} Powered by {% endif %}Zola {%- if lang != config.default_language %} {{ trans(key="and" | safe, lang=lang) }} {% else %} and {% endif -%} Abridge

{%- endif %} {%- endif %}
diff --git a/templates/macros/macros.html b/templates/macros/macros.html index bc38935..4c86aac 100644 --- a/templates/macros/macros.html +++ b/templates/macros/macros.html @@ -1,9 +1,9 @@ {%- macro title_post(page, config) %} -

{{ page.title }}

+

{{ page.title }}

{%- endmacro title_post %} {%- macro meta_post(page, config) %} - + {#- Author #} {%- if page.taxonomies.authors and config.taxonomies %} @@ -119,25 +119,26 @@ {%- macro footer(page, config) %} -{%- if page.reading_time and page.reading_time > 2 %} -

Back to top

-{%- endif %} - + {%- if page.reading_time and page.reading_time > 2 %} +

Back to top

+ {%- endif %} + {#- prev/next content page nextprev title pagination #} + {%- if not config.extra.hide_page_nextprev_titles | default(value=false) %} + {%- if page.lower or page.higher %} + + {%- endif %} + {%- endif %} {%- endmacro footer %} diff --git a/templates/page.html b/templates/page.html index 979e0a1..7b645ca 100644 --- a/templates/page.html +++ b/templates/page.html @@ -39,7 +39,7 @@ {{- macros::meta_post(page=page, config=config) }} {%- endif %}{%- endif %} - {{ page.content | safe }} +{{ page.content | safe }} {%- if config.extra.meta_post.position %} {%- if config.extra.meta_post.position == "bottom" or config.extra.meta_post.position == "both" %} diff --git a/templates/pages.html b/templates/pages.html index 87c9adb..4ef44f5 100644 --- a/templates/pages.html +++ b/templates/pages.html @@ -26,6 +26,7 @@ {%- block content %}
- {{ page.content | safe }} + +{{ page.content | safe }}
{%- endblock content %} diff --git a/templates/posts.html b/templates/posts.html index b4e123e..f9befe5 100644 --- a/templates/posts.html +++ b/templates/posts.html @@ -51,9 +51,7 @@ This Template can also be used as the rendering template for Sections, eg: examp {%- if section_item.title %}

{{ section_item.title }}

{%- endif %} - - {{ section_item.content | safe }} - + {{- section_item.content | safe }} {%- for year, posts in section_item.pages | group_by(attribute="year") %} {%- if not hide_section_dates %} {%- if section_item.title %} -- cgit v1.3.1 From 01359d82330caded871aa7d178b00d7bc2cd16f2 Mon Sep 17 00:00:00 2001 From: Jieiku Date: Sat, 17 Jun 2023 08:50:42 -0700 Subject: Simplify Logic --- templates/macros/create_stork_toml.html | 6 +++--- templates/macros/create_tinysearch_json.html | 4 ++-- 2 files changed, 5 insertions(+), 5 deletions(-) (limited to 'templates') diff --git a/templates/macros/create_stork_toml.html b/templates/macros/create_stork_toml.html index f754e2e..ee1d765 100644 --- a/templates/macros/create_stork_toml.html +++ b/templates/macros/create_stork_toml.html @@ -7,9 +7,9 @@ {% endif -%} {%- endif -%} {%- endfor -%} -{%- if found -%}{%- if section.subsections -%}, +{%- if found and section.subsections -%}, {% for subsection in section.subsections -%} {{ self::from_section(section=subsection) }} {%- endfor -%} -{%- endif -%}{%- endif -%} -{%- endmacro from_section -%} \ No newline at end of file +{%- endif -%} +{%- endmacro from_section -%} diff --git a/templates/macros/create_tinysearch_json.html b/templates/macros/create_tinysearch_json.html index 0e6ece4..fcc1f5a 100644 --- a/templates/macros/create_tinysearch_json.html +++ b/templates/macros/create_tinysearch_json.html @@ -18,10 +18,10 @@ {%- if not loop.last -%},{%- endif %} {%- endif -%} {%- endfor -%} -{%- if found -%}{%- if section.subsections -%} +{%- if found and section.subsections -%} , {%- for subsection in section.subsections -%} {{ self::from_section(section=subsection) }} {%- endfor -%} -{%- endif -%}{%- endif -%} +{%- endif -%} {%- endmacro from_section -%} -- cgit v1.3.1 From 06c5fd1a0c11cb4ae252873a95100d8069ae26df Mon Sep 17 00:00:00 2001 From: Jieiku Date: Tue, 18 Jul 2023 08:19:21 -0700 Subject: Lighthouse Fixes --- config.toml | 4 +++- sass/_colors.scss | 6 +++--- sass/abridge.scss | 2 +- templates/robots.txt | 8 ++++---- 4 files changed, 11 insertions(+), 9 deletions(-) (limited to 'templates') diff --git a/config.toml b/config.toml index 6b65a04..9b818e0 100644 --- a/config.toml +++ b/config.toml @@ -154,6 +154,7 @@ twitter_meta = "your-user-name" # for SEO: twitter:site and twitter:creator google = "Your Google Site verification code." bing = "Your Bing Site verification code." seo = true # enable or disable seo-related meta tags: opengraph, facebook, twitter +#dev = false # development mode, if true then robots.txt should prevent search indexing. ############################################################################### @@ -209,7 +210,8 @@ search_library = 'elasticlunr' #js_codecopy = "js/codecopy.js"# Bundleable - copy code block to clipboard button #js_email = "js/email.js"# Bundleable - obfuscates email address in footer -stylesheets = [ "abridge.css" ] +stylesheets = ["abridge.css"] + ############################################################################### ### Favicons, comment out a line to disable loading some or all of these if needed. diff --git a/sass/_colors.scss b/sass/_colors.scss index 497919d..d8de34b 100644 --- a/sass/_colors.scss +++ b/sass/_colors.scss @@ -33,7 +33,7 @@ $c1: #111 !default;// Background Color Primary $c2: #222 !default;// Background Color Secondary $c3: #333 !default;// Table Rows, Block quote edge, Borders - $c4: #777 !default;// Disabled Buttons, Borders, mark background + $c4: #888 !default;// Disabled Buttons, Borders, mark background $a1: #09f !default;// link color $a2: #0bf !default;// link hover/focus color $a3: #0af !default;// link h1-h2 hover/focus color @@ -76,7 +76,7 @@ $f2: #222 !default;// Font Color Headers $c1: #fff !default;// Background Color Primary $c2: #def !default;// Background Color Secondary - $c3: #137 !default;// Table Rows, Block quote edge, Borders + $c3: #cde !default;// Table Rows, Block quote edge, Borders $c4: #013 !default;// Disabled Buttons, Borders, mark background $a1: #06e !default;// link color $a2: #09f !default;// link hover/focus color @@ -93,7 +93,7 @@ $c1: #111 !default;// Background Color Primary $c2: #222 !default;// Background Color Secondary $c3: #333 !default;// Table Rows, Block quote edge, Borders - $c4: #777 !default;// Disabled Buttons, Borders, mark background + $c4: #888 !default;// Disabled Buttons, Borders, mark background $a1: #f90 !default;// link color $a2: #fb0 !default;// link hover/focus color $a3: #f90 !default;// link h1-h2 hover/focus color diff --git a/sass/abridge.scss b/sass/abridge.scss index b50d2b6..539e377 100644 --- a/sass/abridge.scss +++ b/sass/abridge.scss @@ -1178,7 +1178,7 @@ $syntax: true !default;//syntax highlighting for code blocks cursor: pointer; z-index: 9; position: absolute; - top: .3rem; + top: .2rem; right: .5rem; } .cc:hover { diff --git a/templates/robots.txt b/templates/robots.txt index 09aba30..7977154 100644 --- a/templates/robots.txt +++ b/templates/robots.txt @@ -1,9 +1,9 @@ -{%- if config.extra.prod %} +{%- if config.extra.dev %} +User-Agent: * +Disallow: / +{%- else %} Sitemap: {{ get_url(path="sitemap.xml", trailing_slash=false) }} User-Agent: * Allow: / Host: {{ get_url(path="/", trailing_slash=false) }} -{%- else %} -User-Agent: * -Disallow: / {%- endif %} -- cgit v1.3.1 From b53294f7fb8afbb9565dcd46f2985257c8075e5c Mon Sep 17 00:00:00 2001 From: Jieiku Date: Tue, 18 Jul 2023 09:24:20 -0700 Subject: Additional Copyright Configuration --- config.toml | 7 +++++-- templates/base.html | 7 ++++++- 2 files changed, 11 insertions(+), 3 deletions(-) (limited to 'templates') diff --git a/config.toml b/config.toml index 9b818e0..8dd0442 100644 --- a/config.toml +++ b/config.toml @@ -133,11 +133,14 @@ footer_credit = true textlogo = 'bridge' sitedesc = false # enables or disables the display of the site description below the logo. -#copyright_start_year = 2019 # optional -#copyright_end_year = 2020 # optional, recommend leaving unset, zola build will set this to current year by default headhr = false # show or hide horizontal rule below header foothr = true # show or hide horizontal rule above footer +#copyright_start_string = "©" +#copyright_start_year = 2019 # optional +#copyright_end_year = "" # optional, recommend leaving unset, zola build will set this to current year by default, can use empty string to omit the year. +#copyright_entity = "MyName." # optional, if ommited then the config.title is used. +#copyright_end_string = 'Unless otherwise noted, the content in this website is available under the CC BY-ND 3.0 license.' ############################################################################### ### meta/seo/analytic tags diff --git a/templates/base.html b/templates/base.html index e8706a6..b39bbc0 100644 --- a/templates/base.html +++ b/templates/base.html @@ -120,10 +120,15 @@ {{- social_macros::social_links(config=config) }} {#- Copyright START #} + {%- set copyright_start_string=config.extra.copyright_start_string | default(value="©") %} + {%- if copyright_start_string %}{%- set copyright_start_string=copyright_start_string ~ " " %}{%- endif %} {%- set copyright_start_year=config.extra.copyright_start_year | default(value="") %} {%- if copyright_start_year %}{%- set copyright_start_year=copyright_start_year ~ "-" %}{%- endif %} {%- set copyright_end_year=config.extra.copyright_end_year | default(value=now() | date(format="%Y")) %} - © {{ copyright_start_year ~ copyright_end_year }} {{ config.title }}

+ {%- if config.extra.copyright_entity %}{%- set copyright_entity= " " ~ config.extra.copyright_entity %}{%- else %}{%- set copyright_entity= " " ~ config.title %}{%- endif %} + {%- set copyright_end_string=config.extra.copyright_end_string | default(value="") %} + {%- if copyright_end_string %}{%- set copyright_end_string= " " ~ copyright_end_string %}{%- endif %} + {{ copyright_start_string ~ copyright_start_year ~ copyright_end_year ~ copyright_entity ~ copyright_end_string }}

{#- Copyright END #} {%- if config.extra.menu_footer %}
{%- endblock content %} diff --git a/templates/macros/head.html b/templates/macros/head.html index 25e981d..603c341 100644 --- a/templates/macros/head.html +++ b/templates/macros/head.html @@ -228,6 +228,10 @@ {%- endif %} + {%- if config.extra.favicon_svg %} + + {%- endif %} + {%- if config.extra.favicon180 %} {%- endif %} -- cgit v1.3.1 From ecc9421cc66a31f082a3a5266385f0e552894742 Mon Sep 17 00:00:00 2001 From: Jieiku Date: Fri, 21 Jul 2023 11:34:11 -0700 Subject: updated date --- config.toml | 5 +++-- content/overview-abridge.fr.md | 1 + content/overview-abridge.md | 1 + templates/macros/macros.html | 37 +++++++++++++++++++++++++++++++++---- 4 files changed, 38 insertions(+), 6 deletions(-) (limited to 'templates') diff --git a/config.toml b/config.toml index 3d5addf..ebeba67 100644 --- a/config.toml +++ b/config.toml @@ -41,6 +41,7 @@ flag = "🇫🇷" date_locale = "fr_FR" Search = "Recherche" Recent_Posts = "Articles Récents" +Updated = "Modifié" Index = "Indice" Powered_by = "Propulsé" and = "et" @@ -117,8 +118,8 @@ menu_footer = [ recent = true # TOC / index recent_items = 9 -meta_index = { position="bottom", size="s90", author=false, readtime=false, readstring="min", date=true, categories_tags=true, divider=" " } -meta_post = { position="top", size="s95", author=true, readtime=false, readstring="min read", date=true, categories_tags=true, divider=" " } +meta_index = { position="bottom", size="s90", author=false, readtime=false, readstring="min", date=true, updated=false, categories_tags=true, divider=" " } +meta_post = { position="top", size="s95", author=true, readtime=false, readstring="min read", date=true, updated=true, categories_tags=true, divider=" " } hide_section_dates = false # hides the date for sections that use posts.html as their template. hide_page_nextprev_titles = false # hides the next/previous titles for pages that use page.html as their template. diff --git a/content/overview-abridge.fr.md b/content/overview-abridge.fr.md index 1fda697..388ff69 100644 --- a/content/overview-abridge.fr.md +++ b/content/overview-abridge.fr.md @@ -1,6 +1,7 @@ +++ title = "Abridge Zola Thème" date = 2022-05-17 +updated = 2023-07-21 draft = false [taxonomies] diff --git a/content/overview-abridge.md b/content/overview-abridge.md index f68ef2f..e3f0b58 100644 --- a/content/overview-abridge.md +++ b/content/overview-abridge.md @@ -1,6 +1,7 @@ +++ title = "Abridge Zola Theme" date = 2022-05-17 +updated = 2023-07-21 draft = false [taxonomies] diff --git a/templates/macros/macros.html b/templates/macros/macros.html index 4c86aac..f994bdb 100644 --- a/templates/macros/macros.html +++ b/templates/macros/macros.html @@ -24,7 +24,7 @@ {#- divider #} {%- if config.extra.meta_post.author %} - {%- if config.extra.meta_post.readtime or config.extra.meta_post.date or config.extra.meta_post.categories_tags %} + {%- if config.extra.meta_post.readtime or config.extra.meta_post.date or config.extra.meta_post.updated or config.extra.meta_post.categories_tags %} {%- if config.extra.meta_post.divider %}{{ config.extra.meta_post.divider | safe }}{%- else %}   {%- endif %} {%- endif %} {%- endif %} @@ -32,7 +32,7 @@ {#- ReadTime #} {%- if config.extra.meta_post.readtime %} {%- if config.extra.icon_read %} {% endif %} {{ page.reading_time }} {{ config.extra.meta_post.readstring | default(value="min") }} {#- divider #} - {%- if config.extra.meta_post.date or config.extra.meta_post.categories_tags %} + {%- if config.extra.meta_post.date or config.extra.meta_post.updated or config.extra.meta_post.categories_tags %} {%- if config.extra.meta_post.divider %}{{ config.extra.meta_post.divider | safe }}{%- else %}   {%- endif %}{%- endif %}{%- endif %} {#- Date #} @@ -46,6 +46,20 @@ {{ page.date | date(format="%B %d, %Y", locale=lang_locale) }} {%- else %} {{ page.date | date(format="%B %d, %Y") }} {%- endif %} {#- divider #} + {%- if config.extra.meta_post.updated or config.extra.meta_post.categories_tags %} + {%- if config.extra.meta_post.divider %}{{ config.extra.meta_post.divider | safe }}{%- else %}   {%- endif %}{%- endif %}{% endif %} + + {#- Updated #} + {%- if config.extra.meta_post.updated and page.updated %} {%- if config.extra.icon_date %} {% endif -%} + {%- if lang != config.default_language %} {{ trans(key="Updated" | safe, lang=lang) }}{% else %} Updated{% endif %}: + {%- if config.extra.date_locale %} + {%- if lang != config.default_language -%} + {%- set lang_locale = trans(key="date_locale" | safe, lang=lang) -%} + {%- else -%} + {%- set lang_locale = config.extra.date_locale -%} + {%- endif %} {{ page.updated | date(format="%B %d, %Y", locale=lang_locale) }} + {%- else %} {{ page.updated | date(format="%B %d, %Y") }} {%- endif %} + {#- divider #} {%- if config.extra.meta_post.categories_tags %} {%- if config.extra.meta_post.divider %}{{ config.extra.meta_post.divider | safe }}{%- else %}   {%- endif %}{%- endif %}{% endif %} @@ -83,7 +97,7 @@ {#- divider #} {%- if config.extra.meta_index.author %} - {%- if config.extra.meta_index.readtime or config.extra.meta_index.date or config.extra.meta_index.categories_tags %} + {%- if config.extra.meta_index.readtime or config.extra.meta_index.date or config.extra.meta_index.updated or config.extra.meta_index.categories_tags %} {%- if config.extra.meta_index.divider %}{{ config.extra.meta_index.divider | safe }}{%- else %}   {%- endif %} {%- endif %} {%- endif %} @@ -91,7 +105,7 @@ {#- ReadTime #} {%- if config.extra.meta_index.readtime %} {%- if config.extra.icon_read %} {% endif %} {{ page.reading_time }} {{ config.extra.meta_index.readstring | default(value="min") }} {#- divider #} - {%- if config.extra.meta_index.date or config.extra.meta_index.categories_tags %} + {%- if config.extra.meta_index.date or config.extra.meta_index.updated or config.extra.meta_index.categories_tags %} {%- if config.extra.meta_index.divider %}{{ config.extra.meta_index.divider | safe }}{%- else %}   {%- endif %}{%- endif %}{%- endif %} {#- Date #} @@ -104,6 +118,21 @@ {%- endif -%} {{ page.date | date(format="%B %d, %Y", locale=lang_locale) }} {%- else %} {{ page.date | date(format="%B %d, %Y") }} {%- endif %} + {#- divider #} + {%- if config.extra.meta_index.updated or config.extra.meta_index.categories_tags %} + {%- if config.extra.meta_index.divider %}{{ config.extra.meta_index.divider | safe }}{%- else %}   {%- endif %}{%- endif %}{% endif %} + + {#- Updated #} + {%- if config.extra.meta_index.updated and page.updated %} {%- if config.extra.icon_date %} {% endif -%} + {%- if lang != config.default_language %} {{ trans(key="Updated" | safe, lang=lang) }}{% else %} Updated{% endif %}: + {%- if config.extra.date_locale %} + {%- if lang != config.default_language -%} + {%- set lang_locale = trans(key="date_locale" | safe, lang=lang) -%} + {%- else -%} + {%- set lang_locale = config.extra.date_locale -%} + {%- endif %} {{ page.updated | date(format="%B %d, %Y", locale=lang_locale) }} + {%- else %} {{ page.updated | date(format="%B %d, %Y") }} {%- endif %} + {#- divider #} {%- if config.extra.meta_index.categories_tags %} {%- if config.extra.meta_index.divider %}{{ config.extra.meta_index.divider | safe }}{%- else %}   {%- endif %}{%- endif %}{% endif %} -- cgit v1.3.1 From 15ed680b4f7e1540fb09360dbd755f27403364f0 Mon Sep 17 00:00:00 2001 From: Jieiku Date: Sat, 22 Jul 2023 09:58:11 -0700 Subject: kofi icon --- COPY-TO-ROOT-SASS/abridge.scss | 1 + config.toml | 1 + sass/_functions.scss | 1 + sass/abridge.scss | 2 ++ templates/macros/social.html | 2 ++ 5 files changed, 7 insertions(+) (limited to 'templates') diff --git a/COPY-TO-ROOT-SASS/abridge.scss b/COPY-TO-ROOT-SASS/abridge.scss index a680fdd..6ab3895 100644 --- a/COPY-TO-ROOT-SASS/abridge.scss +++ b/COPY-TO-ROOT-SASS/abridge.scss @@ -26,6 +26,7 @@ $icon-element: false, $icon-matrix: false, $icon-buymeacoffee: false, + $icon-kofi: false, $icon-twitter: false, $icon-facebook: false, $icon-linkedin: false, diff --git a/config.toml b/config.toml index ebeba67..eebc404 100644 --- a/config.toml +++ b/config.toml @@ -173,6 +173,7 @@ mail = "name@example.com" mastodon = "@your-user-name" element = "matrix.example.com" buymeacoffee = "your-user-name" +kofi = "your-user-name" discord = "your-discord" # Everything after https://discord.com/ eg: invite/my-server *or* servers/my-server-id twitter = "your-user-name" facebook = "your-user-name" diff --git a/sass/_functions.scss b/sass/_functions.scss index 2f4029a..dd6880a 100644 --- a/sass/_functions.scss +++ b/sass/_functions.scss @@ -102,6 +102,7 @@ home: "%3Csvg xmlns='http://www.w3.org/2000/svg' stroke='#{map-get($p, s)}' stroke-width='#{map-get($p, sw)}' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Cpath d='M9 22V12h6v10M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2Z'/%3E%3C/svg%3E", instagram: "%3Csvg xmlns='http://www.w3.org/2000/svg' stroke='#{map-get($p, s)}' stroke-width='#{map-get($p, sw)}' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Crect x='2' y='2' width='20' height='20' rx='5' ry='5'/%3E%3Cpath d='M16 11.4A4 4 0 1 1 12.6 8a4 4 0 0 1 3.4 3.4zm1.5-4.9h.01'/%3E%3C/svg%3E", linkedin: "%3Csvg xmlns='http://www.w3.org/2000/svg' stroke='#{map-get($p, s)}' stroke-width='#{map-get($p, sw)}' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Cpath d='M16 8a6 6 0 0 1 6 6v7h-4v-7a2 2 0 0 0-2-2 2 2 0 0 0-2 2v7h-4v-7a6 6 0 0 1 6-6zM2 9h4v12H2z'/%3E%3Ccircle cx='4' cy='4' r='2'/%3E%3C/svg%3E", + kofi: "%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath stroke='#{map-get($p, s)}' stroke-width='#{map-get($p, sw)}' fill='%23fff' d='M2 5h15c8 0 8 10 0 10-1 0-1 0-1 1v2q0 1-1 1H2q-1 0-1-1V6q0-1 1-1m14 4v2c0 1 0 1 1 1 4 0 4-4 0-4-1 0-1 0-1 1'/%3E%3Cpath fill='#{map-get($p, f)}' d='M9 16C2 11 5 6 9 9c4-3 7 2 0 7' /%3E%3C/svg%3E", mail: "%3Csvg xmlns='http://www.w3.org/2000/svg' stroke='#{map-get($p, s)}' stroke-width='#{map-get($p, sw)}' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Cpath d='m22 6-10 7L2 6m2-2h16a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V6c0-1.1.9-2 2-2Z'/%3E%3C/svg%3E", mastodon: "%3Csvg xmlns='http://www.w3.org/2000/svg' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Cpath d='M2 8c0 5.7-.2 12.6 5 14 2 .6 3.7.7 5 .6 2.4-.1 3.8-.9 3.8-.9l-.1-1.8s-1.7.6-3.7.5c-1.9 0-4-.2-4.2-2.6a5 5 90 0 1 0-.7c4 1 7.5.5 8.4.4 2.7-.4 5-2 5.3-3.6.5-2.4.4-5.8.4-5.8C22 3.4 19 2 19 2 15.9.6 8 .6 5.1 2c0 0-3 1.4-3 6zm4.5-2.3c1.2-1.4 3.8-1.5 5 .3l.5.9.6-1c1.1-1.7 3.7-1.6 4.9-.2 1.1 1.3.9 2.5.9 8.4H16V8.6c0-2.4-3-2.5-3 .3v3h-2V9c0-2.8-3-2.7-3-.3V14H5.6c0-5.9-.2-7.1 1-8.4z'/%3E%3C/svg%3E", matrix: "%3Csvg xmlns='http://www.w3.org/2000/svg' stroke='#{map-get($p, s)}' stroke-width='#{map-get($p, sw)}' fill='#{map-get($p, f)}' viewBox='0 0 24 24'%3E%3Cpath d='M.6.6v22.8H3v.6H0V0h3v.6zm7 7.2V9h.1c3.2-2.3 4.3 0 4.8.3C14.9 6.7 18 8 18 11v5h-1.5v-5a1 1 0 0 0-3.5 0v5h-1.7v-5a1 1 0 0 0-3.7 0v5H6V7.8zm15.8 15.7V.4H21V0h3v24h-3v-.6z'/%3E%3C/svg%3E", diff --git a/sass/abridge.scss b/sass/abridge.scss index ac01c1a..e457c5c 100644 --- a/sass/abridge.scss +++ b/sass/abridge.scss @@ -33,6 +33,7 @@ $icon-mastodon: true !default; $icon-element: true !default; $icon-matrix: false !default; $icon-buymeacoffee: true !default; +$icon-kofi: true !default; $icon-twitter: true !default; $icon-facebook: true !default; $icon-linkedin: true !default; @@ -1284,6 +1285,7 @@ $syntax: true !default;//syntax highlighting for code blocks @if $icon-globe {.globe { background-image: functions.icon(globe, "%23888", 2, "none", $ic) }} @if $icon-home {.home { background-image: functions.icon(home, "%23888", 2, "none", $ic) }} @if $icon-instagram {.instagram { background-image: functions.icon(instagram, "%23e07", 2, "none", $ic) }} + @if $icon-kofi {.kofi { background-image: functions.icon(kofi, "%23888", 1.5, "%23f55", $ic) }} @if $icon-linkedin {.linkedin { background-image: functions.icon(linkedin, "%2326a", 2, "none", $ic) }} @if $icon-mail {.mail { background-image: functions.icon(mail, "%23888", 2, "none", $ic) }} @if $icon-mastodon {.mastodon { background-image: functions.icon(mastodon, "none", 1, "%2328c", $ic) }} diff --git a/templates/macros/social.html b/templates/macros/social.html index 2b8f841..6ad83de 100644 --- a/templates/macros/social.html +++ b/templates/macros/social.html @@ -48,6 +48,8 @@ {% endif -%} {%- if config.extra.youtube -%} {% endif -%} + {%- if config.extra.kofi -%} + {% endif -%} {%- if config.extra.buymeacoffee -%} {% endif -%} {%- if config.extra.github_sponsor -%} -- cgit v1.3.1 From e326d4ddb03a2736c6b9a5c41b9441afa8a37053 Mon Sep 17 00:00:00 2001 From: Jieiku Date: Wed, 26 Jul 2023 14:58:47 -0700 Subject: config value optional --- templates/macros/head.html | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) (limited to 'templates') diff --git a/templates/macros/head.html b/templates/macros/head.html index 603c341..35afa5b 100644 --- a/templates/macros/head.html +++ b/templates/macros/head.html @@ -3,10 +3,9 @@ {%- if config.extra.js_switcher | default(value=true) %} {%- set js_theme=config.extra.js_theme | default(value="") -%} {%- if not js_theme %} + {%- set js_theme="js/theme.min.js" -%} {%- if config.extra.js_switcher_default %}{%- if config.extra.js_switcher_default == "light" %} {%- set js_theme="js/theme_light.min.js" -%} - {%- else %} - {%- set js_theme="js/theme.min.js" -%} {%- endif %}{%- endif %} {%- endif %} -- cgit v1.3.1 From 24e4b49edfbbe0b51786606f9c434e8ba860e28d Mon Sep 17 00:00:00 2001 From: Jieiku Date: Wed, 2 Aug 2023 17:02:13 -0700 Subject: always load nojs.css for noscript --- templates/base.html | 2 -- 1 file changed, 2 deletions(-) (limited to 'templates') diff --git a/templates/base.html b/templates/base.html index b39bbc0..2ab46f8 100644 --- a/templates/base.html +++ b/templates/base.html @@ -27,9 +27,7 @@ {{- macros_head::security(config=config) }} {{- macros_head::favicons(config=config) }} - {%- if config.build_search_index %} - {%- endif %} {%- block header %} -- cgit v1.3.1 From 729f7cda12340aabce5d0faab8d306b5e0d59568 Mon Sep 17 00:00:00 2001 From: Jieiku Date: Wed, 9 Aug 2023 18:44:31 -0700 Subject: imghover > imgswap, reduce complexity, fix CSP --- content/overview-images/index.fr.md | 36 +++++++------- content/overview-images/index.md | 36 +++++++------- netlify.toml | 2 +- sass/abridge.scss | 17 +++++++ templates/shortcodes/imghover.html | 95 ------------------------------------- templates/shortcodes/imgswap.html | 59 +++++++++++++++++++++++ 6 files changed, 109 insertions(+), 136 deletions(-) delete mode 100644 templates/shortcodes/imghover.html create mode 100644 templates/shortcodes/imgswap.html (limited to 'templates') diff --git a/content/overview-images/index.fr.md b/content/overview-images/index.fr.md index 130b061..9a68006 100644 --- a/content/overview-images/index.fr.md +++ b/content/overview-images/index.fr.md @@ -9,11 +9,11 @@ categories = ["Features"] tags = ["shortcodes","images"] [extra] toc = true -keywords = "Image, Markdown, Shortcodes, Hover" +keywords = "Image, Markdown, Shortcodes, Swap" thumbnail = "ferris-gesture.png" +++ -Cet article couvre les **shortcodes imghover et img**. Les images peuvent également être intégrées directement à l'aide de markdown `![Ferris](ferris.svg)`, mais il est préférable d'utiliser un shortcode afin de pouvoir définir explicitement la largeur et la hauteur, cela aidera à empêcher le changement de mise en page du contenu, ce qui améliore l'expérience utilisateur et le score Google Lighthouse. +Cet article couvre les **shortcodes imgswap et img**. Les images peuvent également être intégrées directement à l'aide de markdown `![Ferris](ferris.svg)`, mais il est préférable d'utiliser un shortcode afin de pouvoir définir explicitement la largeur et la hauteur, cela aidera à empêcher le changement de mise en page du contenu, ce qui améliore l'expérience utilisateur et le score Google Lighthouse. # img Shortcode @@ -61,47 +61,43 @@ Cet article couvre les **shortcodes imghover et img**. Les images peuvent égale -# imghover Shortcode +# imgswap Shortcode -La première image du tableau src est celle comparée à toutes les autres. +Par défaut, main_src est l'image affichée, swap_src est affiché au survol de la souris. -Lorsque vous passez votre souris sur une image, celle-ci affiche l'image à comparer. +Lorsque vous passez votre souris sur l'image, l'image à comparer s'affiche. -Cela peut être utilisé pour comparer une seule image avec une autre en passant seulement deux src dans le tableau. - -- src est un tableau de chemins et de noms de fichiers pour les images. (obligatoire) +- main_src est le chemin et le nom de fichier de l'image par défaut. (obligatoire) +- swap_src est le chemin et le nom de fichier de l'image d'échange. (obligatoire) - w est la largeur de l'image. - h est la hauteur de l'image. -- p est la taille en pourcentage que vous souhaitez que l'image utilise sur la page. (50 est la valeur par défaut) - -*w et h ne sont utilisés que pour calculer le rapport d'aspect, la taille globale est définie par p* ## Utilisation (même chemin) ```rs -{{/* imghover(src=["ferris.svg", "ferris-gesture.svg", "ferris-happy.svg"] w=600 h=400 p=45) */}} +{{/* imgswap(main_src="ferris.svg" swap_src="ferris-happy.svg" w=600 h=400) */}} ``` **Sortir** ```html -{{ imghover(src=["ferris.svg", "ferris-gesture.svg", "ferris-happy.svg"] w=600 h=400 p=45) }} +{{ imgswap(main_src="ferris.svg" swap_src="ferris-happy.svg" w=600 h=400) }} ``` -{{ imghover(src=["ferris.svg", "ferris-gesture.svg", "ferris-happy.svg"] w=600 h=400 p=45) }} +{{ imgswap(main_src="ferris.svg" swap_src="ferris-happy.svg" w=600 h=400) }} ## Utilisation (chemin relatif ./) ```rs -{{/* imghover(src=["./img/ferris.svg", "./img/ferris-gesture.svg"] w=600 h=400 p=45) */}} +{{/* imgswap(main_src="./img/ferris.svg" swap_src="./img/ferris-gesture.svg" w=600 h=400) */}} ``` **Sortir** ```html -{{ imghover(src=["./img/ferris.svg", "./img/ferris-gesture.svg"] w=600 h=400 p=45) }} +{{ imgswap(main_src="./img/ferris.svg" swap_src="./img/ferris-gesture.svg" w=600 h=400) }} ``` -{{ imghover(src=["./img/ferris.svg", "./img/ferris-gesture.svg"] w=600 h=400 p=45) }} +{{ imgswap(main_src="./img/ferris.svg" swap_src="./img/ferris-gesture.svg" w=600 h=400) }} ## Utilisation (chemin racine /) ```rs -{{/* imghover(src=["/overview-rich-content/ferris.svg", "/overview-rich-content/ferris-gesture.svg"] w=600 h=400 p=45) */}} +{{/* imgswap(main_src="/overview-rich-content/ferris.svg" swap_src="/overview-rich-content/ferris-gesture.svg" w=600 h=400) */}} ``` **Sortir** ```html -{{ imghover(src=["/overview-rich-content/ferris.svg", "/overview-rich-content/ferris-gesture.svg"] w=600 h=400 p=45) }} +{{ imgswap(main_src="/overview-rich-content/ferris.svg" swap_src="/overview-rich-content/ferris-gesture.svg" w=600 h=400) }} ``` -{{ imghover(src=["/overview-rich-content/ferris.svg", "/overview-rich-content/ferris-gesture.svg"] w=600 h=400 p=45) }} +{{ imgswap(main_src="/overview-rich-content/ferris.svg" swap_src="/overview-rich-content/ferris-gesture.svg" w=600 h=400) }} diff --git a/content/overview-images/index.md b/content/overview-images/index.md index 3d60a91..efa8843 100644 --- a/content/overview-images/index.md +++ b/content/overview-images/index.md @@ -9,11 +9,11 @@ categories = ["Features"] tags = ["shortcodes","images"] [extra] toc = true -keywords = "Image, Markdown, Shortcodes, Hover" +keywords = "Image, Markdown, Shortcodes, Swap" thumbnail = "ferris-gesture.png" +++ -This post covers the **imghover and img shortcodes**. Images can also be embedded directly using markdown `![Ferris](ferris.svg)`, but it is better to use a shortcode so you can explicitly set the width and height, this will help prevent content layout shift which improves user experience and the google lighthouse score. +This post covers the **imgswap and img shortcodes**. Images can also be embedded directly using markdown `![Ferris](ferris.svg)`, but it is better to use a shortcode so you can explicitly set the width and height, this will help prevent content layout shift which improves user experience and the google lighthouse score. # img Shortcode @@ -61,47 +61,43 @@ This post covers the **imghover and img shortcodes**. Images can also be embedde -# imghover Shortcode +# imgswap Shortcode -The first image in the src array is the one compared to all the others. +By default main_src is the image displayed, swap_src is displayed on mouse hover. -When you hover your mouse over an image it will display the image to compare. +When you hover your mouse over the image it will display the image to compare. -This can be used to compare only one image with another by passing only two src in the array. - -- src is an array of paths and filenames for the images. (mandatory) +- main_src is the path and filename for the default image. (mandatory) +- swap_src is the path and filename for the swap image. (mandatory) - w is the width of the image. - h is the height of the image. -- p is the percent size that you want the image to use on the page. (50 is the default) - -*w and h are used only to calculate the aspect ratio, overall size is set by p* ## Usage (same path) ```rs -{{/* imghover(src=["ferris.svg", "ferris-gesture.svg", "ferris-happy.svg"] w=600 h=400 p=45) */}} +{{/* imgswap(main_src="ferris.svg" swap_src="ferris-happy.svg" w=600 h=400) */}} ``` **Output** ```html -{{ imghover(src=["ferris.svg", "ferris-gesture.svg", "ferris-happy.svg"] w=600 h=400 p=45) }} +{{ imgswap(main_src="ferris.svg" swap_src="ferris-happy.svg" w=600 h=400) }} ``` -{{ imghover(src=["ferris.svg", "ferris-gesture.svg", "ferris-happy.svg"] w=600 h=400 p=45) }} +{{ imgswap(main_src="ferris.svg" swap_src="ferris-happy.svg" w=600 h=400) }} ## Usage (relative path ./) ```rs -{{/* imghover(src=["./img/ferris.svg", "./img/ferris-gesture.svg"] w=600 h=400 p=45) */}} +{{/* imgswap(main_src="./img/ferris.svg" swap_src="./img/ferris-gesture.svg" w=600 h=400) */}} ``` **Output** ```html -{{ imghover(src=["./img/ferris.svg", "./img/ferris-gesture.svg"] w=600 h=400 p=45) }} +{{ imgswap(main_src="./img/ferris.svg" swap_src="./img/ferris-gesture.svg" w=600 h=400) }} ``` -{{ imghover(src=["./img/ferris.svg", "./img/ferris-gesture.svg"] w=600 h=400 p=45) }} +{{ imgswap(main_src="./img/ferris.svg" swap_src="./img/ferris-gesture.svg" w=600 h=400) }} ## Usage (root path /) ```rs -{{/* imghover(src=["/overview-rich-content/ferris.svg", "/overview-rich-content/ferris-gesture.svg"] w=600 h=400 p=45) */}} +{{/* imgswap(main_src="/overview-rich-content/ferris.svg" swap_src="/overview-rich-content/ferris-gesture.svg" w=600 h=400) */}} ``` **Output** ```html -{{ imghover(src=["/overview-rich-content/ferris.svg", "/overview-rich-content/ferris-gesture.svg"] w=600 h=400 p=45) }} +{{ imgswap(main_src="/overview-rich-content/ferris.svg" swap_src="/overview-rich-content/ferris-gesture.svg" w=600 h=400) }} ``` -{{ imghover(src=["/overview-rich-content/ferris.svg", "/overview-rich-content/ferris-gesture.svg"] w=600 h=400 p=45) }} +{{ imgswap(main_src="/overview-rich-content/ferris.svg" swap_src="/overview-rich-content/ferris-gesture.svg" w=600 h=400) }} diff --git a/netlify.toml b/netlify.toml index 9c492bb..3356614 100644 --- a/netlify.toml +++ b/netlify.toml @@ -16,4 +16,4 @@ command = "zola build --base-url $DEPLOY_PRIME_URL && npm run abridge-demo && zo X-XSS-Protection = "1; mode=block" Referrer-Policy = "strict-origin-when-cross-origin" Strict-Transport-Security = "max-age=63072000; includeSubdomains" - Content-Security-Policy = "default-src 'none'; frame-ancestors 'none'; object-src 'none'; base-uri 'self'; manifest-src 'self'; connect-src 'self'; form-action 'self'; script-src 'self'; img-src 'self' data: cdn.cloudflare.com; frame-src 'self' www.youtube-nocookie.com player.vimeo.com; media-src 'self' data: cdn.cloudflare.com www.youtube-nocookie.com player.vimeo.com; font-src 'self' cdn.cloudflare.com cdn.jsdelivr.net fonts.gstatic.com; style-src 'self' 'unsafe-inline' cdn.cloudflare.com cdn.jsdelivr.net fonts.googleapis.com;" + Content-Security-Policy = "default-src 'none'; frame-ancestors 'none'; object-src 'none'; base-uri 'self'; manifest-src 'self'; connect-src 'self'; form-action 'self'; script-src 'self'; img-src 'self' data: cdn.cloudflare.com; frame-src 'self' www.youtube-nocookie.com player.vimeo.com; media-src 'self' data: cdn.cloudflare.com www.youtube-nocookie.com player.vimeo.com; font-src 'self' cdn.cloudflare.com cdn.jsdelivr.net fonts.gstatic.com; style-src 'self' cdn.cloudflare.com cdn.jsdelivr.net fonts.googleapis.com;" diff --git a/sass/abridge.scss b/sass/abridge.scss index e457c5c..5573482 100644 --- a/sass/abridge.scss +++ b/sass/abridge.scss @@ -200,6 +200,7 @@ $top: true !default;//back to top button using CSS $search: true !default;//search feature $toc: true !default;//Table of Contents, page index / recent posts block $zola: true !default;//Zola Specific +$imgswap: true !default;//Image Swap on hover/click $misc: false !default; $grid: false !default;//Infinity Grid, column based layouts. $syntax: true !default;//syntax highlighting for code blocks @@ -1224,6 +1225,22 @@ $syntax: true !default;//syntax highlighting for code blocks } } } +@if $imgswap { + .img-swap-div { + .img-main { + display: block; + } + .img-swap { + display: none; + } + &:hover .img-swap { + display: block; + } + &:hover .img-main { + display: none; + } + } +} @if $misc { // https://github.com/picocss/pico // Add the correct display in IE 10+ diff --git a/templates/shortcodes/imghover.html b/templates/shortcodes/imghover.html deleted file mode 100644 index 1ad733c..0000000 --- a/templates/shortcodes/imghover.html +++ /dev/null @@ -1,95 +0,0 @@ -{%- set_global bg = "" %} - -{%- for source in src %} - - {%- set dirtest = source | trim_start_matches(pat="./") %} - {%- if dirtest is containing("/") %} - {%- set reldir = true %} - {%- endif %} - - {%- if source is starting_with("./") and reldir %} {# Relative Path #} - {%- set pathtype = "rel-" %} - {%- set path = source | trim_start_matches(pat="./") | split(pat="/") | slice(end=-1) | join(sep="/") | trim_start_matches(pat="/") %} - {%- set path = path ~ "/" %} - - {%- elif source is starting_with("/") %} {# Root Path #} - {%- set pathtype = "root-" %} - {%- set rootpath = source | split(pat="/") | slice(end=-1) | join(sep="/") %} - {%- set path = config.base_url ~ rootpath ~ "/" %} - - {%- else %} {# Same Directory Path #} - {%- set pathtype = "same-" %} - {%- set path = "" %} - {%- endif %} - - {%- set sourcepath = source | split(pat="/") | last %} - {%- set sourcename = pathtype ~ sourcepath | split(pat=".") | first %} - - {%- if loop.first %} - {%- set_global bg = source | split(pat="/") | last %} - {%- else %} -
{{ sourcename }} on hover
-
- {%- endif %} - -{%- endfor %} - - diff --git a/templates/shortcodes/imgswap.html b/templates/shortcodes/imgswap.html new file mode 100644 index 0000000..f8c983c --- /dev/null +++ b/templates/shortcodes/imgswap.html @@ -0,0 +1,59 @@ +
+ {%- set dirtest = main_src | trim_start_matches(pat="./") %} + {%- if dirtest is containing("/") %} + {%- set reldir = true %} + {%- endif %} + + {%- if main_src is starting_with("./") and reldir %} {# Relative Path #} + {%- set path = main_src | trim_start_matches(pat="./") | split(pat="/") | slice(end=-1) | join(sep="/") | trim_start_matches(pat="/") %} + {%- set path = path ~ "/" %} + + {%- elif main_src is starting_with("/") %} {# Root Path #} + {%- set rootpath = main_src | split(pat="/") | slice(end=-1) | join(sep="/") %} + {%- set path = config.base_url ~ rootpath ~ "/" %} + + {%- else %} {# Same Directory Path #} + {%- set path = "" %} + + {%- endif %} + + {%- if not w or not h %} + {%- set metafile = page.path ~ path ~ main_src %} + {%- set meta = get_image_metadata(path=metafile) %} + {%- set w = meta.width %} + {%- set h = meta.height %} + {%- endif %} + + {%- set img = main_src | split(pat="/") | last %} + {%- set name = img | split(pat=".") | first %} + + + {%- set dirtest = swap_src | trim_start_matches(pat="./") %} + {%- if dirtest is containing("/") %} + {%- set reldir = true %} + {%- endif %} + + {%- if swap_src is starting_with("./") and reldir %} {# Relative Path #} + {%- set path = swap_src | trim_start_matches(pat="./") | split(pat="/") | slice(end=-1) | join(sep="/") | trim_start_matches(pat="/") %} + {%- set path = path ~ "/" %} + + {%- elif swap_src is starting_with("/") %} {# Root Path #} + {%- set rootpath = swap_src | split(pat="/") | slice(end=-1) | join(sep="/") %} + {%- set path = config.base_url ~ rootpath ~ "/" %} + + {%- else %} {# Same Directory Path #} + {%- set path = "" %} + + {%- endif %} + + {%- if not w or not h %} + {%- set metafile = page.path ~ path ~ swap_src %} + {%- set meta = get_image_metadata(path=metafile) %} + {%- set w = meta.width %} + {%- set h = meta.height %} + {%- endif %} + + {%- set img = swap_src | split(pat="/") | last %} + {%- set name = img | split(pat=".") | first %} + +
-- cgit v1.3.1 From 0983915e23793c28dd0bee149fd2ec05a7e96a94 Mon Sep 17 00:00:00 2001 From: Jieiku Date: Tue, 15 Aug 2023 21:10:25 -0700 Subject: Lighthouse and YellowLabTools optimizations --- README.md | 7 +++++++ content/overview-images/ferris-gesture.png | Bin 18429 -> 6741 bytes content/overview-rich-content/index.fr.md | 8 ++++---- content/overview-rich-content/index.md | 8 ++++---- content/overview-rich-content/over9000-400.avif | Bin 0 -> 20795 bytes content/overview-rich-content/over9000-400.webp | Bin 24322 -> 0 bytes content/overview-rich-content/over9000-640.avif | Bin 0 -> 31511 bytes content/overview-rich-content/over9000-960.avif | Bin 0 -> 43170 bytes content/overview-rich-content/over9000-960.webp | Bin 39488 -> 0 bytes sass/abridge.scss | 20 +------------------- screenshot.png | Bin 122329 -> 53621 bytes static/android-chrome-192x192.png | Bin 2535 -> 1609 bytes static/android-chrome-192x192m.png | Bin 2273 -> 1170 bytes static/android-chrome-512x512.png | Bin 5377 -> 3937 bytes static/apple-touch-icon.png | Bin 2606 -> 1542 bytes static/banner.png | Bin 13241 -> 4582 bytes static/favicon-32x32.png | Bin 663 -> 559 bytes static/mstile-150x150.png | Bin 2251 -> 1202 bytes templates/base.html | 2 +- templates/macros/social.html | 4 ++-- templates/shortcodes/image.html | 2 +- templates/shortcodes/img.html | 7 +++++-- templates/shortcodes/imgswap.html | 14 ++++++++++---- 23 files changed, 35 insertions(+), 37 deletions(-) create mode 100644 content/overview-rich-content/over9000-400.avif delete mode 100644 content/overview-rich-content/over9000-400.webp create mode 100644 content/overview-rich-content/over9000-640.avif create mode 100644 content/overview-rich-content/over9000-960.avif delete mode 100644 content/overview-rich-content/over9000-960.webp (limited to 'templates') diff --git a/README.md b/README.md index 0db22ce..be9f552 100644 --- a/README.md +++ b/README.md @@ -356,6 +356,13 @@ leanify -i 7777 *.png leanify -i 7777 *.ico ``` +With larger displays and greater pixel density becoming common it is probably a good idea to use atleast a littly bit of lossy compression. For example you can use pngquant with a 93% quality and you will often get images around 1/2 the size. Understand that pngquant is cumulative, so you should keep your original images somewhere, and only ever use pngquant once per image, if you use it again and again on the same image then you will lower the image quality each time. Always use oxipng afterwards, oxipng is lossless. + +```bash +pngquant --skip-if-larger --strip --quality=93-93 --speed 1 *.png +oxipng -o max --strip all -a -Z *.png +``` + ### Pre gzip/brotli content to serve with nginx: If you are serving your site with nginx, you can pre gzip your content. diff --git a/content/overview-images/ferris-gesture.png b/content/overview-images/ferris-gesture.png index e9c8708..67f6cd1 100644 Binary files a/content/overview-images/ferris-gesture.png and b/content/overview-images/ferris-gesture.png differ diff --git a/content/overview-rich-content/index.fr.md b/content/overview-rich-content/index.fr.md index 819b2db..e768252 100644 --- a/content/overview-rich-content/index.fr.md +++ b/content/overview-rich-content/index.fr.md @@ -34,18 +34,18 @@ Le `video` shortcode prend un `sources` paramètre (un tableau de chaînes) et r Le `image` shortcode renvoie une `` balise et accepte trois paramètres : `sources` (un tableau de chaînes), `fallback_path`, et `fallback_alt` (les deux chaînes). -Chaque chaîne du `sources` tableau doit être un chemin vers un fichier image d'un type différent (`webp`, `png`, `jpg`, etc). `fpath` et +Chaque chaîne du `sources` tableau doit être un chemin vers un fichier image d'un type différent (`avif`, `webp`, `png`, `jpg`, etc). `fpath` et `falt` sont utilisés pour créer une `` balise sur laquelle le navigateur peut se replier si les autres formats ne sont pas encore pris en charge, fw et fh définissent la largeur et la hauteur de la solution de repli ### Usage ```rs -{{/* image(sources=["over9000-960.webp", "over9000-640.webp", "over9000-400.webp"], fpath="over9000-640.webp", fw=640, fh=480, falt="ITS OVER 9000!") */}} +{{/* image(sources=["over9000-960.avif", "over9000-640.avif", "over9000-400.avif"], fpath="over9000-640.webp", fw=640, fh=480, falt="ITS OVER 9000!") */}} ``` ### Sortir ```html -{{ image(sources=["over9000-960.webp", "over9000-640.webp", "over9000-400.webp"], fpath="over9000-640.webp", fw=640, fh=480, falt="ITS OVER 9000!") }} +{{ image(sources=["over9000-960.avif", "over9000-640.avif", "over9000-400.avif"], fpath="over9000-640.webp", fw=640, fh=480, falt="ITS OVER 9000!") }} ``` -{{ image(sources=["over9000-960.webp", "over9000-640.webp", "over9000-400.webp"], fpath="over9000-640.webp", fw=640, fh=480, falt="ITS OVER 9000!") }} +{{ image(sources=["over9000-960.avif", "over9000-640.avif", "over9000-400.avif"], fpath="over9000-640.webp", fw=640, fh=480, falt="ITS OVER 9000!") }} ## GIF diff --git a/content/overview-rich-content/index.md b/content/overview-rich-content/index.md index 8f86d3b..4dc2285 100644 --- a/content/overview-rich-content/index.md +++ b/content/overview-rich-content/index.md @@ -41,19 +41,19 @@ parameters: `sources` (an array of strings), `fallback_path`, and `fallback_alt` (both strings). Each string in the `sources` array should be a path to an image file of -a different type (`webp`, `png`, `jpg`, etc). `fpath` and +a different type (`avif`, `webp`, `png`, `jpg`, etc). `fpath` and `falt` are used to create an `` tag for the browser to fall back on if the other formats aren't yet supported, fw and fh set the width and height of the fallback ### Usage ```rs -{{/* image(sources=["over9000-960.webp", "over9000-640.webp", "over9000-400.webp"], fpath="over9000-640.webp", fw=640, fh=480, falt="ITS OVER 9000!") */}} +{{/* image(sources=["over9000-960.avif", "over9000-640.avif", "over9000-400.avif"], fpath="over9000-640.webp", fw=640, fh=480, falt="ITS OVER 9000!") */}} ``` ### Output ```html -{{ image(sources=["over9000-960.webp", "over9000-640.webp", "over9000-400.webp"], fpath="over9000-640.webp", fw=640, fh=480, falt="ITS OVER 9000!") }} +{{ image(sources=["over9000-960.avif", "over9000-640.avif", "over9000-400.avif"], fpath="over9000-640.webp", fw=640, fh=480, falt="ITS OVER 9000!") }} ``` -{{ image(sources=["over9000-960.webp", "over9000-640.webp", "over9000-400.webp"], fpath="over9000-640.webp", fw=640, fh=480, falt="ITS OVER 9000!") }} +{{ image(sources=["over9000-960.avif", "over9000-640.avif", "over9000-400.avif"], fpath="over9000-640.webp", fw=640, fh=480, falt="ITS OVER 9000!") }} ## GIF diff --git a/content/overview-rich-content/over9000-400.avif b/content/overview-rich-content/over9000-400.avif new file mode 100644 index 0000000..e4c6b1d Binary files /dev/null and b/content/overview-rich-content/over9000-400.avif differ diff --git a/content/overview-rich-content/over9000-400.webp b/content/overview-rich-content/over9000-400.webp deleted file mode 100644 index 1b2876f..0000000 Binary files a/content/overview-rich-content/over9000-400.webp and /dev/null differ diff --git a/content/overview-rich-content/over9000-640.avif b/content/overview-rich-content/over9000-640.avif new file mode 100644 index 0000000..38d314b Binary files /dev/null and b/content/overview-rich-content/over9000-640.avif differ diff --git a/content/overview-rich-content/over9000-960.avif b/content/overview-rich-content/over9000-960.avif new file mode 100644 index 0000000..ae3584d Binary files /dev/null and b/content/overview-rich-content/over9000-960.avif differ diff --git a/content/overview-rich-content/over9000-960.webp b/content/overview-rich-content/over9000-960.webp deleted file mode 100644 index 28fba9c..0000000 Binary files a/content/overview-rich-content/over9000-960.webp and /dev/null differ diff --git a/sass/abridge.scss b/sass/abridge.scss index 5573482..2cde0d3 100644 --- a/sass/abridge.scss +++ b/sass/abridge.scss @@ -711,23 +711,9 @@ $syntax: true !default;//syntax highlighting for code blocks margin-bottom: 0; margin-top: 0.2rem; } - li { - display: inline-block; - margin: 0 .2rem; - } } main nav { - ul { - display: flex; - padding-left: 0; - } margin-top: var(--s2);//pagination margin - li { - margin: .2rem; - } - li.inp { - padding-top: .1rem; - } } .outp { padding: 0 .26rem .2rem; @@ -751,11 +737,7 @@ $syntax: true !default;//syntax highlighting for code blocks color: var(--a1);//pagination color current page } footer nav { - ul { - margin: 0; - padding: 0; - } - li { + i { margin: 0 .2rem .4rem; } } diff --git a/screenshot.png b/screenshot.png index cd3a293..ec8d65f 100644 Binary files a/screenshot.png and b/screenshot.png differ diff --git a/static/android-chrome-192x192.png b/static/android-chrome-192x192.png index 4eba45e..3a075c3 100644 Binary files a/static/android-chrome-192x192.png and b/static/android-chrome-192x192.png differ diff --git a/static/android-chrome-192x192m.png b/static/android-chrome-192x192m.png index f7e37a2..f1e485d 100644 Binary files a/static/android-chrome-192x192m.png and b/static/android-chrome-192x192m.png differ diff --git a/static/android-chrome-512x512.png b/static/android-chrome-512x512.png index 371daf4..b671d86 100644 Binary files a/static/android-chrome-512x512.png and b/static/android-chrome-512x512.png differ diff --git a/static/apple-touch-icon.png b/static/apple-touch-icon.png index b872d32..2923e41 100644 Binary files a/static/apple-touch-icon.png and b/static/apple-touch-icon.png differ diff --git a/static/banner.png b/static/banner.png index 775bff2..a4a46d5 100644 Binary files a/static/banner.png and b/static/banner.png differ diff --git a/static/favicon-32x32.png b/static/favicon-32x32.png index e68ac3c..df1736f 100644 Binary files a/static/favicon-32x32.png and b/static/favicon-32x32.png differ diff --git a/static/mstile-150x150.png b/static/mstile-150x150.png index 41ce573..7a18d2b 100644 Binary files a/static/mstile-150x150.png and b/static/mstile-150x150.png differ diff --git a/templates/base.html b/templates/base.html index 2ab46f8..fd3c553 100644 --- a/templates/base.html +++ b/templates/base.html @@ -9,7 +9,7 @@ {{- macros_head::stylesheets(config=config) }} - + {{- macros_head::stylesheets_preload(config=config) }} {{- macros_head::js(config=config) }} diff --git a/templates/macros/social.html b/templates/macros/social.html index 6ad83de..1221ce7 100644 --- a/templates/macros/social.html +++ b/templates/macros/social.html @@ -1,5 +1,5 @@ {%- macro social_links(config) %} -
{%- endmacro %} diff --git a/templates/shortcodes/image.html b/templates/shortcodes/image.html index 8452ce9..4f9d3de 100644 --- a/templates/shortcodes/image.html +++ b/templates/shortcodes/image.html @@ -3,5 +3,5 @@ {% set type = source | split(pat=".") | last -%} {% endfor -%} - {{ falt | default(value='Image') }} + {{ falt | default(value='Image') }} diff --git a/templates/shortcodes/img.html b/templates/shortcodes/img.html index cf2a562..f23f783 100644 --- a/templates/shortcodes/img.html +++ b/templates/shortcodes/img.html @@ -24,5 +24,8 @@ {%- endif %} {%- set img = src | split(pat="/") | last %} -{%- set name = img | split(pat=".") | first %} - + +{%- if not alt %} + {%- set alt = img | split(pat=".") | first %} +{%- endif %} + diff --git a/templates/shortcodes/imgswap.html b/templates/shortcodes/imgswap.html index f8c983c..4397b29 100644 --- a/templates/shortcodes/imgswap.html +++ b/templates/shortcodes/imgswap.html @@ -25,8 +25,11 @@ {%- endif %} {%- set img = main_src | split(pat="/") | last %} - {%- set name = img | split(pat=".") | first %} - + + {%- if not alt %} + {%- set alt = img | split(pat=".") | first %} + {%- endif %} + {%- set dirtest = swap_src | trim_start_matches(pat="./") %} {%- if dirtest is containing("/") %} @@ -54,6 +57,9 @@ {%- endif %} {%- set img = swap_src | split(pat="/") | last %} - {%- set name = img | split(pat=".") | first %} - + + {%- if not alt %} + {%- set alt = img | split(pat=".") | first %} + {%- endif %} +
-- cgit v1.3.1