solar-flair 0.1.10 → 0.2.0

Sign up to get free protection for your applications and to get access to all the features.
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);