diff --git a/assets/config/tailwind.config.js b/assets/config/tailwind.config.js index f1c8bf9587c1..a48ed59b1e78 100644 --- a/assets/config/tailwind.config.js +++ b/assets/config/tailwind.config.js @@ -71,4 +71,11 @@ module.exports = { }, }, }, + + variants: { + margin: [ + "responsive", + "hover", + ] + } } diff --git a/assets/js/carousel.js b/assets/js/carousel.js new file mode 100644 index 000000000000..81557a2d8f1e --- /dev/null +++ b/assets/js/carousel.js @@ -0,0 +1,35 @@ +(function($) { + + // The home-page carousel. Items cycle every four seconds. Clicking a label stops the + // cycling and shows the selected item. + + var carouselIndex = 1; + + var carouselInterval = window.setInterval(function() { + showCarouselItem(carouselIndex); + carouselIndex++; + + if (carouselIndex > 2) { + carouselIndex = 0; + } + }, 4000); + + $(".carousel-item-label").click(function() { + clearInterval(carouselInterval); + + var i = $(".carousel-item-label").index(this); + showCarouselItem(i); + }); + + function showCarouselItem(i) { + $(".carousel-item") + .css("opacity", 0) + .eq(i) + .css("opacity", 1); + + $(".carousel-item-label") + .removeClass("border-b-2") + .eq(i) + .addClass("border-b-2"); + } +})(jQuery); diff --git a/assets/js/main.js b/assets/js/main.js index 213034c997b2..63db455618cc 100644 --- a/assets/js/main.js +++ b/assets/js/main.js @@ -51,36 +51,4 @@ function generateMiniToc() { $(".blog-sidebar-content").toggleClass("hidden"); }); - // Home-page carousel. Items cycle every four seconds. Clicking a label stops the - // cycling and shows the selected item. - var carouselIndex = 1; - - var carouselInterval = window.setInterval(function() { - showCarouselItem(carouselIndex); - carouselIndex++; - - if (carouselIndex > 2) { - carouselIndex = 0; - } - }, 4000); - - $(".carousel-item-label").click(function() { - clearInterval(carouselInterval); - - var i = $(".carousel-item-label").index(this); - showCarouselItem(i); - }); - - function showCarouselItem(i) { - $(".carousel-item") - .css("opacity", 0) - .eq(i) - .css("opacity", 1); - - $(".carousel-item-label") - .removeClass("border-b-2") - .eq(i) - .addClass("border-b-2"); - } - }(jQuery)); diff --git a/assets/js/nav.js b/assets/js/nav.js new file mode 100644 index 000000000000..107d67eedcc4 --- /dev/null +++ b/assets/js/nav.js @@ -0,0 +1,24 @@ +(function(document, $) { + + // The main navigation bar. Binds handlers for showing and hiding + // the big purple submenu on non-touch devices. + + var isTouchDevice = "ontouchstart" in document; + + if (!isTouchDevice) { + + $(".nav-header-items li a").mouseenter(function(event) { + var item = $(event.target).data("submenu"); + $(".submenu-item").hide(); + $(".submenu-item-" + item).show(); + }); + + $(".submenu").mouseleave(function(event) { + // Only hide the submenu if the mouse moves to an element that + // isn't the main menu. + if (event.relatedTarget !== $("nav.nav-main").get(0)) { + $(".submenu-item").hide(); + } + }); + } +})(document, jQuery); diff --git a/content/product/_index.md b/content/product/_index.md index e13e6fc9ac7f..9a4b2bf9f9f5 100644 --- a/content/product/_index.md +++ b/content/product/_index.md @@ -5,4 +5,5 @@ layout: product menu: header: weight: 1 + identifier: product --- diff --git a/content/why-pulumi/_index.md b/content/why-pulumi/_index.md index 10982f8ec44d..a52cc1e62e4c 100644 --- a/content/why-pulumi/_index.md +++ b/content/why-pulumi/_index.md @@ -5,4 +5,5 @@ layout: why-pulumi menu: header: weight: 2 + identifier: why --- diff --git a/layouts/index.html b/layouts/index.html index 7ecec1405da0..823c64f79697 100644 --- a/layouts/index.html +++ b/layouts/index.html @@ -17,8 +17,8 @@

Modern Infrastructure as Code

{{ partial "chrome.html" . }}
Pulumi code - Pulumi CLI - Pulumi Console + Pulumi CLI + Pulumi Console
Code diff --git a/layouts/partials/header.html b/layouts/partials/header.html index 92bbd2394662..c22045062739 100644 --- a/layouts/partials/header.html +++ b/layouts/partials/header.html @@ -35,7 +35,7 @@ {{ range $.Site.Menus.header }}
  • {{ $active := hasPrefix $.RelPermalink .URL }} - + {{ .Name }}
    • @@ -51,3 +51,121 @@
    +
    +
    + + +
    +
    diff --git a/layouts/partials/scripts.html b/layouts/partials/scripts.html index 448a26d21afc..f5fe80808367 100644 --- a/layouts/partials/scripts.html +++ b/layouts/partials/scripts.html @@ -7,7 +7,9 @@ hash in filename, so no need to add query param to cache bust. --> {{ $main := resources.Get "js/main.js" }} +{{ $nav := resources.Get "js/nav.js" }} +{{ $carousel := resources.Get "js/carousel.js" }} {{ $langchoose := resources.Get "js/langchoose.js" }} {{ $noselect := resources.Get "js/noselect.js" }} -{{ $js := slice $main $langchoose $noselect | resources.Concat "js/bundle.js" | resources.Minify | resources.Fingerprint }} +{{ $js := slice $main $nav $carousel $langchoose $noselect | resources.Concat "js/bundle.js" | resources.Minify | resources.Fingerprint }}