futuro 0.3.0 → 0.3.1

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
2
  SHA256:
3
- metadata.gz: 441764ad1426971e21fe12feee5d2035b8d61e38d90f56c00b101bed1ab6de48
4
- data.tar.gz: ae199a7db551272cdfe3cbdc47e3b41f62c781aff9ab781762a87e2b1c646a50
3
+ metadata.gz: fa651dc22999ff08ffe216194a18e9ccca266158889aa7da99428faf40ec13e8
4
+ data.tar.gz: 2c45255c5bc3db20f2b080cfb44590ce4f47f4c31300b2c9651baf71dc5438a8
5
5
  SHA512:
6
- metadata.gz: af89dbe29281b591172fad973b372b7a7e882dbf767bb9ec6591f187d7ca4c68523a54723c00b0ac5799d073f9b4042c97efee60a56b848b5914b17602189695
7
- data.tar.gz: 1d342bc4bde8df9ca4af0320f0529dacec58d4bf80b4c0faa096cfdca8b348484898da0f2296ec8931e405eee6e948071a87735f3af6bb35645a0e680a3908cf
6
+ metadata.gz: 1d30743c02e8b7c25aa6fcfd3bc3560e2f45b385bf70aba775ba1ecf1bac1f31370fda37f59f3437892a911306a8199b7b1435fff8bbb51196459d77e3ee751f
7
+ data.tar.gz: 8b2f86c55403cc4bb96c4a3a1062b969d6db5089acb15b052a16098736c8f43ee6f0e55aebc8e9af058816c46ab3d817e7181d9f12655c21af72886151125252
@@ -4,7 +4,7 @@
4
4
  {% else %}
5
5
  <div class="overlay{{ include.title | downcase | prepend: ' _' }}{% if include.demo %} --demo{% endif %}">
6
6
  {% endif %}
7
- {% unless page.type == 'overlay' %}
7
+ {% unless include.exit == 'false' %}
8
8
  <div class="exit{{ include.title | downcase | prepend: ' _' }}"></div>
9
9
  {% endunless %}
10
10
  <div class="wrap _overlay{{ include.title | prepend: ' --' }}{% if include.demo %} --demo{% endif %}">
data/_layouts/feed.html CHANGED
@@ -16,8 +16,8 @@ layout: mini
16
16
 
17
17
  <body class="{{ setup }}{{ layout }}{{ type }}{% if page.collection %}{{ book }}{% endif %}{% if page.chapter %}{{ chapter }}{% endif %}{% if page.topic %}{{ topic }}{% endif %}">
18
18
 
19
- {% include html/overlay.liquid title='load' state='open' %}
20
- {% include html/overlay.liquid title='mobile' %}
19
+ {% include html/overlay.liquid title='load' exit='false' state='open' %}
20
+ {% include html/overlay.liquid title='mobile' exit='false' %}
21
21
  {% include html/overlay.liquid title='about' %}
22
22
  {% include html/overlay.liquid title='browse' %}
23
23
  {% include html/overlay.liquid title='search' %}
data/_layouts/single.html CHANGED
@@ -9,12 +9,12 @@ layout: mini
9
9
 
10
10
  <body class="{{ page.layout | prepend: 'layout-' }}{{ page.type | prepend: ' type-' }}{% if page.collection %}{{ page.collection | prepend: ' book-' }}{% endif %}{% if page.chapter %}{{ page.chapter | replace: ' ','-' | prepend: ' chapter-' | downcase }}{% endif %}{{ page.title | prepend: ' title-' | downcase }}">
11
11
 
12
- {% include html/overlay.liquid title='load' state='open' %}
13
- {% include html/overlay.liquid title='mobile' %}
12
+ {% include html/overlay.liquid title='load' exit='false' state='open' %}
13
+ {% include html/overlay.liquid title='mobile' exit='false' %}
14
14
 
15
15
  {% if page.type == 'overlay' %}
16
16
  {% assign dynamic = page.title | downcase %}
17
- {% include html/overlay.liquid title=dynamic %}
17
+ {% include html/overlay.liquid title=dynamic exit='false' %}
18
18
  {% endif %}
19
19
 
20
20
  {% unless page.type == 'overlay' %}
data/_sass/_helpers.scss CHANGED
@@ -25,147 +25,3 @@ $coal : lighten(black,5%);
25
25
  $min640 : 'only screen and (min-width: 640px)';
26
26
  $min768 : 'only screen and (min-width: 768px)';
27
27
  $min1024 : 'only screen and (min-width: 1024px)';
28
-
29
- @mixin zeros($pos:fixed,$t:0,$r:0,$b:0,$l:0) {
30
- position: $pos;
31
- top: $t;
32
- right: $r;
33
- bottom: $b;
34
- left: $l;
35
- }
36
-
37
- @mixin center {
38
- &:before {
39
- display: inline-block;
40
- vertical-align: middle;
41
- margin-right: -0.25em;
42
- height: 100%;
43
- content: '';
44
- }
45
- }
46
-
47
- @mixin ib {
48
- vertical-align: middle;
49
- display: inline-block;
50
- }
51
-
52
- @mixin cf {
53
- &:before {
54
- content: " ";
55
- display: table;
56
- }
57
- &:after {
58
- content: " ";
59
- display: table;
60
- clear: both;
61
- }
62
- }
63
-
64
- @mixin grid($rep) {
65
- grid-template-columns: repeat($rep,1fr);
66
- display: grid;
67
- }
68
-
69
- @keyframes load_bg {
70
- 33% {
71
- background-color: blue;
72
- width: 43%;
73
- }
74
- 66% {
75
- background-color: black;
76
- width: 93%;
77
- }
78
- }
79
-
80
- @keyframes load_title {
81
- 0% {
82
- font-family: 'FuturaBT-Bold', 'Helvetica Neue', sans-serif;
83
- letter-spacing: 0.03em;
84
- text-transform: uppercase;
85
- font-size: 4.6rem;
86
- color: red;
87
- }
88
- 33% {
89
- font-family: 'FuturaBT-Book', 'Helvetica Neue', sans-serif;
90
- letter-spacing: inherit;
91
- text-transform: none;
92
- font-size: 4.6rem;
93
- color: blue;
94
- }
95
- 66% {
96
- font-family: 'FuturaBT-BookItalic', 'Helvetica Neue', sans-serif;
97
- font-weight: normal;
98
- font-size: 5.4rem;
99
- color: black;
100
- }
101
- }
102
-
103
- @keyframes load_border {
104
- 33% {
105
- border-color: blue;
106
- }
107
- 66% {
108
- border-color: black;
109
- }
110
- }
111
-
112
- %grid {
113
-
114
- &_default {
115
- grid-template-columns: 20px minmax(280px,1000px) 20px;
116
- }
117
-
118
- &_overlay {
119
- grid-template-columns: 20px minmax(280px,560px) 20px;
120
- }
121
-
122
- &_search {
123
- grid-template-columns: 20px minmax(280px,480px) 20px;
124
- }
125
-
126
- &_load {
127
- grid-template-columns: 20px minmax(280px,320px) 20px;
128
- }
129
- }
130
-
131
- %wrap {
132
-
133
- &_grid {
134
- grid-column: 2 / 3;
135
- display: grid;
136
- }
137
-
138
- &_block {
139
- margin-right: auto;
140
- margin-left: auto;
141
- }
142
-
143
- &_overlay {
144
- min-width: 280px;
145
- @include ib;
146
- }
147
- }
148
-
149
- :focus {
150
- outline: rgba(0,0,0,0);
151
- }
152
-
153
- %book {
154
- font-family: 'FuturaBT-Book', 'Helvetica Neue', sans-serif;
155
- font-weight: normal;
156
-
157
- &-italic {
158
- font-family: 'FuturaBT-BookItalic', 'Helvetica Neue', sans-serif;
159
- font-weight: normal;
160
- }
161
- }
162
-
163
- %bold {
164
- font-family: 'FuturaBT-Bold', 'Helvetica Neue', sans-serif;
165
- font-weight: normal;
166
-
167
- &-italic {
168
- font-family: 'FuturaBT-BoldItalic', 'Helvetica Neue', sans-serif;
169
- font-weight: normal;
170
- }
171
- }
data/_sass/_site.scss CHANGED
@@ -8,6 +8,7 @@
8
8
  }
9
9
 
10
10
  .site {
11
+ @extend %siblings;
11
12
  background-color: $smoke;
12
13
  position: relative;
13
14
  display: none;
@@ -28,20 +29,4 @@
28
29
  &._single {
29
30
  @extend %site-setup;
30
31
  }
31
-
32
- h1 + p, h1 + ul, h1 + ._page-artwork, h1 + ._copy-split {
33
- margin-top: 20px;
34
- }
35
-
36
- h4 + p {
37
- margin-top: 20px;
38
- }
39
-
40
- p + p, p + ul, p + .block._util {
41
- margin-top: 20px;
42
- }
43
-
44
- ul + p, ol + p {
45
- margin-top: 20px;
46
- }
47
32
  }
data/_sass/_wrap.scss CHANGED
@@ -55,12 +55,18 @@
55
55
 
56
56
  &.--load {
57
57
  text-align: center;
58
- grid-gap: 20px;
58
+
59
+ p + .box._load {
60
+ margin-top: 20px;
61
+ }
59
62
  }
60
63
 
61
64
  &.--mobile {
62
65
  text-align: center;
63
- grid-gap: 10px;
66
+
67
+ p + .box._mobile {
68
+ margin-top: 20px;
69
+ }
64
70
  }
65
71
 
66
72
  &.--search {
data/_sass/futuro.scss CHANGED
@@ -5,6 +5,9 @@
5
5
  'normalize',
6
6
  'fonts',
7
7
  'helpers',
8
+ 'helpers/mixins',
9
+ 'helpers/extends',
10
+ 'helpers/keyframes',
8
11
  'base',
9
12
  'area',
10
13
  'artwork',
@@ -0,0 +1,79 @@
1
+
2
+ %grid {
3
+
4
+ &_default {
5
+ grid-template-columns: 20px minmax(280px,1000px) 20px;
6
+ }
7
+
8
+ &_overlay {
9
+ grid-template-columns: 20px minmax(280px,560px) 20px;
10
+ }
11
+
12
+ &_search {
13
+ grid-template-columns: 20px minmax(280px,480px) 20px;
14
+ }
15
+
16
+ &_load {
17
+ grid-template-columns: 20px minmax(280px,320px) 20px;
18
+ }
19
+ }
20
+
21
+ %wrap {
22
+
23
+ &_grid {
24
+ grid-column: 2 / 3;
25
+ display: grid;
26
+ }
27
+
28
+ &_block {
29
+ margin-right: auto;
30
+ margin-left: auto;
31
+ }
32
+
33
+ &_overlay {
34
+ min-width: 280px;
35
+ @include ib;
36
+ }
37
+ }
38
+
39
+ :focus {
40
+ outline: rgba(0,0,0,0);
41
+ }
42
+
43
+ %book {
44
+ font-family: 'FuturaBT-Book', 'Helvetica Neue', sans-serif;
45
+ font-weight: normal;
46
+
47
+ &-italic {
48
+ font-family: 'FuturaBT-BookItalic', 'Helvetica Neue', sans-serif;
49
+ font-weight: normal;
50
+ }
51
+ }
52
+
53
+ %bold {
54
+ font-family: 'FuturaBT-Bold', 'Helvetica Neue', sans-serif;
55
+ font-weight: normal;
56
+
57
+ &-italic {
58
+ font-family: 'FuturaBT-BoldItalic', 'Helvetica Neue', sans-serif;
59
+ font-weight: normal;
60
+ }
61
+ }
62
+
63
+ %siblings {
64
+ h1 + p, h1 + ul, h1 + ._page-artwork, h1 + ._copy-split {
65
+ margin-top: 20px;
66
+ }
67
+
68
+ h4 + p {
69
+ margin-top: 20px;
70
+ }
71
+
72
+ p + p, p + ul, p + .block._util {
73
+ margin-top: 20px;
74
+ }
75
+
76
+ ul + p, ol + p {
77
+ margin-top: 20px;
78
+ }
79
+ }
@@ -0,0 +1,43 @@
1
+
2
+ @keyframes load_bg {
3
+ 33% {
4
+ background-color: blue;
5
+ width: 43%;
6
+ }
7
+ 66% {
8
+ background-color: black;
9
+ width: 93%;
10
+ }
11
+ }
12
+
13
+ @keyframes load_title {
14
+ 0% {
15
+ @include font($bold:true);
16
+ letter-spacing: 0.03em;
17
+ text-transform: uppercase;
18
+ font-size: 4.6rem;
19
+ color: red;
20
+ }
21
+ 33% {
22
+ @include font;
23
+ letter-spacing: inherit;
24
+ text-transform: none;
25
+ font-size: 4.6rem;
26
+ color: blue;
27
+ }
28
+ 66% {
29
+ @include font($italic:true);
30
+ font-weight: normal;
31
+ font-size: 5.4rem;
32
+ color: black;
33
+ }
34
+ }
35
+
36
+ @keyframes load_border {
37
+ 33% {
38
+ border-color: blue;
39
+ }
40
+ 66% {
41
+ border-color: black;
42
+ }
43
+ }
@@ -0,0 +1,54 @@
1
+
2
+ @mixin zeros($pos:fixed,$t:0,$r:0,$b:0,$l:0) {
3
+ position: $pos;
4
+ top: $t;
5
+ right: $r;
6
+ bottom: $b;
7
+ left: $l;
8
+ }
9
+
10
+ @mixin center {
11
+ &:before {
12
+ display: inline-block;
13
+ vertical-align: middle;
14
+ margin-right: -0.25em;
15
+ height: 100%;
16
+ content: '';
17
+ }
18
+ }
19
+
20
+ @mixin ib {
21
+ vertical-align: middle;
22
+ display: inline-block;
23
+ }
24
+
25
+ @mixin cf {
26
+ &:before {
27
+ content: " ";
28
+ display: table;
29
+ }
30
+ &:after {
31
+ content: " ";
32
+ display: table;
33
+ clear: both;
34
+ }
35
+ }
36
+
37
+ @mixin grid($rep) {
38
+ grid-template-columns: repeat($rep,1fr);
39
+ display: grid;
40
+ }
41
+
42
+ @mixin font($italic:false,$bold:false,$boldItalic:false) {
43
+ font-weight: normal;
44
+
45
+ @if $italic {
46
+ font-family: 'FuturaBT-BookItalic', 'Helvetica Neue', sans-serif;
47
+ } @else if $bold {
48
+ font-family: 'FuturaBT-Bold', 'Helvetica Neue', sans-serif;
49
+ } @else if $boldItalic {
50
+ font-family: 'FuturaBT-BoldItalic', 'Helvetica Neue', sans-serif;
51
+ } @else {
52
+ font-family: 'FuturaBT-Book', 'Helvetica Neue', sans-serif;
53
+ }
54
+ }
@@ -1,10 +1,8 @@
1
1
 
2
2
  const SiteFunc = () => {
3
3
 
4
- let open = '--open';
5
-
6
4
  if (!isMobile) {
7
- $('.site').addClass(open);
5
+ $('.site').addClass('--open');
8
6
  }
9
7
 
10
8
  setTimeout(function() {
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: futuro
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.3.0
4
+ version: 0.3.1
5
5
  platform: ruby
6
6
  authors:
7
7
  - Paul Heading
8
8
  autorequire:
9
9
  bindir: bin
10
10
  cert_chain: []
11
- date: 2020-01-14 00:00:00.000000000 Z
11
+ date: 2020-01-15 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: jekyll
@@ -169,6 +169,9 @@ files:
169
169
  - _sass/_title.scss
170
170
  - _sass/_wrap.scss
171
171
  - _sass/futuro.scss
172
+ - _sass/helpers/_extends.scss
173
+ - _sass/helpers/_keyframes.scss
174
+ - _sass/helpers/_mixins.scss
172
175
  - assets/css/normalize.css
173
176
  - assets/css/styles.scss
174
177
  - assets/fonts/230883_0_0.eot