diff --git a/src/customizations/volto/components/theme/Navigation/Navigation.jsx b/src/customizations/volto/components/theme/Navigation/Navigation.jsx
index e5f61b8b1..e3b7999ed 100644
--- a/src/customizations/volto/components/theme/Navigation/Navigation.jsx
+++ b/src/customizations/volto/components/theme/Navigation/Navigation.jsx
@@ -4,6 +4,7 @@
*/
import React, { useEffect, useState } from 'react';
+import { defineMessages, useIntl } from 'react-intl';
import PropTypes from 'prop-types';
import { useDispatch, useSelector } from 'react-redux';
import { UniversalLink } from '@plone/volto/components';
@@ -25,9 +26,13 @@ import {
} from 'design-comuni-plone-theme/components/ItaliaTheme';
import { getDropdownMenuNavitems, getItemsByPath } from 'volto-dropdownmenu';
+import FocusLock from 'react-focus-lock';
const Navigation = ({ pathname }) => {
+ const intl = useIntl();
const [collapseOpen, setCollapseOpen] = useState(false);
+ const [focusTrapActive, setFocusTrapActive] = useState(false);
+
const dispatch = useDispatch();
const subsite = useSelector((state) => state.subsite?.data);
@@ -73,6 +78,7 @@ const Navigation = ({ pathname }) => {
}
setCollapseOpen(false);
+ setFocusTrapActive(false);
};
document.body.addEventListener('click', blocksClickListener);
@@ -89,7 +95,10 @@ const Navigation = ({ pathname }) => {
aria-controls="#it-navigation-collapse"
aria-expanded={collapseOpen}
aria-label="Toggle navigation"
- onClick={() => setCollapseOpen(!collapseOpen)}
+ onClick={() => {
+ setCollapseOpen(!collapseOpen);
+ setFocusTrapActive(!focusTrapActive);
+ }}
>
@@ -99,44 +108,57 @@ const Navigation = ({ pathname }) => {
navbar
onOverlayClick={() => setCollapseOpen(!collapseOpen)}
id="it-navigation-collapse"
+ showCloseButton={false}
>
-
-
-
setCollapseOpen(false)}
+
+
+
+ setCollapseOpen(false)}
+ >
+ {subsite?.subsite_logo ? logoSubsite : }
+
+
+
+ {/* Main Menu */}
+
+ {menu
+ ?.filter((item) => item.visible)
+ ?.map((item, index) => (
+
+ ))}
+
+
+ {/* Secondary Menu */}
+
+
+ {/* Headerslim Menu - main site */}
+ {!subsite &&
}
+
+ {/* Social Links */}
+
+
+ {/* Headerslim Menu - parent site (if subsite) */}
+ {subsite &&
}
+
+
+ setCollapseOpen(!collapseOpen)}
>
- {subsite?.subsite_logo ? logoSubsite : }
-
-
+
+
- {/* Main Menu */}
-
- {menu
- ?.filter((item) => item.visible)
- ?.map((item, index) => (
-
- ))}
-
-
- {/* Secondary Menu */}
-
-
- {/* Headerslim Menu - main site */}
- {!subsite && }
-
- {/* Social Links */}
-
-
- {/* Headerslim Menu - parent site (if subsite) */}
- {subsite && }
-
+
) : null}
@@ -144,6 +166,13 @@ const Navigation = ({ pathname }) => {
);
};
+const messages = defineMessages({
+ CloseMenu: {
+ id: 'close-menu',
+ defaultMessage: 'Chiudi menu',
+ },
+});
+
Navigation.propTypes = {
pathname: PropTypes.string.isRequired,
};
diff --git a/src/theme/ItaliaTheme/Components/_card.scss b/src/theme/ItaliaTheme/Components/_card.scss
index 9656bb18a..5ae2e71ec 100644
--- a/src/theme/ItaliaTheme/Components/_card.scss
+++ b/src/theme/ItaliaTheme/Components/_card.scss
@@ -60,7 +60,7 @@
}
&.card-teaser .card-body {
- flex: 1 0 75%;
+ flex: 1 0 74%;
}
}
diff --git a/src/theme/ItaliaTheme/Components/_search.scss b/src/theme/ItaliaTheme/Components/_search.scss
index ea88018be..eb2d2dc1a 100644
--- a/src/theme/ItaliaTheme/Components/_search.scss
+++ b/src/theme/ItaliaTheme/Components/_search.scss
@@ -7,5 +7,6 @@
border-color: var(--focus-outline-color) !important;
box-shadow: 0 0 0 2px var(--focus-outline-color) !important;
outline: none !important;
+ background-color: #0062e2;
}
}
diff --git a/src/theme/_site-variables.scss b/src/theme/_site-variables.scss
index c3e96cfcb..60917e1b1 100644
--- a/src/theme/_site-variables.scss
+++ b/src/theme/_site-variables.scss
@@ -21,7 +21,7 @@ $font-family-monospace-light: Roboto Mono Light !default;
// Per abilitare l'header bianco impostare a true
// e impostare "$header-center-bg-color: white" come qui sotto
-$enable-header-white-background: false;
+$enable-header-white-background: false !default;
// $header-center-bg-color: white;
// $header-slim-bg-color: #3f3f3f;
diff --git a/src/theme/bootstrap-override/_bootstrap-italia-site.scss b/src/theme/bootstrap-override/_bootstrap-italia-site.scss
index 0e57b65cd..94c5450fe 100644
--- a/src/theme/bootstrap-override/_bootstrap-italia-site.scss
+++ b/src/theme/bootstrap-override/_bootstrap-italia-site.scss
@@ -203,4 +203,5 @@
// gestione dei focus
@import 'bootstrap-italia/src/scss/utilities/focus';
@import 'bootstrap-italia/src/scss/utilities/icons';
+ @import './bootstrap-italia/focus';
}
diff --git a/src/theme/bootstrap-override/bootstrap-italia/_focus.scss b/src/theme/bootstrap-override/bootstrap-italia/_focus.scss
new file mode 100644
index 000000000..1e28e48c8
--- /dev/null
+++ b/src/theme/bootstrap-override/bootstrap-italia/_focus.scss
@@ -0,0 +1,3 @@
+.skiplinks a:focus:not(.focus--mouse) {
+ border: 2px solid;
+}
diff --git a/yarn.lock b/yarn.lock
index a0ca599f1..2e6925f0c 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -6557,8 +6557,8 @@ __metadata:
postcss-scss: 4.0.9
prettier: 3.1.0
react-dropzone: 11.0.1
+ react-focus-lock: 2.9.4
react-google-recaptcha-v3: 1.7.0
- react-highlight-words: 0.18.0
react-select: ^4.3.1
react-slick: ^0.29.0
release-it: 16.1.3
@@ -8450,13 +8450,6 @@ __metadata:
languageName: node
linkType: hard
-"highlight-words-core@npm:^1.2.0":
- version: 1.2.2
- resolution: "highlight-words-core@npm:1.2.2"
- checksum: 737758a8a572c82919552b031df300016164b7d0db6a819d24bc6c7ca2279d3cd6d03497728930d6402423c7a3fc2f42c628a9b01b025c704a0b56a635377511
- languageName: node
- linkType: hard
-
"hoist-non-react-statics@npm:3.3.2, hoist-non-react-statics@npm:^3.3.1, hoist-non-react-statics@npm:^3.3.2":
version: 3.3.2
resolution: "hoist-non-react-statics@npm:3.3.2"
@@ -8503,14 +8496,7 @@ __metadata:
languageName: node
linkType: hard
-"http-cache-semantics@npm:^4.1.0":
- version: 4.1.0
- resolution: "http-cache-semantics@npm:4.1.0"
- checksum: 974de94a81c5474be07f269f9fd8383e92ebb5a448208223bfb39e172a9dbc26feff250192ecc23b9593b3f92098e010406b0f24bd4d588d631f80214648ed42
- languageName: node
- linkType: hard
-
-"http-cache-semantics@npm:^4.1.1":
+"http-cache-semantics@npm:^4.1.0, http-cache-semantics@npm:^4.1.1":
version: 4.1.1
resolution: "http-cache-semantics@npm:4.1.1"
checksum: 83ac0bc60b17a3a36f9953e7be55e5c8f41acc61b22583060e8dedc9dd5e3607c823a88d0926f9150e571f90946835c7fe150732801010845c72cd8bbff1a236
@@ -9462,18 +9448,7 @@ __metadata:
languageName: node
linkType: hard
-"json5@npm:^1.0.1":
- version: 1.0.1
- resolution: "json5@npm:1.0.1"
- dependencies:
- minimist: ^1.2.0
- bin:
- json5: lib/cli.js
- checksum: e76ea23dbb8fc1348c143da628134a98adf4c5a4e8ea2adaa74a80c455fc2cdf0e2e13e6398ef819bfe92306b610ebb2002668ed9fc1af386d593691ef346fc3
- languageName: node
- linkType: hard
-
-"json5@npm:^1.0.2":
+"json5@npm:^1.0.1, json5@npm:^1.0.2":
version: 1.0.2
resolution: "json5@npm:1.0.2"
dependencies:
@@ -9484,16 +9459,7 @@ __metadata:
languageName: node
linkType: hard
-"json5@npm:^2.1.2, json5@npm:^2.2.1":
- version: 2.2.1
- resolution: "json5@npm:2.2.1"
- bin:
- json5: lib/cli.js
- checksum: 74b8a23b102a6f2bf2d224797ae553a75488b5adbaee9c9b6e5ab8b510a2fc6e38f876d4c77dea672d4014a44b2399e15f2051ac2b37b87f74c0c7602003543b
- languageName: node
- linkType: hard
-
-"json5@npm:^2.2.3":
+"json5@npm:^2.1.2, json5@npm:^2.2.1, json5@npm:^2.2.3":
version: 2.2.3
resolution: "json5@npm:2.2.3"
bin:
@@ -10110,13 +10076,6 @@ __metadata:
languageName: node
linkType: hard
-"memoize-one@npm:^4.0.0":
- version: 4.0.3
- resolution: "memoize-one@npm:4.0.3"
- checksum: addd18c046542f57440ba70bf8ebd48663d17626cade681f777522ef70900a87ec72c5041bed8ece4f6d40a2cb58803bae388b50a4b740d64f36bcda20c147b7
- languageName: node
- linkType: hard
-
"memoize-one@npm:^5.0.0, memoize-one@npm:^5.1.1":
version: 5.2.1
resolution: "memoize-one@npm:5.2.1"
@@ -11856,19 +11815,6 @@ __metadata:
languageName: node
linkType: hard
-"react-highlight-words@npm:0.18.0":
- version: 0.18.0
- resolution: "react-highlight-words@npm:0.18.0"
- dependencies:
- highlight-words-core: ^1.2.0
- memoize-one: ^4.0.0
- prop-types: ^15.5.8
- peerDependencies:
- react: ^0.14.0 || ^15.0.0 || ^16.0.0-0 || ^17.0.0-0 || ^18.0.0-0
- checksum: ff9759e7ebeb140067854d8cad3021123ba0e3b78bda14d35d9b21dd7890986c858955885ddbcb537e9f88472aebe4a23a1841b7af190989efb0a8ecf7dc2a57
- languageName: node
- linkType: hard
-
"react-input-autosize@npm:^3.0.0":
version: 3.0.0
resolution: "react-input-autosize@npm:3.0.0"
@@ -12769,11 +12715,11 @@ __metadata:
linkType: hard
"semver@npm:2 || 3 || 4 || 5, semver@npm:^5.4.1":
- version: 5.7.1
- resolution: "semver@npm:5.7.1"
+ version: 5.7.2
+ resolution: "semver@npm:5.7.2"
bin:
- semver: ./bin/semver
- checksum: 57fd0acfd0bac382ee87cd52cd0aaa5af086a7dc8d60379dfe65fea491fb2489b6016400813930ecd61fd0952dae75c115287a1b16c234b1550887117744dfaf
+ semver: bin/semver
+ checksum: fb4ab5e0dd1c22ce0c937ea390b4a822147a9c53dbd2a9a0132f12fe382902beef4fbf12cf51bb955248d8d15874ce8cd89532569756384f994309825f10b686
languageName: node
linkType: hard
@@ -12788,7 +12734,7 @@ __metadata:
languageName: node
linkType: hard
-"semver@npm:7.5.2, semver@npm:^7.3.7":
+"semver@npm:7.5.2":
version: 7.5.2
resolution: "semver@npm:7.5.2"
dependencies:
@@ -12799,7 +12745,7 @@ __metadata:
languageName: node
linkType: hard
-"semver@npm:7.5.4, semver@npm:^7.3.8":
+"semver@npm:7.5.4, semver@npm:^7.3.4, semver@npm:^7.3.5, semver@npm:^7.3.7, semver@npm:^7.3.8":
version: 7.5.4
resolution: "semver@npm:7.5.4"
dependencies:
@@ -12810,16 +12756,7 @@ __metadata:
languageName: node
linkType: hard
-"semver@npm:^6.0.0, semver@npm:^6.1.1, semver@npm:^6.1.2, semver@npm:^6.3.0":
- version: 6.3.0
- resolution: "semver@npm:6.3.0"
- bin:
- semver: ./bin/semver.js
- checksum: 1b26ecf6db9e8292dd90df4e781d91875c0dcc1b1909e70f5d12959a23c7eebb8f01ea581c00783bbee72ceeaad9505797c381756326073850dc36ed284b21b9
- languageName: node
- linkType: hard
-
-"semver@npm:^6.3.1":
+"semver@npm:^6.0.0, semver@npm:^6.1.1, semver@npm:^6.1.2, semver@npm:^6.3.0, semver@npm:^6.3.1":
version: 6.3.1
resolution: "semver@npm:6.3.1"
bin:
@@ -12828,17 +12765,6 @@ __metadata:
languageName: node
linkType: hard
-"semver@npm:^7.3.4, semver@npm:^7.3.5":
- version: 7.3.7
- resolution: "semver@npm:7.3.7"
- dependencies:
- lru-cache: ^6.0.0
- bin:
- semver: bin/semver.js
- checksum: 2fa3e877568cd6ce769c75c211beaed1f9fce80b28338cadd9d0b6c40f2e2862bafd62c19a6cff42f3d54292b7c623277bcab8816a2b5521cf15210d43e75232
- languageName: node
- linkType: hard
-
"set-blocking@npm:^2.0.0, set-blocking@npm:~2.0.0":
version: 2.0.0
resolution: "set-blocking@npm:2.0.0"
@@ -12985,13 +12911,13 @@ __metadata:
linkType: hard
"simple-git@npm:^3.3.0":
- version: 3.14.1
- resolution: "simple-git@npm:3.14.1"
+ version: 3.22.0
+ resolution: "simple-git@npm:3.22.0"
dependencies:
"@kwsites/file-exists": ^1.1.1
"@kwsites/promise-deferred": ^1.1.1
debug: ^4.3.4
- checksum: f9d2282e1483f8f42325a7e80803389eb540101a88968bf9fd277c1eade8621d4c24dcf2677be5d611df8716934fb4c9676356052ac03e2fcec7517b4b922e8b
+ checksum: 118c43a3e1e27aecd8487205ed509acf925112de6edf1feb304d180c673f6e08279a13bcfae33c948de8b0809f2b929f9263fa7033ec7ef84908904eda0c3e2d
languageName: node
linkType: hard