betterplace-content 0.7.72 → 0.7.78

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: c5f3721cb225aaa84401525f008e555e6c8c1b159f15c54ad4aa655285a40530
4
- data.tar.gz: 82b3a9269c5d8c7338bfcfae2ce86849a3955947307568cc8757bef85425d69e
3
+ metadata.gz: 33547327918dff9fa601b7f8df759f1033bd7d194e5c018941c3b0260682d2ff
4
+ data.tar.gz: bda0f5a70fa2300e56519cc4a519a9a52cfdcf1fa60f04215e45a203eb640fc9
5
5
  SHA512:
6
- metadata.gz: '084ed853c65bdfba5fb526ba10023131bf084256a91730df5cb56d8142f699cbc46e155d985fef753b66ddd56d7fa6c5daa107ec1479829909ffc1eafd278b02'
7
- data.tar.gz: a670ad493ffb171746ec7fd980c25baa1199620d7d1b4ab519df3b6f6fd5e6bd29452f5282c5a5a82e7d4a0e27aad1a22079d3024e20248151157758374be18a
6
+ metadata.gz: 4efc82baa908d027beba8d10773b2f731c492a145f9265e6f9ffe672988db32640b99458c756da2e97612b830c2c3291ad70dd6ff7c2489d98c0cb2054cdd29f
7
+ data.tar.gz: e3b193be5046290fe0f0e0312440d6441cbb0d548576115e585d2988be6ab72369fa5f3669aa39e8cce17450f0c1da25b570db10855c9e5272fe376b6edfe2c7
data/_layouts/help.html CHANGED
@@ -18,12 +18,12 @@ layout: default
18
18
  {% if page.author %}
19
19
  <div class="help-meta-information mb-4">
20
20
  <div class="help-author">
21
- <i class="fa fa-user-circle-o fa-fw"></i>
21
+ <i class="fas fa-user fa-fw"></i>
22
22
  {{ page.author }}
23
23
  </div>
24
24
 
25
25
  <div class="help-date">
26
- <i class="fa fa-clock-o fa-fw"></i>
26
+ <i class="fas fa-clock fa-fw"></i>
27
27
  {{ page.date | date:"%d.%m.%Y" }}
28
28
  </div>
29
29
  </div>
data/_layouts/news.html CHANGED
@@ -22,12 +22,12 @@ layout: default
22
22
  {% if page.author %}
23
23
  <div class="news-meta-information mb-4">
24
24
  <div class="news-author">
25
- <i class="fa fa-user-circle-o fa-fw"></i>
25
+ <i class="fas fa-user fa-fw"></i>
26
26
  {{ page.author }}
27
27
  </div>
28
28
 
29
29
  <div class="news-date">
30
- <i class="fa fa-clock-o fa-fw"></i>
30
+ <i class="fas fa-clock fa-fw"></i>
31
31
  {{ page.date | date:"%d.%m.%Y" }}
32
32
  </div>
33
33
  </div>
@@ -1,8 +1,8 @@
1
1
  .generic-team-list {
2
- font-size: 0;
3
2
  padding: 0;
4
3
  margin-left: 0;
5
4
  margin-right: 0;
5
+ list-style: none;
6
6
  display: flex;
7
7
  flex-wrap: wrap;
8
8
 
@@ -10,9 +10,7 @@
10
10
  position: relative;
11
11
  z-index: 10;
12
12
  display: block;
13
- vertical-align: top;
14
13
  font-size: 14px;
15
- font-size: 0;
16
14
 
17
15
  @include desktop {
18
16
  width: 20%;
@@ -23,21 +21,15 @@
23
21
 
24
22
  .user-image {
25
23
  display: block;
26
- vertical-align: top;
27
24
  cursor: pointer;
28
25
 
29
- .generic-admin-box {
30
- font-size: 12px;
31
- position: absolute;
32
- top: 0;
33
- left: 0;
34
- }
35
26
  img {
36
- image-rendering:-webkit-optimize-contrast;
37
27
  cursor: default;
38
28
  }
39
29
 
40
- &:hover +.name-and-meta { display: block; }
30
+ &:hover + .name-and-meta {
31
+ display: block;
32
+ }
41
33
  }
42
34
 
43
35
  .name-and-meta {
@@ -47,13 +39,17 @@
47
39
  width: 100%;
48
40
  text-align: center;
49
41
  background: white;
50
- background: rgba(255,255,255,0.9);
42
+ background: rgba(255, 255, 255, 0.9);
51
43
  display: none;
52
44
  padding: 10px;
53
- box-shadow: 0px 0px 10px rgba(0,0,0,0.5);
54
- -webkit-box-shadow: 0px 0px 10px rgba(0,0,0,0.5);
55
- & { display: none;}
56
- &:hover { display: block; }
45
+ box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
46
+ -webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
47
+ & {
48
+ display: none;
49
+ }
50
+ &:hover {
51
+ display: block;
52
+ }
57
53
 
58
54
  p {
59
55
  color: $dark-grey;
@@ -73,8 +69,9 @@
73
69
  height: 0;
74
70
  border-style: solid;
75
71
  border-width: 0 10px 10px 10px;
76
- border-color: transparent transparent white transparent;
77
- border-color: transparent transparent rgba(255,255,255,0.9) transparent;
72
+ border-color: transparent transparent white transparent;
73
+ border-color: transparent transparent rgba(255, 255, 255, 0.9)
74
+ transparent;
78
75
  }
79
76
  }
80
77
 
@@ -93,12 +90,20 @@
93
90
  }
94
91
 
95
92
  &.has-speech-bubble {
96
- @include desktop { width: 40%; }
97
- @include phone { width: 100%; }
93
+ @include desktop {
94
+ width: 40%;
95
+ }
96
+ @include phone {
97
+ width: 100%;
98
+ }
98
99
  .user-image {
99
100
  float: left;
100
- @include desktop { width: 50%; }
101
- @include phone { width: 50%; }
101
+ @include desktop {
102
+ width: 50%;
103
+ }
104
+ @include phone {
105
+ width: 50%;
106
+ }
102
107
  }
103
108
  .name-and-meta {
104
109
  width: 50%;
@@ -111,7 +116,6 @@
111
116
  position: relative;
112
117
  display: block;
113
118
  width: 50%;
114
- vertical-align: top;
115
119
  font-weight: normal;
116
120
  font-size: 14px;
117
121
  float: left;
@@ -124,11 +128,6 @@
124
128
  padding: 10px 10px 0px 10px;
125
129
  }
126
130
 
127
- table {
128
- height: 100%;
129
- min-height: 135px;
130
- }
131
-
132
131
  &:before {
133
132
  content: '';
134
133
  position: absolute;
@@ -0,0 +1,240 @@
1
+ .generic-team-list-interlaced {
2
+ @mixin phone-ext {
3
+ @include phone {
4
+ @content(2, 2%);
5
+ }
6
+ }
7
+
8
+ @mixin desktop-ext {
9
+ @include desktop {
10
+ @content(5, 1%);
11
+ }
12
+ }
13
+
14
+ @include phone-ext using ($columns, $gutter) {
15
+ margin: 0 $gutter/-2;
16
+ }
17
+ @include desktop-ext using ($columns, $gutter) {
18
+ margin: 0 $gutter/-2;
19
+ }
20
+
21
+ padding: 0;
22
+ list-style: none;
23
+ display: flex;
24
+ flex-wrap: wrap;
25
+
26
+ @include phone {
27
+ font-size: 4.25vw;
28
+ }
29
+
30
+ li {
31
+ $tile-aspect-ratio: percentage(600/365);
32
+ position: relative;
33
+ display: block;
34
+ z-index: 10;
35
+
36
+ @include desktop-ext using ($columns, $gutter) {
37
+ $column-width: 100%/$columns;
38
+ $gutter-per-column: percentage($gutter/($column-width - $gutter));
39
+ width: $column-width;
40
+ padding: $gutter/2;
41
+
42
+ &:nth-child(5n+1) .tile,
43
+ &:nth-child(5n+3) .tile,
44
+ &:nth-child(5n) .tile {
45
+ margin-top: -0.5 * ($tile-aspect-ratio + $gutter-per-column);
46
+ .speech-bubble {
47
+ top: 50%;
48
+ bottom: auto;
49
+ }
50
+ }
51
+
52
+ &.halfling {
53
+ .tile {
54
+ padding-top: 0.5 * ($tile-aspect-ratio - $gutter-per-column);
55
+ }
56
+ }
57
+
58
+ .speech-bubble {
59
+ margin: $gutter-per-column/2 $gutter-per-column;
60
+ }
61
+ }
62
+
63
+ @include phone-ext using ($columns, $gutter) {
64
+ $column-width: 100%/$columns;
65
+ $gutter-per-column: percentage($gutter/($column-width - $gutter));
66
+ width: $column-width;
67
+ padding: $gutter/2;
68
+
69
+ &.desktop-only {
70
+ display: none;
71
+ }
72
+
73
+ &:nth-child(2n+1) .tile {
74
+ margin-top: -0.5 * ($tile-aspect-ratio + $gutter-per-column);
75
+ .speech-bubble {
76
+ top: 50%;
77
+ bottom: auto;
78
+ }
79
+ }
80
+
81
+ &:nth-child(n+14) {
82
+ display: none;
83
+ }
84
+
85
+ &:target, &:target ~ li {
86
+ display: block;
87
+ }
88
+
89
+ &.halfling {
90
+ article {
91
+ padding-top: 0.5 * ($tile-aspect-ratio - $gutter-per-column);
92
+ }
93
+ }
94
+
95
+ .speech-bubble {
96
+ margin: $gutter-per-column/2 $gutter-per-column;
97
+ }
98
+ }
99
+
100
+ &.spacer {
101
+ z-index: 0;
102
+ }
103
+
104
+ &:nth-child(7n) .tile {
105
+ background: #4597a2;
106
+ }
107
+ &:nth-child(7n+1) .tile {
108
+ background: #f5cd47;
109
+ }
110
+ &:nth-child(7n+2) .tile {
111
+ background: #ff6f6c;
112
+ }
113
+ &:nth-child(7n+3) .tile {
114
+ background: #60b2a4;
115
+ }
116
+ &:nth-child(7n+4) .tile {
117
+ background: #6d2c64;
118
+ }
119
+ &:nth-child(7n+5) .tile {
120
+ background: #f5cd47;
121
+ }
122
+ &:nth-child(7n+6) .tile {
123
+ background: #60b2a4;
124
+ }
125
+
126
+ .tile {
127
+ position: relative;
128
+ width: 100%;
129
+ padding-top: $tile-aspect-ratio; // See https://www.w3schools.com/howto/tryit.asp?filename=tryhow_css_aspect_ratio_169
130
+ }
131
+
132
+ .filler {
133
+ position: absolute;
134
+ top: 0;
135
+ left: 0;
136
+ bottom: 0;
137
+ right: 0;
138
+ }
139
+
140
+ .user-image {
141
+ display: block;
142
+ cursor: pointer;
143
+
144
+ img {
145
+ cursor: default;
146
+ }
147
+
148
+ &:hover + .name-and-meta {
149
+ display: block;
150
+ }
151
+ }
152
+
153
+ .name-and-meta {
154
+ hyphens: auto;
155
+ -webkit-hyphens: auto;
156
+ position: absolute;
157
+ bottom: 0;
158
+ left: 0;
159
+ width: 100%;
160
+ text-align: center;
161
+ background: rgba(255, 255, 255, 0.9);
162
+ padding: .5em;
163
+ opacity: 0;
164
+ transition: opacity 0.3s;
165
+
166
+ p {
167
+ color: $dark-grey;
168
+ font-weight: 300;
169
+ font-size: 0.875em;
170
+ line-height: 1.25;
171
+ margin-bottom: .25em;
172
+ }
173
+ }
174
+
175
+ &:hover .name-and-meta {
176
+ opacity: 1;
177
+ }
178
+
179
+ img {
180
+ width: 100%;
181
+ height: auto;
182
+ display: block;
183
+ }
184
+
185
+ .speech-bubble {
186
+ hyphens: auto;
187
+ -webkit-hyphens: auto;
188
+ position: absolute;
189
+ left: 100%;
190
+ top: auto;
191
+ bottom: 50%;
192
+ display: block;
193
+ width: 100%;
194
+ min-height: 50%;
195
+ font-weight: normal;
196
+ background-color: white;
197
+ padding: 0.5em;
198
+
199
+ &:before {
200
+ content: '';
201
+ position: absolute;
202
+ left: -2em;
203
+ width: 0;
204
+ height: 0;
205
+ border-style: solid;
206
+ border-width: 1em 2em 1em 0;
207
+ border-color: transparent white transparent transparent;
208
+ top: 50%;
209
+ margin-top: -1em;
210
+ }
211
+
212
+ h2 {
213
+ font-weight: 300;
214
+ margin-top: 0;
215
+ font-size: 1em;
216
+ line-height: 1.5;
217
+ }
218
+ p {
219
+ font-weight: 300;
220
+ margin-bottom: 0;
221
+ font-size: 0.66667em;
222
+ line-height: 1.25;
223
+ a {
224
+ font-weight: 300;
225
+ color: inherit;
226
+ }
227
+ }
228
+ }
229
+ }
230
+
231
+ // Additional text styles
232
+ .claim {
233
+ padding: .5em;
234
+ margin: 0;
235
+ color: rgba(255, 255, 255, 0.9);
236
+ font-weight: bold;
237
+ font-size: 1.5em;
238
+ text-align: center;
239
+ }
240
+ }
@@ -1,63 +1,15 @@
1
1
  body.team
2
- .generic-content-header
3
- +phone
4
- display: none
5
- +desktop
6
- height: 560px
7
- z-index: 0
8
- background: url('#{$site_baseurl}/assets/theme_images/team/generic-content-header_desktop.jpg') no-repeat 50% 50% $very-light-grey
9
- size: cover
10
-
11
- &:before
12
- display: none
13
-
14
- h1
15
- position: relative
16
- +desktop
17
- margin-bottom: 10px
18
- +phone
19
- margin-top: 30px
20
-
21
- h1,
22
- .unit-descriptions,
23
- .unit-descriptions p
24
- +desktop
25
- text-shadow: 1px 1px 0 #444
26
- text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.5)
27
- color: white
28
-
29
- .content-wrapper
30
- padding-bottom: 80px
31
- +desktop
32
- padding-top: 40px
33
-
34
- .content-wrapper > .container
35
- +desktop
36
- margin-top: -422px
37
-
38
- .tax-receipt-hint .container
39
- +desktop
40
- margin-top: 0
41
2
 
42
3
  .unit-select
43
- padding: 10px 20px 10px 0px
44
- +desktop
45
- color: white
4
+ padding: 0.5rem 0
5
+ display: flex
6
+ position: relative
7
+ z-index: 10 // Stay on top of targetable sheet’s padding.
46
8
 
47
9
  a
48
- padding: 4px 12px 4px 0
49
- display: inline-block
10
+ display: block
11
+ padding: 0.25rem 0.75rem
50
12
  border-right: 1px solid #4c4b4a
51
- color: $medium-green
52
- font-weight: normal
53
- font-size: 16px
54
- margin-right: 12px
55
- +desktop
56
- text-shadow: 1px 1px 0 #444
57
- text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.5)
58
-
59
- +phone
60
- margin-bottom: 5px
61
13
 
62
14
  &:first-child
63
15
  padding-left: 0
@@ -65,38 +17,21 @@ body.team
65
17
  &:last-child
66
18
  border-right-width: 0
67
19
 
68
- &.active
69
- +desktop
70
- color: white
71
-
72
- &:hover
73
- text-decoration: none
74
-
75
- +phone
76
- text-decoration: underline
77
-
78
20
  .unit-descriptions
79
- font-size: 14px
80
- line-height: 22px
81
- padding: 0 20px 17px 0px
21
+ font-size: 0.875rem
22
+ line-height: 1.5
82
23
  font-weight: 300
83
- p
84
- margin-bottom: 0
85
-
86
- a
87
- color: $medium-green
88
- white-space: nowrap
89
-
90
- .jobs-row
91
- text-align: center
92
- +desktop
93
- margin-top: 74px
94
- +phone
95
- margin-top: 50px
96
-
97
- h2
98
- margin-bottom: 25px
99
24
 
100
- p
101
- text-align: center
102
- margin-bottom: 20px
25
+ section.targetable
26
+ padding-top: 3rem // Have some space between target anchor an content.
27
+ margin-top: -3rem // Reset position.
28
+ // Hide not targeted section.
29
+ height: 0
30
+ overflow: hidden
31
+ opacity: 0
32
+ transition: opacity 0.3s ease
33
+
34
+ &:target
35
+ height: auto
36
+ overflow: initial
37
+ opacity: 1
@@ -16,6 +16,7 @@ $site_baseurl: "{{ site.baseurl }}"
16
16
  @import generics/search-form
17
17
  @import generics/sidebar-menu
18
18
  @import generics/team_list
19
+ @import generics/team_list_interlaced
19
20
  @import generics/topicblock
20
21
  @import generics/hero_image
21
22
  @import generics/hero_search
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: betterplace-content
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.7.72
4
+ version: 0.7.78
5
5
  platform: ruby
6
6
  authors:
7
7
  - betterplace.org Developers
8
8
  autorequire:
9
9
  bindir: bin
10
10
  cert_chain: []
11
- date: 2021-01-29 00:00:00.000000000 Z
11
+ date: 2021-02-16 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: jekyll
@@ -134,6 +134,7 @@ files:
134
134
  - _sass/generics/search-form.scss
135
135
  - _sass/generics/sidebar-menu.scss
136
136
  - _sass/generics/team_list.scss
137
+ - _sass/generics/team_list_interlaced.scss
137
138
  - _sass/generics/topicblock.sass
138
139
  - _sass/initialize/colors.sass
139
140
  - _sass/initialize/media_queries.sass
@@ -217,7 +218,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
217
218
  - !ruby/object:Gem::Version
218
219
  version: '0'
219
220
  requirements: []
220
- rubygems_version: 3.2.4
221
+ rubygems_version: 3.1.4
221
222
  signing_key:
222
223
  specification_version: 4
223
224
  summary: betterplace.org's Jekyll Content Theme