adiciona tema e customizacao de header e footer

packages/volto-demo-tema/package.json

@@ -26,7 +26,9 @@
     "release-major-alpha": "release-it major --preRelease=alpha",
     "release-alpha": "release-it --preRelease=alpha"
   },
-  "dependencies": {},
+  "dependencies": {
+    "@kitconcept/volto-light-theme": "^6.0.0-alpha.9"
+  },
   "peerDependencies": {
     "react": "18.2.0",
     "react-dom": "18.2.0"

packages/volto-demo-tema/src/components/RedesSociais/RedesSociais.jsx

@@ -0,0 +1,33 @@
+import React from 'react';
+import facebook from './facebook.svg';
+import insta from './insta.svg';
+import flickr from './flickr.svg';
+import x from './x.svg';
+import youtube from './yt.svg';
+
+const RedesSociais = () => {
+  return (
+    <div className="redes-container">
+      <h1 className="redes-titulo">Redes Sociais</h1>
+      <div className="redes">
+        <a href="https://www.facebook.com/Procergs">
+          <img src={facebook} alt="facebook" />
+        </a>
+        <a href="/">
+          <img src={x} alt="x" />
+        </a>
+        <a href="https://www.youtube.com/user/TVProcergs">
+          <img src={youtube} alt="youtube" />
+        </a>
+        <a href="/">
+          <img src={flickr} alt="flickr" />
+        </a>
+        <a href="https://www.instagram.com/procergsoficial/">
+          <img src={insta} alt="insta" />
+        </a>
+      </div>
+    </div>
+  );
+};
+
+export default RedesSociais;

packages/volto-demo-tema/src/components/SeloGoverno/SeloGoverno.jsx

@@ -0,0 +1,19 @@
+import React from 'react';
+import { UniversalLink } from '@plone/volto/components';
+import LogoRS from './rslogo.svg';
+
+const SeloGoverno = () => {
+  return (
+    <div className="footer-selo-governo">
+      <UniversalLink href="https://www.estado.rs.gov.br" target="_self">
+        <img
+          src={LogoRS}
+          alt="RS.GOV - Novas façanhas"
+          className="selo-governo--padrao"
+        />
+      </UniversalLink>
+    </div>
+  );
+};
+
+export default SeloGoverno;

packages/volto-demo-tema/src/components/SiteMapFooter/SiteMapFooter.jsx

@@ -0,0 +1,130 @@
+import React, { useEffect } from 'react';
+import PropTypes from 'prop-types';
+import { compose } from 'redux';
+import { connect } from 'react-redux';
+import { asyncConnect } from '@plone/volto/helpers';
+import { defineMessages, injectIntl } from 'react-intl';
+import { Container as SemanticContainer } from 'semantic-ui-react';
+import { Helmet, toBackendLang } from '@plone/volto/helpers';
+import { Link } from 'react-router-dom';
+import config from '@plone/volto/registry';
+
+import { getNavigation } from '@plone/volto/actions';
+
+const messages = defineMessages({
+  Sitemap: {
+    id: 'Sitemap',
+    defaultMessage: 'Sitemap',
+  },
+});
+
+export function getSitemapPath(pathname = '', lang) {
+  const prefix = pathname.replace(/\/sitemap$/gm, '').replace(/^\//, '');
+  const path = prefix || lang || '';
+  return path;
+}
+
+/**
+ * Sitemap function component.
+ * @function Sitemap
+ * @param {Object} props - Component properties.
+ * @returns {JSX.Element} - Rendered component.
+ */
+function Sitemap(props) {
+  const {
+    location: { pathname },
+    lang,
+    getNavigation,
+  } = props;
+
+  useEffect(() => {
+    const { settings } = config;
+    const language = settings.isMultilingual ? `${toBackendLang(lang)}` : null;
+    const path = getSitemapPath(pathname, language);
+    getNavigation(path, 4);
+  }, [pathname, lang, getNavigation]);
+
+  const renderItems = (items) => {
+    return (
+      <ul className="rodape__mapa-site">
+        {items.map((item) => (
+          <React.Fragment key={item.title}>
+            {item.items.length > 0 && (
+              <li className="rodape__mapa-site__item" key={item.title}>
+                <Link to={item.url} className="rodape-titulo">
+                  {item.title}
+                </Link>
+                <ul>
+                  {item.items &&
+                    item.items.map((innerItem) => (
+                      <li key={item.title}>
+                        <Link to={innerItem.url}>{innerItem.title}</Link>
+                      </li>
+                    ))}
+                </ul>
+              </li>
+            )}
+          </React.Fragment>
+        ))}
+      </ul>
+    );
+  };
+
+  const Container =
+    config.getComponent({ name: 'Container' }).component || SemanticContainer;
+
+  return (
+    <div id="page-sitemap">
+      <Helmet title={props.intl.formatMessage(messages.Sitemap)} />
+      <Container className="view-wrapper">
+        {props.items && renderItems(props.items, 2)}
+      </Container>
+    </div>
+  );
+}
+
+Sitemap.propTypes = {
+  getNavigation: PropTypes.func.isRequired,
+  location: PropTypes.object.isRequired,
+  intl: PropTypes.object.isRequired,
+  lang: PropTypes.string.isRequired,
+  items: PropTypes.array.isRequired,
+};
+
+export const __test__ = compose(
+  injectIntl,
+  connect(
+    (state) => ({
+      items: state.navigation.items,
+      lang: state.intl.locale,
+    }),
+    { getNavigation },
+  ),
+)(Sitemap);
+
+export default compose(
+  injectIntl,
+  connect(
+    (state) => ({
+      items: state.navigation.items,
+      lang: state.intl.locale,
+    }),
+    { getNavigation },
+  ),
+  asyncConnect([
+    {
+      key: 'navigation',
+      promise: ({ location, store: { dispatch, getState } }) => {
+        if (!__SERVER__) return;
+        const { settings } = config;
+        const path = getSitemapPath(
+          location.pathname,
+          settings.isMultilingual
+            ? toBackendLang(getState().intl.locale)
+            : null,
+        );
+        return dispatch(getNavigation(path, 4));
+      },
+    },
+  ]),
+)(Sitemap);

packages/volto-demo-tema/src/customizations/components/theme/Footer/Footer.jsx

@@ -0,0 +1,27 @@
+import React from 'react';
+import { injectIntl } from 'react-intl';
+import SeloGoverno from '../../../../components/SeloGoverno/SeloGoverno';
+import SiteMapFooter from '../../../../components/SiteMapFooter/SiteMapFooter';
+import RedesSociais from '../../../../components/RedesSociais/RedesSociais';
+
+const Footer = ({ intl }) => {
+  return (
+    <div id="footer" stackable vertical padded inverted color="grey">
+      <div className="footer-container">
+        <div className="footer-site-nome">
+          <SeloGoverno />
+        </div>
+        <SiteMapFooter location="/" />
+        <RedesSociais />
+      </div>
+      <div className="footer-logo">
+        <p>
+          Todo o conteúdo deste site está publicado sob a licença Creative
+          Commons Atribuição-SemDerivações 3.0 Não Adaptada
+        </p>
+      </div>
+    </div>
+  );
+};
+
+export default injectIntl(Footer);