audacity/audacity.github.io
1
0
Fork 0
mirror of https://github.com/audacity/audacity.github.io.git synced 2026-06-13 13:41:41 -05:00
Code Issues 9 Packages Projects Releases Wiki Activity

Remove ability to dismiss banner

Browse Source 
+ do not render banner on '/beta' page
This commit is contained in:
Dilson's Pickles
2024-02-29 22:55:43 +11:00
parent 643d0580f6
commit ff8becd2c6
2 changed files with 26 additions and 51 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
src/components/banner/BetaBanner.jsx
View File

@@ -1,25 +1,32 @@
import React from "react";
import "../../styles/icons.css";
function BetaBanner() {
return (
<div
id="beta-banner"
className="hidden items-center justify-center min-h-24 bg-orange-400 gap-4 flex-wrap"
>
<div className="flex gap-2 flex-wrap my-4 mx-2">
<p className="text-xl font-bold text-gray-900">Get early access to new features!</p>
<p className="text-xl text-gray-900">Help us test our ‘Save to cloud’ feature</p>
</div>
<a href="/beta" id="join-button" className="flex text-xl h-12 my-4 justify-center items-center px-4 border-2 border-gray-900 rounded-md hover:bg-gray-900 hover:text-white">Join the beta</a>
<a
className="flex justify-center items-center h-10 w-10 hover:bg-orange-600 rounded-md"
id="close-button"
function BetaBanner(url) {
if (url.url.endsWith("/beta")) {
return null;
} else
return (
<div
id="beta-banner"
className="flex items-center justify-center min-h-24 bg-orange-400 gap-4 flex-wrap"
>
<span className="icon icon-times"></span>
</a>
</div>
);
<div className="flex gap-2 flex-wrap my-4 mx-2">
<p className="text-xl font-bold text-gray-900">
Get early access to new features!
</p>
<p className="text-xl text-gray-900">
Help us test our ‘Save to cloud’ feature
</p>
</div>
<a
href="/beta"
id="join-button"
className="flex text-xl h-12 my-4 justify-center items-center px-4 border-2 border-gray-900 rounded-md hover:bg-gray-900 hover:text-white"
>
Join the beta
</a>
</div>
);
}
export default BetaBanner;

34
src/layouts/BaseLayout.astro
View File

@@ -33,38 +33,6 @@ const {
<title>{title}</title>
<script src="../assets/js/matomoTracking.js"></script>
<script>
window.addEventListener("load", function () {
const closeButton = document.getElementById("close-button");
const joinButton = document.getElementById("join-button");
const betaFooterLink = document.getElementById("beta-link");
const betaBanner = document.getElementById("beta-banner");
if(localStorage.getItem("dismissBanner") === "true"){
betaBanner?.classList.add("hidden");
betaBanner?.classList.remove("flex");
}
if(localStorage.getItem("dismissBanner") !== "true"){
betaBanner?.classList.remove("hidden");
betaBanner?.classList.add("flex");
}
function dismissBanner() {
console.log("Banner has been dismissed");
localStorage.setItem("dismissBanner", "true")
betaBanner?.classList.add("hidden");
betaBanner?.classList.remove("flex");
console.log(betaBanner?.classList);
}
closeButton?.addEventListener("click", dismissBanner);
joinButton?.addEventListener("click", dismissBanner);
betaFooterLink?.addEventListener("click", dismissBanner);
});
</script>
</head>
<main class="flex flex-col h-screen">
<body>
@@ -73,7 +41,7 @@ const {
>
<header class="sticky left-0 right-0 top-0">
<NavigationReact client:load currentURL={Astro.request.url} />
<BetaBanner />
<BetaBanner client:load url={Astro.request.url}/>
</header>
<div class="flex-1">