Skip to content
This repository has been archived by the owner on Jul 27, 2021. It is now read-only.

The material design `preact-cli` template

License

Notifications You must be signed in to change notification settings

preactjs-templates/material

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

59 Commits
 
 
 
 
 
 

Repository files navigation

THIS TEMPLATE IS DEPRECATED

preact-material-boilerplate

Documentation

Usage

$ npm install -g preact-cli
$ preact create material my-project
$ cd my-project
$ npm install
$ npm run dev

Development server runs on port 8080. If the default port is already in use on your machine it will start the development server on a random port.

Styling material components

In order to style the material components you can give class names to the components and target them with the css selector in any css files.

To style them globally use the index [style.css](https://github.com/preactjs-templates/material/blob/master/template/src/style/index.css), so that it affects it everywhere. e.g.

.mdc-dialog .mdc-dialog__surface{
  max-width: 300px;
  min-width: 0;
  color: tomato;
}

Theming

In order to alter the theme of the app you can again use the index [style.css](https://github.com/preactjs-templates/material/blob/master/template/src/style/index.css) and alter the theme variables in it defined here: https://material.io/develop/web/components/theme/#css-custom-properties

But you can also give class names to the components and use these variables to just change the theme of that component.

Commands

  • npm run start: Runs serve or dev, depending on NODE_ENV value. Defaults to dev server

  • npm run dev: Run a development, HMR server

  • npm run serve: Run a production-like server

  • npm run build: Production-ready build

  • npm run lint: Pass JavaScript files using ESLint

Fork It And Make Your Own

You can fork this repo to create your own boilerplate, and use it with preact-cli:

preact create username/repo my-project

About

The material design `preact-cli` template

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published