search

aforemny / material-components-web-elm

Material Components for Elm
https://aforemny.github.io/material-components-web-elm
MIT License
93 stars 20 forks source link

there is no such class mdc-chip-set--action #118

Closed srghma closed 4 years ago

srghma commented 4 years ago

it's without class

https://material-components.github.io/material-components-web-catalog/#/component/chips

2020-08-24-11:05:01-screenshot

srghma commented 4 years ago

https://github.com/aforemny/material-components-web-elm/blob/e64954e9783130b3b850043031a721a3d93f8d70/src/Material/ChipSet/Action.elm#L73

srghma commented 4 years ago

problem with missing classes could be resolved by extracting class names

e.g. in my halogen project I'm extracting class names to https://github.com/srghma/purescript-halogen-material-components-web/tree/master/src/Material/Classes

using https://github.com/srghma/generate-halogen-generate-css-classes

using script 

gen () {
  # e.g. $2 = "Classes.RMWC.Avatar"
  # e.g. filedir = "Classes/RMWC/Avatar.purs"
  filedir=$(echo -n "$2" | sd --string-mode '.' '/' && echo -n ".purs")
  output="/home/srghma/projects/purescript-halogen-material-components-web/src/$filedir"
  mkdir -p $(dirname $output)

  /home/srghma/projects/generate-halogen-generate-css-classes/.stack-work/dist/x86_64-linux-nix/Cabal-2.4.0.1/build/generate-halogen-generate-css-classes-exe/generate-halogen-generate-css-classes-exe \
    --input "/home/srghma/projects/purescript-halogen-nextjs/node_modules/$1" \
    --output "$output" \
    --module-name "$2"
}

gen @material/button/dist/mdc.button.css                   Material.Classes.Button
gen @material/card/dist/mdc.card.css                       Material.Classes.Card
gen @material/checkbox/dist/mdc.checkbox.css               Material.Classes.Checkbox
gen @material/chips/dist/mdc.chips.css                     Material.Classes.Chips
gen @material/data-table/dist/mdc.data-table.css           Material.Classes.DataTable
gen @material/dialog/dist/mdc.dialog.css                   Material.Classes.Dialog
gen @material/drawer/dist/mdc.drawer.css                   Material.Classes.Drawer
gen @material/elevation/dist/mdc.elevation.css             Material.Classes.Elevation
gen @material/fab/dist/mdc.fab.css                         Material.Classes.Fab
gen @material/floating-label/dist/mdc.floating-label.css   Material.Classes.FloatingLabel
gen @material/form-field/dist/mdc.form-field.css           Material.Classes.FormField
gen @material/grid-list/dist/mdc.grid-list.css             Material.Classes.GridList
gen @material/icon-button/dist/mdc.icon-button.css         Material.Classes.IconButton
gen @material/image-list/dist/mdc.image-list.css           Material.Classes.ImageList
gen @material/layout-grid/dist/mdc.layout-grid.css         Material.Classes.LayoutGrid
gen @material/line-ripple/dist/mdc.line-ripple.css         Material.Classes.LineRipple
gen @material/linear-progress/dist/mdc.linear-progress.css Material.Classes.LinearProgress
gen @material/list/dist/mdc.list.css                       Material.Classes.List
gen @material/menu/dist/mdc.menu.css                       Material.Classes.Menu
gen @material/menu-surface/dist/mdc.menu-surface.css       Material.Classes.MenuSurface
gen @material/notched-outline/dist/mdc.notched-outline.css Material.Classes.NotchedOutline
gen @material/radio/dist/mdc.radio.css                     Material.Classes.Radio
gen @material/ripple/dist/mdc.ripple.css                   Material.Classes.Ripple
gen @material/select/dist/mdc.select.css                   Material.Classes.Select
gen @material/slider/dist/mdc.slider.css                   Material.Classes.Slider
gen @material/snackbar/dist/mdc.snackbar.css               Material.Classes.Snackbar
gen @material/switch/dist/mdc.switch.css                   Material.Classes.Switch
gen @material/tab/dist/mdc.tab.css                         Material.Classes.Tab
gen @material/tab-bar/dist/mdc.tab-bar.css                 Material.Classes.TabBar
gen @material/tab-indicator/dist/mdc.tab-indicator.css     Material.Classes.TabIndicator
gen @material/tab-scroller/dist/mdc.tab-scroller.css       Material.Classes.TabScroller
gen @material/textfield/dist/mdc.textfield.css             Material.Classes.Textfield
gen @material/theme/dist/mdc.theme.css                     Material.Classes.Theme
gen @material/top-app-bar/dist/mdc.top-app-bar.css         Material.Classes.TopAppBar
gen @material/typography/dist/mdc.typography.css           Material.Classes.Typography
srghma commented 4 years ago

it can be amended for elm, just change this https://github.com/srghma/generate-halogen-generate-css-classes/blob/777ab19e1dec141c90fdf1461bcac923beca4910/cli/Main.hs#L93-L106

aforemny commented 4 years ago

Hi @srghma, thank you for reporting this. It is fixed in d482328a24a838fd44be1a583fdb71d474fbc926. Seeing that we did not have issues with non-existent CSS classes before, I decided not to include automatic extraction of class names since it seems to be non-trivial.