Add new custom card layouts (#2245)

Pipfile.lock

@@ -208,11 +208,11 @@
         },
         "click": {
             "hashes": [
-                "sha256:2739815aaa5d2c986a88f1e9230c55e17f0caad3d958a5e13ad0797c166db9e3",
+                "sha256:48ee849951919527a045bfe3bf7baa8a959c423134e1a5b98c05c20ba75a1cbd",
-                "sha256:b97d0c74955da062a7d4ef92fadb583806a585b2ea81958a81bd72726cbb8e37"
+                "sha256:fa244bb30b3b5ee2cae3da8f55c9e5e0c0e86093306301fb418eb9dc40fbded5"
             ],
             "markers": "python_version >= '3.7'",
-            "version": "==8.1.4"
+            "version": "==8.1.6"
         },
         "colorama": {
             "hashes": [
@@ -505,7 +505,7 @@
         },
         "mkdocs-material": {
             "path": "./modules/mkdocs-material",
-            "version": "==9.1.16+insiders.4.36.0"
+            "version": "==9.1.18+insiders.4.37.0"
         },
         "mkdocs-material-extensions": {
             "hashes": [
@@ -593,11 +593,11 @@
         },
         "pipdeptree": {
             "hashes": [
-                "sha256:47bfc150560709420b647bcc6293868d6f0848fb33a7d9ccbfc0abe343999953",
+                "sha256:0d64fe4e9573d3e992fc84f8dc025bd9cfdf00ce9850c1252dcbdbd1734d324d",
-                "sha256:65ddcb15b05a396fa2a0d6e1696881b80463942a8cef12071141898bfff24255"
+                "sha256:6bcc50ad4c06f05996e2fad3dc56585c323c9a7aa18694ca5b2d8115db183e80"
             ],
-            "markers": "python_version >= '3.7'",
+            "markers": "python_version >= '3.8'",
-            "version": "==2.9.5"
+            "version": "==2.10.2"
         },
         "pycparser": {
             "hashes": [
@@ -616,11 +616,11 @@
         },
         "pymdown-extensions": {
             "hashes": [
-                "sha256:ae66d84013c5d027ce055693e09a4628b67e9dec5bce05727e45b0918e36f274",
+                "sha256:508009b211373058debb8247e168de4cbcb91b1bff7b5e961b2c3e864e00b195",
-                "sha256:b44e1093a43b8a975eae17b03c3a77aad4681b3b56fce60ce746dbef1944c8cb"
+                "sha256:ef25dbbae530e8f67575d222b75ff0649b1e841e22c2ae9a20bad9472c2207dc"
             ],
             "markers": "python_version >= '3.7'",
-            "version": "==10.0.1"
+            "version": "==10.1"
         },
         "pyquery": {
             "hashes": [
@@ -647,49 +647,49 @@
         },
         "pyyaml": {
             "hashes": [
-                "sha256:01b45c0191e6d66c470b6cf1b9531a771a83c1c4208272ead47a3ae4f2f603bf",
+                "sha256:062582fca9fabdd2c8b54a3ef1c978d786e0f6b3a1510e0ac93ef59e0ddae2bc",
-                "sha256:0283c35a6a9fbf047493e3a0ce8d79ef5030852c51e9d911a27badfde0605293",
+                "sha256:1635fd110e8d85d55237ab316b5b011de701ea0f29d07611174a1b42f1444741",
-                "sha256:055d937d65826939cb044fc8c9b08889e8c743fdc6a32b33e2390f66013e449b",
+                "sha256:184c5108a2aca3c5b3d3bf9395d50893a7ab82a38004c8f61c258d4428e80206",
-                "sha256:07751360502caac1c067a8132d150cf3d61339af5691fe9e87803040dbc5db57",
+                "sha256:18aeb1bf9a78867dc38b259769503436b7c72f7a1f1f4c93ff9a17de54319b27",
-                "sha256:0b4624f379dab24d3725ffde76559cff63d9ec94e1736b556dacdfebe5ab6d4b",
+                "sha256:1d4c7e777c441b20e32f52bd377e0c409713e8bb1386e1099c2415f26e479595",
-                "sha256:0ce82d761c532fe4ec3f87fc45688bdd3a4c1dc5e0b4a19814b9009a29baefd4",
+                "sha256:1e2722cc9fbb45d9b87631ac70924c11d3a401b2d7f410cc0e3bbf249f2dca62",
-                "sha256:1e4747bc279b4f613a09eb64bba2ba602d8a6664c6ce6396a4d0cd413a50ce07",
+                "sha256:1fe35611261b29bd1de0070f0b2f47cb6ff71fa6595c077e42bd0c419fa27b98",
-                "sha256:213c60cd50106436cc818accf5baa1aba61c0189ff610f64f4a3e8c6726218ba",
+                "sha256:28c119d996beec18c05208a8bd78cbe4007878c6dd15091efb73a30e90539696",
-                "sha256:231710d57adfd809ef5d34183b8ed1eeae3f76459c18fb4a0b373ad56bedcdd9",
+                "sha256:42f8152b8dbc4fe7d96729ec2b99c7097d656dc1213a3229ca5383f973a5ed6d",
-                "sha256:277a0ef2981ca40581a47093e9e2d13b3f1fbbeffae064c1d21bfceba2030287",
+                "sha256:4fb147e7a67ef577a588a0e2c17b6db51dda102c71de36f8549b6816a96e1867",
-                "sha256:2cd5df3de48857ed0544b34e2d40e9fac445930039f3cfe4bcc592a1f836d513",
+                "sha256:50550eb667afee136e9a77d6dc71ae76a44df8b3e51e41b77f6de2932bfe0f47",
-                "sha256:40527857252b61eacd1d9af500c3337ba8deb8fc298940291486c465c8b46ec0",
+                "sha256:510c9deebc5c0225e8c96813043e62b680ba2f9c50a08d3724c7f28a747d1486",
-                "sha256:432557aa2c09802be39460360ddffd48156e30721f5e8d917f01d31694216782",
+                "sha256:5773183b6446b2c99bb77e77595dd486303b4faab2b086e7b17bc6bef28865f6",
-                "sha256:473f9edb243cb1935ab5a084eb238d842fb8f404ed2193a915d1784b5a6b5fc0",
+                "sha256:596106435fa6ad000c2991a98fa58eeb8656ef2325d7e158344fb33864ed87e3",
-                "sha256:48c346915c114f5fdb3ead70312bd042a953a8ce5c7106d5bfb1a5254e47da92",
+                "sha256:6965a7bc3cf88e5a1c3bd2e0b5c22f8d677dc88a455344035f03399034eb3007",
-                "sha256:50602afada6d6cbfad699b0c7bb50d5ccffa7e46a3d738092afddc1f9758427f",
+                "sha256:69b023b2b4daa7548bcfbd4aa3da05b3a74b772db9e23b982788168117739938",
-                "sha256:68fb519c14306fec9720a2a5b45bc9f0c8d1b9c72adf45c37baedfcd949c35a2",
+                "sha256:704219a11b772aea0d8ecd7058d0082713c3562b4e271b849ad7dc4a5c90c13c",
-                "sha256:77f396e6ef4c73fdc33a9157446466f1cff553d979bd00ecb64385760c6babdc",
+                "sha256:7e07cbde391ba96ab58e532ff4803f79c4129397514e1413a7dc761ccd755735",
-                "sha256:81957921f441d50af23654aa6c5e5eaf9b06aba7f0a19c18a538dc7ef291c5a1",
+                "sha256:81e0b275a9ecc9c0c0c07b4b90ba548307583c125f54d5b6946cfee6360c733d",
-                "sha256:819b3830a1543db06c4d4b865e70ded25be52a2e0631ccd2f6a47a2822f2fd7c",
+                "sha256:9046c58c4395dff28dd494285c82ba00b546adfc7ef001486fbf0324bc174fba",
-                "sha256:897b80890765f037df3403d22bab41627ca8811ae55e9a722fd0392850ec4d86",
+                "sha256:9eb6caa9a297fc2c2fb8862bc5370d0303ddba53ba97e71f08023b6cd73d16a8",
-                "sha256:98c4d36e99714e55cfbaaee6dd5badbc9a1ec339ebfc3b1f52e293aee6bb71a4",
+                "sha256:a0cd17c15d3bb3fa06978b4e8958dcdc6e0174ccea823003a106c7d4d7899ac5",
-                "sha256:9df7ed3b3d2e0ecfe09e14741b857df43adb5a3ddadc919a2d94fbdf78fea53c",
+                "sha256:afd7e57eddb1a54f0f1a974bc4391af8bcce0b444685d936840f125cf046d5bd",
-                "sha256:9fa600030013c4de8165339db93d182b9431076eb98eb40ee068700c9c813e34",
+                "sha256:b1275ad35a5d18c62a7220633c913e1b42d44b46ee12554e5fd39c70a243d6a3",
-                "sha256:a80a78046a72361de73f8f395f1f1e49f956c6be882eed58505a15f3e430962b",
+                "sha256:b786eecbdf8499b9ca1d697215862083bd6d2a99965554781d0d8d1ad31e13a0",
-                "sha256:afa17f5bc4d1b10afd4466fd3a44dc0e245382deca5b3c353d8b757f9e3ecb8d",
+                "sha256:ba336e390cd8e4d1739f42dfe9bb83a3cc2e80f567d8805e11b46f4a943f5515",
-                "sha256:b3d267842bf12586ba6c734f89d1f5b871df0273157918b0ccefa29deb05c21c",
+                "sha256:baa90d3f661d43131ca170712d903e6295d1f7a0f595074f151c0aed377c9b9c",
-                "sha256:b5b9eccad747aabaaffbc6064800670f0c297e52c12754eb1d976c57e4f74dcb",
+                "sha256:bc1bf2925a1ecd43da378f4db9e4f799775d6367bdb94671027b73b393a7c42c",
-                "sha256:bfaef573a63ba8923503d27530362590ff4f576c626d86a9fed95822a8255fd7",
+                "sha256:bd4af7373a854424dabd882decdc5579653d7868b8fb26dc7d0e99f823aa5924",
-                "sha256:c5687b8d43cf58545ade1fe3e055f70eac7a5a1a0bf42824308d868289a95737",
+                "sha256:bf07ee2fef7014951eeb99f56f39c9bb4af143d8aa3c21b1677805985307da34",
-                "sha256:cba8c411ef271aa037d7357a2bc8f9ee8b58b9965831d9e51baf703280dc73d3",
+                "sha256:bfdf460b1736c775f2ba9f6a92bca30bc2095067b8a9d77876d1fad6cc3b4a43",
-                "sha256:d15a181d1ecd0d4270dc32edb46f7cb7733c7c508857278d3d378d14d606db2d",
+                "sha256:c8098ddcc2a85b61647b2590f825f3db38891662cfc2fc776415143f599bb859",
-                "sha256:d4b0ba9512519522b118090257be113b9468d804b19d63c71dbcf4a48fa32358",
+                "sha256:d2b04aac4d386b172d5b9692e2d2da8de7bfb6c387fa4f801fbf6fb2e6ba4673",
-                "sha256:d4db7c7aef085872ef65a8fd7d6d09a14ae91f691dec3e87ee5ee0539d516f53",
+                "sha256:d858aa552c999bc8a8d57426ed01e40bef403cd8ccdd0fc5f6f04a00414cac2a",
-                "sha256:d4eccecf9adf6fbcc6861a38015c2a64f38b9d94838ac1810a9023a0609e1b78",
+                "sha256:f003ed9ad21d6a4713f0a9b5a7a0a79e08dd0f221aff4525a2be4c346ee60aab",
-                "sha256:d67d839ede4ed1b28a4e8909735fc992a923cdb84e618544973d7dfc71540803",
+                "sha256:f22ac1c3cac4dbc50079e965eba2c1058622631e526bd9afd45fedd49ba781fa",
-                "sha256:daf496c58a8c52083df09b80c860005194014c3698698d1a57cbcfa182142a3a",
+                "sha256:faca3bdcf85b2fc05d06ff3fbc1f83e1391b3e724afa3feba7d13eeab355484c",
-                "sha256:dbad0e9d368bb989f4515da330b88a057617d16b6a8245084f1b05400f24609f",
+                "sha256:fca0e3a251908a499833aa292323f32437106001d436eca0e6e7833256674585",
-                "sha256:e61ceaab6f49fb8bdfaa0f92c4b57bcfbea54c09277b1b4f7ac376bfb7a7c174",
+                "sha256:fd1592b3fdf65fff2ad0004b5e363300ef59ced41c2e6b3a99d4089fa8c5435d",
-                "sha256:f84fbc98b019fef2ee9a1cb3ce93e3187a6df0b2538a651bfb890254ba9f90b5"
+                "sha256:fd66fc5d0da6d9815ba2cebeb4205f95818ff4b79c3ebe268e75d961704af52f"
             ],
             "markers": "python_version >= '3.6'",
-            "version": "==6.0"
+            "version": "==6.0.1"
         },
         "pyyaml-env-tag": {
             "hashes": [
@@ -850,11 +850,11 @@
         },
         "urllib3": {
             "hashes": [
-                "sha256:48e7fafa40319d358848e1bc6809b208340fafe2096f1725d05d67443d0483d1",
+                "sha256:8d22f86aae8ef5e410d4f539fde9ce6b2113a001bb4d189e0aed70642d602b11",
-                "sha256:bee28b5e56addb8226c96f7f13ac28cb4c301dd5ea8a6ca179c0b9835e032825"
+                "sha256:de7df1803967d2c2a98e4b11bb7d6bd9210474c46e8a0401514e3a42a75ebde4"
             ],
             "markers": "python_version >= '3.7'",
-            "version": "==2.0.3"
+            "version": "==2.0.4"
         },
         "watchdog": {
             "hashes": [
@@ -898,11 +898,11 @@
         },
         "zipp": {
             "hashes": [
-                "sha256:1876cb065531855bbe83b6c489dcf69ecc28f1068d8e95959fe8bbc77774c941",
+                "sha256:679e51dd4403591b2d6838a48de3d283f3d188412a9782faadf845f298736ba0",
-                "sha256:5dadc3ad0a1f825fe42ce1bce0f2fc5a13af2e6b2d386af5b0ff295bc0a287d3"
+                "sha256:ebc15946aa78bd63458992fc81ec3b6f7b1e92d51c35e6de1c3804e73b799147"
             ],
             "markers": "python_version >= '3.8'",
-            "version": "==3.16.0"
+            "version": "==3.16.2"
         }
     },
     "develop": {

config/layouts/home.yml

@@ -0,0 +1,100 @@
+definitions:
+
+  - &background_color >-
+    #FFD06F
+
+  - &color >-
+    #2d2d2d
+
+  - &title_font_family >-
+    Bagnard
+
+  - &font_family >-
+    {%- if config.theme.language == "he" -%}
+      Suez One
+    {%- elif config.theme.language == ("zh-Hant" or "ru") -%}
+      Noto Sans TC
+    {%- else -%}
+      Public Sans
+    {%- endif -%}
+
+  - &page_title >-
+    {{ config.site_name }}
+
+  - &page_title_with_site_name >-
+    {{ page.meta.get("title", page.title) }}
+  
+  - &page_description >-
+    {{ config.extra.homepage_description or "A socially motivated website which provides information about protecting your online data privacy and security." }}
+
+  - &og_description >-
+    {{ page.meta.get("description", config.site_description) or "" }}
+
+  - &logo >-
+    {{ config.docs_dir }}/{{ config.theme.logo }}
+
+# Meta tags
+tags:
+
+  # Open Graph
+  og:type: website
+  og:title: *page_title_with_site_name
+  og:description: *og_description
+  og:image: "{{ image.url }}"
+  og:image:type: "{{ image.type }}"
+  og:image:width: "{{ image.width }}"
+  og:image:height: "{{ image.height }}"
+  og:url: "{{ page.canonical_url }}"
+
+  # Twitter
+  twitter:card: summary_large_image
+  twitter.title: *page_title_with_site_name
+  twitter:description: *page_description
+  twitter:image: "{{ image.url }}"
+
+# -----------------------------------------------------------------------------
+# Specification
+# -----------------------------------------------------------------------------
+
+# Card size and layers
+size: { width: 1200, height: 630 }
+layers:
+
+  # Background
+  - background:
+      color: *background_color
+
+  # Logo
+  - size: { width: 64, height: 64 }
+    offset: { x: 64, y: 64 }
+    background:
+      image: *logo
+
+  # Page title
+  - size: { width: 864, height: 256 }
+    offset: { x: 62, y: 192 }
+    typography:
+      content: *page_title
+      align: start
+      color: *color
+      line:
+        amount: 3
+        height: 1.5
+      font:
+        family: *title_font_family
+        style: Bold
+  
+  # Page description
+  - size: { width: 864, height: 192 }
+    offset: { x: 64, y: 320 }
+    typography:
+      content: *page_description
+      overflow: shrink
+      align: start
+      color: *color
+      line:
+        amount: 3
+        height: 1.5
+      font:
+        family: *font_family
+        style: Regular

config/layouts/page.yml

@@ -18,9 +18,7 @@ definitions:
     {{ layout.color or "#2d2d2d" }}
 
   - &title_font_family >-
-    {%- if page.is_homepage -%}
+    {%- if config.theme.language == "he" -%}
-      Bagnard
-    {%- elif config.theme.language == "he" -%}
       Suez One
     {%- elif config.theme.language == ("zh-Hant" or "ru") -%}
       Noto Serif TC
@@ -38,40 +36,19 @@ definitions:
     {%- endif -%}
 
   - &site_name >-
-    {%- if page.is_homepage -%}
+    {{ config.site_name }}
-    {%- else -%}
-      {{ config.site_name }}
-    {%- endif -%}
 
   - &page_title >-
-    {%- if page.is_homepage -%}
+    {{ page.meta.get("title", page.title) }}
-      Privacy Guides
-    {%- else -%}
-      {{ page.meta.get("title", page.title) }}
-    {%- endif -%}
 
   - &page_title_with_site_name >-
     {%- if page.meta.meta_title -%}
       {{ page.meta.meta_title }}
-    {%- elif not page.is_homepage -%}
-      {{ page.meta.get("title", page.title) }} - {{ config.site_name }}
     {%- else -%}
-      {{ page.meta.get("title", page.title) }}
+      {{ page.meta.get("title", page.title) }} - {{ config.site_name }}
     {%- endif -%}
 
   - &page_description >-
-    {%- if page.is_homepage -%}
-    {%- else -%}
-      {{ page.meta.get("description", config.site_description) or "" }}
-    {%- endif -%}
-  
-  - &homepage_description >-
-    {%- if page.is_homepage -%}
-      {{ config.extra.homepage_description or "A socially motivated website which provides information about protecting your online data privacy and security." }}
-    {%- else -%}
-    {%- endif -%}
-
-  - &og_description >-
     {{ page.meta.get("description", config.site_description) or "" }}
 
   - &page_icon >-
@@ -90,7 +67,7 @@ tags:
   # Open Graph
   og:type: website
   og:title: *page_title_with_site_name
-  og:description: *og_description
+  og:description: *page_description
   og:image: "{{ image.url }}"
   og:image:type: "{{ image.type }}"
   og:image:width: "{{ image.width }}"
@@ -166,18 +143,3 @@ layers:
       font:
         family: *font_family
         style: Regular
-  
-  # Homepage description
-  - size: { width: 864, height: 192 }
-    offset: { x: 64, y: 320 }
-    typography:
-      content: *homepage_description
-      overflow: shrink
-      align: start
-      color: *color
-      line:
-        amount: 3
-        height: 1.5
-      font:
-        family: *font_family
-        style: Regular

config/layouts/pride.yml

@@ -0,0 +1,137 @@
+definitions:
+
+  - &background_image >-
+    {%- if page.meta.cover -%}
+      theme/assets/img/cover/{{ page.meta.cover }}
+    {%- else -%}
+      {{ layout.background_image or "theme/assets/brand/PNG/Banner/cover-progress-notext-blur.png" }}
+    {%- endif -%}
+
+  - &background_color >-
+    #f7f7fcaa
+
+  - &color >-
+    {{ layout.color or "#2d2d2d" }}
+
+  - &title_font_family >-
+    {%- if config.theme.language == "he" -%}
+      Suez One
+    {%- elif config.theme.language == ("zh-Hant" or "ru") -%}
+      Noto Serif TC
+    {%- else -%}
+      Bagnard
+    {%- endif -%}
+
+  - &font_family >-
+    {%- if config.theme.language == "he" -%}
+      Suez One
+    {%- elif config.theme.language == ("zh-Hant" or "ru") -%}
+      Noto Sans TC
+    {%- else -%}
+      Public Sans
+    {%- endif -%}
+
+  - &site_name >-
+    {{ config.site_name }}
+
+  - &page_title >-
+    {{ page.meta.get("title", page.title) }}
+
+  - &page_title_with_site_name >-
+    {%- if page.meta.meta_title -%}
+      {{ page.meta.meta_title }}
+    {%- else -%}
+      {{ page.meta.get("title", page.title) }}
+    {%- endif -%}
+
+  - &page_description >-
+    {{ page.meta.get("description", config.site_description) or "" }}
+
+  - &page_icon >-
+    {{ page.meta.icon or "" }}
+
+  - &logo >-
+    theme/assets/brand/SVG/Logo/privacy-guides-logo-notext.svg
+
+# Meta tags
+tags:
+
+  # Open Graph
+  og:type: website
+  og:title: *page_title_with_site_name
+  og:description: *page_description
+  og:image: "{{ image.url }}"
+  og:image:type: "{{ image.type }}"
+  og:image:width: "{{ image.width }}"
+  og:image:height: "{{ image.height }}"
+  og:url: "{{ page.canonical_url }}"
+
+  # Twitter
+  twitter:card: summary_large_image
+  twitter.title: *page_title_with_site_name
+  twitter:description: *page_description
+  twitter:image: "{{ image.url }}"
+
+# -----------------------------------------------------------------------------
+# Specification
+# -----------------------------------------------------------------------------
+
+# Card size and layers
+size: { width: 1200, height: 630 }
+layers:
+
+  # Background
+  - background:
+      image: *background_image
+      color: *background_color
+
+  # Page icon
+  - size: { width: 630, height: 630 }
+    offset: { x: 570, y: 0 }
+    icon:
+      value: *page_icon
+      color: "#00000033"
+
+  # Logo
+  - size: { width: 64, height: 64 }
+    offset: { x: 64, y: 64 }
+    background:
+      image: *logo
+
+  # Site name
+  - size: { width: 768, height: 42 }
+    offset: { x: 160, y: 78 }
+    typography:
+      content: *site_name
+      color: *color
+      font:
+        family: Bagnard
+        style: Bold
+
+  # Page title
+  - size: { width: 864, height: 256 }
+    offset: { x: 62, y: 192 }
+    typography:
+      content: *page_title
+      align: start
+      color: *color
+      line:
+        amount: 3
+        height: 1.5
+      font:
+        family: *title_font_family
+        style: Bold
+
+  # Page description
+  - size: { width: 864, height: 96 }
+    offset: { x: 64, y: 480 }
+    typography:
+      content: *page_description
+      align: start
+      color: *color
+      line:
+        amount: 3
+        height: 1.5
+      font:
+        family: *font_family
+        style: Regular

config/mkdocs-common.yml

@@ -128,7 +128,8 @@ plugins:
     cards: !ENV [CARDS, true]
     cards_dir: assets/img/social
     cards_layout_dir: config/layouts
-    cards_layout: custom
+    cards_layout: page
+    # cards_layout: pride
 
 markdown_extensions:
   admonition: {}

docs/index.md

@@ -1,6 +1,8 @@
 ---
 meta_title: "Privacy Guides: Your Independent Privacy and Security Resource"
 template: overrides/home.en.html
+social:
+  cards_layout: home
 hide:
   - navigation
   - toc

modules/mkdocs-material

@@ -1 +1 @@
-Subproject commit 2ac6640830e9accfdd04ac568fa41996d6f99707
+Subproject commit afb31add19c8f7db162af1bea02395a8ea107b04