commit b73240b865d1ff3dd5e9a9df94b66776d339f383 Author: headpatsyou Date: Sat Jan 24 20:20:48 2026 +0000 inital commit diff --git a/documents/documents.html b/documents/documents.html new file mode 100644 index 0000000..42ea657 --- /dev/null +++ b/documents/documents.html @@ -0,0 +1,78 @@ + + + + + + + + + Documentos | Comfy Solutions + + + + + + + + + + + +

+ + +

Documentos de Acessibilidade

+ +

+ Aqui encontra todos os documentos relacionados com o nosso compromisso de acessibilidade. Os documentos estão organizados por categoria. +

+ +

+ + +

+ + + + diff --git a/documents/documents.js b/documents/documents.js new file mode 100644 index 0000000..4e6705e --- /dev/null +++ b/documents/documents.js @@ -0,0 +1,153 @@ +document.addEventListener('DOMContentLoaded', function() { + const languageToggle = document.getElementById('language-toggle'); + const langLabel = document.getElementById('lang-label'); + const pageHeading = document.getElementById('page-heading'); + const portugueseContent = document.getElementById('portuguese-content'); + const englishContent = document.getElementById('english-content'); + const navCommitment = document.getElementById('nav-commitment'); + const navDocuments = document.getElementById('nav-documents'); + const htmlElement = document.documentElement; + + let documentsData = []; + + // Load documents from JSON + fetch('./documents.json') + .then(response => response.json()) + .then(data => { + documentsData = data.documents; + renderDocuments('pt-PT'); + setLanguage(localStorage.getItem('preferred-language') || 'pt-PT'); + }) + .catch(error => console.error('Error loading documents:', error)); + + languageToggle.addEventListener('click', function() { + const currentLang = htmlElement.lang; + const newLang = currentLang === 'pt-PT' ? 'en' : 'pt-PT'; + setLanguage(newLang); + }); + + function renderDocuments(lang) { + const container = lang === 'pt-PT' + ? document.getElementById('documents-container') + : document.getElementById('documents-container-en'); + + const filtered = documentsData; + + // Group by category + const grouped = {}; + filtered.forEach(doc => { + if (!grouped[doc.category]) { + grouped[doc.category] = []; + } + grouped[doc.category].push(doc); + }); + + container.innerHTML = ''; + + Object.keys(grouped).forEach(category => { + const categoryTitle = getCategoryTitle(category, lang); + const categoryDiv = document.createElement('div'); + categoryDiv.className = 'document-category'; + + const categoryHeading = document.createElement('h2'); + categoryHeading.textContent = categoryTitle; + categoryDiv.appendChild(categoryHeading); + + grouped[category].forEach(doc => { + const docCard = document.createElement('div'); + docCard.className = 'document-card'; + + const cardHeader = document.createElement('div'); + cardHeader.className = 'card-header'; + + const docTitle = document.createElement('h3'); + docTitle.textContent = doc.title; + cardHeader.appendChild(docTitle); + + const langBadge = document.createElement('div'); + langBadge.className = 'language-badge'; + const langText = getLanguageName(doc.language); + langBadge.innerHTML = ` + language + ${langText} + `; + cardHeader.appendChild(langBadge); + + docCard.appendChild(cardHeader); + + const docDesc = document.createElement('p'); + docDesc.textContent = doc.description; + docCard.appendChild(docDesc); + + const downloadLink = document.createElement('a'); + downloadLink.href = doc.filename; + downloadLink.className = 'btn btn-primary'; + downloadLink.download = ''; + downloadLink.innerHTML = ` + download + ${lang === 'pt-PT' ? 'Download' : 'Download'} + `; + + const linkWrapper = document.createElement('p'); + linkWrapper.style.marginTop = '16px'; + linkWrapper.appendChild(downloadLink); + docCard.appendChild(linkWrapper); + + categoryDiv.appendChild(docCard); + }); + + container.appendChild(categoryDiv); + }); + } + + function getLanguageName(langCode) { + const names = { + 'pt-PT': 'Português', + 'en': 'English' + }; + return names[langCode] || langCode; + } + + function getCategoryTitle(category, lang) { + const titles = { + legal: { + 'pt-PT': 'Documentos Legais', + 'en': 'Legal Documents' + }, + report: { + 'pt-PT': 'Relatórios', + 'en': 'Reports' + }, + policy: { + 'pt-PT': 'Políticas', + 'en': 'Policies' + } + }; + return titles[category][lang] || category; + } + + function setLanguage(lang) { + if (lang === 'en') { + htmlElement.lang = 'en'; + portugueseContent.classList.add('hidden'); + englishContent.classList.remove('hidden'); + pageHeading.lang = 'en'; + pageHeading.textContent = 'Accessibility Documents'; + langLabel.textContent = 'Português'; + if (navCommitment) navCommitment.textContent = 'Commitment'; + if (navDocuments) navDocuments.textContent = 'Documents'; + renderDocuments('en'); + } else { + htmlElement.lang = 'pt-PT'; + englishContent.classList.add('hidden'); + portugueseContent.classList.remove('hidden'); + pageHeading.lang = 'pt-PT'; + pageHeading.textContent = 'Documentos de Acessibilidade'; + langLabel.textContent = 'English'; + if (navCommitment) navCommitment.textContent = 'Compromisso'; + if (navDocuments) navDocuments.textContent = 'Documentos'; + renderDocuments('pt-PT'); + } + localStorage.setItem('preferred-language', lang); + } +}); diff --git a/documents/documents.json b/documents/documents.json new file mode 100644 index 0000000..09b99be --- /dev/null +++ b/documents/documents.json @@ -0,0 +1,20 @@ +{ + "documents": [ + { + "id": "declaration-powerliftingpt", + "title": "Declaração de Acessibilidade - powerlifting.pt", + "description": "Declaração formal de acessibilidade conforme Decreto-Lei n.º 83/2018 para o website powerlifting.pt", + "filename": "powerliftingpt/accessibility-statement_2026-01-24.html", + "language": "pt-PT", + "category": "legal" + }, + { + "id": "report-pt", + "title": "Checklist 10 aspetos funcionais - powerlifting.pt", + "description": "Relatório detalhado de testes de acessibilidade do WGAC 2.1 e do governo português.", + "filename": "powerliftingpt/sintese-10aspetos_powerliftingpt.xlsx", + "language": "pt-PT", + "category": "report" + } + ] +} diff --git a/documents/icon.png b/documents/icon.png new file mode 100644 index 0000000..6a12267 Binary files /dev/null and b/documents/icon.png differ diff --git a/documents/powerliftingpt/accessibility-statement_2026-01-24.html b/documents/powerliftingpt/accessibility-statement_2026-01-24.html new file mode 100644 index 0000000..0896d2a --- /dev/null +++ b/documents/powerliftingpt/accessibility-statement_2026-01-24.html @@ -0,0 +1,111 @@ +

Declaração de Acessibilidade e Usabilidade

+ A + Associação Portuguesa de Powerlifting junto com a comfy.solutions + compromete-se a disponibilizar + o sítio Web + powerlifting.pt, + em conformidade com o Decreto-Lei n.º 83/2018, de 19 de + outubro, que transpõe a Diretiva (UE) 2016/2102 do + Parlamento Europeu e do Conselho, relativa à + acessibilidade dos sítios Web e das aplicações móveis. +

I. Estado de conformidade

+ O sítio Web + powerlifting.pt + da + Associação Portuguesa de Powerlifting junto com a comfy.solutions está + plenamente conforme + para com o Decreto-Lei n.º 83/2018 de 19 de outubro. +

+ II. Elaboração da presente declaração de acessibilidade e + usabilidade +

+ Esta declaração foi atualizada a + 2026-01-24. +

+ De acordo com o artigo 9º do Decreto-Lei n.º 83/2018, as entidades + devem adotar os procedimentos de monitorização a seguir + apresentados. Os procedimentos A) e B) são obrigatórios. O + procedimento C) é recomendado. +

+ A. Avaliações automáticas levadas a efeito +

(2026-01-24). Relatório: Verificação automática da página /pt
- Ferramenta utilizada: accessMonitor
- Amostra: 1 páginas.
- Principais resultados (sumário): No total de uma página nesta availação automática, foi obtido uma pontuação 10/10 no accessMonitor, onde, das 33 práticas encontradas, 28 das mesmas foram consideradas aceitáveis (19 consideradas A, 9 consideradas AA) e 5 das mesmas foram consideradas para revisão manual (3 consideradas A, 2 consideradas AAA).
(2026-01-24). Relatório: Verificação automática da página /pt/sobre/quem-somos
- Ferramenta utilizada: accessMonitor
- Amostra: 1 páginas.
- Principais resultados (sumário): No total de uma página nesta availação automática, foi obtido uma pontuação 9.7/10 no accessMonitor, onde, das 33 práticas encontradas, 26 das mesmas foram consideradas aceitáveis (16 consideradas A, 10 consideradas AA), 6 das mesmas foram consideradas para revisão manual (3 consideradas A, 3 consideradas AAA) e 1 das mesmas foi considerada Não aceitável (1 considerada AA)
(2026-01-24). Relatório: Verificação automática da página /pt/sobre/contatos
- Ferramenta utilizada: accessMonitor
- Amostra: 1 páginas.
- Principais resultados (sumário): No total de uma página nesta availação automática, foi obtido uma pontuação 9.7/10 no accessMonitor, onde, das 30 práticas encontradas, 25 das mesmas foram consideradas aceitáveis (16 consideradas A, 9 consideradas AA) e 5 das mesmas foram consideradas para revisão manual (3 consideradas A, 2 consideradas AAA).
(2026-01-24). Relatório: Verificação automática da página /pt/competicoes/calendario
- Ferramenta utilizada: accessMonitor
- Amostra: 0 páginas.
- Principais resultados (sumário): Esta página não foi possível ser analisada pois a ferramenta accessMonitor, do gov.pt, estava a devolver um erro 500 (erro interno).
(2026-01-24). Relatório: Verificação automática da página /pt/competicoes/resultados
- Ferramenta utilizada: accessMonitor
- Amostra: 1 páginas.
- Principais resultados (sumário): No total de uma página nesta availação automática, foi obtido uma pontuação 9.7/10 no accessMonitor, onde, das 33 práticas encontradas, 24 das mesmas foram consideradas aceitáveis (17 consideradas A, 7 consideradas AA), 5 das mesmas foram consideradas para revisão manual (3 consideradas A, 3 consideradas AAA) e 4 das mesmas foi considerada Não aceitável (2 consideradas A, 2 consideradas AA)
(2026-01-24). Relatório: Verificação automática da página /pt/regras/ipf-rule-book
- Ferramenta utilizada: accessMonitor
- Amostra: 1 páginas.
- Principais resultados (sumário): No total de uma página nesta availação automática, foi obtido uma pontuação 9.2/10 no accessMonitor, onde, das 34 práticas encontradas, 26 das mesmas foram consideradas aceitáveis (16 consideradas A, 10 consideradas AA), 6 das mesmas foram consideradas para revisão manual (3 consideradas A, 3 consideradas AAA) e 2 das mesmas foi considerada Não aceitável (1 considerada A, 1 considerada AAA)
(2026-01-24). Relatório: Verificação automática da página /pt/regras/anti-doping
- Ferramenta utilizada: accessMonitor
- Amostra: 1 páginas.
- Principais resultados (sumário): No total de uma página nesta availação automática, foi obtido uma pontuação 9.2/10 no accessMonitor, onde, das 34 práticas encontradas, 27 das mesmas foram consideradas aceitáveis (17 consideradas A, 10 consideradas AA), 6 das mesmas foram consideradas para revisão manual (3 consideradas A, 3 consideradas AAA) e 1 das mesmas foi considerada Não aceitável (1 considerada AA)
(2026-01-24). Relatório: Verificação automática da página /pt/perguntas
- Ferramenta utilizada: accessMonitor
- Amostra: 1 páginas.
- Principais resultados (sumário): No total de uma página nesta availação automática, foi obtido uma pontuação 9.2/10 no accessMonitor, onde, das 30 práticas encontradas, 25 das mesmas foram consideradas aceitáveis (16 consideradas A, 9 consideradas AA)e 3 das mesmas foram consideradas para revisão manual (3 consideradas A, 2 consideradas AAA).

+ B. Avaliações manuais levadas a efeito: +

(2025-01-24). Relatório: Checklist "10 aspetos funcionais"
- Amostra: 2 páginas.
- Principais resultados (heurísticas satisfeitas/total heurísticas aplicadas): 22/23

+ C. Testes de usabilidade com pessoas com + deficiência: +

O sítio Web ainda não foi alvo de testes com + utilizadores com deficiência. +

+ III. Contacto e solicitação de informação relativa + ao sítio Web +

+ Para contactar, enviar sugestões, efetuar reclamações ou + solicitar informação adicional relativamente aos conteúdos + e/ou funcionalidades presentes no sítio Web + da + Associação Portuguesa de Powerlifting junto com a comfy.solutions, utilize, por + favor, os seguintes meios: +

Correio eletrónico:: acessibilidade@comfy.solutions
Website: accessiblidade.comfy.solutions

+ IV. Outras evidências +

+ A + Associação Portuguesa de Powerlifting junto com a comfy.solutions não apresentou, + aquando do preenchimento da presente Declaração, + outras evidências ou esforços para tornar o seu sítio + Web conforme para com os requisitos de acessibilidade + constantes do Decreto-Lei n.º 83/2018, de 19 de outubro. +

+ V. Denúncia de situações de discriminação +

+ De acordo com o n.º 1 do artigo 13.º do Decreto-Lei n.º 83/2018, de + 19 de outubro, sempre que uma pessoa com deficiência seja + objeto de um tratamento menos favorável do que aquele que + é, tenha sido ou venha a ser dado a outra pessoa em + situação comparável, que consubstancie uma prática + discriminatória contra pessoas com deficiência, prevista e + punida nos termos do + artigo 4.º da Lei n.º 46/2006, de 28 de agosto, pode, essa pessoa, apresentar queixa, de acordo com o + disposto no + Decreto-Lei n.º 34/2007, de 15 de fevereiro. +

+ O Instituto Nacional para a Reabilitação (INR, I.P.), + disponibiliza um + formulário para denunciar situações de discriminação, encaminhando as queixas apresentadas às entidades + competentes. Anualmente, o INR, I.P. elabora um relatório + anual sobre a aplicação da lei que proíbe e pune a + discriminação em razão da deficiência e da existência de + risco agravado de saúde (Lei n.o 46/2006, de 28 de + agosto). +

+ +

+ A presente Declaração de Acessibilidade e Usabilidade foi + criada com o auxílio do + Gerador WAI-Tools PT v1.5, desenvolvido no âmbito do projeto + WAI-Tools, de cujo + consórcio a AMA é parte integrante. A Declaração foi + concebida em conformidade com o Decreto-Lei n.º 83/2018, de 19 de + outubro. +

\ No newline at end of file diff --git a/documents/powerliftingpt/sintese-10aspetos_powerliftingpt.xlsx b/documents/powerliftingpt/sintese-10aspetos_powerliftingpt.xlsx new file mode 100644 index 0000000..af6d9d3 Binary files /dev/null and b/documents/powerliftingpt/sintese-10aspetos_powerliftingpt.xlsx differ diff --git a/documents/style.css b/documents/style.css new file mode 100644 index 0000000..3fe102b --- /dev/null +++ b/documents/style.css @@ -0,0 +1,610 @@ +/* Material Design 2 - Comfy Solutions */ + +@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap'); + +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} + +:root { + --primary-color: #5B7394; + --accent-color: #FDC95D; + --dark-color: #040D15; + --surface-color: #ffffff; + --surface-variant: #f5f5f5; + --text-primary: #1a1a1a; + --text-secondary: #424242; + --divider-color: #e0e0e0; + --focus-color: #FDC95D; + + /* Material Design 2 elevation */ + --elevation-1: 0px 2px 1px -1px rgba(0,0,0,0.2), 0px 1px 1px 0px rgba(0,0,0,0.14), 0px 1px 3px 0px rgba(0,0,0,0.12); + --elevation-2: 0px 3px 1px -2px rgba(0,0,0,0.2), 0px 2px 2px 0px rgba(0,0,0,0.14), 0px 1px 5px 0px rgba(0,0,0,0.12); + --elevation-4: 0px 2px 4px -1px rgba(0,0,0,0.2), 0px 4px 5px 0px rgba(0,0,0,0.14), 0px 1px 10px 0px rgba(0,0,0,0.12); +} + +html { + scroll-behavior: smooth; +} + +body { + font-family: 'Roboto', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; + line-height: 1.5; + color: var(--text-primary); + background-color: var(--surface-color); + font-size: 14px; + font-weight: 400; + letter-spacing: 0.25px; +} + +.container { + max-width: 960px; + margin: 0 auto; + padding: 0; +} + +/* Skip Link */ +.skip-link { + position: absolute; + top: -40px; + left: 0; + background: var(--primary-color); + color: white; + padding: 8px 16px; + text-decoration: none; + z-index: 100; +} + +.skip-link:focus { + top: 0; +} + +/* Header */ +.header { + background-color: var(--primary-color); + color: white; + box-shadow: var(--elevation-4); + padding: 16px 24px; + position: sticky; + top: 0; + z-index: 1000; +} + +.header-content { + display: flex; + justify-content: space-between; + align-items: center; + max-width: 960px; + margin: 0 auto; +} + +.header-left { + display: flex; + align-items: center; + gap: 40px; +} + +.brand { + font-size: 20px; + font-weight: 500; + letter-spacing: 0.15px; + margin: 0; + color: white; + display: flex; + align-items: center; + gap: 12px; +} + +.brand-link { + color: white; + text-decoration: none; + transition: color 0.2s ease; +} + +.brand-link:hover { + color: #f0f0f0; +} + +.brand-link:focus-visible { + outline: 3px solid var(--accent-color); + outline-offset: 2px; + border-radius: 2px; +} + +/* Navigation Menu */ +.nav-menu { + display: flex; + gap: 24px; + align-items: center; +} + +.nav-link { + color: rgba(255, 255, 255, 0.87); + text-decoration: none; + font-size: 14px; + font-weight: 500; + letter-spacing: 0.4px; + transition: color 0.2s ease; + padding-bottom: 4px; + border-bottom: 2px solid transparent; +} + +.nav-link:hover { + color: white; +} + +.nav-link:focus-visible { + outline: 3px solid var(--accent-color); + outline-offset: 2px; +} + +.nav-link.nav-active { + color: white; + border-bottom-color: var(--accent-color); +} + +.brand-icon { + height: 28px; + width: 28px; + object-fit: contain; +} + +/* Buttons */ +.btn { + display: inline-flex; + align-items: center; + gap: 8px; + padding: 0; + border: none; + border-radius: 4px; + font-family: 'Roboto', sans-serif; + font-size: 14px; + font-weight: 500; + letter-spacing: 0.4px; + text-decoration: none; + cursor: pointer; + transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); + text-transform: uppercase; +} + +.btn-primary { + background-color: var(--primary-color); + color: white; + padding: 10px 24px; + box-shadow: var(--elevation-2); +} + +.btn-primary:hover { + background-color: #3d4d63; + box-shadow: var(--elevation-4); +} + +.btn-primary:active { + box-shadow: var(--elevation-1); +} + +.btn-text { + color: var(--dark-color); + background-color: var(--accent-color); + padding: 8px 16px; + gap: 8px; + box-shadow: var(--elevation-1); +} + +.btn-text:hover { + background-color: #fdd96f; + box-shadow: var(--elevation-2); +} + +.btn-text:focus-visible { + outline: 3px solid var(--dark-color); +} + +/* Material Icons */ +.material-icons { + font-size: 24px; + width: 24px; + height: 24px; + display: inline-flex; + align-items: center; + justify-content: center; +} + +.btn .material-icons { + font-size: 18px; + width: 18px; + height: 18px; +} + +/* Main Content */ +.main-content { + padding: 40px 24px; + max-width: 960px; + margin: 0 auto; +} + +.hero { + text-align: center; + margin-bottom: 40px; +} + +.hero h1 { + font-size: 32px; + font-weight: 300; + letter-spacing: 0.25px; + line-height: 1.4; + color: var(--dark-color); + margin: 0; +} + +.content-section { + display: flex; + flex-direction: column; + gap: 24px; +} + +.content-section h3 + p { + margin-top: -12px; +} + +h3 { + font-size: 20px; + font-weight: 500; + letter-spacing: 0.15px; + color: var(--dark-color); + margin: 0 0 8px 0; + display: flex; + align-items: center; + gap: 12px; +} + +h4 { + font-size: 16px; + font-weight: 500; + letter-spacing: 0.15px; + color: var(--dark-color); + margin: 0 0 8px 0; + display: flex; + align-items: center; + gap: 12px; +} + +p { + font-size: 14px; + font-weight: 400; + letter-spacing: 0.25px; + line-height: 1.6; + color: var(--text-secondary); + margin: 0; +} + +.leading-paragraph { + font-size: 16px; + font-weight: 400; + line-height: 1.7; + color: var(--text-primary); + margin: 0; +} + +/* Links */ +a { + color: var(--primary-color); + text-decoration: none; + transition: all 0.2s ease; + position: relative; +} + +a:hover { + color: #3d4d63; + text-decoration: underline; +} + +a:focus-visible { + outline: 3px solid var(--focus-color); + outline-offset: 2px; +} + +/* Cards */ +.verification-cards { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); + gap: 20px; + margin: 20px 0; +} + +.card { + background-color: var(--surface-variant); + border-radius: 4px; + padding: 24px; + box-shadow: var(--elevation-1); + transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); +} + +.card:hover { + box-shadow: var(--elevation-2); + transform: translateY(-2px); +} + +.card h4 { + color: var(--primary-color); + margin-bottom: 12px; +} + +.card p { + margin: 0; + color: var(--text-secondary); +} + +.card a { + color: var(--primary-color); + font-weight: 500; +} + +/* Boxes */ +.commitment-box, +.contact-box { + background-color: var(--surface-variant); + border-left: 4px solid var(--accent-color); + border-radius: 4px; + padding: 24px; + box-shadow: var(--elevation-1); +} + +.contact-box { + background-color: var(--dark-color); + color: white; + border-left-color: var(--accent-color); +} + +.contact-box h3 { + color: white; + margin-bottom: 16px; +} + +.contact-box p { + color: rgba(255, 255, 255, 0.87); +} + +.contact-box a { + color: var(--accent-color); +} + +.contact-box a:hover { + color: #fdd96f; +} + +.contact-box .btn-primary { + background-color: var(--accent-color); + color: var(--dark-color); + margin-top: 16px; +} + +.contact-box .btn-primary:hover { + background-color: #fdd96f; +} + +/* Language Content */ +.language-content { + opacity: 1; + transition: opacity 0.3s ease; +} + +.language-content.hidden { + display: none; +} + +/* Footer */ +.footer { + border-top: 1px solid var(--divider-color); + padding: 24px; + text-align: center; + color: var(--text-secondary); + font-size: 12px; + letter-spacing: 0.4px; + margin-top: 32px; +} + +/* Accessibility */ +*:focus-visible { + outline: 3px solid var(--focus-color); + outline-offset: 2px; +} + +/* Print Styles */ +@media print { + .header, + .footer { + display: none; + } + + .btn { + display: none; + } +} + +/* Documents Page */ +.documents-grid { + display: flex; + flex-direction: column; + gap: 32px; +} + +.document-category { + display: flex; + flex-direction: column; + gap: 16px; +} + +.document-category h2 { + margin: 0 0 8px 0; + padding-bottom: 12px; + border-bottom: 2px solid var(--accent-color); +} + +.document-card { + background-color: var(--surface-variant); + border-radius: 4px; + padding: 24px; + box-shadow: var(--elevation-1); + transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); +} + +.document-card:hover { + box-shadow: var(--elevation-2); + transform: translateY(-2px); +} + +.card-header { + display: flex; + justify-content: space-between; + align-items: flex-start; + gap: 16px; + margin-bottom: 8px; +} + +.document-card h3 { + font-size: 18px; + font-weight: 500; + letter-spacing: 0.15px; + color: var(--primary-color); + margin: 0; + flex: 1; +} + +.language-badge { + display: flex; + align-items: center; + gap: 6px; + background-color: var(--primary-color); + color: white; + padding: 6px 12px; + border-radius: 16px; + font-size: 12px; + font-weight: 500; + letter-spacing: 0.4px; + white-space: nowrap; +} + +.language-badge .material-icons { + font-size: 16px; + width: 16px; + height: 16px; +} + +.document-card p { + font-size: 14px; + color: var(--text-secondary); + margin: 0; +} + +/* Responsive Design */ +@media (max-width: 768px) { + .header { + padding: 12px 16px; + } + + .header-content { + flex-direction: column; + align-items: flex-start; + gap: 12px; + } + + .header-left { + gap: 16px; + } + + .nav-menu { + gap: 16px; + font-size: 13px; + } + + .nav-link { + padding-bottom: 2px; + } + + .brand { + font-size: 18px; + } + + .main-content { + padding: 28px 16px; + } + + .hero h2 { + font-size: 24px; + } + + .verification-cards { + grid-template-columns: 1fr; + gap: 16px; + } + + .card, + .commitment-box, + .contact-box { + padding: 16px; + } + + h3 { + font-size: 18px; + } + + h4 { + font-size: 14px; + } +} + +@media (max-width: 480px) { + .main-content { + padding: 24px 12px; + } + + .hero h2 { + font-size: 20px; + } + + .content-section { + gap: 20px; + } + + h3 { + font-size: 16px; + } + + h4 { + font-size: 14px; + } + + .card, + .commitment-box, + .contact-box { + padding: 16px; + } + + .btn { + width: 100%; + justify-content: center; + } +} + +/* Reduced Motion */ +@media (prefers-reduced-motion: reduce) { + * { + animation-duration: 0.01ms !important; + animation-iteration-count: 1 !important; + transition-duration: 0.01ms !important; + } +} + +/* High Contrast Mode */ +@media (prefers-contrast: more) { + a { + text-decoration: underline; + } + + .btn { + border: 2px solid currentColor; + } +} diff --git a/eval(2).csv b/eval(2).csv new file mode 100644 index 0000000..c05a810 --- /dev/null +++ b/eval(2).csv @@ -0,0 +1,27 @@ +URI;Data;ID;Tipo de erro;Nivel de Conformidade;Critério;Descrição;Número de ocorrências;Valor;Pontuação +;;img_01a;Sucesso;A;1.1.1;Constatei que todas as imagens da página têm o necessário equivalente alternativo em texto.;1;;9,1 +;;a_01a;Aviso;A;2.4.1;Constatei que o primeiro link da página nos permite saltar para o conteúdo principal.;1;;9,1 +;;a_02b;Aviso;A;2.4.1;Encontrei 1 link para contornar blocos de conteúdo.;1;;9,1 +;;hx_01b;Aviso;AAA;1.3.1 2.4.10;Encontrei 12 cabeçalhos na página.;12;;9,1 +;;hx_03;Erro;AAA;1.3.1 2.4.10;Encontrei 1 caso em que se viola a sequência hierárquica dos níveis de cabeçalho.;1;;9,1 +;;layout_01a;Sucesso;A;1.3.1;Constatei que não há elementos obsoletos usados para controlo visual da apresentação.;0;;9,1 +;;lang_01;Aviso;A;3.1.1;Verifiquei que o idioma principal da página está marcado como "pt-BR".;1;pt-BR;9,1 +;;title_06;Sucesso;A;2.4.2;Encontrei um título na página e ele parece-me correto.;1;Compromisso de Acessibilidade | Comfy Solutions;9,1 +;;heading_01;Sucesso;A;1.3.1;Constatei que todos os cabeçalhos desta página têm nome acessível;12;;9,1 +;;heading_03;Sucesso;A;1.3.1;Identifiquei exatamente um cabeçalho de nível 1.;1;;9,1 +;;aria_03;Sucesso;A;1.3.1;Verifiquei que todos os estados e todas as propriedades ARIA têm um tipo de valor válido.;1;;9,1 +;;aria_05;Sucesso;A;;Verifiquei que todos os estados e todas as propriedades ARIA são permitidos.;1;;9,1 +;;aria_07;Sucesso;A;;Verifiquei que todos os atributos aria-* estão de acordo com a especificação ARIA.;1;;9,1 +;;button_01;Sucesso;A;;Verifiquei que todos os elementos button têm nome acessível.;1;;9,1 +;;element_06;Sucesso;AA;3.1.2;Verifiquei que todos os elementos com atributo lang têm uma etiqueta de linguagem válida;1;;9,1 +;;element_08;Sucesso;A;4.1.2;Constatei que todos os elementos com um papel semântico que confere aos seus descendentes um papel decorativo, não têm descendentes focáveis;2;;9,1 +;;id_01;Sucesso;A;4.1.1;Constatei que nesta página não há atributos id repetidos.;6;;9,1 +;;a_10;Sucesso;A;4.1.2;Verifiquei que todas as ligações têm nome acessível.;7;;9,1 +;;textC_01;Aviso;AAA;1.4.6;Verifiquei que todas as combinações de cor têm uma relação de contraste superior ao rácio de contraste otimizado sugerido pelas WCAG, ou seja 4,5 para 1 para texto com letra grande e 7 para 1 para texto com letra normal.;44;;9,1 +;;label_03;Erro;A;2.5.3;Encontrei 1 elemento interativo cujo texto visível não faz parte do nome acessível computado para o elemento;1;;9,1 +;;landmark_01;Sucesso;AA;1.3.1 2.4.1;Constatei que o elemento com a semântica de banner não está contido dentro de nenhum elemento com outra semântica;1;;9,1 +;;landmark_05;Sucesso;AA;1.3.1;Constatei que o elemento com a semântica de contentinfo não está contido dentro de nenhum elemento com outra semântica;1;;9,1 +;;landmark_07;Sucesso;AA;1.3.1;Constatei que o elemento com a semântica de main não está contido dentro de nenhum elemento com outra semântica;1;;9,1 +;;landmark_09;Sucesso;AA;1.3.1 2.4.1;Encontrei um elemento com a semântica de banner.;1;;9,1 +;;landmark_11;Sucesso;AA;1.3.1;Encontrei um elemento com a semântica de contentinfo.;1;;9,1 +;;landmark_13;Sucesso;AA;1.3.1;Encontrei um elemento com a semântica de main.;1;;9,1 diff --git a/icon.png b/icon.png new file mode 100644 index 0000000..6a12267 Binary files /dev/null and b/icon.png differ diff --git a/index.html b/index.html new file mode 100644 index 0000000..a65ab0f --- /dev/null +++ b/index.html @@ -0,0 +1,176 @@ + + + + + + + + + Compromisso de Acessibilidade | comfy.solutions + + + + + + + + + + + +

+ + +

A internet deve ser acessível para todos. Este é o nosso compromisso.

+ +

+ A comfy.solutions compromete-se a desenvolver sites acessíveis a todos. Todos os nossos sites seguem o Decreto-Lei n.º 83/2018, de 19 de outubro, que transpõe a Diretiva (UE) 2016/2102 do Parlamento Europeu e do Conselho, relativa à acessibilidade dos sítios Web e das aplicações móveis. +

+ +

Metodologia

+ Seguimos os proseguimentos A e B (verificação automática e verificação manual) em todos os nossos sites. +

+ +

+ check_circle + Verificação Automática +

+ Utilizamos o accessMonitor, do ecossistema acessibilidade.gov.pt. +

+ +

+ done_all + Verificação Manual +

+ Utilizamos o Gerador da Declaração de Acessibilidade e Usabilidade, também do ecossistema acessibilidade.gov.pt. +

+ +

+ calendar_today + Compromisso de Revisão +

+ Compromotemos-nos em rever o nosso conteúdo pelo menos uma vez a cada 3 meses. +

+ +

+ email + Precisa de ajuda? +

+ Temos o nosso email de acessibilidade sempre disponível. Estamos sempre prontos a ajudar, todos os dias. +

+ + mail + acessibilidade@comfy.solutions + +

+ +

+ Comfy.solutions is committed to developing accessible websites for everyone. All our websites comply with Decree-Law no. 83/2018, of October 19, which transposes Directive (EU) 2016/2102 of the European Parliament and Council, relating to the accessibility of websites and mobile applications. +

+ +

Methodology

+ We follow procedures A and B (automated testing and manual testing) on all our websites. +

+ +

+ check_circle + Automated Testing +

+ We use accessMonitor, from the acessibilidade.gov.pt ecosystem. +

+ +

+ done_all + Manual Testing +

+ We use the Accessibility and Usability Declaration Generator, also from the acessibilidade.gov.pt ecosystem. +

+ +

+ calendar_today + Review Commitment +

+ We commit to reviewing our content at least once every 3 months. +

+ +

+ email + Need Help? +

+ Our accessibility email is always available. We are always ready to help, every day. +

+ + mail + acessibilidade@comfy.solutions + +

+ + +

+ + + + diff --git a/script.js b/script.js new file mode 100644 index 0000000..8851ab9 --- /dev/null +++ b/script.js @@ -0,0 +1,43 @@ +document.addEventListener('DOMContentLoaded', function() { + const languageToggle = document.getElementById('language-toggle'); + const langLabel = document.getElementById('lang-label'); + const portugueseContent = document.getElementById('portuguese-content'); + const englishContent = document.getElementById('english-content'); + const heroHeading = document.getElementById('hero-heading'); + const navCommitment = document.getElementById('nav-commitment'); + const navDocuments = document.getElementById('nav-documents'); + const htmlElement = document.documentElement; + + // Get saved language preference or default to Portuguese + const savedLanguage = localStorage.getItem('preferred-language') || 'pt-PT'; + setLanguage(savedLanguage); + + languageToggle.addEventListener('click', function() { + const currentLang = htmlElement.lang; + const newLang = currentLang === 'pt-PT' ? 'en' : 'pt-PT'; + setLanguage(newLang); + }); + + function setLanguage(lang) { + if (lang === 'en') { + htmlElement.lang = 'en'; + portugueseContent.classList.add('hidden'); + englishContent.classList.remove('hidden'); + heroHeading.lang = 'en'; + heroHeading.textContent = 'The internet should be accessible to everyone. This is our commitment.'; + langLabel.textContent = 'Português'; + if (navCommitment) navCommitment.textContent = 'Commitment'; + if (navDocuments) navDocuments.textContent = 'Documents'; + } else { + htmlElement.lang = 'pt-PT'; + englishContent.classList.add('hidden'); + portugueseContent.classList.remove('hidden'); + heroHeading.lang = 'pt-PT'; + heroHeading.textContent = 'A internet deve ser acessível para todos. Este é o nosso compromisso.'; + langLabel.textContent = 'English'; + if (navCommitment) navCommitment.textContent = 'Compromisso'; + if (navDocuments) navDocuments.textContent = 'Documentos'; + } + localStorage.setItem('preferred-language', lang); + } +}); diff --git a/stru.md b/stru.md new file mode 100644 index 0000000..e0727a0 --- /dev/null +++ b/stru.md @@ -0,0 +1,19 @@ +### comfy.solutions + +## A internet deve ser acessível para todos. Este é o nosso compromisso. + +A comfy.solutions compromete-se a desenvolver sites acessíveis a todos. Todos os nossos sites seguem o Decreto-Lei n.º 83/2018, de 19 de outubro, que transpõe a Diretiva (UE) 2016/2102 do Parlamento Europeu e do Conselho, relativa à acessibilidade dos sítios Web e das aplicações móveis. + +Seguimos os proseguimentos A e B (verificação automática e verificação manual) em todos os nossos sites. + +Para a verificação automática, utilizamos o [accessMonitor](https://accessmonitor.acessibilidade.gov.pt), do ecossistema acessibilidade.gov.pt. + +Para a verificação manual, utilizamos o [Gerador da Declaração de Acessibilidade e Usabilidade](https://www.acessibilidade.gov.pt/gerador/), também do ecossistema ecossistema acessibilidade.gov.pt. + +Compromotemos-nos em rever o nosso conteúdo pelo menos uma vez a cada 3 meses. + +Temos o nosso email de acessibilidade sempre disponível. Estamos sempre prontos a ajudar, todos os dias. + + + + diff --git a/style.css b/style.css new file mode 100644 index 0000000..3838386 --- /dev/null +++ b/style.css @@ -0,0 +1,581 @@ +/* Material Design 2 - Comfy Solutions */ + +@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap'); + +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} + +:root { + --primary-color: #5B7394; + --accent-color: #FDC95D; + --dark-color: #040D15; + --surface-color: #ffffff; + --surface-variant: #f5f5f5; + --text-primary: #1a1a1a; + --text-secondary: #424242; + --divider-color: #e0e0e0; + --focus-color: #FDC95D; + + /* Material Design 2 elevation */ + --elevation-1: 0px 2px 1px -1px rgba(0,0,0,0.2), 0px 1px 1px 0px rgba(0,0,0,0.14), 0px 1px 3px 0px rgba(0,0,0,0.12); + --elevation-2: 0px 3px 1px -2px rgba(0,0,0,0.2), 0px 2px 2px 0px rgba(0,0,0,0.14), 0px 1px 5px 0px rgba(0,0,0,0.12); + --elevation-4: 0px 2px 4px -1px rgba(0,0,0,0.2), 0px 4px 5px 0px rgba(0,0,0,0.14), 0px 1px 10px 0px rgba(0,0,0,0.12); +} + +html { + scroll-behavior: smooth; +} + +body { + font-family: 'Roboto', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; + line-height: 1.5; + color: var(--text-primary); + background-color: var(--surface-color); + font-size: 14px; + font-weight: 400; + letter-spacing: 0.25px; +} + +.container { + max-width: 960px; + margin: 0 auto; + padding: 0; +} + +/* Skip Link */ +.skip-link { + position: absolute; + top: -40px; + left: 0; + background: var(--primary-color); + color: white; + padding: 8px 16px; + text-decoration: none; + z-index: 100; +} + +.skip-link:focus { + top: 0; +} + +/* Header */ +.header { + background-color: var(--primary-color); + color: white; + box-shadow: var(--elevation-4); + padding: 16px 24px; + position: sticky; + top: 0; + z-index: 1000; +} + +.header-content { + display: flex; + justify-content: space-between; + align-items: center; + max-width: 960px; + margin: 0 auto; +} + +.header-left { + display: flex; + align-items: center; + gap: 40px; +} + +.brand { + font-size: 20px; + font-weight: 500; + letter-spacing: 0.15px; + margin: 0; + color: white; + display: flex; + align-items: center; + gap: 12px; +} + +.brand-link { + color: white; + text-decoration: none; + transition: color 0.2s ease; +} + +.brand-link:hover { + color: #f0f0f0; +} + +.brand-link:focus-visible { + outline: 3px solid var(--accent-color); + outline-offset: 2px; + border-radius: 2px; +} + +/* Navigation Menu */ +.nav-menu { + display: flex; + gap: 24px; + align-items: center; +} + +.nav-link { + color: rgba(255, 255, 255, 0.87); + text-decoration: none; + font-size: 14px; + font-weight: 500; + letter-spacing: 0.4px; + transition: color 0.2s ease; + padding-bottom: 4px; + border-bottom: 2px solid transparent; +} + +.nav-link:hover { + color: white; +} + +.nav-link:focus-visible { + outline: 3px solid var(--accent-color); + outline-offset: 2px; +} + +.nav-link.nav-active { + color: white; + border-bottom-color: var(--accent-color); +} + +.brand-icon { + height: 28px; + width: 28px; + object-fit: contain; +} + +/* Buttons */ +.btn { + display: inline-flex; + align-items: center; + gap: 8px; + padding: 0; + border: none; + border-radius: 4px; + font-family: 'Roboto', sans-serif; + font-size: 14px; + font-weight: 500; + letter-spacing: 0.4px; + text-decoration: none; + cursor: pointer; + transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); + text-transform: uppercase; +} + +.btn-primary { + background-color: var(--primary-color); + color: white; + padding: 10px 24px; + box-shadow: var(--elevation-2); +} + +.btn-primary:hover { + background-color: #3d4d63; + box-shadow: var(--elevation-4); +} + +.btn-primary:active { + box-shadow: var(--elevation-1); +} + +.btn-text { + color: var(--dark-color); + background-color: var(--accent-color); + padding: 8px 16px; + gap: 8px; + box-shadow: var(--elevation-1); +} + +.btn-text:hover { + background-color: #fdd96f; + box-shadow: var(--elevation-2); +} + +.btn-text:focus-visible { + outline: 3px solid var(--dark-color); +} + +/* Material Icons */ +.material-icons { + font-size: 24px; + width: 24px; + height: 24px; + display: inline-flex; + align-items: center; + justify-content: center; +} + +.btn .material-icons { + font-size: 18px; + width: 18px; + height: 18px; +} + +/* Main Content */ +.main-content { + padding: 40px 24px; + max-width: 960px; + margin: 0 auto; +} + +.hero { + text-align: center; + margin-bottom: 40px; +} + +.hero h1 { + font-size: 32px; + font-weight: 300; + letter-spacing: 0.25px; + line-height: 1.4; + color: var(--dark-color); + margin: 0; +} + +.content-section { + display: flex; + flex-direction: column; + gap: 24px; +} + +.content-section h3 + p { + margin-top: -12px; +} + +h3 { + font-size: 20px; + font-weight: 500; + letter-spacing: 0.15px; + color: var(--dark-color); + margin: 0 0 8px 0; + display: flex; + align-items: center; + gap: 12px; +} + +h4 { + font-size: 16px; + font-weight: 500; + letter-spacing: 0.15px; + color: var(--dark-color); + margin: 0 0 8px 0; + display: flex; + align-items: center; + gap: 12px; +} + +p { + font-size: 14px; + font-weight: 400; + letter-spacing: 0.25px; + line-height: 1.6; + color: var(--text-secondary); + margin: 0; +} + +.leading-paragraph { + font-size: 16px; + font-weight: 400; + line-height: 1.7; + color: var(--text-primary); + margin: 0; +} + +/* Links */ +a { + color: var(--primary-color); + text-decoration: none; + transition: all 0.2s ease; + position: relative; +} + +a:hover { + color: #3d4d63; + text-decoration: underline; +} + +a:focus-visible { + outline: 3px solid var(--focus-color); + outline-offset: 2px; +} + +/* Cards */ +.verification-cards { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); + gap: 20px; + margin: 20px 0; +} + +.card { + background-color: var(--surface-variant); + border-radius: 4px; + padding: 24px; + box-shadow: var(--elevation-1); + transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); +} + +.card:hover { + box-shadow: var(--elevation-2); + transform: translateY(-2px); +} + +.card h4 { + color: var(--primary-color); + margin-bottom: 12px; +} + +.card p { + margin: 0; + color: var(--text-secondary); +} + +.card a { + color: var(--primary-color); + font-weight: 500; +} + +/* Boxes */ +.commitment-box, +.contact-box { + background-color: var(--surface-variant); + border-left: 4px solid var(--accent-color); + border-radius: 4px; + padding: 24px; + box-shadow: var(--elevation-1); +} + +.contact-box { + background-color: var(--dark-color); + color: white; + border-left-color: var(--accent-color); +} + +.contact-box h3 { + color: white; + margin-bottom: 16px; +} + +.contact-box p { + color: rgba(255, 255, 255, 0.87); +} + +.contact-box a { + color: var(--accent-color); +} + +.contact-box a:hover { + color: #fdd96f; +} + +.contact-box .btn-primary { + background-color: var(--accent-color); + color: var(--dark-color); + margin-top: 16px; +} + +.contact-box .btn-primary:hover { + background-color: #fdd96f; +} + +/* Language Content */ +.language-content { + opacity: 1; + transition: opacity 0.3s ease; +} + +.language-content.hidden { + display: none; +} + +/* Footer */ +.footer { + border-top: 1px solid var(--divider-color); + padding: 24px; + text-align: center; + color: var(--text-secondary); + font-size: 12px; + letter-spacing: 0.4px; + margin-top: 32px; +} + +/* Accessibility */ +*:focus-visible { + outline: 3px solid var(--focus-color); + outline-offset: 2px; +} + +/* Print Styles */ +@media print { + .header, + .footer { + display: none; + } + + .btn { + display: none; + } +} + +/* Documents Page */ +.documents-grid { + display: flex; + flex-direction: column; + gap: 32px; +} + +.document-category { + display: flex; + flex-direction: column; + gap: 16px; +} + +.document-category h2 { + margin: 0 0 8px 0; + padding-bottom: 12px; + border-bottom: 2px solid var(--accent-color); +} + +.document-card { + background-color: var(--surface-variant); + border-radius: 4px; + padding: 24px; + box-shadow: var(--elevation-1); + transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); +} + +.document-card:hover { + box-shadow: var(--elevation-2); + transform: translateY(-2px); +} + +.document-card h3 { + font-size: 18px; + font-weight: 500; + letter-spacing: 0.15px; + color: var(--primary-color); + margin: 0 0 8px 0; +} + +.document-card p { + font-size: 14px; + color: var(--text-secondary); + margin: 0; +} + +/* Responsive Design */ +@media (max-width: 768px) { + .header { + padding: 12px 16px; + } + + .header-content { + flex-direction: column; + align-items: flex-start; + gap: 12px; + } + + .header-left { + gap: 16px; + } + + .nav-menu { + gap: 16px; + font-size: 13px; + } + + .nav-link { + padding-bottom: 2px; + } + + .brand { + font-size: 18px; + } + + .main-content { + padding: 28px 16px; + } + + .hero h2 { + font-size: 24px; + } + + .verification-cards { + grid-template-columns: 1fr; + gap: 16px; + } + + .card, + .commitment-box, + .contact-box { + padding: 16px; + } + + h3 { + font-size: 18px; + } + + h4 { + font-size: 14px; + } +} + +@media (max-width: 480px) { + .main-content { + padding: 24px 12px; + } + + .hero h2 { + font-size: 20px; + } + + .content-section { + gap: 20px; + } + + h3 { + font-size: 16px; + } + + h4 { + font-size: 14px; + } + + .card, + .commitment-box, + .contact-box { + padding: 16px; + } + + .btn { + width: 100%; + justify-content: center; + } +} + +/* Reduced Motion */ +@media (prefers-reduced-motion: reduce) { + * { + animation-duration: 0.01ms !important; + animation-iteration-count: 1 !important; + transition-duration: 0.01ms !important; + } +} + +/* High Contrast Mode */ +@media (prefers-contrast: more) { + a { + text-decoration: underline; + } + + .btn { + border: 2px solid currentColor; + } +}