-
Notifications
You must be signed in to change notification settings - Fork 35
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge branch 'develop' of https://github.com/public-ui/kolibri into 5…
…371-scenario-komplexes-workflow-formular
- Loading branch information
Showing
1,101 changed files
with
3,419 additions
and
2,145 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,49 +1,53 @@ | ||
# Contributing | ||
|
||
Wir würden uns freuen, wenn Sie etwas zu **KoliBri** beitragen und dabei helfen würden, es noch besser zu machen, als es heute ist! Als Mitwirkender bitten wir Sie, die folgenden Richtlinien zu befolgen: | ||
We would love for you to contribute to **KoliBri**and help make it even better than it is today! As a contributor, we ask that you follow the following guidelines: | ||
|
||
- [Contributing](#contributing) | ||
- [Code of Conduct](#code-of-conduct) | ||
- [Fragen und Probleme](#fragen-und-probleme) | ||
- [Fehler melden](#fehler-melden) | ||
- [Weiterentwicklung](#weiterentwicklung) | ||
- [Questions and Problems](#questions-and-problems) | ||
- [Report bug](#report-bug) | ||
- [Further development](#further-development) | ||
|
||
## Code of Conduct | ||
|
||
Helfen Sie uns, **KoliBri** offen und integrativ zu halten. Bitte lesen und folgen Sie unserer [Code of Conduct](CODE_OF_CONDUCT.md). | ||
Help us keep **KoliBri** open and inclusive. Please read and follow our [Code of Conduct](CODE_OF_CONDUCT.md). | ||
|
||
## Fragen und Probleme | ||
## Questions and problems | ||
|
||
Bitte erstellen Sie keine Issue-Tickets für allgemeine Supportfragen. Wir möchten das Ticketsystem für die Nachverfolgung von Fehlerberichten und Funktionsanfragen verwenden. | ||
Please do not create issue tickets for general support questions. We want to use the ticket system for tracking bug reports and feature requests. | ||
|
||
Stattdessen empfehlen wir als erstes bei [Stack Overflow](https://stackoverflow.com/questions/tagged/kolibri) nachzuschauen, ob jemand anderes die Frage oder das Problem schon gelöst hat. Gerne können dort auch neue Fragen mit dem Tag `kolibri` erstellt werden. | ||
Instead, we recommend first checking [Stack Overflow](https://stackoverflow.com/questions/tagged/kolibri) to see whether someone else has already solved the question or problem. You can also create new questions with the tag “hummingbird”. | ||
To save your time and ours, we will close all general questions in the ticket system and redirect those asking to Stack Overflow. | ||
|
||
Um Ihre und unsere Zeit zu sparen, werden wir alle allgemeinen Fragen im Ticketsystem schließen und die Fragenden an Stack Overflow weiterleiten. | ||
If you would like to contact us, please send us an email to [kolibri@itzbund.de](kolibri@itzbund.de). | ||
|
||
Wenn Sie gerne mit uns Kontakt aufnehmen wollen, dann schreiben Sie uns entweder eine E-Mail an [kolibri@itzbund.de](kolibri@itzbund.de). | ||
## Report an error | ||
|
||
## Fehler melden | ||
If you find an error in the source code, you can report it to our ticket system. | ||
|
||
Wenn Sie einen Fehler im Quellcode finden, dann können Sie diesen an unser Ticketsystem melden. | ||
It would be even better if you suggested a solution to us as a pull request. | ||
|
||
Noch besser wäre es, wenn Sie uns eine Lösung als Pull Request vorschlagen. | ||
## Further development | ||
|
||
## Weiterentwicklung | ||
You can request new features by submitting an issue to our ticket system. If you would like to implement a new function, please note the following steps for further action: | ||
|
||
Sie können neue Funktionen anfordern, indem Sie ein Problem an unser Ticketsystem senden. Wenn Sie gerne eine neue Funktion implementieren möchten, dann beachten Sie bitte die folgenden Schritte für das weitere Vorgehen: | ||
- It is helpful to read the KoliBri [architecture concept](https://public-ui.github.io/docs/concepts/architecture) before implementing. | ||
- For major innovations, please create a ticket with the description of the new function. | ||
- For small innovations, you can offer and justify the implementation directly as a pull request. | ||
|
||
- Es ist hilfreich vor dem Implementieren das [Architekturkonzept](https://public-ui.github.io/docs/concepts/architecture) zu KoliBri zu lesen. | ||
- Bei größeren Neuerungen legen Sie bitte ein Ticket mit der Beschreibung der neuen Funktion an. | ||
- Bei kleinen Neuerungen können Sie die Implementierung direkt als Pull Request anbieten und begründen. | ||
### Git flow | ||
|
||
### Git-Flow | ||
We work according to the Git flow: https://medium.com/android-news/gitflow-with-github-c675aa4f606a | ||
|
||
Wir arbeiten nach dem Git-Flow: https://medium.com/android-news/gitflow-with-github-c675aa4f606a | ||
### Developing | ||
|
||
### Änder-/Neuerungen implementieren | ||
|
||
- [pnpm installieren](https://pnpm.io/installation) | ||
- Konsole im Projekt root öffnen | ||
- Alle Pakete installieren mit "pnpm i" | ||
- in gewüschtes Projekt wechseln | ||
- Projekt starten mit "pnpm start" | ||
1. For contributing, you need a [GitHub account](https://github.com/login) | ||
2. Fork [our repository](https://github.com/public-ui/kolibri) on GitHub | ||
3. Open your preferred command line interface | ||
4. Clone the forked repository to your local machine | ||
5. Navigate the project root directory | ||
6. Create a new branch for your changes | ||
7. [Install PNPM](https://pnpm.io/installation) on you local machine | ||
8. Install all packages with `pnpm i` | ||
9. Navigate to the desired package in our monorepo | ||
10. Start the project with “pnpm start” |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,132 +1,33 @@ | ||
# Willkommen bei KoliBri | ||
# Welcome to KoliBri | ||
|
||
**KoliBri** steht für **Ko**mponenten-Bib**li**othek für die **B**ar**ri**erefreiheit | ||
> „The accessible HTML-Standard“ | ||
**KoliBri** stands for „Component library for the accessibility“ and was from the | ||
[Informationstechnikzentrum Bund (ITZBund)](https://itzbund.de) | ||
open source released for reuse and further development. | ||
|
||
## Vision | ||
|
||
Wir machen gemeinsam **HTML** mittels **wiederverwendbaren Web Components barrierefrei**, um die **Usability** und **Zugänglichkeit** sicherzustellen. | ||
Together we make **HTML** accessible using **reusable web components** to ensure **usability** and **accessibility**. | ||
|
||
## Mission | ||
|
||
Der [HTML-Webstandard](https://html.spec.whatwg.org) ist an sich sehr "offen" spezifiziert, um möglichst langlebig und robust zu sein. Es kommt daher häufig vor, das HTML-Kompositionen nicht ohne Weiteres barrierefrei, semantisch und valide sind. | ||
KoliBri baut direkt auf den [Webstandards](https://www.w3.org/standards/webdesign/) des [W3C](https://www.w3.org) auf (Framework-agnostisch), ist dabei eine generische Referenzimplementierung des [WCAG-Standards](https://www.w3.org/WAI/standards-guidelines/wcag/) und der [BITV](https://www.bitvtest.de/bitv_test.html) für die Barrierefreiheit und als eine Multi-Theming-fähige Präsentationsschicht umgesetzt. Es gibt keinerlei fachlichen Bezug und keine Datenübertragungsfunktionalitäten. Damit ist KoliBri für die Realisierung statischer Webseiten als auch dynamischer Webanwendungen unterschiedlicher Corporate Designs und Styleguides gleichermaßen wiederverwendbar und somit für Open Source sehr interessant. | ||
|
||
## Kollaboration und Kooperation | ||
|
||
Der **Fokus** von KoliBri liegt auf **kleinen** (atomaren), sehr **flexiblen** und gut **wiederverwendbaren** HTML-Kompositionen (z.B. Button). Wir bieten eine barrierefreie, semantische und valide Standard-Implementierung solcher Komponenten an, die für jede höherwertige HTML-Struktur oder Komponente (Molekül, Organismus oder Template) wiederverwendet werden können. | ||
|
||
Bei diesen atomaren Komponenten sollten wir **kollaborieren** und **kooperieren**, um unsere Fähigkeiten und unser Wissen zu bündeln. Durch die Synergieeffekte an den Basis-Komponenten kann der eigene Fokus mehr auf fachspezifische Inhalte gelegt werden. | ||
|
||
Lasst **uns** dazu **gemeinsam** KoliBri **besser** und **bunter** machen! | ||
|
||
> Weiter [zur **Dokumentation**](https://public-ui.github.io)… | ||
## Lizenz | ||
|
||
![Logo European Union Public Licence (EUPL)](https://joinup.ec.europa.eu/sites/default/files/styles/logo/public/collection/logo/2019-12/EUPL-logo-04%20%281%29.png?itok=4H40Q1GB) | ||
|
||
KoliBri wird unter der [**EUROPEAN UNION PUBLIC LICENCE v. 1.2**](https://joinup.ec.europa.eu/sites/default/files/custom-page/attachment/eupl_v1.2_de.pdf) Open Source freigegeben. Folgende Aspekte sind insbesondere dadurch berücksichtigt: | ||
|
||
- **Zugänglichmachung:** Die Artefakte und der Quellcode können von jedem frei und kostenlos wiederverwendet werden. Hierdurch leistet der ITZBund einen Beitrag im Sinne von ["Public Money - Public Code"](https://publiccode.eu/). | ||
- **Gewährleistungs- und Haftungsausschluss:** Mit der Wiederverwendung gehen keinerlei Gewährleistung und Haftungsansprüche einher. | ||
- **„Copyleft“-Klausel:** Copyleft besagt, dass jede Kopie von KoliBri (Fork) wieder unter der selben oder einer kompatiblen Open Source-Lizenz veröffentlicht werden muss. | ||
|
||
## Anwendung erstellen | ||
|
||
Im folgenden Video sehen Sie, wie Sie ganz einfach eine Webanwendung auf KoliBri-Basis erstellen können. | ||
|
||
**Befehl:** `npm init kolibri@latest my-app` | ||
|
||
![Zeigt wie man mit create-kolibri eine neue App anlegen kann.](https://raw.githubusercontent.com/public-ui/.github/main/profile/create-kolibri.gif) | ||
|
||
Aktuell können Sie eine `statische Webseite` oder Webanwendungen für die Frameworks `React`, `Preact`, `Solid`, `Next.js`, `Vue`, `Astro` und `Angular` generieren. | ||
|
||
## Abgrenzung | ||
|
||
![Darstellung, wie die Komponenten mittels verschiedener Styleguides zu kundenspezifischen Komponenten werden.](docs/abgrenzung.jpg) | ||
|
||
KoliBri stellt die Barrierefreiheit auf Ebene der webbasierten Komponenten sicher und bietet die ideale Grundlage zur Realisierung barrierefreier Benutzeroberflächen. | ||
|
||
KoliBri ist kein CSS-Framework und auch kein Design System. KoliBri dient jedoch als konkrete Implementierung semantisch korrekter Komponenten für Styleguides und Design Systeme. | ||
|
||
KoliBri kombiniert (technisch) die barrierefrei abgestimmten und standardisierten Komponenten mit beliebigen Designs zu jeweils robusten und kundenspezifischen Komponenten für dynamische Webanwendungen und statische Webseiten. | ||
|
||
## Versionierung | ||
|
||
KoliBri folgt den Prinzipien des semantischen Versionierens. | ||
|
||
Aufbau einer Version: | ||
|
||
<ul> | ||
<li> | ||
besteht in der Regel aus 3 Teilen (z.B. 1.0.2) | ||
<ul> | ||
<li> | ||
Major, hier die <i>1</i> | ||
</li> | ||
<li> | ||
Minor, hier die <i>0</i> | ||
</li> | ||
<li> | ||
Patch, hier die <i>2</i> | ||
</li> | ||
</ul> | ||
</li> | ||
<li> | ||
für die Härtungsphase einer Version, kann man zusätzlich Labels verwenden (z.B. 1.0.3-rc.2) | ||
<ul> | ||
<li> | ||
Label, hier die <i>rc.2</i> | ||
</li> | ||
</ul> | ||
</li> | ||
</ul> | ||
|
||
Folgende Hauptprinzipien kommen dabei zur Anwendung: | ||
|
||
<ul> | ||
<li> | ||
<b>Patch</b>: Beinhaltet Änderungen die den aktuellen Funktionsumfang verbessern und in seiner Verwendung nicht ändern. | ||
</li> | ||
<li> | ||
<b>Minor</b>: Beinhaltet Änderungen die den Funktionsumfang erweitern und den bestehenden Funktionsumfang in seiner Verwendung nicht ändern. | ||
</li> | ||
<li> | ||
<b>Major</b>: Beinhaltet Änderungen die eine architektonische Neuausrichtung ermöglichen und den bestehenden Funktionsumfang in seiner Verwendung ändern | ||
dürfen. | ||
</li> | ||
</ul> | ||
|
||
Ausführliche Version der SemVer finden Sie hier: [https://semver.org](https://semver.org) | ||
|
||
## Qualitätsziele | ||
|
||
In der folgenden Tabelle werden die priorisierten Qualitäten von KoliBri aufgelistet: | ||
The [HTML web standard](https://html.spec.whatwg.org) is itself very “openly” specified in order to be as long-lasting and robust as possible. It therefore often happens that HTML compositions are not easily accessible, semantic and valid. | ||
|
||
| Qualität | Priorität | Erläuterung | | ||
| --------------------- | :-------: | ------------------------------------------------------------------------------------------------------------------------------------- | | ||
| Kompatibilität | AAA | W3C®-Standards, Framework-agnostisch und Open Source | | ||
| Gebrauchstauglichkeit | AAA | BIK BITV- und Usability-Test | | ||
| Wartbarkeit | AAA | DevOps, Technologie-Stack, Modularisierung und Automatisierung | | ||
| Portierbarkeit | AA | Anpassbarkeit an verschiedene Styleguides des Bundes oder anderer | | ||
| Zuverlässigkeit | AA | BIK BITV-, Axe-, Unit-, Snapshot-, E2E-Tests und Developer Experience (EX) | | ||
| Performance | A | KoliBri geht hier einen Kompromiss ein, da es die Entwicklung aktiv bei der Umsetzung barrierefreier Benutzeroberflächen unterstützt. | | ||
| Sicherheit | A | Web Components dienen der Präsentationsschicht und beinhalten selbst keine sensitiven Informationen. | | ||
KoliBri is based directly on the [Web standards](https://www.w3.org/standards/webdesign/) of the [W3C](https://www.w3.org) (framework-agnostic), and is generic Reference implementation of the [WCAG standard](https://www.w3.org/WAI/standards-guidelines/wcag/) and the [BITV](https://www.bitvtest.de/bitv_test.html) for accessibility and implemented as a multi-theming capable presentation layer. There is no technical reference and no data transfer functionality. This means that KoliBri is equally reusable for the realization of static websites as well as dynamic web applications with different corporate designs and style guides and is therefore very interesting for open source. | ||
|
||
## Geräte-, Betriebssystem-, Browser- und Screenreader-Anforderungen | ||
## Collaboration and cooperation | ||
|
||
KoliBri ist für die Umsetzung beliebiger webbasierter Benutzeroberflächen vorgesehen und soll auf allen modernen Geräten (PC, Tablet, Mobil), Betriebssystemen (Windows, Linux, MaxOS, Android, iOS) und standardkonformen Browsern eingesetzt werden können. | ||
The **focus** of KoliBri is on **small** (atomic), very **flexible** and highly **reusable** HTML compositions (e.g. buttons). We offer an accessible, semantic and valid standard implementation of such components that can be reused for any higher-level HTML structure or component (molecule, organism or template). | ||
These atomic components are where we should **collaborate** and **cooperate** to combine our skills and knowledge. The synergy effects on the basic components allow you to focus more on subject-specific content. | ||
|
||
Der Microsoft Internet Explorer wird explizit nicht unterstützt, um das Projekt und die Entwicklung nicht durch Altlasten zu schwächen. KoliBri investiert stattdessen konzequent in die Zukunft. | ||
Let's make KoliBri **better** and **more colorful** together! | ||
|
||
| Gerät | Betriebsystem | Browser | Screenreader | | ||
| ---------------- | --------------------------- | ------------------------------------------------------------ | --------------------------------------- | | ||
| PC | Windows<br/>Linux<br/>MacOS | Chrome<br/>Firefox<br/>Edge<br/>Opera<br/>Safari (nur MacOS) | NVDA<br/>Jaws<br/>VoiceOver (nur MacOS) | | ||
| Tablet<br/>Mobil | Android<br/>iOS | Chrome<br/>Firefox<br/>Edge<br/>Opera<br/>Safari (nur iOS) | TalkBack (nur Android) | | ||
> Continue [to **Documentation**](https://public-ui.github.io)… | ||
## Let's go | ||
|
||
- [Getting Started](https://public-ui.github.io/docs/get-started/first-steps) | ||
- [Get Started](https://public-ui.github.io/en/docs/get-started/first-steps) | ||
- [Contributing](./CONTRIBUTING.md) | ||
- [Code of Conduct](./CODE_OF_CONDUCT.md) | ||
- [Sicherheit](./docs/SECURITY.md) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -30,5 +30,5 @@ | |
"packages/tools/visual-tests" | ||
], | ||
"useNx": true, | ||
"version": "1.7.0-rc.15" | ||
"version": "1.7.1" | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.