From: Jeremy Thomas Date: Sat, 29 Jul 2017 14:47:33 +0000 (+0100) Subject: Add getting started X-Git-Tag: 0.5.0~9 X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=78f297c5fb058598141f9b18148c82b74c801838;p=thirdparty%2Fbulma.git Add getting started --- diff --git a/docs/_config.yml b/docs/_config.yml index 7bb099360..e3bf7fec3 100644 --- a/docs/_config.yml +++ b/docs/_config.yml @@ -8,7 +8,7 @@ description: "Bulma is an open source CSS framework based on Flexbox and built markdown: kramdown permalink: pretty url: http://bulma.io -fontawesome: https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css +fontawesome: https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css exclude: ['fontawesome', 'node_modules', 'templates', '.babelrc', 'bulma-docs.sass', 'docker-compose.yml', 'package.json', 'yarn.lock'] # Variables diff --git a/docs/_includes/getting-started.html b/docs/_includes/getting-started.html new file mode 100644 index 000000000..5e08d4c27 --- /dev/null +++ b/docs/_includes/getting-started.html @@ -0,0 +1,21 @@ + + + + + Hello Bulma! + + + + +
+
+

+ Hello World +

+

+ My first website with Bulma! +

+
+
+ + \ No newline at end of file diff --git a/docs/documentation/elements/tag.html b/docs/documentation/elements/tag.html index 078e8b2df..7e17770ed 100644 --- a/docs/documentation/elements/tag.html +++ b/docs/documentation/elements/tag.html @@ -123,7 +123,7 @@ variables: {% capture tags_delete_addons %}
- Alex Smith + Alex Smith
{% endcapture %} diff --git a/docs/documentation/overview/start.html b/docs/documentation/overview/start.html index 26fa2ac0d..301093c8a 100644 --- a/docs/documentation/overview/start.html +++ b/docs/documentation/overview/start.html @@ -9,11 +9,28 @@ doc-subtab: start
-

3 ways to start

+

Getting started

You only need 1 CSS file to use Bulma

+
+

+ There are several ways to get started with Bulma. You can either: +

+
    +
  1. + use npm to install the Bulma package +
    2. +
  2. + use the cdnjs CDN to link to the Bulma stylesheet +
    3. +
  3. + use the GitHub repository to get the latest development version +
    4. +
+
+

1

@@ -22,9 +39,7 @@ doc-subtab: start

Use NPM (recommended):

-{% highlight bash %} -npm install bulma -{% endhighlight %} + {% highlight bash %}npm install bulma{% endhighlight %}
@@ -62,10 +77,21 @@ npm install bulma

If you want to use icons with Bulma, don't forget to include Font Awesome:

-{% highlight html %} - -{% endhighlight %} + {% highlight html %}{% endhighlight %}
+ + {% include heading.html name="Starter template" %} + +
+

+ If you want to get started right away, you can use this HTML starter template. Just copy/paste this code in a file and save it on your computer. +

+
+ +
+ {% highlight html %}{% include getting-started.html %}{% endhighlight %} +
+