charts fixes

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:

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'

pages/_includes/cards/gallery.html

+<div class="card card-sm">
+  <div class="card-body">
+    <a href="#" class="mb-3 d-block"><img src="{{ site.base }}/img/photos/{{ photo.file }}" class="rounded"></a>
+    <div class="d-flex align-items-center">
+      {% include ui/avatar.html person=include.person class="mr-3 rounded" %}
+      <div class="leading-tight">
+        <div>{{ include.person.full_name }}</div>
+        <div class="text-muted">{{ forloop.index | random_date_ago: 10 | timeago }}</div>
+      </div>
+      <div class="ml-auto">
+        <a href="#" class="text-muted">
+          {% include_cached ui/icon.html icon="eye" %}
+          {{ forloop.index | random_number: 300, 600 }}
+        </a>
+        <a href="#" class="ml-3 text-muted">
+          {% include_cached ui/icon.html icon="heart" %}
+          {{ forloop.index | random_number: 20, 100 }}
+        </a>
+      </div>
+    </div>
+  </div>
+</div>
\ No newline at end of file

pages/_includes/layout/page-title-actions.html

@@ -2,23 +2,30 @@
 
 <!-- Page title actions -->
 <div class="col-auto ml-auto d-print-none">
-	{% if actions == 'users' %}
-		<div class="d-flex">
-			<input type="search" class="form-control d-inline-block w-9 mr-3" placeholder="Search user&hellip;"/>
-			{% include_cached ui/button.html text="New user" color="primary" icon="plus" %}
-		</div>
-	{% elsif actions == 'calendar' %}
-		<div class="d-flex">
-			{% include_cached ui/button.html text="Add event" color="primary" icon="plus" %}
-		</div>
-	{% elsif actions == 'breadcrumb' %}
-		<div class="d-flex">
-			{% include_cached ui/breadcrumb.html class="breadcrumb-alternate" %}
-		</div>
-	{% elsif actions == 'buttons' %}
-		<span class="d-none d-sm-inline">
+  {% if actions == 'users' %}
+  <div class="d-flex">
+    <input type="search" class="form-control d-inline-block w-9 mr-3" placeholder="Search user&hellip;"/>
+    {% include_cached ui/button.html text="New user" color="primary" icon="plus" %}
+  </div>
+  {% elsif actions == 'calendar' %}
+  <div class="d-flex">
+    {% include_cached ui/button.html text="Add event" color="primary" icon="plus" %}
+  </div>
+  {% elsif actions == 'photos' %}
+  <div class="d-flex">
+    <div class="mr-3">
+      {% include ui/form/input-icon.html %}
+    </div>
+    {% include_cached ui/button.html text="Add event" color="primary" icon="plus" %}
+  </div>
+  {% elsif actions == 'breadcrumb' %}
+  <div class="d-flex">
+    {% include_cached ui/breadcrumb.html class="breadcrumb-alternate" %}
+  </div>
+  {% elsif actions == 'buttons' %}
+  <span class="d-none d-sm-inline">
 			{% include_cached ui/button.html text="New view" color="secondary" icon="plus" %}
 		</span>
-		{% 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 %}
 </div>
\ No newline at end of file

pages/_includes/ui/form/input-icon.html

@@ -10,7 +10,7 @@
 		{{ addon }}
 	{% endif %}
 
-	<input type="text" class="form-control{% if include.light %} form-control-light{% endif %}" placeholder="{{ include.placeholder | default: 'Search for&hellip;' }}">
+	<input type="text" class="form-control{% if include.light %} form-control-light{% endif %}" placeholder="{{ include.placeholder | default: 'Search&hellip;' }}">
 
 	{% unless include.prepend %}
 		{{ addon }}

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] %}
 	<div class="col-sm-6 col-lg-4">
-		<div class="card p-3">
-			<a href="#" class="mb-4"><img src="{{ site.base }}/img/photos/{{photo.file}}" class="rounded"></a>
-			<div class="d-flex align-items-center leading-none">
-				{% include ui/avatar.html person=person class="mr-3" %}
-				<div>
-					<div>{{ person.full_name }}</div>
-					<small class="text-muted">{{ forloop.index | random_date_ago: 10 | timeago }}</small>
-				</div>
-				<div class="ml-auto">
-					<a href="#" class="text-muted">
-						{% include_cached ui/icon.html icon="eye" %}
-						{{ forloop.index | random_number: 300, 600 }}
-					</a>
-					<a href="#" class="ml-3 text-muted">
-						{% include_cached ui/icon.html icon="heart" %}
-						{{ forloop.index | random_number: 20, 100 }}
-					</a>
-				</div>
-			</div>
-		</div>
+		{% include cards/gallery.html person=person %}
 	</div>
 	{% assign horizontal = horizontal | plus: 1 %}
 	{% endif %}

scss/_debug.scss

 $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}'");

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;

scss/ui/_cards.scss

@@ -20,7 +20,7 @@
 
 .card-sm {
   .card-body {
-    padding: .75rem;
+    padding: map-get($spacers, 3);
   }
 }