From 578419c3e7ad080afaefa6d86439fb759a641a01 Mon Sep 17 00:00:00 2001 From: codecalm Date: Fri, 20 Dec 2019 23:58:12 +0100 Subject: [PATCH] charts fixes --- pages/_data/charts.yml | 30 -------------- pages/_data/colors.yml | 11 +++++ pages/_includes/cards/gallery.html | 22 ++++++++++ .../_includes/layout/page-title-actions.html | 41 +++++++++++-------- pages/_includes/ui/form/input-icon.html | 2 +- pages/gallery.html | 22 +--------- scss/_debug.scss | 2 +- scss/layout/_page.scss | 2 +- scss/ui/_cards.scss | 2 +- 9 files changed, 63 insertions(+), 71 deletions(-) create mode 100644 pages/_includes/cards/gallery.html diff --git a/pages/_data/charts.yml b/pages/_data/charts.yml index 421b6ad5..02d4b907 100644 --- a/pages/_data/charts.yml +++ b/pages/_data/charts.yml @@ -76,7 +76,6 @@ total-sales: type: donut demo: true sparkline: true - name: Total sales series: - name: Direct color: blue @@ -92,8 +91,6 @@ total-sales: data: 12 campaigns: - name: Campaigns - demo: true type: radialBar sparkline: true series: @@ -108,7 +105,6 @@ campaigns: data: 18 tasks: - name: Tasks demo: true type: line categories: ['M', 'T', 'W', 'T', 'F', 'S', 'S', 'M', 'T', 'W', 'T', 'F', 'S', 'S', 'M', 'T', 'W'] @@ -130,9 +126,6 @@ tasks: data: [0, 0, 1, 0, 2, 0, 1, 0, 2, 3, 0, 2, 3, 2, 1, 0, 0] development-activity: - name: Development Activity - title: Development Activity - demo: true type: area groups: [1, 2, 3] hide-points: true @@ -146,8 +139,6 @@ development-activity: data: [3, 5, 4, 6, 7, 5, 6, 8, 24, 7, 12, 5, 6, 3, 8, 4, 14, 30, 17, 19, 15, 14, 25, 32, 40, 55, 60, 48, 52, 70] line: - name: Employment Growth - demo: true type: line show-grid: true categories: ['2013', '2014', '2015', '2016', '2017', '2018'] @@ -163,7 +154,6 @@ line: data: [17, 18, 21, 20, 30, 29] line-stroke: - name: Line chart demo: true type: line stroke-curve: straight @@ -181,7 +171,6 @@ line-stroke: data: [7, 10, 11, 18, 18, 18, 24] stepline: - name: Stepline demo: true type: line stroke-curve: stepline @@ -192,7 +181,6 @@ stepline: data: [34, 44, 54, 21, 12, 43, 33, 23, 66, 66, 58] temperature: - name: Monthly Average Temperature demo: true type: line show-labels: true @@ -210,7 +198,6 @@ temperature: area: - name: Lorem ipsum demo: true type: area categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun'] @@ -224,7 +211,6 @@ area: area-spline: - name: Lorem ipsum demo: true type: area spline: true @@ -239,7 +225,6 @@ area-spline: area-spline-stacked: - name: Lorem ipsum demo: true type: area spline: true @@ -255,7 +240,6 @@ area-spline-stacked: spline: - name: Wind speed during two days demo: true type: line spline: true @@ -269,12 +253,7 @@ spline: color: green data: [0, 0, 0.6, 0.9, 0.8, 0.2, 0, 0, 0, 0.1, 0.6, 0.7, 0.8, 0.6, 0.2, 0, 0.1, 0.3, 0.3, 0, 0.1, 0, 0, 0, 0.2, 0.1, 0, 0.3, 0, 0.1, 0.2, 0.1, 0.3, 0.3, 0, 3.1, 3.1, 2.5, 1.5, 1.9, 2.1, 1, 2.3, 1.9, 1.2, 0.7, 1.3, 0.4, 0.3] - - - pie: - name: Lorem ipsum - demo: true type: pie show-data-labels: true sparkline: true @@ -293,8 +272,6 @@ pie: data: 14 donut: - name: Lorem ipsum - demo: true type: donut sparkline: true series: @@ -307,7 +284,6 @@ donut: scatter: - name: Lorem ipsum demo: true type: scatter categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun'] @@ -321,7 +297,6 @@ scatter: combination: - name: Combination chart demo: true type: bar types: @@ -347,7 +322,6 @@ revenue-bg: type: area days-labels-count: 30 sparkline: true - demo: true series: - name: Profits data: [37, 35, 44, 28, 36, 24, 65, 31, 37, 39, 62, 51, 35, 41, 35, 27, 93, 53, 61, 27, 54, 43, 19, 46, 39, 62, 51, 35, 41, 67] @@ -358,7 +332,6 @@ new-clients: sparkline: true stroke-width: [2, 1] stroke-dash: [0, 3] - demo: true series: - name: May color: blue @@ -371,7 +344,6 @@ active-users: type: bar days-labels-count: 30 sparkline: true - demo: true series: - name: Profits data: [37, 35, 44, 28, 36, 24, 65, 31, 37, 39, 62, 51, 35, 41, 35, 27, 93, 53, 61, 27, 54, 43, 19, 46, 39, 62, 51, 35, 41, 67] @@ -379,7 +351,6 @@ active-users: traffic-in: type: bar sparkline: true - demo: true color: green series: - name: Inbound @@ -387,7 +358,6 @@ traffic-in: traffic-out: type: bar - demo: true sparkline: true color: red series: diff --git a/pages/_data/colors.yml b/pages/_data/colors.yml index 3fa9c24b..aa6a746d 100644 --- a/pages/_data/colors.yml +++ b/pages/_data/colors.yml @@ -97,6 +97,17 @@ green-700: '#387000' green-800: '#264a00' green-900: '#132500' +lime: '#7bd235' +lime-100: '#e5f6d7' +lime-200: '#caedae' +lime-300: '#b0e486' +lime-400: '#95db5d' +lime-500: '#7bd235' +lime-600: '#62a82a' +lime-700: '#4a7e20' +lime-800: '#315415' +lime-900: '#192a0b' + teal: '#2bcbba' teal-100: '#d5f5f1' teal-200: '#aaeae3' diff --git a/pages/_includes/cards/gallery.html b/pages/_includes/cards/gallery.html new file mode 100644 index 00000000..50bcd6cb --- /dev/null +++ b/pages/_includes/cards/gallery.html @@ -0,0 +1,22 @@ +
+
+ +
+ {% include ui/avatar.html person=include.person class="mr-3 rounded" %} +
+
{{ include.person.full_name }}
+
{{ forloop.index | random_date_ago: 10 | timeago }}
+
+
+ + {% include_cached ui/icon.html icon="eye" %} + {{ forloop.index | random_number: 300, 600 }} + + + {% include_cached ui/icon.html icon="heart" %} + {{ forloop.index | random_number: 20, 100 }} + +
+
+
+
\ No newline at end of file diff --git a/pages/_includes/layout/page-title-actions.html b/pages/_includes/layout/page-title-actions.html index 1d56d772..2ef21e4d 100644 --- a/pages/_includes/layout/page-title-actions.html +++ b/pages/_includes/layout/page-title-actions.html @@ -2,23 +2,30 @@
- {% if actions == 'users' %} -
- - {% include_cached ui/button.html text="New user" color="primary" icon="plus" %} -
- {% elsif actions == 'calendar' %} -
- {% include_cached ui/button.html text="Add event" color="primary" icon="plus" %} -
- {% elsif actions == 'breadcrumb' %} -
- {% include_cached ui/breadcrumb.html class="breadcrumb-alternate" %} -
- {% elsif actions == 'buttons' %} - + {% if actions == 'users' %} +
+ + {% include_cached ui/button.html text="New user" color="primary" icon="plus" %} +
+ {% elsif actions == 'calendar' %} +
+ {% include_cached ui/button.html text="Add event" color="primary" icon="plus" %} +
+ {% elsif actions == 'photos' %} +
+
+ {% include ui/form/input-icon.html %} +
+ {% include_cached ui/button.html text="Add event" color="primary" icon="plus" %} +
+ {% elsif actions == 'breadcrumb' %} +
+ {% include_cached ui/breadcrumb.html class="breadcrumb-alternate" %} +
+ {% elsif actions == 'buttons' %} + {% include_cached ui/button.html text="New view" color="secondary" icon="plus" %} - {% include_cached ui/button.html text="Create new report" color="primary" class="ml-3" %} - {% endif %} + {% include_cached ui/button.html text="Create new report" color="primary" class="ml-3" %} + {% endif %}
\ No newline at end of file diff --git a/pages/_includes/ui/form/input-icon.html b/pages/_includes/ui/form/input-icon.html index 9b3af86c..7cbc9f90 100644 --- a/pages/_includes/ui/form/input-icon.html +++ b/pages/_includes/ui/form/input-icon.html @@ -10,7 +10,7 @@ {{ addon }} {% endif %} - + {% unless include.prepend %} {{ addon }} diff --git a/pages/gallery.html b/pages/gallery.html index f21652a6..d876d332 100644 --- a/pages/gallery.html +++ b/pages/gallery.html @@ -2,6 +2,7 @@ title: Gallery page-title: Gallery page-title-description: 1-12 of 241 photos +page-title-actions: photos done: true menu: gallery --- @@ -12,26 +13,7 @@ menu: gallery {% if photo.horizontal %} {% assign person = site.data.people[forloop.index0] %}
-
- -
- {% include ui/avatar.html person=person class="mr-3" %} -
-
{{ person.full_name }}
- {{ forloop.index | random_date_ago: 10 | timeago }} -
-
- - {% include_cached ui/icon.html icon="eye" %} - {{ forloop.index | random_number: 300, 600 }} - - - {% include_cached ui/icon.html icon="heart" %} - {{ forloop.index | random_number: 20, 100 }} - -
-
-
+ {% include cards/gallery.html person=person %}
{% assign horizontal = horizontal | plus: 1 %} {% endif %} diff --git a/scss/_debug.scss b/scss/_debug.scss index 5d80477c..430bb411 100644 --- a/scss/_debug.scss +++ b/scss/_debug.scss @@ -1,7 +1,7 @@ $debug: false; @if $debug { - $colors: ("blue": $blue, "azure": $azure, "indigo": $indigo, "purple": $purple, "pink": $pink, "red": $red, "orange": $orange, "yellow": $yellow, "green": $green, "teal": $teal, "cyan": $cyan); + $colors: ("blue": $blue, "azure": $azure, "indigo": $indigo, "purple": $purple, "pink": $pink, "red": $red, "orange": $orange, "yellow": $yellow, "lime": $lime, "green": $green, "teal": $teal, "cyan": $cyan); @each $name, $color in $colors { @debug ("#{$name}: '#{$color}'"); diff --git a/scss/layout/_page.scss b/scss/layout/_page.scss index 080c0f34..ddb9239c 100644 --- a/scss/layout/_page.scss +++ b/scss/layout/_page.scss @@ -2,7 +2,7 @@ display: flex; align-items: center; min-height: 2.25rem; - margin: .25rem 0 1.5rem; + margin: .25rem 0 $card-spacer-y; >* { flex: 1; diff --git a/scss/ui/_cards.scss b/scss/ui/_cards.scss index e9a161f1..492c9c9a 100644 --- a/scss/ui/_cards.scss +++ b/scss/ui/_cards.scss @@ -20,7 +20,7 @@ .card-sm { .card-body { - padding: .75rem; + padding: map-get($spacers, 3); } } -- GitLab