diff --git a/confiture-web-app/src/components/account/dashboard/AuditRow.vue b/confiture-web-app/src/components/account/dashboard/AuditRow.vue index 1ce56a404..aef2fa47a 100644 --- a/confiture-web-app/src/components/account/dashboard/AuditRow.vue +++ b/confiture-web-app/src/components/account/dashboard/AuditRow.vue @@ -334,8 +334,8 @@ const csvExportFilename = computed(() => { .audit-name:focus { outline: none; } -.audit-name:focus::before { - outline: 2px solid #0a76f6; +.audit-name:focus-visible::before { + outline: 2px solid var(--dsfr-outline); } .audit-name::before { diff --git a/confiture-web-app/src/components/audit/AraTabs.vue b/confiture-web-app/src/components/audit/AraTabs.vue index 00af43b5d..566a59768 100644 --- a/confiture-web-app/src/components/audit/AraTabs.vue +++ b/confiture-web-app/src/components/audit/AraTabs.vue @@ -179,7 +179,7 @@ li { background-color: var(--active-tint); } -.tabs button:focus { +.tabs button:focus-visible { outline: 2px solid var(--dsfr-outline); outline-offset: -2px; } diff --git a/confiture-web-app/src/components/audit/AuditGenerationFilters.vue b/confiture-web-app/src/components/audit/AuditGenerationFilters.vue index 7e2c14320..1af006cb2 100644 --- a/confiture-web-app/src/components/audit/AuditGenerationFilters.vue +++ b/confiture-web-app/src/components/audit/AuditGenerationFilters.vue @@ -287,8 +287,8 @@ const notApplicableCount = computed( margin-bottom: 2rem; } -.toggle-column-button:focus { - outline: 2px solid #0a76f6; +.toggle-column-button:focus-visible { + outline: 2px solid var(--dsfr-outline); outline-offset: -2px; } diff --git a/confiture-web-app/src/components/audit/CriteriumNotCompliantAccordion.vue b/confiture-web-app/src/components/audit/CriteriumNotCompliantAccordion.vue index a9e1a9aa6..92819d7ef 100644 --- a/confiture-web-app/src/components/audit/CriteriumNotCompliantAccordion.vue +++ b/confiture-web-app/src/components/audit/CriteriumNotCompliantAccordion.vue @@ -260,7 +260,7 @@ const isOffline = useIsOffline(); .upload-label { cursor: pointer; - outline-color: #0a76f6; + outline-color: var(--dsfr-outline); outline-offset: 2px; outline-width: 2px; outline-style: none;