Docs/variables data (#1314)

* Replace variables.json with colors.json and update related files accordingly

* Add variables data files

* Update variables include template and all related files to use new variables data

* Fix mobile breakpoint id typo in responsivness docs page

* Fix Liquid syntax error in made-with-bulma docs page

* Update bulma sass files count in modular docs page

* Use breakpoints data in responsiveness helpers docs page

* Use breakpoints and variables data in typography helpers docs page

* Add missing page titles in docs pages front matter

docs/_data/variables/components/card.json

@@ -0,0 +1,45 @@
+{
+  "dir_name": "components",
+  "file_name": "card",
+  "file_relative_path": "components/card.sass",
+  "file_line_from": 1,
+  "file_line_to": 9,
+  "file_url": "https://github.com/jgthms/bulma/blob/master/sass/components/card.sass#L1,L9",
+  "vars": {
+    "card-color": {
+      "id": "card-color",
+      "name": "$card-color",
+      "value": "$text"
+    },
+    "card-background-color": {
+      "id": "card-background-color",
+      "name": "$card-background-color",
+      "value": "$white"
+    },
+    "card-shadow": {
+      "id": "card-shadow",
+      "name": "$card-shadow",
+      "value": "0 2px 3px rgba($black, 0.1), 0 0 0 1px rgba($black, 0.1)"
+    },
+    "card-header-color": {
+      "id": "card-header-color",
+      "name": "$card-header-color",
+      "value": "$text-strong"
+    },
+    "card-header-shadow": {
+      "id": "card-header-shadow",
+      "name": "$card-header-shadow",
+      "value": "0 1px 2px rgba($black, 0.1)"
+    },
+    "card-header-weight": {
+      "id": "card-header-weight",
+      "name": "$card-header-weight",
+      "value": "$weight-bold"
+    },
+    "card-footer-border-top": {
+      "id": "card-footer-border-top",
+      "name": "$card-footer-border-top",
+      "value": "1px solid $border"
+    }
+  }
+}