diff --git a/app/assets/stylesheets/layout/cookies_consent_management.scss b/app/assets/stylesheets/layout/cookies_consent_management.scss index 389208c7e..10aebdde9 100644 --- a/app/assets/stylesheets/layout/cookies_consent_management.scss +++ b/app/assets/stylesheets/layout/cookies_consent_management.scss @@ -30,4 +30,34 @@ } } } + + .cookies-essentials { + ul { + list-style: none; + margin-#{$global-left}: 0; + + li { + display: flex; + gap: $line-height; + justify-content: space-between; + padding: $line-height / 3; + + &:nth-child(odd) { + background: #efefef; + } + } + } + + .switch { + margin-top: $line-height / 3; + + &:focus-within { + @include focus-outline; + } + } + + p { + margin-bottom: 0; + } + } } diff --git a/app/components/layout/cookies_consent/management_component.html.erb b/app/components/layout/cookies_consent/management_component.html.erb index 99211e52f..dad0cbabb 100644 --- a/app/components/layout/cookies_consent/management_component.html.erb +++ b/app/components/layout/cookies_consent/management_component.html.erb @@ -12,6 +12,17 @@

<%= t("cookies_management.essentials.title") %>

<%= t("cookies_management.essentials.description") %>

+
+ +
diff --git a/config/locales/en/general.yml b/config/locales/en/general.yml index 677016950..407809720 100644 --- a/config/locales/en/general.yml +++ b/config/locales/en/general.yml @@ -946,3 +946,4 @@ en: essentials: title: Essential cookies description: They are used for many different purposes, such as recognising you as a user, choosing the language or customising the way in which content is displayed. + hint: Without these, basic navigation functions will be impaired, so they should always be active. diff --git a/config/locales/es/general.yml b/config/locales/es/general.yml index 111848515..8cbe6a81b 100644 --- a/config/locales/es/general.yml +++ b/config/locales/es/general.yml @@ -946,3 +946,4 @@ es: essentials: title: Cookies esenciales description: Utilizadas para finalidades muy diversas, como por ejemplo, reconocerte como usuario, elegir el idioma o personalizar la forma en la que se muestra el contenido. + hint: Sin ellas, las funciones básicas de navegación se verán afectadas, por lo que deben estar siempre activas. diff --git a/spec/components/layout/cookies_consent/management_component_spec.rb b/spec/components/layout/cookies_consent/management_component_spec.rb index 5188ee0ae..4d8f4c036 100644 --- a/spec/components/layout/cookies_consent/management_component_spec.rb +++ b/spec/components/layout/cookies_consent/management_component_spec.rb @@ -20,6 +20,7 @@ describe Layout::CookiesConsent::ManagementComponent do expect(page).to have_css "h2", text: "Cookies management" expect(page).to have_link "More information about cookies", href: "/cookies_policy" expect(page).to have_css "h3", text: "Essential cookies" + expect(page).to have_css ".switch-input[type='checkbox'][name='essential_cookies'][disabled][checked]" expect(page).to have_button "Accept essential cookies" end