Skip to content

UI Framework

Requirements

You should be familiar with:

Getting Started

git clone https://github.com/fosscord/fosscord-ui
cd fosscord-ui
npm install
npm run scss

Open ./test/index.html to see the test page.

Writing a component

text inside of <> has to be replaced by the corresponding values

  1. create a file named like the component you're creating in test/<component>.html and scss/<component>.scss

  2. copy the content of test/template.html to test/<component>.html and replace the <h1> content with the components name

  3. source the created test/<component>.html> in test/index.html as follows: append the following to scss/index.scss to the div with the class "grid"

<a
  class="Link"
  href="<component>.html"
  class="text link">

  <component>
</a>
  1. source the created scss/<component>.scss in scss/index.scss as follows: append the following to scss/index.scss
...
@import "<component>.scss";
Back to top