bump to v1.1.0: accessibility, filter bar fix, updated README
This commit is contained in:
49
README.md
49
README.md
@@ -8,7 +8,7 @@
|
|||||||
|
|
||||||
<p align="center">
|
<p align="center">
|
||||||
<img src="https://img.shields.io/badge/license-CC0_1.0-blue" alt="License: CC0 1.0" />
|
<img src="https://img.shields.io/badge/license-CC0_1.0-blue" alt="License: CC0 1.0" />
|
||||||
<img src="https://img.shields.io/badge/version-1.0.0-green" alt="Version 0.1.0" />
|
<img src="https://img.shields.io/badge/version-1.1.0-green" alt="Version 1.1.0" />
|
||||||
<img src="https://img.shields.io/badge/platform-Windows-0078D4?logo=windows" alt="Windows" />
|
<img src="https://img.shields.io/badge/platform-Windows-0078D4?logo=windows" alt="Windows" />
|
||||||
<img src="https://img.shields.io/badge/portable-no%20install%20needed-brightgreen" alt="Portable" />
|
<img src="https://img.shields.io/badge/portable-no%20install%20needed-brightgreen" alt="Portable" />
|
||||||
<img src="https://img.shields.io/badge/built%20with-Tauri%20v2-orange" alt="Built with Tauri v2" />
|
<img src="https://img.shields.io/badge/built%20with-Tauri%20v2-orange" alt="Built with Tauri v2" />
|
||||||
@@ -95,6 +95,53 @@ Full keyboard-driven workflow. Vim-style or arrow keys -- your choice.
|
|||||||
- **Custom scrollbars** -- themed scrollbars throughout, with auto-hide behavior
|
- **Custom scrollbars** -- themed scrollbars throughout, with auto-hide behavior
|
||||||
- **Smooth animations** -- staggered entrances, layout transitions, and micro-interactions powered by Framer Motion, with full `prefers-reduced-motion` support
|
- **Smooth animations** -- staggered entrances, layout transitions, and micro-interactions powered by Framer Motion, with full `prefers-reduced-motion` support
|
||||||
|
|
||||||
|
### ♿ Accessibility (WCAG 2.2 AAA)
|
||||||
|
|
||||||
|
OpenPylon targets WCAG 2.2 AAA conformance -- because productivity tools should work for everyone, not just people with perfect vision and a mouse.
|
||||||
|
|
||||||
|
**Color and Contrast**
|
||||||
|
|
||||||
|
- **7:1 enhanced contrast** on all text and interactive elements, in both light and dark themes
|
||||||
|
- **3:1 non-text contrast** on borders, scrollbar thumbs, and focus indicators
|
||||||
|
- **High-contrast mode** support -- `prefers-contrast: more` boosts all tokens further
|
||||||
|
- **Color is never the sole indicator** -- priority levels, due date status, and labels all include text or shape cues alongside color
|
||||||
|
|
||||||
|
**Focus and Keyboard**
|
||||||
|
|
||||||
|
- **3px dual-ring focus indicators** visible on every interactive element, against any background
|
||||||
|
- **Skip-to-content link** as the first focusable element on the page
|
||||||
|
- **Full keyboard navigation** -- vim keys, arrow keys, tab order, Escape to dismiss
|
||||||
|
- **Shift+F10 context menus** -- right-click menus are also reachable via keyboard
|
||||||
|
- **Focus trapping** in all modals and dialogs with focus restore on close
|
||||||
|
- **Hidden interactive elements** (menu buttons, action buttons) become visible on `focus-visible`, not just hover
|
||||||
|
|
||||||
|
**Screen Readers and ARIA**
|
||||||
|
|
||||||
|
- **ARIA live regions** announce card/column creation, deletion, moves, filter changes, and drag-and-drop operations
|
||||||
|
- **Proper dialog semantics** -- `role="dialog"`, `aria-modal`, `aria-labelledby` on all modals
|
||||||
|
- **Tab/tabpanel pattern** in settings with `role="tablist"`, `role="tab"`, `aria-selected`
|
||||||
|
- **Calendar grid** with `role="grid"`, `aria-selected` on date cells, labeled navigation
|
||||||
|
- **`aria-label`** on every icon-only button, color swatch, status indicator, and unlabeled input
|
||||||
|
- **`aria-pressed`** on all toggle buttons (theme, density, motion, label chips, priority)
|
||||||
|
- **Screen-reader-only labels** for search inputs, select dropdowns, and range sliders
|
||||||
|
|
||||||
|
**Toasts and Notifications**
|
||||||
|
|
||||||
|
- **8-second auto-dismiss** with pause-on-hover and pause-on-focus
|
||||||
|
- **Visible dismiss button** on every toast
|
||||||
|
- **`aria-live="polite"`** region so screen readers announce toast content without interrupting
|
||||||
|
|
||||||
|
**Motion**
|
||||||
|
|
||||||
|
- **`prefers-reduced-motion`** fully respected -- both via CSS media query and an in-app toggle
|
||||||
|
- **No essential information** conveyed through animation alone
|
||||||
|
|
||||||
|
**Page Structure**
|
||||||
|
|
||||||
|
- **Dynamic page titles** -- updates to reflect the current board name
|
||||||
|
- **Landmark regions** and semantic HTML throughout
|
||||||
|
- **Minimum touch targets** -- 44px interactive area on small buttons via extended hit zones
|
||||||
|
|
||||||
### 🛡️ Data Safety
|
### 🛡️ Data Safety
|
||||||
|
|
||||||
Your work is protected by multiple layers of redundancy -- because tools that lose your data don't deserve your trust.
|
Your work is protected by multiple layers of redundancy -- because tools that lose your data don't deserve your trust.
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
{
|
{
|
||||||
"name": "openpylon",
|
"name": "openpylon",
|
||||||
"private": true,
|
"private": true,
|
||||||
"version": "1.0.1",
|
"version": "1.1.0",
|
||||||
"type": "module",
|
"type": "module",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"dev": "vite",
|
"dev": "vite",
|
||||||
|
|||||||
2
src-tauri/Cargo.lock
generated
2
src-tauri/Cargo.lock
generated
@@ -2360,7 +2360,7 @@ dependencies = [
|
|||||||
|
|
||||||
[[package]]
|
[[package]]
|
||||||
name = "openpylon"
|
name = "openpylon"
|
||||||
version = "1.0.1"
|
version = "1.1.0"
|
||||||
dependencies = [
|
dependencies = [
|
||||||
"serde",
|
"serde",
|
||||||
"serde_json",
|
"serde_json",
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
[package]
|
[package]
|
||||||
name = "openpylon"
|
name = "openpylon"
|
||||||
version = "1.0.1"
|
version = "1.1.0"
|
||||||
description = "A Tauri App"
|
description = "A Tauri App"
|
||||||
authors = ["you"]
|
authors = ["you"]
|
||||||
edition = "2021"
|
edition = "2021"
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
{
|
{
|
||||||
"$schema": "https://schema.tauri.app/config/2",
|
"$schema": "https://schema.tauri.app/config/2",
|
||||||
"productName": "openpylon",
|
"productName": "openpylon",
|
||||||
"version": "1.0.1",
|
"version": "1.1.0",
|
||||||
"identifier": "com.openpylon.app",
|
"identifier": "com.openpylon.app",
|
||||||
"build": {
|
"build": {
|
||||||
"beforeDevCommand": "npm run dev",
|
"beforeDevCommand": "npm run dev",
|
||||||
|
|||||||
@@ -388,7 +388,7 @@ export function BoardView() {
|
|||||||
const columnIds = board.columns.map((c) => c.id);
|
const columnIds = board.columns.map((c) => c.id);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<div className="flex h-full flex-col">
|
||||||
{/* Visually hidden live region for drag-and-drop announcements */}
|
{/* Visually hidden live region for drag-and-drop announcements */}
|
||||||
<div
|
<div
|
||||||
aria-live="polite"
|
aria-live="polite"
|
||||||
@@ -421,7 +421,7 @@ export function BoardView() {
|
|||||||
>
|
>
|
||||||
<OverlayScrollbarsComponent
|
<OverlayScrollbarsComponent
|
||||||
ref={osRef}
|
ref={osRef}
|
||||||
className="h-full"
|
className="min-h-0 flex-1"
|
||||||
options={{ scrollbars: { theme: "os-theme-pylon", autoHide: "scroll", autoHideDelay: 600, clickScroll: true }, overflow: { y: "hidden" } }}
|
options={{ scrollbars: { theme: "os-theme-pylon", autoHide: "scroll", autoHideDelay: 600, clickScroll: true }, overflow: { y: "hidden" } }}
|
||||||
defer
|
defer
|
||||||
>
|
>
|
||||||
@@ -511,6 +511,6 @@ export function BoardView() {
|
|||||||
cardId={selectedCardId}
|
cardId={selectedCardId}
|
||||||
onClose={() => { setSelectedCardId(null); }}
|
onClose={() => { setSelectedCardId(null); }}
|
||||||
/>
|
/>
|
||||||
</>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -343,7 +343,7 @@ export function SettingsDialog({ open, onOpenChange }: SettingsDialogProps) {
|
|||||||
<div className="space-y-2 text-sm text-pylon-text">
|
<div className="space-y-2 text-sm text-pylon-text">
|
||||||
<p className="font-heading text-lg">OpenPylon</p>
|
<p className="font-heading text-lg">OpenPylon</p>
|
||||||
<p className="text-pylon-text-secondary">
|
<p className="text-pylon-text-secondary">
|
||||||
v0.1.0 · Local-first Kanban board
|
v1.1.0 · Local-first Kanban board
|
||||||
</p>
|
</p>
|
||||||
<p className="text-pylon-text-secondary">
|
<p className="text-pylon-text-secondary">
|
||||||
Built with Tauri, React, and TypeScript.
|
Built with Tauri, React, and TypeScript.
|
||||||
|
|||||||
Reference in New Issue
Block a user