florida-drupalcamp-tailwindcss

Find a file

Oliver Davies d7d778096e Add homepage header		2020-12-27 12:07:35 +00:00
assets/css	Make child links toggleable	2020-12-27 12:07:17 +00:00
bin	Initial commit	2020-12-26 22:20:18 +00:00
config	Add mobile navigation	2020-12-27 12:07:16 +00:00
public	Add homepage header	2020-12-27 12:07:35 +00:00
src	Add mobile navigation	2020-12-27 12:07:16 +00:00
templates	Add homepage header	2020-12-27 12:07:35 +00:00
.env	Initial commit	2020-12-26 22:20:18 +00:00
.gitignore	Add and configure Tailwind CSS	2020-12-26 22:43:57 +00:00
composer.json	Initial commit	2020-12-26 22:20:18 +00:00
composer.lock	Initial commit	2020-12-26 22:20:18 +00:00
package.json	Add and configure Tailwind CSS	2020-12-26 22:43:57 +00:00
postcss.config.js	Add and configure Tailwind CSS	2020-12-26 22:43:57 +00:00
README.rst	Add and configure Tailwind CSS	2020-12-26 22:43:57 +00:00
symfony.lock	Initial commit	2020-12-26 22:20:18 +00:00
tailwind.config.js	Override sm screen size	2020-12-27 12:07:17 +00:00
yarn.lock	Add and configure Tailwind CSS	2020-12-26 22:43:57 +00:00

README.rst

Florida DrupalCamp Tailwind CSS Workshop
########################################

Local web server
================

Run the following command to start a local web server. Going to that URL in your browser should show you the example page.

.. code::

    php -S 127.0.0.1:8000 -t public

Building the CSS
================

The CSS is generated from ``assets/css/tailwind.pcss`` and is compiled using ``postcss-cli``.

To simplify the process, there are some custom npm scripts added in ``package.json`` that can be used to compile the CSS:

- ``yarn dev`` - generate the development CSS which is un-purged and un-minified.
- ``yarn prod`` - generate the production CSS which is purged and minified.
- ``yarn watch`` - generate the development CSS, but re-generate automatically when the source file is changed.