Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Enhancements to website versioning #2117

Merged
merged 15 commits into from
Nov 23, 2022
+63 −49
Merged

Enhancements to website versioning #2117

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
15 commits
Select commit Hold shift + click to select a range
df1495a
Add version switcher dropdown functionality to docs navbar
willihay Nov 11, 2022
993cf6b
Preliminary work includes version warning banner text
willihay Nov 15, 2022
a480836
Return spacing of unchanged html to previous position
willihay Nov 15, 2022
b41e920
Add comments for draft PR
willihay Nov 15, 2022
eaa214a
Move version dropdown and prevent left nav from scrolling
willihay Nov 16, 2022
2ef9709
Correct BaseURL in site config
willihay Nov 17, 2022
f37c090
Add preview info banner and update conditional logic
willihay Nov 17, 2022
cfceff9
Make local and preview into dynamic version options
willihay Nov 17, 2022
441a1f8
JS fix
willihay Nov 17, 2022
377d840
Add version CSS, defaults, load from config
willihay Nov 18, 2022
cbfaf5b
Move some CSS from HTML attributes to custom.sass
willihay Nov 22, 2022
a0af512
Improve function that adjusts sidebar attributes to prevent unwanted …
willihay Nov 23, 2022
9b60aed
Resolve merge conflict
willihay Nov 23, 2022
12b2c45
Fix attribute bug in updateSelectElement function
willihay Nov 23, 2022
e2b46e1
Add comments to sass
willihay Nov 23, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
20 changes: 15 additions & 5 deletions assets/js/app.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -169,7 +169,7 @@ function updateSelectElement(currentOrigin) {
if (currentValue == currentOrigin) {
originMatched = true;
$(this).attr("selected", "selected");
$(this).css("class", "selectedVersion");
$(this).attr("class", "selectedVersion");
}
});

Expand All @@ -191,6 +191,15 @@ function updateSelectElement(currentOrigin) {
}
}

function updateSidebarAttributes() {
// If an info or warning banner is present, adjust the top and height of the left nav so that it doesn't scroll when scrolling the contents of the page.
if ($("#preview-info").length > 0 || $("#version-warning").length > 0) {
var bannerHeight = $("#docs-banners").height();
$(".docs-sidebar").css("top", bannerHeight);
$(".docs-sidebar").css("height", window.innerHeight - bannerHeight);
}
}

// For docs navbar, switch to a different published docset.
$(function() {
// Update the dropdown for the version switcher, based on the origin part of the URL.
Expand All @@ -211,10 +220,11 @@ $(function() {
}
});

// If an info or warning banner is present, adjust the top of the left nav so that it doesn't scroll when scrolling the contents of the page.
if ($("#preview-info").length > 0 || $("#version-warning").length > 0) {
$(".docs-sidebar").css("top", $(".sticky-top").height());
}
updateSidebarAttributes();
});

$(window).on("resize", function() {
updateSidebarAttributes();
});

$(function() {
Expand Down
9 changes: 7 additions & 2 deletions assets/sass/custom.sass
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -460,6 +460,11 @@ code
@include media-breakpoint-down(lg)
display: block

// layouts/partials/navbar.html build-info
.build-info-text
margin-bottom: 0
text-align: center

// layouts/partials/hero.html

// banner
Expand Down Expand Up @@ -1526,9 +1531,9 @@ $os-selector-mobile-height: 48px

@include media-breakpoint-up(xl)
position: sticky
top: 4rem
top: 4rem // this is recalculated in app.js updateSidebarAttributes() function
z-index: 1000
height: calc(100vh - 4rem)
height: calc(100vh - 4rem) // this is recalculated in app.js updateSidebarAttributes() function
flex: 0 1 320px
order: 0
box-sizing: border-box
Expand Down
79 changes: 39 additions & 40 deletions layouts/partials/navbar.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,52 +8,51 @@
{{ $isRelease := in site.BaseURL "www.o3de.org" }}

{{ if $isDocs }}
<!-- TODO: Additional sticky-top is temporary. Working on a better way to stop left nav from scrolling. -->
<div class="sticky-top">
<div class="main-navbar navbar navbar-dark navbar-docs sticky-top" role="navigation" aria-label="main navigation">
<div class="container-fluid d-flex flex-row justify-content-between">
<div class="navbar-brand">
<a class="navbar-item" href="{{ $docs }}">
{{ if $logo }}
{{ $url := printf "img/logos/%s" $logo | relURL }}
<img src="{{ $url }}" class="navbar-logo">
{{ else }}
{{ $title }}
{{ end }}
<span class="subTitle">LEARN</span>
</a>
</div>

<div class="d-flex flex-row align-items-center navbar-docs">
<div id="main-nav" class="navbar-primary">
{{ partial "docs-menu-loop.html" . }}
<div class="sticky-top" id="docs-banners">
<div class="main-navbar navbar navbar-dark navbar-docs" role="navigation" aria-label="main navigation">
Comment on lines +11 to +12
Copy link
Contributor Author

@willihay willihay Nov 23, 2022 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

These two lines contain the only important changes to navbar.html in this PR. The rest is fixing indentation, which the GitHub PR diff engine mangled.

<div class="container-fluid d-flex flex-row justify-content-between">
<div class="navbar-brand">
<a class="navbar-item" href="{{ $docs }}">
{{ if $logo }}
{{ $url := printf "img/logos/%s" $logo | relURL }}
<img src="{{ $url }}" class="navbar-logo">
{{ else }}
{{ $title }}
{{ end }}
<span class="subTitle">LEARN</span>
</a>
</div>

<button class="navbar-toggler secondary-toggler" type="button" data-toggle="collapse" data-target="#secondary-nav" aria-controls="secondary-nav" aria-expanded="false" aria-label="Toggle secondary navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="d-flex flex-row align-items-center navbar-docs">
<div id="main-nav" class="navbar-primary">
{{ partial "docs-menu-loop.html" . }}
</div>

<div class="collapse navbar-collapse navbar-secondary" id="secondary-nav">
{{ partial "docs-secondary-menu-loop.html" . }}
</div>

<div id="mobile-docs-toggler" class="mobile-docs-toggler">
<span class="navbar-toggler-icon"></span>
<button class="navbar-toggler secondary-toggler" type="button" data-toggle="collapse" data-target="#secondary-nav" aria-controls="secondary-nav" aria-expanded="false" aria-label="Toggle secondary navigation">
<span class="navbar-toggler-icon"></span>
</button>

<div class="collapse navbar-collapse navbar-secondary" id="secondary-nav">
{{ partial "docs-secondary-menu-loop.html" . }}
</div>

<div id="mobile-docs-toggler" class="mobile-docs-toggler">
<span class="navbar-toggler-icon"></span>
</div>
</div>
</div>
</div>
</div>
{{ if not .Site.IsServer }}
{{ if $isPreview }}
<div class="p-2 text-white bg-secondary" id="preview-info">
{{ partial "preview-info.html" . }}
</div>
{{ else if not $isRelease }}
<div class="p-2 text-dark bg-warning" id="version-warning">
{{ partial "version-warning.html" . }}
</div>
</div>
{{ if not .Site.IsServer }}
{{ if $isPreview }}
<div class="p-2 text-white bg-secondary" id="preview-info">
{{ partial "preview-info.html" . }}
</div>
{{ else if not $isRelease }}
<div class="p-2 text-dark bg-warning" id="version-warning">
{{ partial "version-warning.html" . }}
</div>
{{ end }}
{{ end }}
{{ end }}
</div>
{{ else }}
<div class="new-nav main-navbar navbar navbar-dark navbar-expand-lg sticky-top" role="navigation" aria-label="main navigation">
Expand Down
2 changes: 1 addition & 1 deletion layouts/partials/preview-info.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
{{ $prnum := replaceRE `^https://deploy-preview-(\d+).*` "$1" .Permalink }}

<p style="margin-bottom:0; text-align:center;">
<p class="build-info-text">
<b>GitHub pull request: <a href="{{ $.Site.Params.repositoryUrl }}/pull/{{ $prnum }}" target="_blank">PR {{ $prnum }}</a></b>
</p>
2 changes: 1 addition & 1 deletion layouts/partials/version-warning.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
{{ $pathname := .RelPermalink }}

<p style="margin-bottom:0; text-align:center;">
<p class="build-info-text">
<b>This page is not the current release of O3DE documentation. <a href="https://www.o3de.org{{ $pathname }}">Click here to switch to the latest release</a>, or select a version from the dropdown.</b>
</p>