• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号
登陆 注册

clshortfuse/materialdesignweb: Material Design for Web

原作者: [db:作者] 来自: 网络 收藏 邀请

开源软件名称（OpenSource Name）：

clshortfuse/materialdesignweb

开源软件地址(OpenSource Url)：

https://github.com/clshortfuse/materialdesignweb

开源编程语言(OpenSource Language)：

JavaScript 59.6%

开源软件介绍(OpenSource Introduction)：

materialdesignweb

Material Design for Web

Demo

https://clshortfuse.github.io/materialdesignweb/

Getting started

npm: npm install @shortfuse/materialdesignweb

Core modules

Module CSS-Only Support Description status
aria ❌ Handles ARIA attributes, ARIA roles, tabindexes, and keyboard interaction preRC
document ✅ Applies color-scheme, standalone-window, and user agents detection RC
overlay ✅ Applies overlay states to components RC
ripple ✅ Applies press ripple on interactions preRC
theme ✅ Applies ink and surface colors based on light/dark context preRC
transition ❌ Transitions shape and content between elements preRC

Component Modules

Component Integrations CSS-Only Support Keyboard Support ARIA Role ARIA Attributes Status
appbar button ✅ N/A ❌ ❌ beta
backdrop planned
banner button ✅ N/A ❌ ❌ beta
bottomnav bottomnavitem† overlay ❌ ✅ tablist aria-multiselectable aria-orientation RC
bottomnavitem overlay ripple ❌ ✅ tab aria-selected RC
button overlay ripple ✅ ✅ button aria-disabled‡ aria-pressed‡ stable
card button divider ✅ N/A ❌ ❌ preRC
chip chipitem ✅ ❌ ❌ ❌ alpha
chipitem ❌ ❌ ❌ ❌ ❌ alpha
datatable button ✅ ✅ grid aria-selected preRC
dialog button ✅ ✅ dialog aria-modal preRC
divider ✅ separator‡ preRC
elevation ✅ RC
fab button† ✅ ❌ ❌ ❌ beta
grid ✅ ❌ ❌ preRC
imagelist use grid
layout ✅ ❌ ❌ ❌ beta
list listitem† listexpander ✅ ✅ group list listbox radiogroup tree aria-orientation preRC
listcontent overlay ripple ✅ ✅ listitem link option radio treeitem aria-checked aria-selected preRC
listitem ✅ ✅ treeitem none aria-expanded aria-hidden preRC
listsecondary ✅ ✅ none‡ preRC
menu divider menuitem† ✅ ✅ menu aria-hidden preRC
menuitem overlay ripple ✅ ✅ menuitem menuitemradio menuitemcheckbox aria-disabled aria-checked stable
navdrawer use layout
progress ✅ ❌ ❌ beta
selection ✅ ✅ checkbox‡ radio‡ aria-checked aria-disabled preRC
sidesheet use layout
slider ✅ ❌ ❌ ❌ alpha
snackbar button ✅ ✅ alert aria-hidden RC
tab tablist tabcontent ❌ RC
tabcontent tabpanel† ❌ ✅ RC
tabitem overlay ripple ❌ ✅ tab aria-selected RC
tablist tabitem† overlay ❌ ✅ tablist aria-multiselectable aria-orientation RC
tabpanel ❌ ✅ tabpanel aria-expanded aria-hidden RC
textfield list ✅ ✅ ❌ ❌ preRC
tooltip ✅ ❌ ❌ beta
type ✅ RC

Adapter classes

Adapter Components Status
datatable button datatable† preRC
dom preRC
list domadapter† listitem† preRC
search list† textfield† preRC

Legend

  • planned - Planned for later

  • draft - Not yet functional

  • alpha - Partially working

  • beta - Working but incomplete

  • preRC - Needs minor changes

  • RC - Needs testing as-is

  • stable - Production-ready

  • † - Required

  • ‡ - Apply manually

鲜花
握手
雷人
路过
鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
More+
上一篇：
Ramotion/animated-tab-bar: RAMAnimatedTabBarController is a Swift UI module libr ...发布时间：2022-08-18
下一篇：
fython/PackageTracker: Track your package simply on Android.发布时间：2022-08-18
热门推荐
More+
热门话题
More+
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服（服务时间 9:00～18:00）

在线QQ客服
地址：深圳市南山区西丽大学城创智工业园
电邮：jeky_zhao#qq.com
移动电话：139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap