Andreas Reinhold / reiniandClaude Opus 5
4141ebe7b0
<x-search> renders data-md-search with data-md-trigger and binds data-md-open and data-md-full-screen; its parts become data-md-search-* and the empty row data-md-search-empty. search.css moves into material.components on px, spacing and state tokens (plan step 36). search.js and the showcase layout follow the renamed hooks. Browser tests cover the polite result count as it changes, the icon entry point expanding full screen and returning focus, and suggestions swapping to results on the first key. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01Qwx5USif3wFFmxtHg5U1g9
39 lines
1.4 KiB
CSS
39 lines
1.4 KiB
CSS
/*
|
|
* Livewire Material's Tailwind half: the theme that turns the tokens into utilities, the token
|
|
* utilities, and the component stylesheets still written for Tailwind (`@utility`, `@variant`,
|
|
* `@layer components`). It goes when the last component leaves Tailwind.
|
|
*
|
|
* It carries no tokens, so it can sit behind the foundation without declaring them twice — the
|
|
* Workbench imports it that way, after Tailwind:
|
|
*
|
|
* @import '../../../resources/css/foundation.css';
|
|
* @import 'tailwindcss' source(none);
|
|
* @import '../../../resources/css/tailwind.css';
|
|
*
|
|
* An application on 1.x-style imports keeps importing material.css, which brings the tokens and
|
|
* this file together.
|
|
*/
|
|
|
|
@import './tokens/theme.css';
|
|
@import './tokens/utilities.css';
|
|
/* Actions and communication — leaving in step 36 */
|
|
@import './components/actions.css';
|
|
@import './components/groups.css';
|
|
@import './components/menu.css';
|
|
|
|
/* Inputs, selection and data — leaving in step 36 */
|
|
@import './components/datepicker.css';
|
|
@import './components/timepicker.css';
|
|
@import './components/table.css';
|
|
|
|
/* Containment — leaving in step 36 */
|
|
@import './components/list.css';
|
|
@import './components/collapse.css';
|
|
@import './components/dialog.css';
|
|
|
|
/* Navigation — leaving in step 36 */
|
|
@import './components/tabs.css';
|
|
@import './components/app-bar.css';
|
|
@import './components/navigation.css';
|
|
@import './components/toolbar.css';
|