Commit Graph

69 Commits

Author SHA1 Message Date
Lea Verou
bdd25571a8 Themer first slice (#857)
* Basic scaffolding

* Generate theme & palette data.js that other JS can import

* Make it possible to include page-card without links

* WIP

* Add `appearance` to details, closes #569

Except `accent` as that's a) far less useful and b) trickier due to the icon color

* Fix broken link

* WIP

* WIP

* Icons icon

* Unify styles for interactive cards

* Prevent focusing inside theme icons

* Fixes

* Action page cards

* Panel scrollables

* scrollable

* Scroll shadows

* Add renaming UI

* UI

* Move styling of heading icons to `ui.css`

* Support permalinks & CRUD

* Make clickable cards more accessible

* Style cards a little better

* Default to styles panel if theme is selected

* Update theme-icons.css

* Custom themes should be saved under Custom

* Get theme code

* Bigger title

* Fixes

* Use theme Vue app for remixing too

* Fix preview jank and make preview script more flexible

* Make radio groups scrollable

* Add affordance to button cards

* Sticky

* `<color-select>`

* Fix theme remixing

* Improve previewing logic

* Fix preview

* Move `domChange()` to separate module

`theme-picker.js` includes side-effects, which may not always be desirable everywhere we may want to import `domChange()`

* Update preview.js

* Panel animation

* Hide Save button if no changes and not saved

* Do not show blank code when no selection has been made

* Use theme slug in filename

* Remove unused component

* Better UI for editing title (and any other text)

* Tweak UI of renaming

* Better indicate default selection

* Fix preview reverting bug

* Fill out app preview with more examples

* Remove `zoom` from theme showcase (yields unexpected/painful results Safari), improve display in wider viewports

* Pending delete

* Make styles panel cards scrollable

* Fix some of the Safari issues

* Update search.css

* Update panel.css

* Select preview UI

* Fix typo

* Frame colors setting as color contrast

* Show dark mode in color mappings

* Brand color

* Swatch styling

* Fix caret icon

* Move Starting theme to the same level as other controls

* Rename typography to Fonts

* Fix bug: Swatch select should show swatches from the selected palette

* Move capitalize to shared utils

* Add utils for handling nested objects

* Icons panel

* Update code.js

* Move utils around

* Add fit and finish to sidebar panels

* Theme card: Move icons to separate data structure

* Move data to dedicated folder since we now have a lot more of it

* Add default icon families and variants to themes

* Data

* Add `deepEntries()`

* Add Duotone

* Spruce up icons preview

* Use theme's icon family in showcase

* Font cards

* Font cards

* Add `max-inline-size` to preview container

* Remove alternate preview options

* Remove theme subtitle

* Support FA kit codes

* Remove Pro badges from theme cards

* Use panagram preview for Fonts

* Consistent heading and label capitalization

* Classes for different icons-card types

* Update data.js.njk

* Variable style on icon family cards

* Fix Sharp Duotone

* Clean up FA kit code hint

* Hide non-functional Icon Library field

* Fix theme icon heights

* icon variant -> style in theme metadata

* Fix bug with icons defaults not being shown

* More convenient theme defaults

* Fix bug with non updating URL

* Fix bug

* Fix multiplying badges

* Custom docs pages

* Add Duotone icons to Mellow theme

* Fix 404

* Remove "Create" from sidebar

* Fix bug

* Move vue components to `/assets/`, move their CSS with them

* Safari/FF compatibility

* Make panels scrollable again

* Fix extra spacing

---------

Co-authored-by: lindsaym-fa <dev@lindsaym.design>
2025-05-09 17:04:06 -04:00
Konnor Rogers
7545f04c46 remove all references to /docs/installation (#872) 2025-04-21 17:01:09 -04:00
Konnor Rogers
b75d3b615c fix login media query and leaking variables with Turbo (#867)
* fix media queries to use wa-desktop-only

* fix errors in remix.js when changing pages

* prettier
2025-04-14 11:11:08 -04:00
Kelsey Jackson
9d1c47449e Kj/first pattern launch (#861)
* dividing up e-commerce patterns

* started invoice table

* building out the filter

* Initial Commit

* switching machines

* switching machines

* started split image pattern:

* commiting to merge in next

* commiting to switch machines

* upated the product detail patterns

* updated product list patterns

* updated some patterns

* filter work

* added utilities to order history

* added utilities to order-summary

* updated width of container

* switching machines

* switching machines

* fixing conflicts

* editing descriptions

* updated descriptions

* adding some polish

* more filter work

* updated prouct preview

* Revisions to "Product Features"

* "Category Filters" revisions + `wa-placeholder` utility

* cleaned up product list

* tweaked product overview

* tweaked order history

* tweak category preview

* "Checkout Form" revisions

* Re-add `navigation` to "Product Features" carousel

* cleaned up shopping cart

* tweaked order summary

* Add missing file extension

* Fix typo in file name

* Revert checkout form changes in attempt to improve diff

* Reimplement checkout form revisions

* cleaned up checkout form

* Add "What's a Pattern?" and "Using Patterns" to index

* Update category descriptions and headings

* Add docs layout for patterns with stylesheet

* tweaked customer review

* Add checkout form example

* a little more polish

* more tweaks

* switching branches to merge

* created e-commerce index

* unlisted links

* updtated content

* updated content for category preview

* updated order history

* committing to bring branches up to next

* inital commit

* Reorganize app patterns into separate pages

* switching machines

* Add link style utilities

* Refactor product list patterns

* more polish

* Refactor product overview patterns

* switching machines

* Refactor shopping cart patterns

* committing to pull down changes

* updated product preview

* updated image

* updated incentives

* Clean up utility usage and code formatting for category previews

* started updating with style utilities

* Clean up utilities and formatting, replace placeholder text in order history

* updated incentive images

* updated reviews

* added review variant

* more polish

* some heavy duty updates

* removed store navigation

* switching machines
:

* Clean up utility usage and code formatting for order summaries

* Clean up utility usage and code formatting for product previews

* big switchover

* removed old file

* working on sidebar

* updated sidebar

* created info category

* splitting up the old blog page

* a little cleanup and adding detail

* got three done

* updated social share

* Quick formatting adjustment

* initial paywalls

* Use overviews in pattern subcategories (#826)

* Do not error if no pages

* Automatically set parents and tags for patterns

* Update overview.njk

* [WIP] Use overview pages for pattern listings

* Remove explicit parents

---------

Co-authored-by: lindsaym-fa <dev@lindsaym.design>

* some newsletter signups

* added login patterns

* reworked feeds'

* a few more

* added a few more

* add more app patterns

* App pattern tweaks (#827)

* Fix `patterns.css` reference

* Tweaks to action panel patterns

* Tweaks to comments patterns

* Progress on data display patterns

* Progress on empty state patterns

* Use email-related data from recent update in `pattern-main` (altered slightly)

* Tweaks to data display patterns

* Tweaks to empty state patterns

* Tweaks to FAQ patterns

* Tweaks to feed patterns

* Tweaks to grid patterns

* Tweaks to pagination patterns

* Tweaks to pricing patterns

* Tweaks to description list patterns

* Tweaks to leaderboard patterns

* Add and update names and descriptions

* Ensure comments fields have labels

* Tweak recent additions

* switching machines

* catching up with next

* added permissions pattern

* switching machines

* added post articles

* having local browset issues

* a few more app patterns

* took out info patterns

* spiffed up the action panels

* gave the action panels a once over

* added content to data display

* updated a few patterns

* clean up a few e-commerce patterns

* added time componen to reviews

---------

Co-authored-by: lindsaym-fa <dev@lindsaym.design>
Co-authored-by: Lea Verou <lea@verou.me>
Co-authored-by: Lindsay M <126139086+lindsaym-fa@users.noreply.github.com>
2025-04-14 11:10:54 -04:00
Lea Verou
f13deb87bb Drop hoist from public API, use Popover API where supported (#351)
* First stab at using the Popover API for PE

* fix popup

* First stab at using the Popover API for PE

* fix popup

* Prettier

* Fix TS error

* Remove workaround

* Default to `strategy = fixed` if Popover API is not supported

* Clear out default UA styles for popovers

* Kill `hoist` with fire 🔥

* Refactor

* Update `@floating-ui/dom`

* Fix flipping and shofting

* Fix autosize

* Use `defaultBoundary` for `flip` too

That way we get the previous behavior for it.

* Remove `strategy`, just use `SUPPORTS_POPOVER` check where relevant

* Remove uses of `strategy`

* Use viewport as the default boundary for shifting and autosizing and add `boundary=scroll` to override

---------

Co-authored-by: konnorrogers <konnor5456@gmail.com>
2025-04-09 16:47:40 -05:00
Lea Verou
cff752b600 Move CRUD logic from palette app to Vue mixin 2025-04-02 11:51:12 -04:00
Lea Verou
40a58ff35f Do not rely on {% raw %}, fixes #851 2025-03-31 17:53:33 -04:00
Lea Verou
0f2950c4cc Import CRUD parts from #828 2025-03-31 17:53:33 -04:00
Lea Verou
59dcaaff83 Content hierarchy bugfixes & improvements (#821)
- Sidebar, overview listings, breadcrumbs now based on actual parent-child relationships, rather than increasingly outdated heuristics
- parent properties are now generated automatically from the URL structure, and need only be specified to override that default
- Ability to group by page hierarchy in overview pages, where pages that have >= 2 children become categories

Smaller improvements:
- More flexible syntax for specifying the params of overview pages
- [Overviews] Hide group heading if only one group is present
- parentItem and parentUrl properties that can be used on any page
- Alias a collection as the children of a page (useful for "virtual" parents like Layout)
- Do not error if a page card icon is missing
2025-03-21 16:30:06 -04:00
Konnor Rogers
79bafc513a 11ty for webawesome-app (#803)
* working on integration

* 11ty for webawesome + app

* add flashes

* additional changes

* prettier

* add note about nunjucks

* prettier
2025-03-18 13:04:24 -04:00
Lindsay M
41affca083 Allow color tweak tags to wrap (#769) 2025-02-21 11:50:13 -05:00
Lea Verou
132dbfabcc Gray tweaks prototype (#761)
Co-authored-by: Lindsay M <126139086+lindsaym-fa@users.noreply.github.com>
2025-02-20 12:10:43 -05:00
Lea Verou
4921d1c32e Save palette MVP, fixes #746 (#755) 2025-02-18 16:11:40 -05:00
Lea Verou
726dc73e2a Hue tweaking & chroma scaling, closes #669 #670 (#747)
- General infrastructure to support palette tweaking
- Hue shifts per color scale (UI, permalinks, dynamic code snippets)
- Scale overall chroma up/down (UI, permalinks, dynamic code snippets)
- Update contrast ratio tables (styling for contrast up/down/fail could use improvement, but it's a starting point)
- Make sure it works with Turbo (i.e. things don't break when we navigate to another page)
2025-02-13 19:28:20 -05:00
Lea Verou
ffda52a7cf Theme remixing: Dynamic code snippets (#729) 2025-02-07 23:03:34 -05:00
Lea Verou
c30f3c4b09 Improve theme remixing UI (#724)
Co-authored-by: lindsaym-fa <dev@lindsaym.design>
Co-authored-by: Lindsay M <126139086+lindsaym-fa@users.noreply.github.com>
2025-02-07 11:35:12 -05:00
Lea Verou
17eeccbc5d Better infrastructure for core colors, show core colors in docs, closes #668 2025-02-05 11:24:13 -05:00
Lea Verou
404d59d9d6 Improve FOUCE reduction utility, docs fixes, :state(wa-defined) (#643)
* Utility layout

* Split out, improve & document FOUCE utility
2025-01-31 11:19:30 -05:00
Lindsay M
a64cc60ad5 Revise docs to clarify installation guidance (#638)
* Revise docs to clarify installation guidance

* Fix broken link

* Clarify `:where(:root)`, add CSS part example
2025-01-30 14:40:08 -05:00
Lea Verou
4f9af1e871 Add JS snppet for setting wa-dark based on OS default 2025-01-30 08:32:01 -08:00
Lea Verou
88b6fe2fbe Docs on cherry-picking native styles (#619)
Co-authored-by: Lindsay M <126139086+lindsaym-fa@users.noreply.github.com>
2025-01-28 16:58:53 -05:00
Cory LaViska
e1bf5471bf Use native events when possible (#590)
* fix filename

* <wa-input> input + change (change not working)

* compose that horribly misleading change event

* use native blur/focus events

* update checkbox

* update color picker events

* update color picker events

* update radio group events

* update button events

* remove event options

* update select events

* update image comparer events

* update icon button events

* update slider events

* update rating events

* update radio events

* update switch event

* update textarea events

* update radio button events

* remove unused events

* cleanup

* fix react wrappers

* fix react events for real this time

* update changelog

* add note

* Update src/components/input/input.ts

Co-authored-by: Lea Verou <lea@verou.me>

* delete unused close event

* use same event type

* fix tests

* remove wa- from events in docs and examples

* fix comment

* Update docs/docs/resources/changelog.md

Co-authored-by: Lea Verou <lea@verou.me>

---------

Co-authored-by: Lea Verou <lea@verou.me>
2025-01-23 17:52:41 -05:00
Lea Verou
7258c001a7 Demo for mixing and matching (#565) 2025-01-17 10:38:03 -05:00
Lea Verou
da32015f27 Basic mixing and matching docs (#560) 2025-01-16 16:31:24 -05:00
Lea Verou
df51149d0a Show contrast ratios in contrast pair tables 2025-01-16 13:18:26 -05:00
lindsaym-fa
ecf21adddc Fix punctuation 2025-01-16 10:15:16 -05:00
Lea Verou
52c24fc3b7 Add color palette to theme pages 2025-01-16 10:15:16 -05:00
Lea Verou
d464714d7b Rudimentary palette icons 2025-01-16 10:15:16 -05:00
Lea Verou
7d089bbe2f Palette Docs 2025-01-16 10:15:16 -05:00
Lea Verou
a07f6280a3 Themes category in docs (#477)
Co-authored-by: Lindsay M <126139086+lindsaym-fa@users.noreply.github.com>
Co-authored-by: lindsaym-fa <dev@lindsaym.design>
2025-01-13 13:14:12 -05:00
Lea Verou
6822b25772 Rewrite color scheme logic (#481)
- Minimize needless swaps
- Centralize logic
- Use an actual `<wa-select>` rather than hacking it with `<wa-dropdown>`
- Move shared includes to shared template
- Rewrite critical theme JS
- Refactor of theme picker code
- Utilize view transitions better and use them for color scheme too
- Do not store default value in localStorage
- Removed unused `*-wide` templates
- Fixed #482
2025-01-10 15:32:28 -05:00
Lea Verou
419f0610e4 Template-tweaks
- Move breadcrumbs to separate template
- Rename `beforeContent` to `header`
- Move breadcrumbs inside header
2025-01-09 02:26:01 -05:00
Lea Verou
19042fcca4 Decouple dark mode & theme, fixes #445 closes #385 (#457)
Co-authored-by: Lindsay M <126139086+lindsaym-fa@users.noreply.github.com>
2025-01-08 12:50:29 -05:00
Lea Verou
ef7d47e2b9 [Docs] Move commonalities across blocks to a single base layout (#424) 2025-01-06 17:01:29 -05:00
Lea Verou
ac7437894a Automate all overviews, fix bugs with filtering 2025-01-03 20:17:19 -05:00
Lea Verou
83fb761d41 Rename applied.css to docs and add some docs on usage 2024-12-20 14:01:14 -05:00
Lea Verou
84734a56b6 Add class names to utility class pages 2024-12-20 13:20:06 -05:00
Lea Verou
a238880dbe Allow utilities to have statuses too 2024-12-20 13:14:37 -05:00
Lea Verou
b0bb014167 Statuses 2024-12-20 10:58:45 -05:00
Lea Verou
dabaef3fab The big rename nobody wants to do :P 2024-12-19 04:03:44 -05:00
Lea Verou
e74edd8f68 Element description, just like components 2024-12-18 11:15:52 -05:00
Lea Verou
af3b83318b Cross linking between Essentials and Components 2024-12-17 18:06:54 -05:00
Cory LaViska
e973b599aa add links; fixes #313 2024-12-17 12:10:11 -05:00
Cory LaViska
f8e61f72c4 fix typo 2024-12-17 11:53:30 -05:00
Cory LaViska
0eebf44292 move custom states 2024-12-17 11:29:47 -05:00
Cory LaViska
37a1680a85 move states 2024-12-17 11:10:04 -05:00
lindsaym-fa
28ebab868b remove busted links to old layout.css location 2024-12-13 15:03:25 -05:00
Lea Verou
9c17d27af4 Big CSS Reorg Part 1 (#304) 2024-12-13 13:45:33 -05:00
Lea Verou
ea25de8040 Split CSS utility regions into separate files 2024-12-13 04:25:58 -05:00
Cory LaViska
9a68409ccd Merge branch 'next' into konnorrogers/set-outline-false-on-page 2024-12-09 12:56:40 -05:00