mirror of
https://github.com/tiennm99/HugoBlox-kit.git
synced 2026-10-12 14:14:48 +00:00
starters(blog): add content & upgrade
This commit is contained in:
1 parent
49690f2ae1
commit
f1c8e66988
17 files changed
+602
-37
No files matched your search
Vendored
+2
-2
@@ -1,2 +1,2 @@
|
||||
/*! tailwindcss v3.1.8 | MIT License | https://tailwindcss.com*/*,:after,:before{box-sizing:border-box;border:0 solid #e5e7eb}:after,:before{--tw-content:""}html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:initial}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;font-weight:inherit;line-height:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button;background-color:initial;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:initial}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@media (min-width:1536px){.container{max-width:1536px}}.prose{color:var(--tw-prose-body);max-width:65ch}.prose :where([class~=lead]):not(:where([class~=not-prose] *)){color:var(--tw-prose-lead);font-size:1.25em;line-height:1.6;margin-top:1.2em;margin-bottom:1.2em}.prose :where(a):not(:where([class~=not-prose] *)){color:var(--tw-prose-links);text-decoration:underline;font-weight:500}.prose :where(strong):not(:where([class~=not-prose] *)){color:var(--tw-prose-bold);font-weight:600}.prose :where(a strong):not(:where([class~=not-prose] *)){color:inherit}.prose :where(blockquote strong):not(:where([class~=not-prose] *)){color:inherit}.pLine truncated
|
||||
/*! Wowchemy Components | https://wowchemy.com */.page-wrapper{min-height:100vh;display:grid;grid-template-rows:auto 1fr auto;grid-template-columns:100%}.page-footer,.page-header{flex-shrink:0}.page-body{flex-grow:1}.article-header{position:relative;clear:both}.article-banner{width:100%;height:260px;-o-object-fit:cover;object-fit:cover}.featured-image-wrapper{position:relative;padding-left:0;padding-right:0}.featured-image{position:relative;width:100%;display:block;margin:0 auto}.article-header-caption{position:absolute;bottom:0;right:0;margin:0 auto;padding:2px 5px;color:#fff;font-size:.7em;background:#000;text-align:right;z-index:5;opacity:.65;border-radius:5px 0 0}@media (min-width:64em){.article-header-caption{padding:5px 10px}}.article-header-caption a{color:#fff;text-decoration:none}ul.task-list{list-style:none}ul.task-list li input[type=checkbox]{margin-right:.5rem}ul.task-list input[type=checkbox]:checked{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:1em;height:1em;border:none;background:initial;position:relative}ul.task-list input[type=checkbox]:not(:checked){width:.9em;height:.9em}ul.task-list input[type=checkbox]:checked:after{content:"✅"}.wg-about-avatar{#profile{text-align:center;padding:30px 10px;position:relative}.avatar{width:auto;height:auto;max-width:225px;max-height:225px;-o-object-fit:cover;object-fit:cover}.portrait-title h2{font-size:1.75em;font-weight:300;margin:20px 0 10px}.portrait-title h3{font-size:1rem;font-weight:300;margin:0 0 10px}.network-icon{display:inline-flex;flex-direction:row;flex-wrap:wrap;justify-content:center;list-style:none;padding:0;margin:0}#profile .network-icon{margin-top:.5rem}.network-icon li{margin-right:10px;@media (max-width:640px){margin-right:12px}}.network-icon li:last-of-type{margin-right:0}.network-icon li:hover{transform:scale(1.2)}.big-icon{font-size:2rem}.ul-interests li{font-size:.9rem}.ul-edu{list-style:none}.ul-edu li{position:relative;padding:0 15px 4px 3px}.ul-edu li .description p{margin:0}.ul-edu li .description p.course{font-size:.9rem}.ul-edu li .description p.institution{font-size:.75rem}.network-icon .big-icon{font-size:1.5rem}.dark .portrait-title h3{color:hsla(0,0%,100%,.9);font-weight:700}.dark .portrait-title h2{color:#fff;font-weight:700}.bio-text{max-width:680px}}.avatar-wrapper{position:relative;width:150px;height:150px;margin-left:auto;margin-right:auto}.avatar-emoji{position:absolute;width:40px;height:40px;line-height:40px;border-radius:100%;bottom:0;right:0;text-align:center;font-size:20px;background-color:#fff;color:#000;box-shadow:0 10px 20px rgb(0 0 0/4%),0 2px 6px rgb(0 0 0/4%),0 0 1px rgb(0 0 0/4%)}.dark .avatar-emoji{background-color:#000;box-shadow:0 10px 20px rgb(0 0 0/4%),0 2px 6px rgb(0 0 0/4%),0 0 1px hsla(0,0%,100%,.96)}.hover\:bg-gray-100:hover{--tw-bg-opacity:1;background-color:rgb(243 244 246/var(--tw-bg-opacity))}.hover\:text-neutral-700:hover{--tw-text-opacity:1;color:rgb(64 64 64/var(--tw-text-opacity))}.hover\:text-gray-800:hover{--tw-text-opacity:1;color:rgb(31 41 55/var(--tw-text-opacity))}.hover\:text-gray-900:hover{--tw-text-opacity:1;color:rgb(17 24 39/var(--tw-text-opacity))}.hover\:no-underline:hover{-webkit-text-decoration-line:none;text-decoration-line:none}.hover\:shadow-none:hover{--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.focus\:text-neutral-700:focus{--tw-text-opacity:1;color:rgb(64 64 64/var(--tw-text-opacity))}.focus\:no-underline:focus{-webkit-text-decoration-line:none;text-decoration-line:none}.focus\:shadow-none:focus{--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.focus\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}.focus\:ring-0:focus{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.dark .dark\:prose-invert{--tw-prose-body:var(--tw-prose-invert-body);--tw-prose-headings:var(--tw-prose-invert-headings);--tw-prose-lead:var(--tw-prose-invert-lead);--tw-prose-links:var(--tw-prose-invert-links);--tw-prose-bold:var(--tw-prose-invert-bold);--tw-prose-counters:var(--tw-prose-invert-counters);--tw-prose-bullets:var(--tw-prose-invert-bullets);--tw-prose-hr:var(--tw-prose-invert-hr);--tw-prose-quotes:var(--tw-prose-invert-quotes);--tw-prose-quote-borders:var(--tw-prose-invert-quote-borders);--tw-prose-captions:var(--tw-prose-invert-captions);--tw-prose-code:var(--tw-prose-invert-code);--tw-prose-pre-code:var(--tw-prose-invert-pre-code);--tw-prose-pre-bg:var(--tw-prose-invert-pre-bg);--tw-prose-th-borders:var(--tw-prose-invert-th-borders);--tw-prose-td-borders:var(--tw-prose-invert-td-borders)}.dark .darLine truncated
|
||||
/*! tailwindcss v3.3.5 | MIT License | https://tailwindcss.com*/*,:after,:before{-webkit-box-sizing:border-box;box-sizing:border-box;border:0 solid #e5e7eb}:after,:before{--tw-content:""}html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:Inter var,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;-webkit-font-feature-settings:normal;font-feature-settings:normal;font-variation-settings:normal}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:initial}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;-webkit-font-feature-settings:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button;background-color:initial;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:initial}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-webkit-input-placeholder,textarea::-webkit-input-placeholder{opacity:1;color:#9ca3af}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input:-ms-input-placeholder,textarea:-ms-input-placeholder{opacity:1;color:#9ca3af}input::-ms-input-placeholder,textarea::-ms-input-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]{display:none}*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#3b82f680;--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }::-ms-backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#3b82f680;--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;Line truncated
|
||||
/*! Wowchemy Components | https://wowchemy.com */.page-wrapper{min-height:100vh;display:grid;grid-template-rows:auto 1fr auto;grid-template-columns:100%}.page-footer,.page-header{-ms-flex-negative:0;flex-shrink:0}.page-body{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}.article-header{position:relative;clear:both}.article-banner{width:100%;height:260px;-o-object-fit:cover;object-fit:cover}.featured-image-wrapper{position:relative;padding-left:0;padding-right:0}.featured-image{position:relative;width:100%;display:block;margin:0 auto}.article-header-caption{position:absolute;bottom:0;right:0;margin:0 auto;padding:2px 5px;color:#fff;font-size:.7em;background:#000;text-align:right;z-index:5;opacity:.65;border-radius:5px 0 0}@media (min-width:64em){.article-header-caption{padding:5px 10px}}.article-header-caption a{color:#fff;text-decoration:none}ul.task-list{list-style:none}ul.task-list li input[type=checkbox]{margin-right:.5rem}ul.task-list input[type=checkbox]:checked{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:1em;height:1em;border:none;background:initial;position:relative}ul.task-list input[type=checkbox]:not(:checked){width:.9em;height:.9em}ul.task-list input[type=checkbox]:checked:after{content:"✅"}.highlight{position:relative;z-index:0}.highlight:hover>.copy-button{visibility:visible}.copy-button{visibility:hidden;position:absolute;right:0;top:0;z-index:10;width:5rem;cursor:pointer;white-space:nowrap;border-bottom-left-radius:.375rem;border-top-right-radius:.375rem;--tw-bg-opacity:1;background-color:rgba(var(--color-neutral-200),var(--tw-bg-opacity));padding-top:.25rem;padding-bottom:.25rem;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:.875rem;line-height:1.25rem;--tw-text-opacity:1;color:rgba(var(--color-neutral-700),var(--tw-text-opacity));opacity:.9}:is(.dark .copy-button){--tw-bg-opacity:1;background-color:rgba(var(--color-neutral-600),var(--tw-bg-opacity));--tw-text-opacity:1;color:rgba(var(--color-neutral-200),var(--tw-text-opacity))}.copy-button:active,.copy-button:active:hover,.copy-button:focus,.copy-button:hover{--tw-bg-opacity:1;background-color:rgba(var(--color-primary-100),var(--tw-bg-opacity))}:is(.dark .copy-button:active),:is(.dark .copy-button:active:hover),:is(.dark .copy-button:focus),:is(.dark .copy-button:hover){--tw-bg-opacity:1;background-color:rgba(var(--color-primary-600),var(--tw-bg-opacity))}.wg-about-avatar{#profile{text-align:center;padding:30px 10px;position:relative}.avatar{width:auto;height:auto;max-width:225px;max-height:225px;-o-object-fit:cover;object-fit:cover}.portrait-title h2{font-size:1.75em;font-weight:300;margin:20px 0 10px}.portrait-title h3{font-size:1rem;font-weight:300;margin:0 0 10px}.network-icon{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;list-style:none;padding:0;margin:0}#profile .network-icon{margin-top:.5rem}.network-icon li{margin-right:10px;@media (max-width:640px){margin-right:12px}}.network-icon li:last-of-type{margin-right:0}.network-icon li:hover{-webkit-transform:scale(1.2);transform:scale(1.2)}.big-icon{font-size:2rem}.ul-interests li{font-size:.9rem}.ul-edu{list-style:none}.ul-edu li{position:relative;padding:0 15px 4px 3px}.ul-edu li .description p{margin:0}.ul-edu li .description p.course{font-size:.9rem}.ul-edu li .description p.institution{font-size:.75rem}.network-icon .big-icon{font-size:1.5rem}.dark .portrait-title h3{color:#ffffffe6;font-weight:700}.dark .portrait-title h2{color:#fff;font-weight:700}.bio-text{max-width:680px}}.avatar-wrapper{position:relative;width:150px;height:150px;margin-left:auto;margin-right:auto}.avatar-emoji{position:absolute;width:40px;height:40px;line-height:40px;border-radius:100%;bottom:0;right:0;text-align:center;font-size:20px;background-color:#fff;color:#000;-webkit-box-shadow:0 10px 20px #0000000a,0 2px 6px #0000000a,0 0 1px #0000000a;box-shadow:0 10px 20px #0000000a,0 2px 6px #0000000a,0 0 1px #0000000a}.dark .avatar-emoji{background-color:#000;-webkit-box-shadow:0 10px 20px #0000000a,0 2px 6px #0000000a,0 0 1px #fffffff5;box-shadow:0 10px 20px #0000000a,0 2px 6px #0000000a,0 0 1px #fffffff5}:root{--color-neutral:255,255,255;--color-neutral-50:248,250,252;--color-neutral-100:241,245,249;--color-neutral-200:226,232,240;--color-neutral-300:203,213,225;--color-neutral-400:148,163,184;--color-neutral-500:100,116,139;--color-neutral-600:71,85,105;--color-neutral-700:51,65,85;--color-neutral-800:30,41,59;--color-neutral-900:15,23,42;--color-primary-50:239,246,255;--color-primary-100:219,234,254;--color-primary-200:191,219,254;--color-primary-300:147,197,253;--color-primary-400:96,165,250;--color-primary-500:59,130,246;--color-primary-600:37,99,235;--color-primary-700:29,78,216;--color-prLine truncated
|
||||
@@ -3,7 +3,7 @@
|
||||
# Hugo Documentation: https://gohugo.io/getting-started/configuration/#all-configuration-settings
|
||||
# This file is formatted using YAML syntax - learn more at https://learnxinyminutes.com/docs/yaml/
|
||||
|
||||
title: Minimal Hugo Blog Theme # Website name
|
||||
title: Scientific Blog (Hugo Theme) # Website name
|
||||
baseURL: 'https://example.com/' # Website URL
|
||||
|
||||
############################
|
||||
@@ -15,7 +15,7 @@ cascade:
|
||||
- _target:
|
||||
path: /post/**
|
||||
pager: true
|
||||
editable: true
|
||||
editable: false
|
||||
reading_time: true
|
||||
commentable: true
|
||||
show_related: true
|
||||
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 229 KiB |
@@ -0,0 +1,155 @@
|
||||
---
|
||||
title: 📈 Communicate your results effectively with the best data visualizations
|
||||
summary: Use popular tools such as Plotly, Mermaid, and data frames.
|
||||
date: 2023-10-25
|
||||
tags:
|
||||
- Hugo
|
||||
- Wowchemy
|
||||
- Markdown
|
||||
image:
|
||||
caption: 'Image credit: [**Unsplash**](https://unsplash.com)'
|
||||
---
|
||||
|
||||
Wowchemy is designed to give technical content creators a seamless experience. You can focus on the content and Wowchemy handles the rest.
|
||||
|
||||
Use popular tools such as Plotly, Mermaid, and data frames.
|
||||
|
||||
## Charts
|
||||
|
||||
Wowchemy supports the popular [Plotly](https://plot.ly/) format for interactive data visualizations. With Plotly, you can design almost any kind of visualization you can imagine!
|
||||
|
||||
Save your Plotly JSON in your page folder, for example `line-chart.json`, and then add the `{{</* chart data="line-chart" */>}}` shortcode where you would like the chart to appear.
|
||||
|
||||
Demo:
|
||||
|
||||
{{< chart data="line-chart" >}}
|
||||
|
||||
You might also find the [Plotly JSON Editor](http://plotly-json-editor.getforge.io/) useful.
|
||||
|
||||
## Diagrams
|
||||
|
||||
Wowchemy supports a Markdown extension for diagrams. You can enable this feature by toggling the `diagram` option in your `config/_default/params.toml` file or by adding `diagram: true` to your page front matter.
|
||||
|
||||
An example **flowchart**:
|
||||
|
||||
```mermaid
|
||||
graph TD
|
||||
A[Hard] -->|Text| B(Round)
|
||||
B --> C{Decision}
|
||||
C -->|One| D[Result 1]
|
||||
C -->|Two| E[Result 2]
|
||||
```
|
||||
|
||||
renders as
|
||||
|
||||
```mermaid
|
||||
graph TD
|
||||
A[Hard] -->|Text| B(Round)
|
||||
B --> C{Decision}
|
||||
C -->|One| D[Result 1]
|
||||
C -->|Two| E[Result 2]
|
||||
```
|
||||
|
||||
An example **sequence diagram**:
|
||||
|
||||
```mermaid
|
||||
sequenceDiagram
|
||||
Alice->>John: Hello John, how are you?
|
||||
loop Healthcheck
|
||||
John->>John: Fight against hypochondria
|
||||
end
|
||||
Note right of John: Rational thoughts!
|
||||
John-->>Alice: Great!
|
||||
John->>Bob: How about you?
|
||||
Bob-->>John: Jolly good!
|
||||
```
|
||||
|
||||
renders as
|
||||
|
||||
```mermaid
|
||||
sequenceDiagram
|
||||
Alice->>John: Hello John, how are you?
|
||||
loop Healthcheck
|
||||
John->>John: Fight against hypochondria
|
||||
end
|
||||
Note right of John: Rational thoughts!
|
||||
John-->>Alice: Great!
|
||||
John->>Bob: How about you?
|
||||
Bob-->>John: Jolly good!
|
||||
```
|
||||
|
||||
An example **class diagram**:
|
||||
|
||||
```mermaid
|
||||
classDiagram
|
||||
Class01 <|-- AveryLongClass : Cool
|
||||
Class03 *-- Class04
|
||||
Class05 o-- Class06
|
||||
Class07 .. Class08
|
||||
Class09 --> C2 : Where am i?
|
||||
Class09 --* C3
|
||||
Class09 --|> Class07
|
||||
Class07 : equals()
|
||||
Class07 : Object[] elementData
|
||||
Class01 : size()
|
||||
Class01 : int chimp
|
||||
Class01 : int gorilla
|
||||
Class08 <--> C2: Cool label
|
||||
```
|
||||
|
||||
renders as
|
||||
|
||||
```mermaid
|
||||
classDiagram
|
||||
Class01 <|-- AveryLongClass : Cool
|
||||
Class03 *-- Class04
|
||||
Class05 o-- Class06
|
||||
Class07 .. Class08
|
||||
Class09 --> C2 : Where am i?
|
||||
Class09 --* C3
|
||||
Class09 --|> Class07
|
||||
Class07 : equals()
|
||||
Class07 : Object[] elementData
|
||||
Class01 : size()
|
||||
Class01 : int chimp
|
||||
Class01 : int gorilla
|
||||
Class08 <--> C2: Cool label
|
||||
```
|
||||
|
||||
An example **state diagram**:
|
||||
|
||||
```mermaid
|
||||
stateDiagram
|
||||
[*] --> Still
|
||||
Still --> [*]
|
||||
Still --> Moving
|
||||
Moving --> Still
|
||||
Moving --> Crash
|
||||
Crash --> [*]
|
||||
```
|
||||
|
||||
renders as
|
||||
|
||||
```mermaid
|
||||
stateDiagram
|
||||
[*] --> Still
|
||||
Still --> [*]
|
||||
Still --> Moving
|
||||
Moving --> Still
|
||||
Moving --> Crash
|
||||
Crash --> [*]
|
||||
```
|
||||
|
||||
## Data Frames
|
||||
|
||||
Save your spreadsheet as a CSV file in your page's folder and then render it by adding the _Table_ shortcode to your page:
|
||||
|
||||
```go
|
||||
{{</* table path="results.csv" header="true" caption="Table 1: My results" */>}}
|
||||
```
|
||||
|
||||
renders as
|
||||
|
||||
{{< table path="results.csv" header="true" caption="Table 1: My results" >}}
|
||||
|
||||
## Did you find this page helpful? Consider sharing it 🙌
|
||||
@@ -0,0 +1,71 @@
|
||||
{
|
||||
"data": [
|
||||
{
|
||||
"uid": "babced",
|
||||
"fill": "tonexty",
|
||||
"mode": "none",
|
||||
"name": "Col2",
|
||||
"type": "scatter",
|
||||
"x": [
|
||||
"2000-01-01",
|
||||
"2001-01-01",
|
||||
"2002-01-01",
|
||||
"2003-01-01",
|
||||
"2004-01-01",
|
||||
"2005-01-01",
|
||||
"2006-01-01",
|
||||
"2007-01-01",
|
||||
"2008-01-01",
|
||||
"2009-01-01",
|
||||
"2010-01-01",
|
||||
"2011-01-01",
|
||||
"2012-01-01",
|
||||
"2013-01-01",
|
||||
"2014-01-01",
|
||||
"2015-01-01",
|
||||
"2016-01-01"
|
||||
],
|
||||
"y": [
|
||||
"17087182",
|
||||
"29354370",
|
||||
"38760373",
|
||||
"40912332",
|
||||
"51611646",
|
||||
"64780617",
|
||||
"85507314",
|
||||
"121892559",
|
||||
"172338726",
|
||||
"238027855",
|
||||
"206956723",
|
||||
"346004403",
|
||||
"697089489",
|
||||
"672985183",
|
||||
"968882453",
|
||||
"863105652",
|
||||
"1068513050"
|
||||
],
|
||||
"fillcolor": "rgb(224, 102, 102)"
|
||||
}
|
||||
],
|
||||
"layout": {
|
||||
"title": "Total Number of Websites",
|
||||
"width": 800,
|
||||
"xaxis": {
|
||||
"type": "date",
|
||||
"range": [946702800000, 1451624400000],
|
||||
"title": "Source: <a href=\"http://www.scribblrs.com/\">Scribblrs</a><br>Source: <a href=\"http://www.internetlivestats.com/total-number-of-websites/\">Internet Live Stats</a>",
|
||||
"showgrid": false,
|
||||
"autorange": true,
|
||||
"tickformat": "%Y"
|
||||
},
|
||||
"yaxis": {
|
||||
"type": "linear",
|
||||
"range": [0, 1124750578.9473684],
|
||||
"title": "",
|
||||
"autorange": true
|
||||
},
|
||||
"height": 500,
|
||||
"autosize": false
|
||||
},
|
||||
"frames": []
|
||||
}
|
||||
File renamed without changes.
|
500 Internal Server Error
An error occurred: An error occurred Gitea Version: 28.1.0 |