diff --git a/assets/css/compiled/main.css b/assets/css/compiled/main.css index 1c72b68c..05fef631 100644 --- a/assets/css/compiled/main.css +++ b/assets/css/compiled/main.css @@ -1510,18 +1510,14 @@ select { margin-top: 1.25rem; } -.mt-2\.5 { - margin-top: 0.625rem; +.mt-1 { + margin-top: 0.25rem; } .mb-6 { margin-bottom: 1.5rem; } -.mt-2 { - margin-top: 0.5rem; -} - .mt-3 { margin-top: 0.75rem; } @@ -1594,10 +1590,6 @@ select { margin-bottom: 0px; } -.mt-1 { - margin-top: 0.25rem; -} - .mb-\[2px\] { margin-bottom: 2px; } @@ -1638,12 +1630,16 @@ select { height: 6rem; } +.h-8 { + height: 2rem; +} + .h-36 { height: 9rem; } -.h-8 { - height: 2rem; +.h-\[400px\] { + height: 400px; } .h-48 { @@ -1654,6 +1650,38 @@ select { height: 50%; } +.h-\[350px\] { + height: 350px; +} + +.h-\[350vh\] { + height: 350vh; +} + +.h-\[10vh\] { + height: 10vh; +} + +.h-\[100vh\] { + height: 100vh; +} + +.h-\[20vh\] { + height: 20vh; +} + +.h-\[30vh\] { + height: 30vh; +} + +.h-\[35vh\] { + height: 35vh; +} + +.h-\[45vh\] { + height: 45vh; +} + .max-h-\[5rem\] { max-height: 5rem; } @@ -1955,6 +1983,10 @@ select { background-color: rgba(var(--color-neutral-100), 0.5); } +.bg-gradient-to-t { + background-image: linear-gradient(to top, var(--tw-gradient-stops)); +} + .bg-gradient-to-b { background-image: linear-gradient(to bottom, var(--tw-gradient-stops)); } @@ -1963,12 +1995,22 @@ select { background-image: linear-gradient(to right, var(--tw-gradient-stops)); } +.from-neutral { + --tw-gradient-from: rgba(var(--color-neutral), 1); + --tw-gradient-to: rgba(var(--color-neutral), 0); + --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); +} + .from-primary-500 { --tw-gradient-from: rgba(var(--color-primary-500), 1); --tw-gradient-to: rgba(var(--color-primary-500), 0); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); } +.to-transparent { + --tw-gradient-to: transparent; +} + .to-secondary-700 { --tw-gradient-to: rgba(var(--color-secondary-700), 1); } @@ -2281,6 +2323,10 @@ select { opacity: 0; } +.mix-blend-normal { + mix-blend-mode: normal; +} + .mix-blend-multiply { mix-blend-mode: multiply; } @@ -2992,12 +3038,32 @@ body:has(#menu-controller:checked) { background-position:center; } -.single_hero { +.single_hero_basic { background-repeat:no-repeat; background-size:cover; background-position:center; } +.single_hero_round { + max-height: 50vh; + -o-object-fit: cover; + object-fit: cover; +} + +.single_hero_background { + background-repeat:no-repeat; + background-size:cover; + background-position:center; + width: calc(100% + 40px); + z-index: -10; + margin-left: -20px; +} + +.hero_gradient { + width: 100%; + height: 100%; +} + .thumbnailshadow { box-shadow: 5px 5px 20px 1px rgba(0, 0, 0, 0.3); } @@ -3352,6 +3418,12 @@ body:has(#menu-controller:checked) { background-color: rgba(var(--color-primary-800), var(--tw-bg-opacity)); } +.dark .dark\:from-neutral-800 { + --tw-gradient-from: rgba(var(--color-neutral-800), 1); + --tw-gradient-to: rgba(var(--color-neutral-800), 0); + --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); +} + .dark .dark\:from-primary-600 { --tw-gradient-from: rgba(var(--color-primary-600), 1); --tw-gradient-to: rgba(var(--color-primary-600), 0); @@ -3547,6 +3619,30 @@ body:has(#menu-controller:checked) { height: 14rem; } + .md\:h-\[1000px\] { + height: 1000px; + } + + .md\:h-\[500px\] { + height: 500px; + } + + .md\:h-\[500vh\] { + height: 500vh; + } + + .md\:h-\[10vh\] { + height: 10vh; + } + + .md\:h-\[35vh\] { + height: 35vh; + } + + .md\:h-\[45vh\] { + height: 45vh; + } + .md\:w-1\/3 { width: 33.333333%; } @@ -3629,10 +3725,58 @@ body:has(#menu-controller:checked) { height: 18rem; } + .lg\:h-\[500px\] { + height: 500px; + } + .lg\:h-full { height: 100%; } + .lg\:h-\[1000px\] { + height: 1000px; + } + + .lg\:h-\[100px\] { + height: 100px; + } + + .lg\:h-\[1000vh\] { + height: 1000vh; + } + + .lg\:h-\[100vh\] { + height: 100vh; + } + + .lg\:h-\[10vh\] { + height: 10vh; + } + + .lg\:h-\[50vh\] { + height: 50vh; + } + + .lg\:h-\[40vh\] { + height: 40vh; + } + + .lg\:h-\[45vh\] { + height: 45vh; + } + + .lg\:h-\[60vh\] { + height: 60vh; + } + + .lg\:h-\[55vh\] { + height: 55vh; + } + + .lg\:h-\[35vh\] { + height: 35vh; + } + .lg\:w-1\/4 { width: 25%; } diff --git a/assets/css/main.css b/assets/css/main.css index 48367249..d908ed23 100644 --- a/assets/css/main.css +++ b/assets/css/main.css @@ -347,12 +347,31 @@ body:has(#menu-controller:checked) { background-position:center; } -.single_hero { +.single_hero_basic { background-repeat:no-repeat; background-size:cover; background-position:center; } +.single_hero_round { + max-height: 50vh; + object-fit: cover; +} + +.single_hero_background { + background-repeat:no-repeat; + background-size:cover; + background-position:center; + width: calc(100% + 40px); + z-index: -10; + margin-left: -20px; +} + +.hero_gradient { + width: 100%; + height: 100%; +} + .thumbnailshadow { box-shadow: 5px 5px 20px 1px rgba(0, 0, 0, 0.3); } diff --git a/assets/js/appearance.js b/assets/js/appearance.js index e6254d89..af3e41b9 100644 --- a/assets/js/appearance.js +++ b/assets/js/appearance.js @@ -52,4 +52,4 @@ window.addEventListener("DOMContentLoaded", (event) => { localStorage.removeItem("appearance"); }); } -}); +}); \ No newline at end of file diff --git a/config/_default/params.toml b/config/_default/params.toml index 979fbc83..6f991981 100644 --- a/config/_default/params.toml +++ b/config/_default/params.toml @@ -36,6 +36,7 @@ enableCodeCopy = true showDateUpdated = false showAuthor = true showHero = true + heroStyle = "basic" # valid options: basic, big, background showBreadcrumbs = true showDraftLabel = true showEdit = true diff --git a/exampleSite/config/_default/params.toml b/exampleSite/config/_default/params.toml index c5467e4e..6b673a19 100644 --- a/exampleSite/config/_default/params.toml +++ b/exampleSite/config/_default/params.toml @@ -36,6 +36,7 @@ mainSections = ["docs"] showDateUpdated = false showAuthor = true showHero = true + heroStyle = "background" # valid options: basic, big, background showBreadcrumbs = true showDraftLabel = true showEdit = true diff --git a/exampleSite/content/docs/configuration/index.md b/exampleSite/content/docs/configuration/index.md index fd44bc54..c027a310 100644 --- a/exampleSite/content/docs/configuration/index.md +++ b/exampleSite/content/docs/configuration/index.md @@ -146,6 +146,7 @@ Many of the article defaults here can be overridden on a per article basis by sp |`article.showDateUpdated`|`false`|Whether or not the dates articles were updated are displayed.| |`article.showAuthor`|`true`|Whether or not the author box is displayed in the article footer.| |`article.showHero`|`true`|Whether the thumbnail image will be shown as a hero image within each article page.| +|`heroStyle`|`basic`|Style to display the hero image, valid options are: `basic`, `big`, `background`.| |`article.showBreadcrumbs`|`false`|Whether or not breadcrumbs are displayed in the article header.| |`article.showDraftLabel`|`true`|Whether or not the draft indicator is shown next to articles when site is built with `--buildDrafts`.| |`article.showEdit`|`false`|Whether or not the link to edit the article content should be displayed.| diff --git a/exampleSite/content/docs/front-matter/index.md b/exampleSite/content/docs/front-matter/index.md index dad157da..2b3502d1 100644 --- a/exampleSite/content/docs/front-matter/index.md +++ b/exampleSite/content/docs/front-matter/index.md @@ -27,6 +27,7 @@ Front matter parameter default values are inherited from the theme's [base confi |`authors`|_Not set_|Array of values for authors, if set it overrides `showAuthor` settings for page or site. Used on the multiple authors feature, check [this page]({{< ref "multi-author" >}}) for more details on how to configure that feature.| |`showAuthorsBadges`|`article.showAuthorsBadges`|Whether the `authors` taxonomies are are displayed in the article or list header. This requires the setup of `multiple authors` and the `authors` taxonomy. Check [this page]({{< ref "multi-author" >}}) for more details on how to configure that feature.| |`showHero`|`article.showHero`|Whether the thumbnail image will be shown as a hero image within the article page.| +|`heroStyle`|`article.heroStyle`|Style to display the hero image, valid options are: `basic`, `big`, `background`.| |`showBreadcrumbs`|`article.showBreadcrumbs` or `list.showBreadcrumbs`|Whether the breadcrumbs are displayed in the article or list header.| |`showDate`|`article.showDate`|Whether or not the article date is displayed. The date is set using the `date` parameter.| |`showDateUpdated`|`article.showDateUpdated`|Whether or not the date the article was updated is displayed. The date is set using the `lastmod` parameter.| diff --git a/exampleSite/resources/_gen/images/docs/advanced-customisation/featured_huc648350f543f5a6da75f60f86e4aecc9_625096_1200x0_resize_box_3.png b/exampleSite/resources/_gen/images/docs/advanced-customisation/featured_huc648350f543f5a6da75f60f86e4aecc9_625096_1200x0_resize_box_3.png new file mode 100644 index 00000000..1675d73b Binary files /dev/null and b/exampleSite/resources/_gen/images/docs/advanced-customisation/featured_huc648350f543f5a6da75f60f86e4aecc9_625096_1200x0_resize_box_3.png differ diff --git a/exampleSite/resources/_gen/images/docs/configuration/featured_hu61945c9a50a7e783444cb54fb71dc68a_650977_1200x0_resize_box_3.png b/exampleSite/resources/_gen/images/docs/configuration/featured_hu61945c9a50a7e783444cb54fb71dc68a_650977_1200x0_resize_box_3.png new file mode 100644 index 00000000..5a6e38bc Binary files /dev/null and b/exampleSite/resources/_gen/images/docs/configuration/featured_hu61945c9a50a7e783444cb54fb71dc68a_650977_1200x0_resize_box_3.png differ diff --git a/exampleSite/resources/_gen/images/docs/content-examples/featured_hua9cafb9ef9e179b71d05f85e3ab9080d_648770_1200x0_resize_box_3.png b/exampleSite/resources/_gen/images/docs/content-examples/featured_hua9cafb9ef9e179b71d05f85e3ab9080d_648770_1200x0_resize_box_3.png new file mode 100644 index 00000000..2082fad1 Binary files /dev/null and b/exampleSite/resources/_gen/images/docs/content-examples/featured_hua9cafb9ef9e179b71d05f85e3ab9080d_648770_1200x0_resize_box_3.png differ diff --git a/exampleSite/resources/_gen/images/docs/firebase-views/featured_hu893b4009285a3fc236e74f3cf6b73d3e_4462659_1200x0_resize_box_3.png b/exampleSite/resources/_gen/images/docs/firebase-views/featured_hu893b4009285a3fc236e74f3cf6b73d3e_4462659_1200x0_resize_box_3.png new file mode 100644 index 00000000..0f32efb0 Binary files /dev/null and b/exampleSite/resources/_gen/images/docs/firebase-views/featured_hu893b4009285a3fc236e74f3cf6b73d3e_4462659_1200x0_resize_box_3.png differ diff --git a/exampleSite/resources/_gen/images/docs/front-matter/featured_hu2d8098f125aeb5b866c985ce18317fa7_5037509_1200x0_resize_box_3.png b/exampleSite/resources/_gen/images/docs/front-matter/featured_hu2d8098f125aeb5b866c985ce18317fa7_5037509_1200x0_resize_box_3.png new file mode 100644 index 00000000..69c373f0 Binary files /dev/null and b/exampleSite/resources/_gen/images/docs/front-matter/featured_hu2d8098f125aeb5b866c985ce18317fa7_5037509_1200x0_resize_box_3.png differ diff --git a/exampleSite/resources/_gen/images/docs/getting-started/featured_hu7b932db01f62f5127910b65e3cd14f9d_599809_1200x0_resize_box_3.png b/exampleSite/resources/_gen/images/docs/getting-started/featured_hu7b932db01f62f5127910b65e3cd14f9d_599809_1200x0_resize_box_3.png new file mode 100644 index 00000000..6cca63b6 Binary files /dev/null and b/exampleSite/resources/_gen/images/docs/getting-started/featured_hu7b932db01f62f5127910b65e3cd14f9d_599809_1200x0_resize_box_3.png differ diff --git a/exampleSite/resources/_gen/images/docs/homepage-layout/featured_hu2b64bd3fbe5e1f5f3d9d27abc9d45f1e_648252_1200x0_resize_box_3.png b/exampleSite/resources/_gen/images/docs/homepage-layout/featured_hu2b64bd3fbe5e1f5f3d9d27abc9d45f1e_648252_1200x0_resize_box_3.png new file mode 100644 index 00000000..6a37587a Binary files /dev/null and b/exampleSite/resources/_gen/images/docs/homepage-layout/featured_hu2b64bd3fbe5e1f5f3d9d27abc9d45f1e_648252_1200x0_resize_box_3.png differ diff --git a/exampleSite/resources/_gen/images/docs/hosting-deployment/featured_hu64bf821b067f4f95fc394dc0a744aa3f_4868715_1200x0_resize_box_3.png b/exampleSite/resources/_gen/images/docs/hosting-deployment/featured_hu64bf821b067f4f95fc394dc0a744aa3f_4868715_1200x0_resize_box_3.png new file mode 100644 index 00000000..480c1889 Binary files /dev/null and b/exampleSite/resources/_gen/images/docs/hosting-deployment/featured_hu64bf821b067f4f95fc394dc0a744aa3f_4868715_1200x0_resize_box_3.png differ diff --git a/exampleSite/resources/_gen/images/docs/installation/featured_hua34c938079c0c05729a2a4d4783f7807_634706_1200x0_resize_box_3.png b/exampleSite/resources/_gen/images/docs/installation/featured_hua34c938079c0c05729a2a4d4783f7807_634706_1200x0_resize_box_3.png new file mode 100644 index 00000000..975ebc65 Binary files /dev/null and b/exampleSite/resources/_gen/images/docs/installation/featured_hua34c938079c0c05729a2a4d4783f7807_634706_1200x0_resize_box_3.png differ diff --git a/exampleSite/resources/_gen/images/docs/multi-author/featured_hub711b3bcf9ec72021fe99f7bb1f650e4_637127_1200x0_resize_box_3.png b/exampleSite/resources/_gen/images/docs/multi-author/featured_hub711b3bcf9ec72021fe99f7bb1f650e4_637127_1200x0_resize_box_3.png new file mode 100644 index 00000000..6d5f37eb Binary files /dev/null and b/exampleSite/resources/_gen/images/docs/multi-author/featured_hub711b3bcf9ec72021fe99f7bb1f650e4_637127_1200x0_resize_box_3.png differ diff --git a/exampleSite/resources/_gen/images/docs/partials/featured_hue41d16dad4a5698d84d57019e7c71ba2_674943_1200x0_resize_box_3.png b/exampleSite/resources/_gen/images/docs/partials/featured_hue41d16dad4a5698d84d57019e7c71ba2_674943_1200x0_resize_box_3.png new file mode 100644 index 00000000..bce65da0 Binary files /dev/null and b/exampleSite/resources/_gen/images/docs/partials/featured_hue41d16dad4a5698d84d57019e7c71ba2_674943_1200x0_resize_box_3.png differ diff --git a/exampleSite/resources/_gen/images/docs/shortcodes/featured_huccf4470440ae6b15644c014dfa031fdc_4868633_1200x0_resize_box_3.png b/exampleSite/resources/_gen/images/docs/shortcodes/featured_huccf4470440ae6b15644c014dfa031fdc_4868633_1200x0_resize_box_3.png new file mode 100644 index 00000000..099535b1 Binary files /dev/null and b/exampleSite/resources/_gen/images/docs/shortcodes/featured_huccf4470440ae6b15644c014dfa031fdc_4868633_1200x0_resize_box_3.png differ diff --git a/exampleSite/resources/_gen/images/docs/thumbnails/featured_hu93f196360c2371d7e9554814ee21804a_5014315_1200x0_resize_box_3.png b/exampleSite/resources/_gen/images/docs/thumbnails/featured_hu93f196360c2371d7e9554814ee21804a_5014315_1200x0_resize_box_3.png new file mode 100644 index 00000000..470f1e15 Binary files /dev/null and b/exampleSite/resources/_gen/images/docs/thumbnails/featured_hu93f196360c2371d7e9554814ee21804a_5014315_1200x0_resize_box_3.png differ diff --git a/layouts/_default/single.html b/layouts/_default/single.html index fb2cbd65..8b5457db 100644 --- a/layouts/_default/single.html +++ b/layouts/_default/single.html @@ -1,7 +1,14 @@ {{ define "main" }}
- {{ partial "hero.html" . }} -
+ {{ if .Params.showHero | default (.Site.Params.article.showHero | default false) }} + {{ $heroStyle := print "partials/hero/" .Site.Params.article.heroStyle ".html" }} + {{ if templates.Exists $heroStyle }} + {{ partial $heroStyle . }} + {{ else }} + {{ partial "partials/hero/basic.html" . }} + {{ end }} + {{- end -}} +
{{ if .Params.showBreadcrumbs | default (.Site.Params.article.showBreadcrumbs | default false) }} {{ partial "breadcrumbs.html" . }} {{ end }} @@ -136,6 +143,15 @@ remove_like_article(id_likes) } } + + var header = document.getElementById("single_header") + var style = getComputedStyle(header); + console.log(style, style.height) + var margin = '-'+ (parseInt(style.height) + parseInt(style.marginTop) + parseInt(style.marginBottom) + 20) + 'px' + console.log(margin) + var hero = document.getElementById('hero') + if(hero) + hero.style["margin-bottom"] = margin;