From b88cc462061a1bb8cd5c189c3b55745935e641ff Mon Sep 17 00:00:00 2001 From: Blaine Bublitz Date: Sun, 28 Apr 2024 18:36:43 -0400 Subject: [PATCH 1/7] feat: Add AnnouncementBar for State of Gulp survey --- docusaurus.config.js | 6 +++ .../AnnouncementBar/CloseButton/index.js | 20 +++++++++ .../CloseButton/styles.module.css | 4 ++ src/theme/AnnouncementBar/Content/index.js | 17 ++++++++ .../AnnouncementBar/Content/styles.module.css | 10 +++++ src/theme/AnnouncementBar/index.js | 29 +++++++++++++ src/theme/AnnouncementBar/styles.module.css | 41 +++++++++++++++++++ 7 files changed, 127 insertions(+) create mode 100644 src/theme/AnnouncementBar/CloseButton/index.js create mode 100644 src/theme/AnnouncementBar/CloseButton/styles.module.css create mode 100644 src/theme/AnnouncementBar/Content/index.js create mode 100644 src/theme/AnnouncementBar/Content/styles.module.css create mode 100644 src/theme/AnnouncementBar/index.js create mode 100644 src/theme/AnnouncementBar/styles.module.css diff --git a/docusaurus.config.js b/docusaurus.config.js index f13b9e3..325fa58 100644 --- a/docusaurus.config.js +++ b/docusaurus.config.js @@ -15,6 +15,12 @@ module.exports = { projectName: 'gulpjs.github.io', // The theme themeConfig: { + announcementBar: { + id: 'state_of_gulp', + content: + 'Participate in the State of Gulp survey—Seeking feedback until May 31st!', + isCloseable: false, + }, colorMode: { defaultMode: 'light', disableSwitch: true, diff --git a/src/theme/AnnouncementBar/CloseButton/index.js b/src/theme/AnnouncementBar/CloseButton/index.js new file mode 100644 index 0000000..7352c3e --- /dev/null +++ b/src/theme/AnnouncementBar/CloseButton/index.js @@ -0,0 +1,20 @@ +import React from 'react'; +import clsx from 'clsx'; +import {translate} from '@docusaurus/Translate'; +import IconClose from '@theme/Icon/Close'; +import styles from './styles.module.css'; +export default function AnnouncementBarCloseButton(props) { + return ( + + ); +} diff --git a/src/theme/AnnouncementBar/CloseButton/styles.module.css b/src/theme/AnnouncementBar/CloseButton/styles.module.css new file mode 100644 index 0000000..0494ec0 --- /dev/null +++ b/src/theme/AnnouncementBar/CloseButton/styles.module.css @@ -0,0 +1,4 @@ +.closeButton { + padding: 0; + line-height: 0; +} diff --git a/src/theme/AnnouncementBar/Content/index.js b/src/theme/AnnouncementBar/Content/index.js new file mode 100644 index 0000000..a7a8b61 --- /dev/null +++ b/src/theme/AnnouncementBar/Content/index.js @@ -0,0 +1,17 @@ +import React from 'react'; +import clsx from 'clsx'; +import {useThemeConfig} from '@docusaurus/theme-common'; +import styles from './styles.module.css'; +export default function AnnouncementBarContent(props) { + const {announcementBar} = useThemeConfig(); + const {content} = announcementBar; + return ( +
+ ); +} diff --git a/src/theme/AnnouncementBar/Content/styles.module.css b/src/theme/AnnouncementBar/Content/styles.module.css new file mode 100644 index 0000000..16635d4 --- /dev/null +++ b/src/theme/AnnouncementBar/Content/styles.module.css @@ -0,0 +1,10 @@ +.content { + font-size: 85%; + text-align: center; + padding: 5px 0; +} + +.content a { + color: inherit; + text-decoration: underline; +} diff --git a/src/theme/AnnouncementBar/index.js b/src/theme/AnnouncementBar/index.js new file mode 100644 index 0000000..d2e6339 --- /dev/null +++ b/src/theme/AnnouncementBar/index.js @@ -0,0 +1,29 @@ +import React from 'react'; +import {useThemeConfig} from '@docusaurus/theme-common'; +import {useAnnouncementBar} from '@docusaurus/theme-common/internal'; +import AnnouncementBarCloseButton from '@theme/AnnouncementBar/CloseButton'; +import AnnouncementBarContent from '@theme/AnnouncementBar/Content'; +import styles from './styles.module.css'; +export default function AnnouncementBar() { + const {announcementBar} = useThemeConfig(); + const {isActive, close} = useAnnouncementBar(); + if (!isActive) { + return null; + } + const {backgroundColor, textColor, isCloseable} = announcementBar; + return ( +
+ {isCloseable &&
} + + {isCloseable && ( + + )} +
+ ); +} diff --git a/src/theme/AnnouncementBar/styles.module.css b/src/theme/AnnouncementBar/styles.module.css new file mode 100644 index 0000000..1891cc4 --- /dev/null +++ b/src/theme/AnnouncementBar/styles.module.css @@ -0,0 +1,41 @@ +.announcementBar { + display: flex; + align-items: center; + height: 40px; + background-color: var(--ifm-color-secondary); + color: var(--ifm-color-white); +} + +html[data-announcement-bar-initially-dismissed='true'] .announcementBar { + display: none; +} + +.announcementBarPlaceholder { + flex: 0 0 10px; +} + +.announcementBarClose { + flex: 0 0 30px; + align-self: stretch; +} + +.announcementBarContent { + flex: 1 1 auto; +} + +@media print { + .announcementBar { + display: none; + } +} + +@media (min-width: 997px) { + :root { + --docusaurus-announcement-bar-height: 30px; + } + + .announcementBarPlaceholder, + .announcementBarClose { + flex-basis: 50px; + } +} From 543dbb4877c3095ec13d2a43bc673838e88ce6ff Mon Sep 17 00:00:00 2001 From: Blaine Bublitz Date: Sun, 28 Apr 2024 18:52:46 -0400 Subject: [PATCH 2/7] chore: Re-add American Express as a sponsor --- docusaurus.config.js | 19 +++++++++---------- 1 file changed, 9 insertions(+), 10 deletions(-) diff --git a/docusaurus.config.js b/docusaurus.config.js index 325fa58..c455f9e 100644 --- a/docusaurus.config.js +++ b/docusaurus.config.js @@ -185,16 +185,15 @@ module.exports = { flexBasis: '150px', }, }, - // Stopped donating on June 15th, 2022 - // { - // href: 'https://developer.americanexpress.com', - // src: 'sponsor-logos/american-express.svg', - // alt: 'American Express', - // title: 'American Express', - // style: { - // flexBasis: '145px', - // }, - // }, + { + href: 'https://developer.americanexpress.com', + src: 'sponsor-logos/american-express.svg', + alt: 'American Express', + title: 'American Express', + style: { + flexBasis: '145px', + }, + }, ] }, stylesheets: [ From b34bff302eb5476c6c7c63baf4cc639b8d8a5ac0 Mon Sep 17 00:00:00 2001 From: Blaine Bublitz Date: Sun, 28 Apr 2024 19:00:25 -0400 Subject: [PATCH 3/7] chore: Remove WordTips sponsor that dropped off in 2023 --- docusaurus.config.js | 19 ++++++++++--------- 1 file changed, 10 insertions(+), 9 deletions(-) diff --git a/docusaurus.config.js b/docusaurus.config.js index c455f9e..6eda93a 100644 --- a/docusaurus.config.js +++ b/docusaurus.config.js @@ -176,15 +176,16 @@ module.exports = { // flexBasis: '80px', // }, // }, - { - href: 'https://word.tips/', - src: 'sponsor-logos/word-tips.png', - alt: 'WordTips logo', - title: 'WordTips', - style: { - flexBasis: '150px', - }, - }, + // Stopped donating in Sept 2023 + // { + // href: 'https://word.tips/', + // src: 'sponsor-logos/word-tips.png', + // alt: 'WordTips logo', + // title: 'WordTips', + // style: { + // flexBasis: '150px', + // }, + // }, { href: 'https://developer.americanexpress.com', src: 'sponsor-logos/american-express.svg', From 061e161f75012b2f563a36169f4054af83374db8 Mon Sep 17 00:00:00 2001 From: Blaine Bublitz Date: Sun, 28 Apr 2024 19:04:12 -0400 Subject: [PATCH 4/7] chore: Update content to reflect state of backer banner --- src/theme/BackerSection/index.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/theme/BackerSection/index.js b/src/theme/BackerSection/index.js index d7b0a8d..3a3da1f 100644 --- a/src/theme/BackerSection/index.js +++ b/src/theme/BackerSection/index.js @@ -22,12 +22,12 @@ function BackerSection() {

$5 each month

-

We'll rotate your avatar through the individual contributors banner below.

+

In the future, we'll rotate your avatar through an individual contributors banner below.

Donate $5

$10 each month

-

We'll thank you on Twitter and rotate your avatar through the individual contributors banner below.

+

We'll thank you on Twitter and, in the future, rotate your avatar through an individual contributors banner below.

Donate $10
From becf22b8aa56473d5f1e790cdfacfe2edc5fa7f2 Mon Sep 17 00:00:00 2001 From: Blaine Bublitz Date: Sun, 28 Apr 2024 19:48:42 -0400 Subject: [PATCH 5/7] chore: Rework banner --- docusaurus.config.js | 2 +- src/theme/AnnouncementBar/Content/styles.module.css | 4 ++-- src/theme/AnnouncementBar/styles.module.css | 5 +---- 3 files changed, 4 insertions(+), 7 deletions(-) diff --git a/docusaurus.config.js b/docusaurus.config.js index 6eda93a..2e654a5 100644 --- a/docusaurus.config.js +++ b/docusaurus.config.js @@ -18,7 +18,7 @@ module.exports = { announcementBar: { id: 'state_of_gulp', content: - 'Participate in the State of Gulp survey—Seeking feedback until May 31st!', + `We're seeking your feedback until May 31st—participate in the Gulp Developer Survey today!`, isCloseable: false, }, colorMode: { diff --git a/src/theme/AnnouncementBar/Content/styles.module.css b/src/theme/AnnouncementBar/Content/styles.module.css index 16635d4..425d607 100644 --- a/src/theme/AnnouncementBar/Content/styles.module.css +++ b/src/theme/AnnouncementBar/Content/styles.module.css @@ -1,10 +1,10 @@ .content { - font-size: 85%; + font-size: 1rem; text-align: center; padding: 5px 0; } .content a { - color: inherit; + color: var(--ifm-color-primary); text-decoration: underline; } diff --git a/src/theme/AnnouncementBar/styles.module.css b/src/theme/AnnouncementBar/styles.module.css index 1891cc4..f20b54d 100644 --- a/src/theme/AnnouncementBar/styles.module.css +++ b/src/theme/AnnouncementBar/styles.module.css @@ -1,7 +1,7 @@ .announcementBar { display: flex; align-items: center; - height: 40px; + height: 64px; background-color: var(--ifm-color-secondary); color: var(--ifm-color-white); } @@ -30,9 +30,6 @@ html[data-announcement-bar-initially-dismissed='true'] .announcementBar { } @media (min-width: 997px) { - :root { - --docusaurus-announcement-bar-height: 30px; - } .announcementBarPlaceholder, .announcementBarClose { From b6841fe71c5ef6bba364920073d580e216ecf27e Mon Sep 17 00:00:00 2001 From: Blaine Bublitz Date: Sun, 28 Apr 2024 21:38:47 -0400 Subject: [PATCH 6/7] feat: Add survey url --- docusaurus.config.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docusaurus.config.js b/docusaurus.config.js index 2e654a5..7b353e7 100644 --- a/docusaurus.config.js +++ b/docusaurus.config.js @@ -18,7 +18,7 @@ module.exports = { announcementBar: { id: 'state_of_gulp', content: - `We're seeking your feedback until May 31st—participate in the Gulp Developer Survey today!`, + `We're seeking your feedback until May 31st—participate in the Gulp Developer Survey today!`, isCloseable: false, }, colorMode: { From 70636f94176d81f4be4f81365d2d17ed41107f47 Mon Sep 17 00:00:00 2001 From: Blaine Bublitz Date: Sun, 28 Apr 2024 21:39:15 -0400 Subject: [PATCH 7/7] feat: Add Web Weekly sponsor --- docusaurus.config.js | 9 +++++++++ static/sponsor-logos/web-weekly.svg | 1 + 2 files changed, 10 insertions(+) create mode 100644 static/sponsor-logos/web-weekly.svg diff --git a/docusaurus.config.js b/docusaurus.config.js index 7b353e7..d0777ff 100644 --- a/docusaurus.config.js +++ b/docusaurus.config.js @@ -195,6 +195,15 @@ module.exports = { flexBasis: '145px', }, }, + { + href: 'https://webweekly.email/', + src: 'sponsor-logos/web-weekly.svg', + alt: 'Web Weekly - Your friendly web dev newsletter', + title: 'Web Weekly - Your friendly web dev newsletter', + style: { + flexBasis: '175px', + } + } ] }, stylesheets: [ diff --git a/static/sponsor-logos/web-weekly.svg b/static/sponsor-logos/web-weekly.svg new file mode 100644 index 0000000..d4aca02 --- /dev/null +++ b/static/sponsor-logos/web-weekly.svg @@ -0,0 +1 @@ + \ No newline at end of file