solar-flair 0.1.10 → 0.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
- SHA256:
3
- metadata.gz: 9251718bafbd713be06c090a03952da98322e18878468d6052321ea74cc8ea5c
4
- data.tar.gz: 832977c41508214a8ba21f5d15c97ca23058cf46526e656186beefa77e8784f8
2
+ SHA1:
3
+ metadata.gz: 3f10c89de636b8e938c72c680eacd8658e3044b3
4
+ data.tar.gz: 30f662acf3c6c474f7f4322ec06ec990cfc71ebe
5
5
  SHA512:
6
- metadata.gz: f0365429b32eeac6bd2c818ff6830c3132251bd8639b458b4de386abc95e772b464bd262f84a8598a8214196a1a5545adaa7ec4e7213be149bc0156b27d98c48
7
- data.tar.gz: df5f73ff6c3c09ef5620d891be6b4506c0a756a574c49d2941a5d4b46bf97f8ec5fe8ccb6d695bc0adb13f75ead5609764b2d9c26654b3fcdb83c4dd8894e276
6
+ metadata.gz: 46a75ae8d9c8c49885c19777ce77ca3d4b38ae4f0a9c4bfacdb9d6db211329078bb3938e42cfc9f3366982ca004a6361843565da6e3bb63a1dac75fb4d191b29
7
+ data.tar.gz: 1419794a3d5e0dd4b2d48e385eb2df9a5f50e6d1f260b9a9cfa79161e437cfe1c53ad13246ba37e01344bd08258d1852882301b50079199b75006570df445840
@@ -1,6 +1,6 @@
1
1
  <footer class="footer">
2
2
 
3
- {% assign color = page.color | default: site.theme_color %}
3
+ {% assign color = page.theme_style | default: site.theme_style %}
4
4
 
5
5
  <section class="grad-{{ color }} ">
6
6
  {% if page.url == "/" && site.cta_gs_url %}
data/_includes/head.html CHANGED
@@ -1,5 +1,6 @@
1
1
  <head>
2
- {% assign color = page.color | default: site.theme_color %}
2
+ {% assign color = page.theme_style | default: site.theme_style %}
3
+ {% assign favicon = site.data.theme[color].favicon %}
3
4
 
4
5
  {% if site.gtm_id %}
5
6
  <!-- Google Tag Manager -->
@@ -23,7 +24,7 @@
23
24
  <!-- Meta Tags -->
24
25
  <title>{% if page.title %}{{ page.title | escape }}{% else %}{{ site.title | escape }}{% endif %}</title>
25
26
  <meta name="description" content="{{ page.excerpt | default: site.description | strip_html | normalize_whitespace | truncate: 160 | escape }}">
26
- <link rel="icon" href="/assets/solar_assets/favicons/{{ color }}/favicon.png">
27
+ <link rel="icon" href="{{ favicon }}">
27
28
 
28
29
  <!-- Open Graph Tags -->
29
30
  <meta content="{{ site.title }}" property="og:site_name">
@@ -2,13 +2,15 @@
2
2
  {% assign pages = site.pages | sort: 'weight' %}
3
3
  {% assign default_paths = pages | map: "path" %}
4
4
  {% assign page_paths = site.header_pages | default: default_paths %}
5
- {% assign color = page.color | default: site.theme_color %}
6
-
5
+
6
+ {% assign color = page.theme_style | default: site.theme_style %}
7
+ {% assign favicon = site.data.theme[color].favicon %}
8
+
7
9
  {% if page_paths %}
8
10
 
9
11
  <nav id="mainNav" class="navbar navbar-expand-lg justify-content-between navbar-light fixed-top">
10
12
  <a class="navbar-brand" href="{{ site.brand_url }}">
11
- <img src="/assets/solar_assets/favicons/{{ color }}/favicon.png" height="30" alt=""></a>
13
+ <img src="{{ favicon }}" height="30" alt=""></a>
12
14
  {% if site.title_1 && site.title_2 %}
13
15
  <a class="nav-link sitename" href="/"><span class="bold {{ color }} ">{{ site.title_1 }}</span> <span class="grey">{{ site.title_2 }}</span> <span class="sr-only">(current)</span>
14
16
  {% else %}
@@ -22,7 +24,7 @@
22
24
  <div class="collapse navbar-collapse " id="navbar">
23
25
 
24
26
  <ul class="navbar-nav ml-auto">
25
-
27
+
26
28
  {% for path in page_paths %}
27
29
  {% assign my_page = site.pages | where: "path", path | first %}
28
30
  {% if my_page.title %}
data/_layouts/blog.html CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  layout: default
3
3
  ---
4
- {% assign color = page.color | default: site.theme_color %}
4
+ {% assign color = page.theme_style | default: site.theme_style %}
5
5
 
6
6
  <div class="container" style="margin-top:66px">
7
7
  <div class="row">
@@ -1,9 +1,11 @@
1
1
  <!DOCTYPE html>
2
+
3
+ {% assign color = page.theme_style | default: site.theme_style %}
4
+
2
5
  <html lang="{{ page.lang | default: site.lang | default: "en" }}">
3
6
 
4
7
  {% include head.html %}
5
8
 
6
- {% assign color = page.color | default: site.theme_color %}
7
9
  <body class="{{ color }}">
8
10
  {% if site.gtm_id %}
9
11
  <!-- Google Tag Manager (noscript) -->
data/_layouts/home.html CHANGED
@@ -2,10 +2,11 @@
2
2
  layout: default
3
3
  ---
4
4
 
5
- {% assign color = page.color | default: site.theme_color %}
5
+ {% assign color = page.theme_style | default: site.theme_style %}
6
+ {% assign favicon = site.data.theme[color].favicon %}
6
7
 
7
8
 
8
- <div class="jumbotron jumbotron-fluid eq-height {{ color }}-home vh{{ site.vertical_height }}" >
9
+ <div class="jumbotron jumbotron-fluid eq-height home-{{ color }} vh{{ site.vertical_height }}" >
9
10
  <div class="container bottom text-center py-5">
10
11
  <h1 class="display-3 mb-0 sr-contact">{{ site.title}}</h1>
11
12
  <p class="lead p-1 bold sr-contact" >{{ site.slug }}</p>
@@ -38,8 +39,8 @@ layout: default
38
39
  <div class="col-12 col-md-6 my-auto text-center ">
39
40
 
40
41
  <span class="fa-stack fa-9x sr-icons">
41
- <i class="far fa-sun fa-stack-2x orange-text orange-text-l10" ></i>
42
- <i class="fas fa-circle fa-stack-1x orange-text orange-text-d10" ></i>
42
+ <i class="far fa-sun fa-stack-2x orange-text text-l10-two" ></i>
43
+ <i class="fas fa-circle fa-stack-1x orange-text text-d10-two" ></i>
43
44
  <!-- <i class="fas fa-sun fa-stack-1x fa-inverse orange-text-d10" ></i> -->
44
45
  </span>
45
46
 
@@ -65,13 +66,13 @@ layout: default
65
66
  <div class="container">
66
67
  <div class="row py-4" >
67
68
  <div class="col-12 order-2 col-lg-7 order-lg-1 my-auto text-center">
68
- <i class="align-middle pr-5 fas fa-fighter-jet fa-3x text-l20-purple sr-easeInOut" ></i>
69
- <i class="align-middle pr-5 fas fa-fighter-jet fa-7x purple-text sr-easeInOut" ></i>
70
- <i class="align-middle pr-5 fas fa-fighter-jet fa-10x text-d20-purple sr-easeInOut" ></i>
69
+ <i class="align-middle pr-5 fas fa-fighter-jet fa-3x text-l20-four sr-easeInOut" ></i>
70
+ <i class="align-middle pr-5 fas fa-fighter-jet fa-7x text-four sr-easeInOut" ></i>
71
+ <i class="align-middle pr-5 fas fa-fighter-jet fa-10x text-d20-four sr-easeInOut" ></i>
71
72
  </div>
72
- <div class="col-12 order-1 col-lg-5 order-lg-2 my-auto text-center p-5 blue">
73
- <div class="purple-text promo">
74
- <h3 class="text-d10-purple">Fast</h3>
73
+ <div class="col-12 order-1 col-lg-5 order-lg-2 my-auto text-center p-5">
74
+ <div class="text-four promo">
75
+ <h3 class="text-d10-four">Fast</h3>
75
76
  <p>Using Jekyll with Solar Flair allows our sites to achieve a loadtime of under 500ms</p>
76
77
  </div>
77
78
  </div>
@@ -83,16 +84,16 @@ layout: default
83
84
  <div class="container">
84
85
  <div class="row justify-content-end">
85
86
  <div class="col-12 col-lg-5 my-auto text-center p-5">
86
- <div class="green-text promo">
87
- <h3 class="text-d10-green">Responsive</h3>
87
+ <div class="text-one promo">
88
+ <h3 class="text-d10-one">Responsive</h3>
88
89
  <p>The theme will adjust to whatever device users view it on: mobile, tablet, or desktop and laptop computers</p>
89
90
  </div>
90
91
  </div>
91
92
  <div class="col-12 col-lg-7 my-auto text-center">
92
- <i class="align-middle pr-5 fas fa-mobile-alt fa-5x green-text-d10 sr-pop-a" ></i>
93
- <i class="align-middle pr-5 fas fa-tablet-alt fa-5x green-text-d10 sr-pop-b" ></i>
94
- <i class="align-middle pr-5 fas fa-laptop fa-5x green-text-d10 sr-pop-c" ></i>
95
- <i class="align-middle pr-5 fas fa-desktop fa-5x green-text-d10 sr-pop-d" ></i>
93
+ <i class="align-middle pr-5 fas fa-mobile-alt fa-5x text-d10-one sr-pop-a" ></i>
94
+ <i class="align-middle pr-5 fas fa-tablet-alt fa-5x text-d10-one sr-pop-b" ></i>
95
+ <i class="align-middle pr-5 fas fa-laptop fa-5x text-d10-one sr-pop-c" ></i>
96
+ <i class="align-middle pr-5 fas fa-desktop fa-5x text-d10-one sr-pop-d" ></i>
96
97
  </div>
97
98
  </div>
98
99
  </div>
@@ -102,16 +103,16 @@ layout: default
102
103
  <div class="container">
103
104
  <div class="row ">
104
105
  <div class="col-12 order-2 col-lg-3 order-lg-1 my-auto text-center">
105
- <i class="align-middle fas fa-universal-access fa-10x blue-text-d10 sr-easeInOut" ></i>
106
+ <i class="align-middle fas fa-universal-access fa-10x text-d10-three sr-easeInOut" ></i>
106
107
  </div>
107
108
  <div class="col-12 order-1 col-lg-6 order-lg-2 my-auto text-center p-5">
108
- <div class="blue-text promo">
109
- <h3 class="text-d10-blue">Accessible</h3>
109
+ <div class="text-three promo">
110
+ <h3 class="text-d10-three">Accessible</h3>
110
111
  <p>One of Solar Flair's piorities is enabling any user the ability to use sites</p>
111
112
  </div>
112
113
  </div>
113
114
  <div class="col-12 order-2 col-lg-3 order-lg-3 my-auto text-center">
114
- <i class="align-middle fab fa-accessible-icon fa-10x blue-text-d10 sr-easeInOut" ></i>
115
+ <i class="align-middle fab fa-accessible-icon fa-10x text-d10-three sr-easeInOut" ></i>
115
116
  </div>
116
117
  </div>
117
118
  </div>
@@ -0,0 +1,80 @@
1
+ ---
2
+ layout: default
3
+ ---
4
+
5
+ {% if page.cover %}
6
+ <div class="jumbotron jumbotron-fluid mb-5" style="position:relative;background-image:url('{{ page.cover }}');background-size:cover;background-position:center; height: 65vh; color:white;">
7
+ <div class="container" style="position: absolute; bottom: 0;background:rgba(0,0,0,.7); width:100%; max-width:none; text-shadow: rgb(0, 0, 0) 1px 2px;">
8
+ <div class="row">
9
+ <div class="offset-1 col-11">
10
+ <h1 class="display-3 text-uppercase">{{ page.long_title | escape }}</h1>
11
+ <p class="lead" style="font-weight:400; padding:1% 0;">{{ page.description }}</p>
12
+ </div>
13
+ </div>
14
+ </div>
15
+ </div>
16
+ {% endif %}
17
+
18
+ <main class="container mt-10" aria-label="Content">
19
+
20
+ <article class="row">
21
+
22
+ {% if page.cover == null %}
23
+ <div class="col-12">
24
+ <h1 class="display-3 text-uppercase">{{ page.long_title | escape }}</h1>
25
+ <p class="lead" style="font-weight:400; padding:1% 0;">{{ page.description }}</p>
26
+ </div>
27
+ {% endif %}
28
+
29
+ <table class="table">
30
+ <tr>
31
+ <th class="text-center"><small><strong>Lighten 30%</strong></small></th>
32
+ <th class="text-center"><small><strong>Lighten 20%</strong></small></th>
33
+ <th class="text-center"><small><strong>Lighten 10%</strong></small></th>
34
+ <th class="text-center">Primary</th>
35
+ <th class="text-center"><small><strong>Darken 10%</strong></small></th>
36
+ <th class="text-center"><small><strong>Darken 20%</strong></small></th>
37
+ <th class="text-center"><small><strong>Darken 30%</strong></small></th>
38
+ </tr>
39
+
40
+ {% for theme in site.data.theme %}
41
+ <tr>
42
+ <td class="text-center text-l30-{{ theme[0] }}">
43
+ <i class="fas fa-square fa-4x "></i><br><code class="output"></code>
44
+ </td>
45
+ <td class="text-center text-l20-{{ theme[0] }}">
46
+ <i class="fas fa-square fa-4x "></i><br><code class="output"></code>
47
+ </td>
48
+ <td class="text-center text-l10-{{ theme[0] }}">
49
+ <i class="fas fa-square fa-4x "></i><br><code class="output"></code>
50
+ </td>
51
+ <td class="text-center text-{{ theme[0] }}">
52
+ <i class="fas fa-square fa-4x "></i><br><code class="output"></code>
53
+ </td>
54
+ <td class="text-center text-d10-{{ theme[0] }}">
55
+ <i class="fas fa-square fa-4x "></i><br><code class="output"></code>
56
+ </td>
57
+ <td class="text-center text-d20-{{ theme[0] }}">
58
+ <i class="fas fa-square fa-4x "></i><br><code class="output"></code>
59
+ </td>
60
+ <td class="text-center text-d30-{{ theme[0] }}">
61
+ <i class="fas fa-square fa-4x "></i><br><code class="output"></code>
62
+ </td>
63
+ </tr>
64
+ {% endfor %}
65
+ </table>
66
+
67
+ {% if content %}
68
+ <div class="col">
69
+
70
+ {{ content | inject_anchors }}
71
+ </div>
72
+ {% endif %}
73
+
74
+
75
+
76
+
77
+ </article>
78
+
79
+ </main>
80
+
data/_layouts/teaser.html CHANGED
@@ -1,11 +1,11 @@
1
1
  ---
2
2
  layout: default
3
3
  ---
4
- {% assign color = page.color | default: site.theme_color %}
4
+ {% assign color = page.theme_style | default: site.theme_style %}
5
5
  {% assign slug = page.slug | default: site.slug %}
6
6
 
7
7
 
8
- <div class="jumbotron jumbotron-fluid eq-height {{ color }}-home vh{{ site.vertical_height }} mb-0" >
8
+ <div class="jumbotron jumbotron-fluid eq-height home-{{ color }} vh{{ site.vertical_height }} mb-0" >
9
9
  <div class="container bottom text-center py-5">
10
10
  <h1 class="display-3 mb-0 sr-contact">{{ site.title}}</h1>
11
11
  <p class="lead p-1 bold sr-contact" >{{ slug }}</p>
@@ -15,14 +15,22 @@ $spacing-unit: 30px !default;
15
15
 
16
16
  $text-color: #111 !default;
17
17
  $background-color: #fdfdfd !default;
18
- // $brand-color: #F47B28 !default;
19
- $orange-color: #F47B28 !default;
20
- $green-color: #428E42 !default;
21
- $blue-color: #14A1AF !default;
22
- $purple-color: #9E1D58 !default;
23
- $grey-color: #828282 !default;
24
- $grey-color-light: lighten($grey-color, 40%) !default;
25
- $grey-color-dark: darken($grey-color, 25%) !default;
18
+
19
+
20
+ $color-one: #428E42 !default;
21
+ $color-two: #F47B28 !default;
22
+ $color-three: #14A1AF !default;
23
+ $color-four: #9E1D58 !default;
24
+ $color-grey: #828282 !default;
25
+
26
+ $green-color: #428E42 ;
27
+ $blue-color: #14A1AF;
28
+ // $orange-color: $color-two;
29
+ // $purple-color: $color-four;
30
+ // $grey-color: $color-grey;
31
+
32
+ $grey-color-light: lighten($color-grey, 40%) !default;
33
+ $grey-color-dark: darken($color-grey, 25%) !default;
26
34
 
27
35
  // Width of the content area
28
36
  $content-width: 800px !default;
@@ -30,19 +38,6 @@ $content-width: 800px !default;
30
38
  $on-palm: 600px !default;
31
39
  $on-laptop: 800px !default;
32
40
 
33
- // Use media queries like this:
34
- // @include media-query($on-palm) {
35
- // .wrapper {
36
- // padding-right: $spacing-unit / 2;
37
- // padding-left: $spacing-unit / 2;
38
- // }
39
- // }
40
- @mixin media-query($device) {
41
- @media screen and (max-width: $device) {
42
- @content;
43
- }
44
- }
45
-
46
41
  @mixin relative-font-size($ratio) {
47
42
  font-size: $base-font-size * $ratio;
48
43
  }
@@ -61,7 +56,6 @@ $on-laptop: 800px !default;
61
56
  ;
62
57
 
63
58
 
64
-
65
59
  body{
66
60
  font-family:'Open Sans', sans-serif;
67
61
  line-height: 1.5;
@@ -112,24 +106,24 @@ body{
112
106
 
113
107
 
114
108
  .requestquote{
115
- border-top: #428e42 solid 50px;
116
- // border-right:none;
117
- // border-left:none;
118
- background:white;
109
+ border-top: #428e42 solid 50px;
110
+ // border-right:none;
111
+ // border-left:none;
112
+ background:white;
119
113
  }
120
114
 
121
115
 
122
116
 
123
117
  .footer{
124
- background-size:cover;background-position:center;
118
+ background-size:cover;background-position:center;
125
119
  }
126
120
 
127
121
  .btn:hover{
128
- cursor: pointer;
122
+ cursor: pointer;
129
123
  }
130
124
 
131
125
  .mt-10{
132
- margin-top: 6rem!important;
126
+ margin-top: 6rem!important;
133
127
 
134
128
  }
135
129
 
@@ -139,17 +133,13 @@ body{
139
133
  line-height: 1.5;
140
134
  }
141
135
  p{
142
- font-size: 1.1em;
136
+ font-size: 1.1em;
143
137
  }
144
138
  nav{
145
- font-family: 'Montserrat', sans-serif;
139
+ font-family: 'Montserrat', sans-serif;
146
140
  }
147
141
  main.page-content{
148
- padding-top: 69px;
149
- }
150
-
151
- #navbar > ul.navbar-nav.mr-auto > li > a{
152
- color: #F47B28;
142
+ padding-top: 69px;
153
143
  }
154
144
 
155
145
 
@@ -177,19 +167,19 @@ body{
177
167
 
178
168
 
179
169
  .requestquote{
180
- border-top: #428e42 solid 50px;
181
- // border-right:none;
182
- // border-left:none;
183
- background:white;
170
+ border-top: #428e42 solid 50px;
171
+ // border-right:none;
172
+ // border-left:none;
173
+ background:white;
184
174
  }
185
175
 
186
176
 
187
177
  .btn:hover{
188
- cursor: pointer;
178
+ cursor: pointer;
189
179
  }
190
180
 
191
181
  .mt-10{
192
- margin-top: 6rem!important;
182
+ margin-top: 6rem!important;
193
183
 
194
184
  }
195
185
 
@@ -85,40 +85,18 @@ h1, h2, h3, h4, h5, h6 {
85
85
  font-weight: $base-font-weight;
86
86
  }
87
87
 
88
-
89
-
90
-
91
-
92
- .greenLink{
93
- color: $green-color!important;
94
- }
95
- .orangeLink{
96
- color: $orange-color!important;
97
- }
98
- .greyLink{
99
- color:#7F7F7F;
100
- }
101
-
102
-
103
-
104
88
  div.promo{
105
89
  h3{
106
90
  font-size: 3.5rem;
107
91
  }
108
92
  }
109
93
 
110
- a.quote{
111
- color: $green-color;
112
- &:hover{
113
- color: darken($green-color, 25%);
114
- text-decoration: underline;
115
- }
116
- }
94
+
117
95
  /**
118
96
  * Blockquotes
119
97
  */
120
98
  blockquote {
121
- color: $grey-color;
99
+ color: $color-grey;
122
100
  border-left: 4px solid $grey-color-light;
123
101
  padding-left: $spacing-unit / 2;
124
102
  @include relative-font-size(1.125);