To run the project.
docker-compose up
To build the project
npm run build-storybook
There are two places to put CSS. Global styles go in the public/styles folder. Module styles stay in the individual .astro
file for their module.
Global styles go in the public
folder and are organized into the following files:
main.css
text.css
includes headings, body, labels, etc.heading-1
throughheading-6
all includes styles for the three breakpoints.
font-faces.css
has@font-face
rules for using Poppins. Currently we directly use scripts from Google Fonts in Layout.astro.
Module styles go into a <style>
block at the bottom of the .astro
file that contains the corresponding component.
An .astro
file looks like this:
---
// TypeScript/JavaScript code goes here. Use JavaScript for Hubspot compatibility.
---
<!-- HTML markup goes here -->
<style>
/* Styles for this component go here */
</style>