diff --git a/.gitignore b/.gitignore index 0c14a96..dbd746b 100644 --- a/.gitignore +++ b/.gitignore @@ -14,4 +14,5 @@ resources jsconfig.json hugo_stats.json go.sum -yarn.lock \ No newline at end of file +yarn.lock +.vscode/ \ No newline at end of file diff --git a/assets/images/hmc_landing_bg.webp b/assets/images/hmc_landing_bg.webp new file mode 100644 index 0000000..d251653 Binary files /dev/null and b/assets/images/hmc_landing_bg.webp differ diff --git a/assets/images/jangafx.png b/assets/images/jangafx.png new file mode 100644 index 0000000..2486c9d Binary files /dev/null and b/assets/images/jangafx.png differ diff --git a/assets/images/mozilla.png b/assets/images/mozilla.png new file mode 100644 index 0000000..5635997 Binary files /dev/null and b/assets/images/mozilla.png differ diff --git a/assets/images/people/devon.jpg b/assets/images/people/devon.jpg new file mode 100644 index 0000000..7505994 Binary files /dev/null and b/assets/images/people/devon.jpg differ diff --git a/assets/images/people/morgan-scaled.jpeg b/assets/images/people/morgan-scaled.jpeg new file mode 100644 index 0000000..c68ff73 Binary files /dev/null and b/assets/images/people/morgan-scaled.jpeg differ diff --git a/assets/images/people/phil_homan.jpg b/assets/images/people/phil_homan.jpg new file mode 100644 index 0000000..ec3f5e9 Binary files /dev/null and b/assets/images/people/phil_homan.jpg differ diff --git a/assets/images/pontoco_logo.png b/assets/images/pontoco_logo.png new file mode 100644 index 0000000..ad43180 Binary files /dev/null and b/assets/images/pontoco_logo.png differ diff --git a/assets/images/starry_night.png b/assets/images/starry_night.png new file mode 100644 index 0000000..37c02a9 Binary files /dev/null and b/assets/images/starry_night.png differ diff --git a/assets/images/tf.png b/assets/images/tf.png new file mode 100644 index 0000000..d437985 Binary files /dev/null and b/assets/images/tf.png differ diff --git a/assets/images/transition.svg b/assets/images/transition.svg new file mode 100644 index 0000000..2cda1f9 --- /dev/null +++ b/assets/images/transition.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/assets/js/main.js b/assets/js/main.js index 3b3e302..1a8d6d1 100644 --- a/assets/js/main.js +++ b/assets/js/main.js @@ -33,4 +33,34 @@ }, }, }); + + + // Swipers + // ---------------------------------------- + const swipers = document.querySelectorAll(".swiper-slider"); + + swipers.forEach((swiper) => { + console.log("ayy"); + new Swiper(swiper, { + spaceBetween: 24, + loop: true, + pagination: { + el: swiper.querySelector(".swiper-slider-pagination"), + type: "bullets", + clickable: true, + }, + navigation: { + nextEl: swiper.querySelector(".swiper-button-next"), + prevEl: swiper.querySelector(".swiper-button-prev"), + }, + breakpoints: { + 768: { + slidesPerView: 2, + }, + 992: { + slidesPerView: 3, + }, + }, + }); + }); })(); diff --git a/assets/scss/custom.scss b/assets/scss/custom.scss index aa6964e..1cc68f3 100644 --- a/assets/scss/custom.scss +++ b/assets/scss/custom.scss @@ -7,7 +7,6 @@ color: #20CCF8; } - .boston-bg { background-color: #20CCF8; } diff --git a/config/_default/params.toml b/config/_default/params.toml index 5bb6811..599f99a 100644 --- a/config/_default/params.toml +++ b/config/_default/params.toml @@ -2,8 +2,8 @@ # favicon module: https://github.com/gethugothemes/hugo-modules/tree/master/images#favicon-implementation favicon = "images/hmc_favicon.png" # logo module: https://github.com/gethugothemes/hugo-modules/tree/master/images#logo-implementation -logo = "images/logo.png" -logo_darkmode = "images/logo-darkmode.png" +logo = "images/cities-light-mode.svg" +logo_darkmode = "images/cities-dark-mode.svg" # use `px` or `x` with logo_width, example: "100px". # Note: logo_width is not work with .svg file logo_width = "120px" @@ -18,7 +18,7 @@ navbar_fixed = true theme_switcher = true theme_default = "system" # available options [light/dark/system] # Main Sections -mainSections = ["blog"] +mainSections = ["news"] # contact form action contact_form_action = "#" # contact form works with [https://airform.io/] or [https://formspree.io] # google tag manager, see https://developers.google.com/tag-manager/ @@ -46,7 +46,7 @@ link = "tickets" [search] enable = true primary_color = "#121212" -include_sections = ["blog"] +include_sections = ["news"] show_image = true show_description = true show_tags = true diff --git a/content/english/_index.md b/content/english/_index.md index 1a7bacd..2fcd98b 100644 --- a/content/english/_index.md +++ b/content/english/_index.md @@ -40,25 +40,56 @@ features: - title: "Inspired by Handmade Hero" image: "" side: "center" + bg_img: + parallax: true + img: "/images/test_bg.jpg" + transition: + start: "/images/transition2.svg" + start_class: "mb-5" + start_color: "#fff" + start_dark: "/images/transition2.svg" + start_dark_color: "#150e31" + end: "/images/transition.svg" + end_class: "mt-20 transform -scale-y-100 -scale-x-100" + end_color: "#fff" + end_dark: "/images/transition2.svg" + end_dark_color: "#150e31" + bg_color: "#0a0a0a" content: "Like [Handmade Hero]() by Molly Rocket, we belive in breaking software down to the bare bones and building back an understanding of how it all really works. _We are not affiliated with Molly Rocket, Inc._" + content_class: "text-white mt-12" + title_class: "text-white" button: enable: enable + class: "meetups-bg dark:meetups-bg" label: "About Us" link: "/about" - - title: "Discover the Key Features Of Hugo" - image: "/images/service-2.png" - content: "Hugo is an all-in-one web framework for building fast, content-focused websites. It offers a range of exciting features for developers and website creators. Some of the key features are:" - bulletpoints: - - "Zero JS, by default: No JavaScript runtime overhead to slow you down." - - "Customizable: Tailwind, MDX, and 100+ other integrations to choose from." - - "UI-agnostic: Supports React, Preact, Svelte, Vue, Solid, Lit and more." + - title: "Companies Value Handmade" + title_class: "text-center" + image: "" + side: "center" + swiper: + show_buttons: false + slides: + - name: "JangaFX" + icon: "/images/jangafx.png" + link: "https://tek256.com" + - name: "Pontoco" + icon: "/images/pontoco_logo.png" + link: "https://tek256.com" + - name: "Mozilla" + icon: "/images/mozilla.png" + link: "https://tek256.com" + - name: "TestFit" + icon: "/images/tf.png" + link: "https://tek256.com" button: - enable: true - label: "Get Started Now" - link: "https://github.com/zeon-studio/hugoplate" + enable: false - title: "The Top Reasons to Choose Hugo for Your Hugo Project" + bg_img: + parallax: false + img: "/images/hmc_landing_bg.webp" image: "/images/service-3.png" content: "With Hugo, you can build modern and content-focused websites without sacrificing performance or ease of use." bulletpoints: diff --git a/content/english/about/_index.md b/content/english/about/_index.md deleted file mode 100644 index 78fb9cf..0000000 --- a/content/english/about/_index.md +++ /dev/null @@ -1,9 +0,0 @@ ---- -title: "About Handmade Cities" -meta_title: "About" -description: "this is meta description" -image: "" -draft: false ---- - -Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis illum nesciunt commodi vel nisi ut alias excepturi ipsum, totam, labore tempora, odit ex iste tempore sed. Fugit voluptatibus perspiciatis assumenda nulla ad nihil, omnis vel, doloremque sit quam autem optio maiores, illum eius facilis et quo consectetur provident dolor similique! Enim voluptatem dicta expedita veritatis repellat dolorum impedit, provident quasi at. diff --git a/content/english/about/index.md b/content/english/about/index.md new file mode 100644 index 0000000..8f0eb18 --- /dev/null +++ b/content/english/about/index.md @@ -0,0 +1,71 @@ +--- +title: "About Handmade Cities" +meta_title: "About" +layout: "about" +description: "About Handmade Cities" +draft: false + +features: + - title: "About Handmade Cities" + title_class: "text-center text-white" + image: "" + side: "center" + bg_img: + parallax: true + img: "/images/starry_night.png" + grid: + - title: "Sponsor-free tech events" + content: "We reject sponsorship deals because we must be allowed to criticize anyone’s software. Accepting “free” bags of money destroys our ability to change the industry." + color: "#FC6D36" + content_class: "text-white" + - title: "An obligation to software quality" + content: "The industry’s incentives are about imposing control and fleecing customers. We’ve abandoned the user’s quality of experience, agency over their software, and privacy." + color: "#A456EA" + content_class: "text-white" + - title: "Self-host wherever possible" + content: "Anything essential to our conferences is processed in-house. E.g. When you register for an event we personally handle the process to generate your ticket—removing spying middlemen like Ticketmaster." + color: "#6B8EE8" + content_class: "text-white" + - title: "Healthy expansion" + content: "As a [polyglot](https://vimeo.com/661662233), our founder intends to expand even outside the United States. Since we wish to retain independence, however, we’re only growing through increased audience support." + color: "#60E3C4" + content_class: "text-white" + + - title: "Abner Coimbre" + title_class: "text-white" + subtitle: "Founder" + subtitle_class: "text-[#F7CE3B]" + image: "/images/people/abner_2022.png" # Only keep one image line + bg_color: "#060610" + content_class: "text-white" + content: "[Abner](https://abnercoimbre.com) is the founder of Handmade Cities and sole organizer for our conferences.
His professional story began when he left Puerto Rico for a yearlong internship at NASA. Abner was mentored on how they make software and after winning NASA’s Intern of the Year, he published an essay on their programming philosophy ([featured](https://observer.com/2017/07/a-look-into-nasa-coding-philosophy-kennedy-space-center-programming/) in the news.) He was promoted to launch control engineers.

Abner also started the [Handmade Network](https://handmade.network/), an online community learning to make quality software. He went on to work for Jonathan Blow multiple years and then Cyan Worlds to help ship the [Myst remake](https://store.steampowered.com/app/1255560/Myst/).

His concern of declining standards—both ethical and technical—pushed Abner to run tech conferences full-time, with ironclad conviction that we need independent organizers more than ever." + + - title: "Morgan Rammell" + title_class: "text-white" + subtitle: "Event Coordinator" + subtitle_class: "text-[#F7CE3B]" + bg_color: "#060610" + image: "/images/people/morgan-scaled.jpeg" + content_class: "text-white" + content: "Morgan’s done corporate event planning for several years but is now interested in the indie space. She oversees the logistics of running and facilitating Handmade conferences, working with the venue to solve any issues that arise in real-time.
+ + Born and raised in Washington state you’ll find Morgan snowboarding, hiking, camping, and even rock-climbing!" + - title: "Phil Homan" + title_class: "text-white" + subtitle: "Technical Producer" + subtitle_class: "text-[#F7CE3B]" + bg_color: "#060610" + image: "/images/people/phil_homan.jpg" + content_class: "text-white" + content: "Phil Homan, who goes by [PH Test](https://phtest.tv/), is a Seattle developer with a knack for multidisciplinary work: live-performance visuals, experimental programs, games, and video production—often with tools he made himself!
+ + Phil joined Handmade Cities to help Abner with matters related to streaming, recording, and A/V support at the conferences." + - title: "Devon (tek256)" + title_class: "text-white" + subtitle: "Editor" + subtitle_class: "text-[#F7CE3B]" + bg_color: "#060610" + image: "/images/people/devon.jpg" + content_class: "text-white" + content: "Devon, who goes by [tek256](https://tek256.com/), is a talented freelance game developer. A Washington native, his interests go beyond video games which include editing video and audio as well as playing professional DJ at local events and parties.
Devon joined the staff to assist with editing content: trailers, podcasts, talks, and more." +--- \ No newline at end of file diff --git a/content/english/blog/_index.md b/content/english/news/_index.md similarity index 100% rename from content/english/blog/_index.md rename to content/english/news/_index.md diff --git a/content/english/blog/post-1.md b/content/english/news/post-1.md similarity index 100% rename from content/english/blog/post-1.md rename to content/english/news/post-1.md diff --git a/content/english/blog/post-2.md b/content/english/news/post-2.md similarity index 100% rename from content/english/blog/post-2.md rename to content/english/news/post-2.md diff --git a/content/english/blog/post-3.md b/content/english/news/post-3.md similarity index 100% rename from content/english/blog/post-3.md rename to content/english/news/post-3.md diff --git a/content/english/blog/post-4.md b/content/english/news/post-4.md similarity index 100% rename from content/english/blog/post-4.md rename to content/english/news/post-4.md diff --git a/hugo.toml b/hugo.toml index 351fdd4..00ac1a8 100644 --- a/hugo.toml +++ b/hugo.toml @@ -116,6 +116,8 @@ ordered = true [mediaTypes] [mediaTypes."application/manifest+json"] suffixes = ["webmanifest"] +[mediaTypes."image/svg+xml"] +suffixes = ["svg"] ########################### Output Format ########################## diff --git a/layouts/_default/about.html b/layouts/_default/about.html new file mode 100644 index 0000000..83da529 --- /dev/null +++ b/layouts/_default/about.html @@ -0,0 +1,153 @@ +{{ define "main" }} + + {{ $tick := 0 }} + {{ range $i, $e:= .Params.features }} + +
+ {{ with .transition }} + {{ if .start }} +
+ {{ end }} + {{ if .start_dark }} + + {{ end }} + {{ end }} + {{ with .bg_img }} + {{ $res := resources.Get .img }} +
+ {{ end }} + +
+
+ {{ if eq .side "center" }} +
+ {{ if .subtitle }} +

{{ .subtitle }}

+ {{ end }} +

+ {{ .title | markdownify }} +

+
+ + {{ range $i, $e := .grid }} +
+
+

{{ add $i 1 }}

+
+
+

{{ .title }}

+

{{ .content | markdownify }}

+
+
+ {{ end }} +
+ + +

+ {{ .content | markdownify }} +

+
    + {{ range .bulletpoints }} +
  • + + {{ . | markdownify }} +
    • + {{ end }} +
+ {{ with .button }} + {{ if .enable }} + + {{ .label }} + + + {{ end }} + {{ end }} +
+ {{ else }} + + {{ if eq .side "left" }} + {{ $tick = 0 }} + {{ else if eq .side "right" }} + {{ $tick = 1 }} + {{ end }} + + {{ with .bg_img }} + {{ if .parallax }} +
+
+
+
+ {{ end }} + {{ end }} + +
+ + {{ if .image }} + {{ $res := resources.Get .image }} + + {{ end }} +
+
+ {{ if .subtitle }} +

{{ .subtitle }}

+ {{ end }} +

+ {{ .title | markdownify }} +

+

+ {{ .content | markdownify }} +

+
    + {{ range .bulletpoints }} +
  • + + {{ . | markdownify }} +
    • + {{ end }} +
+ {{ with .button }} + {{ if .enable }} + + {{ .label }} + + + {{ end }} + {{ end }} +
+ {{ if eq $tick 0 }} + {{ $tick = 1}} + {{ else }} + {{ $tick = 0 }} + {{ end }} + + {{ end }} +
+
+ {{ with .transition }} + {{ if .end }} +
+ {{ end }} + {{ if .end_dark }} + + {{ end }} + {{ end}} +
+ {{ end }} + +{{ end }} \ No newline at end of file diff --git a/layouts/index.html b/layouts/index.html index 5d152ae..d0a929f 100644 --- a/layouts/index.html +++ b/layouts/index.html @@ -75,59 +75,151 @@ {{ end }} + {{ $tick := 0 }} {{ range $i, $e:= .Params.features }} -
-
+ +
+ {{ with .transition }} + {{ if .start }} +
+ {{ end }} + {{ if .start_dark }} + + {{ end }} + {{ end }} + {{ with .bg_img }} + {{ $res := resources.Get .img }} +
+ {{ end }} + +
{{ if eq .side "center" }} - DEVON RETURN HERE: - TODO: - - USE LOCAL VARIABLE TO TRACK INDEX WHEN NOT SET LAYOUT PATTERN, - - USE IS_LEFT / IS_RIGHT TO SET MOD SIDE???? - {{ end }} - {{ if eq .side "left" }} - {{ end }} - {{ if eq .side "right" }} - {{ end }} - {{ if not .side }}
+

+ {{ .title | markdownify }} +

+ {{ with .swiper }} +
+
+ {{ range .slides }} +
+
+ + {{ $res := resources.Get .icon }} + + {{ .name }} + +
+
+ {{ end }} +
+
+ + {{ if .show_buttons }} +
+
+ {{ end }} +
+ {{ end }} +

+ {{ .content | markdownify }} +

+
    + {{ range .bulletpoints }} +
  • + + {{ . | markdownify }} +
    • + {{ end }} +
+ {{ with .button }} + {{ if .enable }} + + {{ .label }} + + + {{ end }} + {{ end }} +
+ {{ else }} + + {{ if eq .side "left" }} + {{ $tick = 0 }} + {{ else if eq .side "right" }} + {{ $tick = 1 }} + {{ end }} + + {{ with .bg_img }} + {{ if .parallax }} +
+
+
+
+ {{ end }} + {{ end }} + +
- {{ if .image }} - {{ partial "image" (dict "Src" .image "Alt" "feature image" "DisplayXL" "520x" "DisplayLG" "425x" "DisplayMD" "360x") }} - {{ end }} -
-
-

- {{ .title | markdownify }} -

-

- {{ .content | markdownify }} -

-
    - {{ range .bulletpoints }} -
  • - - {{ . | markdownify }} -
    • + {{ end }}"> + + {{ if .image }} + {{ partial "image" (dict "Src" .image "Alt" "feature image" "DisplayXL" "520x" "DisplayLG" "425x" "DisplayMD" "360x") }} {{ end }} -
- {{ with .button }} - {{ if .enable }} - - {{ .label }} - - +
+
+

+ {{ .title | markdownify }} +

+

+ {{ .content | markdownify }} +

+
    + {{ range .bulletpoints }} +
  • + + {{ . | markdownify }} +
    • + {{ end }} +
+ {{ with .button }} + {{ if .enable }} + + {{ .label }} + + + {{ end }} {{ end }} +
+ {{ if eq $tick 0 }} + {{ $tick = 1}} + {{ else }} + {{ $tick = 0 }} {{ end }} -
+ {{ end }}
+ {{ with .transition }} + {{ if .end }} +
+ {{ end }} + {{ if .end_dark }} + + {{ end }} + {{ end}}
{{ end }} @@ -187,8 +279,7 @@ {{ end }} -
+
diff --git a/layouts/blog/list.html b/layouts/news/list.html similarity index 100% rename from layouts/blog/list.html rename to layouts/news/list.html diff --git a/layouts/blog/single.html b/layouts/news/single.html similarity index 100% rename from layouts/blog/single.html rename to layouts/news/single.html diff --git a/layouts/partials/bg_image.html b/layouts/partials/bg_image.html new file mode 100644 index 0000000..5a1c09a --- /dev/null +++ b/layouts/partials/bg_image.html @@ -0,0 +1,93 @@ +{{ $imagePath:= string .Src }} +{{ $image:= . }} +{{ $size:= .Size }} +{{ $perspective:= .Perspective | default "cover" }} +{{ $position:= .Position | default "center center" }} +{{ $repeat:= .Repeat | default "no-repeat" }} +{{ $webp:= .Webp | default true }} +{{ $context:= .Context | default . }} +{{ $contentImage:= false }} +{{ $assetImage:= false }} +{{ $placeholder:= .Placeholder | default false }} +{{ $placeholderQuality:= "40x q20" }} + + +{{ with $context.Resources }} +{{ if .GetMatch $imagePath }} +{{ $contentImage = true }} +{{ end }} +{{ end }} + + + +{{ if fileExists (add `assets/` (string $imagePath)) }} +{{ $assetImage = true }} +{{ end }} + + +{{ if or (hasPrefix $imagePath "http") (fileExists (add `static/` (string $imagePath))) }} +
+ + +{{ else if or $assetImage $contentImage }} + +{{ if $assetImage }} +{{ $image = resources.Get $imagePath }} +{{ else if $contentImage }} +{{ $image = $context.Resources.GetMatch $imagePath }} +{{ end }} + + +{{ $imageExt := path.Ext $image }} + + +{{ if eq $imageExt `.svg` }} +{{ .Scratch.Set "image-height" "" }} +{{ .Scratch.Set "image-width" "" }} +{{ else }} +{{ .Scratch.Set "image-height" $image.Height }} +{{ .Scratch.Set "image-width" $image.Width }} +{{ end }} +{{ $imageHeight:= .Scratch.Get "image-height" }} +{{ $imageWidth:= .Scratch.Get "image-width" }} + + +{{ if or (eq $imageExt `.gif`) (eq $imageExt `.svg`) }} + + +
+ +{{ else }} + +{{ if $size }} + +{{ $imageWebp:= $image.Resize (add (string $size) " webp") }} +{{ if not $webp }} +{{ $imageWebp = $image.Resize (string $size) }} +{{ end }} + + +{{ $placeholderImage := ($imageWebp.Resize $placeholderQuality) | images.Filter (images.GaussianBlur 5) }} + +
+ +{{ else }} + +{{ $height:= string $image.Height }} +{{ $width:= string $image.Width }} +{{ $defaultSize:= add (add $width "x") $height }} +{{ $imageWebp:= $image.Resize (add $defaultSize " webp") }} +{{ if not $webp }} +{{ $imageWebp = $image.Resize (string $defaultSize) }} +{{ end }} + + +{{ $placeholderImage := ($imageWebp.Resize $placeholderQuality) | images.Filter (images.GaussianBlur 5) }} + +
+ +{{ end }} + +{{ end }} + +{{ end }} \ No newline at end of file diff --git a/layouts/partials/essentials/style.html b/layouts/partials/essentials/style.html index 3b82893..652f672 100644 --- a/layouts/partials/essentials/style.html +++ b/layouts/partials/essentials/style.html @@ -1,18 +1,5 @@ - - - - - - - - - - - - - {{ $pf:= site.Data.theme.fonts.font_family.primary }} diff --git a/layouts/partials/img_url.html b/layouts/partials/img_url.html new file mode 100644 index 0000000..8edac6d --- /dev/null +++ b/layouts/partials/img_url.html @@ -0,0 +1,93 @@ +{{ $imagePath:= string .Src }} +{{ $image:= . }} +{{ $size:= .Size }} +{{ $perspective:= .Perspective | default "cover" }} +{{ $position:= .Position | default "center center" }} +{{ $repeat:= .Repeat | default "no-repeat" }} +{{ $webp:= .Webp | default true }} +{{ $context:= .Context | default . }} +{{ $contentImage:= false }} +{{ $assetImage:= false }} +{{ $placeholder:= .Placeholder | default false }} +{{ $placeholderQuality:= "40x q20" }} + + +{{ with $context.Resources }} +{{ if .GetMatch $imagePath }} +{{ $contentImage = true }} +{{ end }} +{{ end }} + + + +{{ if fileExists (add `assets/` (string $imagePath)) }} +{{ $assetImage = true }} +{{ end }} + + +{{ if or (hasPrefix $imagePath "http") (fileExists (add `static/` (string $imagePath))) }} +{{ $imagePath | absURL }} + + +{{ else if or $assetImage $contentImage }} + +{{ if $assetImage }} +{{ $image = resources.Get $imagePath }} +{{ else if $contentImage }} +{{ $image = $context.Resources.GetMatch $imagePath }} +{{ end }} + + +{{ $imageExt := path.Ext $image }} + + +{{ if eq $imageExt `.svg` }} +{{ .Scratch.Set "image-height" "" }} +{{ .Scratch.Set "image-width" "" }} +{{ else }} +{{ .Scratch.Set "image-height" $image.Height }} +{{ .Scratch.Set "image-width" $image.Width }} +{{ end }} +{{ $imageHeight:= .Scratch.Get "image-height" }} +{{ $imageWidth:= .Scratch.Get "image-width" }} + + +{{ if or (eq $imageExt `.gif`) (eq $imageExt `.svg`) }} + + +{{ $image.RelPermalink }} + +{{ else }} + +{{ if $size }} + +{{ $imageWebp:= $image.Resize (add (string $size) " webp") }} +{{ if not $webp }} +{{ $imageWebp = $image.Resize (string $size) }} +{{ end }} + + +{{ $placeholderImage := ($imageWebp.Resize $placeholderQuality) | images.Filter (images.GaussianBlur 5) }} + +{{if $placeholder}}data:image/jpeg;base64,{{ $placeholderImage.Content | base64Encode }}{{else}}{{ $imageWebp.RelPermalink }}{{end}} + +{{ else }} + +{{ $height:= string $image.Height }} +{{ $width:= string $image.Width }} +{{ $defaultSize:= add (add $width "x") $height }} +{{ $imageWebp:= $image.Resize (add $defaultSize " webp") }} +{{ if not $webp }} +{{ $imageWebp = $image.Resize (string $defaultSize) }} +{{ end }} + + +{{ $placeholderImage := ($imageWebp.Resize $placeholderQuality) | images.Filter (images.GaussianBlur 5) }} + +{{if $placeholder}}data:image/jpeg;base64,{{ $placeholderImage.Content | base64Encode }}{{else}}{{ $imageWebp.RelPermalink }}{{end}} + +{{ end }} + +{{ end }} + +{{ end }} \ No newline at end of file diff --git a/layouts/partials/page-header-breadcrumbs.html b/layouts/partials/page-header-breadcrumbs.html new file mode 100644 index 0000000..c0b2baa --- /dev/null +++ b/layouts/partials/page-header-breadcrumbs.html @@ -0,0 +1,9 @@ +
+
+
+

{{ T (printf "%s" (lower .Title)) | default .Title | title }}

+ {{ partial "components/breadcrumb" (dict "Context" . "Class" "mt-6") }} +
+
+
diff --git a/layouts/partials/page-header.html b/layouts/partials/page-header.html index c0b2baa..52b6ed6 100644 --- a/layouts/partials/page-header.html +++ b/layouts/partials/page-header.html @@ -1,9 +1,8 @@
+ class="px-8 py-14">

{{ T (printf "%s" (lower .Title)) | default .Title | title }}

- {{ partial "components/breadcrumb" (dict "Context" . "Class" "mt-6") }}
diff --git a/layouts/partials/parallax_bg.html b/layouts/partials/parallax_bg.html new file mode 100644 index 0000000..6a92bcf --- /dev/null +++ b/layouts/partials/parallax_bg.html @@ -0,0 +1,243 @@ +{{ $image:= . }} +{{ $imagePath:= .Src }} +{{ $class:= .Class }} +{{ $size:= .Size }} +{{ $alt:= .Alt }} +{{ $displayXL:= .DisplayXL | default "1110x" }} +{{ $displayLG:= .DisplayLG | default "700x" }} +{{ $displayMD:= .DisplayMD | default "600x" }} +{{ $displaySM:= .DisplaySM | default "545x" }} +{{ $resize:= .Resize | default true }} +{{ $loading:= .Loading | default "lazy" }} +{{ $context:= .Context | default . }} +{{ $contentImage:= false }} +{{ $assetImage:= false }} +{{ $sizeValue:= index (split $size ` `) 0 }} +{{ $height:= index (split $sizeValue `x`) 1 }} +{{ $width:= index (split $sizeValue `x`) 0 }} +{{ $webp:= .Webp | default true }} +{{ $command:= .Command | default "Resize" }} +{{ $placeholder:= .Placeholder | default false }} +{{ $placeholderQuality:= "40x q20" }} + + + +{{ with $context.Resources.GetMatch $imagePath }} + {{ $contentImage = true }} +{{ end }} + + + +{{ if fileExists (add `assets/` (string $imagePath)) }} + {{ $assetImage = true }} +{{ end }} + + + +{{ if or (hasPrefix $imagePath "http") (fileExists (add `static/` (string $imagePath))) }} +
+{{ else }} + + + + {{ if or $assetImage $contentImage }} + {{ if $assetImage }} + {{ $image = resources.Get $imagePath }} + {{ else if $contentImage }} + {{ $image = $context.Resources.GetMatch $imagePath }} + {{ end }} + + + + {{ $imageExt := path.Ext $image }} + + + + {{ if eq $imageExt `.svg` }} + {{ .Scratch.Set "image-height" "" }} + {{ .Scratch.Set "image-width" "" }} + {{ else }} + {{ .Scratch.Set "image-height" $image.Height }} + {{ .Scratch.Set "image-width" $image.Width }} + {{ end }} + {{ $imageHeight:= .Scratch.Get "image-height" }} + {{ $imageWidth:= .Scratch.Get "image-width" }} + + + + {{ if or (eq $imageExt `.gif`) (eq $imageExt `.svg`) }} +
+ {{ else }} + + {{ if $size }} + + {{ $imageFallback:= $image.Resize $size }} + {{ $imageWebp:= $image.Resize (add (string $size) " webp") }} + {{ if not $webp }} + {{ $imageWebp = $image.Resize (string $size) }} + {{ end }} + + {{ if eq $command "Fit" }} + {{ $imageFallback = $image.Fit $size }} + {{ $imageWebp = $image.Fit (add (string $size) " webp") }} + {{ if not $webp }} + {{ $imageWebp = $image.Fit (string $size) }} + {{ end }} + + {{ else if eq $command "Fill" }} + {{ $imageFallback = $image.Fill $size }} + {{ $imageWebp = $image.Fill (add (string $size) " webp") }} + {{ if not $webp }} + {{ $imageWebp = $image.Fill (string $size) }} + {{ end }} + + {{ else if eq $command "Crop" }} + {{ $imageFallback = $image.Crop $size }} + {{ $imageWebp = $image.Crop (add (string $size) " webp") }} + {{ if not $webp }} + {{ $imageWebp = $image.Crop (string $size) }} + {{ end }} + {{ end }} + + + + {{ $placeholderImage := ($imageWebp.Resize $placeholderQuality) | images.Filter (images.GaussianBlur 5) }} + + +
+ + + {{ else if or (lt ($image.Width) 500) (not $resize) }} + {{ $size:= add (add (string $image.Width) "x") (string $image.Height) }} + + {{ $imageWebp:= $image.Resize (add (string $size) " webp") }} + {{ if not $webp }} + {{ $imageWebp = $image.Resize (string $size) }} + {{ end }} + + {{ if eq $command "Fit" }} + {{ $imageWebp = $image.Resize (add (string $size) " webp") }} + {{ if not $webp }} + {{ $imageWebp = $image.Resize (string $size) }} + {{ end }} + + {{ else if eq $command "Fill" }} + {{ $imageWebp = $image.Resize (add (string $size) " webp") }} + {{ if not $webp }} + {{ $imageWebp = $image.Resize (string $size) }} + {{ end }} + + {{ else if eq $command "Crop" }} + {{ $imageWebp = $image.Resize (add (string $size) " webp") }} + {{ if not $webp }} + {{ $imageWebp = $image.Resize (string $size) }} + {{ end }} + {{ end }} + + + + {{ $placeholderImage := ($imageWebp.Resize $placeholderQuality) | images.Filter (images.GaussianBlur 5) }} + + +
+ {{ else }} + + + + {{ $imageFallback:= $image.Resize $displayXL }} + {{ $imageXL:= $image.Resize (add $displayXL " webp") }} + {{ $imageLG:= $image.Resize (add $displayLG " webp") }} + {{ $imageMD:= $image.Resize (add $displayMD " webp") }} + {{ $imageSM:= $image.Resize (add $displaySM " webp") }} + {{ if not $webp }} + {{ $imageXL = $image.Resize $displayXL }} + {{ $imageLG = $image.Resize $displayLG }} + {{ $imageMD = $image.Resize $displayMD }} + {{ $imageSM = $image.Resize $displaySM }} + {{ end }} + + + + {{ $placeholderImage := ($imageFallback.Resize $placeholderQuality) | images.Filter (images.GaussianBlur 5) }} + + +
+ {{ end }} + + {{ end }} + + {{ end }} + + + +{{ end }} \ No newline at end of file diff --git a/package.json b/package.json index bfd5f58..5962d4b 100644 --- a/package.json +++ b/package.json @@ -8,12 +8,8 @@ "dev": "hugo server", "build": "hugo --gc --minify --templateMetrics --templateMetricsHints --forceSyncStatic", "preview": "hugo server --disableFastRender --navigateToChanged --templateMetrics --templateMetricsHints --watch --forceSyncStatic -e production --minify", - "dev:example": "cd exampleSite && hugo server", - "build:example": "cd exampleSite && hugo --gc --minify --templateMetrics --templateMetricsHints --forceSyncStatic", - "preview:example": "cd exampleSite && hugo server --disableFastRender --navigateToChanged --templateMetrics --templateMetricsHints --watch --forceSyncStatic -e production --minify", "update-modules": "node ./scripts/clearModules.js && hugo mod clean --all && hugo mod get -u ./... && hugo mod tidy", "remove-darkmode": "node ./scripts/removeDarkmode.js && yarn format", - "project-setup": "node ./scripts/projectSetup.js", "theme-setup": "node ./scripts/themeSetup.js", "update-theme": "node ./scripts/themeUpdate.js", "format": "prettier -w ." diff --git a/static/images/cities-dark-mode-row.png b/static/images/cities-dark-mode-row.png new file mode 100644 index 0000000..56969e4 Binary files /dev/null and b/static/images/cities-dark-mode-row.png differ diff --git a/static/images/cities-dark-mode.svg b/static/images/cities-dark-mode.svg new file mode 100644 index 0000000..0dba39b --- /dev/null +++ b/static/images/cities-dark-mode.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/images/cities-light-mode.png b/static/images/cities-light-mode.png new file mode 100644 index 0000000..572b73c Binary files /dev/null and b/static/images/cities-light-mode.png differ diff --git a/static/images/cities-light-mode.svg b/static/images/cities-light-mode.svg new file mode 100644 index 0000000..55cdf03 --- /dev/null +++ b/static/images/cities-light-mode.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/images/transition.svg b/static/images/transition.svg new file mode 100644 index 0000000..2cda1f9 --- /dev/null +++ b/static/images/transition.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/images/transition2.svg b/static/images/transition2.svg new file mode 100644 index 0000000..71a4fd6 --- /dev/null +++ b/static/images/transition2.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/images/transition3.svg b/static/images/transition3.svg new file mode 100644 index 0000000..fbae560 --- /dev/null +++ b/static/images/transition3.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/themes/hugoplate/assets/js/main.js b/themes/hugoplate/assets/js/main.js index 3b3e302..d74f4c7 100644 --- a/themes/hugoplate/assets/js/main.js +++ b/themes/hugoplate/assets/js/main.js @@ -33,4 +33,29 @@ }, }, }); + + // Swipers + // ---------------------------------------- + const swipers = docuemnt.querySelectorAll(".swiper-slider"); + + swipers.forEach((swiper) => { + console.log("ayy"); + new Swiper(swiper.id, { + spaceBetween: 24, + loop: true, + pagination: { + el: swiper.querySelector(".swiper-slider-pagination"), + type: "bullets", + clickable: true, + }, + breakpoints: { + 768: { + slidesPerView: 2, + }, + 992: { + slidesPerView: 3, + }, + }, + }); + }); })();