function enableDarkTheme() {
    // Updating the theme preference in localStorage to dark.
    localStorage.theme = "dark";

    /**********************************************************
        This is where the restyling for dark theme begins.
     **********************************************************/

    // Setting the body background to black.
    document.body.style.backgroundColor = "black";

    // Setting both of the corresponding buttons to black.
    themeToggleButtons.forEach((button) => {
        button.style.color = "black";
    });

    // Setting the textinfo-headings and their corresponding text to white (for contrast to black background).
    document
        .querySelectorAll("div[class='textinfo-heading']")
        .forEach((heading) => {
            Array.from(heading.parentNode.children).forEach((child) => {
                child.classList == "textinfo-heading"
                    ? (child.classList = "textinfo-heading dark-mode-heading")
                    : (child.classList = "dark-mode-text");
            });
        });

    // Setting the main section paragraphs (quotes and text bodies) to white (for contrast to black body) by adding the dark-mode-text class.
    document.querySelectorAll("p:not(#chef-name)").forEach((text) => {
        text.classList == ""
            ? (text.classList = "dark-mode-text")
            : (text.classList += " dark-mode-text");
    });

    // If the form is on this page...
    if (inquiryForm != null) {
        // Set its text to white (for contrast to black body) by adding the dark-mode-text class.
        // Form header.
        inquiryForm.querySelector("h3").classList = "dark-mode-text";
        // Form input labels.
        inquiryForm.querySelectorAll("label").forEach((label) => {
            label.classList = "dark-mode-text";
        });
    }

    // If the flickity dots are being used on this page...
    if (document.querySelector("ol.flickity-page-dots") != null) {
        // Add the dark flickity dot style.
        document.querySelector("head").appendChild(darkDotStyle);
    }

    // Setting the toast message to dark mode version.
    document.querySelector("span.toast-msg").classList = "toast-msg-dark";
}
// This function enables dark theme for all pages on the site.
This function enables dark theme for all pages on the site.
This function enables dark theme for all pages on the site .
function enableDarkTheme() {
    localStorage.theme = "dark";
    document.body.style.backgroundColor = "black";
    themeToggleButtons.forEach((button) => {
        button.style.color = "black";
    });
    document
        .querySelectorAll("div[class='textinfo-heading']")
        .forEach((heading) => {
            Array.from(heading.parentNode.children).forEach((child) => {
                child.classList == "textinfo-heading"
                    ? (child.classList = "textinfo-heading dark-mode-heading")
                    : (child.classList = "dark-mode-text");
            });
        });
    document.querySelectorAll("p:not(#chef-name)").forEach((text) => {
        text.classList == ""
            ? (text.classList = "dark-mode-text")
            : (text.classList += " dark-mode-text");
    });
    if (inquiryForm != null) {
        inquiryForm.querySelector("h3").classList = "dark-mode-text";
        inquiryForm.querySelectorAll("label").forEach((label) => {
            label.classList = "dark-mode-text";
        });
    }
    if (document.querySelector("ol.flickity-page-dots") != null) {
        document.querySelector("head").appendChild(darkDotStyle);
    }
    document.querySelector("span.toast-msg").classList = "toast-msg-dark";
}
function enableDarkTheme ( ) { localStorage . theme = "dark" ; document . body . style . backgroundColor = "black" ; themeToggleButtons . forEach ( ( button ) => { button . style . color = "black" ; } ) ; document . querySelectorAll ( "div[class='textinfo-heading']" ) . forEach ( ( heading ) => { Array . from ( heading . parentNode . children ) . forEach ( ( child ) => { child . classList == "textinfo-heading" ? ( child . classList = "textinfo-heading dark-mode-heading" ) : ( child . classList = "dark-mode-text" ) ; } ) ; } ) ; document . querySelectorAll ( "p:not(#chef-name)" ) . forEach ( ( text ) => { text . classList == "" ? ( text . classList = "dark-mode-text" ) : ( text . classList += " dark-mode-text" ) ; } ) ; if ( inquiryForm != null ) { inquiryForm . querySelector ( "h3" ) . classList = "dark-mode-text" ; inquiryForm . querySelectorAll ( "label" ) . forEach ( ( label ) => { label . classList = "dark-mode-text" ; } ) ; } if ( document . querySelector ( "ol.flickity-page-dots" ) != null ) { document . querySelector ( "head" ) . appendChild ( darkDotStyle ) ; } document . querySelector ( "span.toast-msg" ) . classList = "toast-msg-dark" ; }
This function enables dark theme for all pages on the site.
This function enables dark theme for all pages on the site .
// Updating the theme preference in localStorage to dark. /**********************************************************
        This is where the restyling for dark theme begins.
     **********************************************************/ // Setting the body background to black. // Setting both of the corresponding buttons to black. // Setting the textinfo-headings and their corresponding text to white (for contrast to black background). // Setting the main section paragraphs (quotes and text bodies) to white (for contrast to black body) by adding the dark-mode-text class. // If the form is on this page... // Set its text to white (for contrast to black body) by adding the dark-mode-text class. // Form header. // Form input labels. // If the flickity dots are being used on this page... // Add the dark flickity dot style. // Setting the toast message to dark mode version.