linaro-jekyll-theme 4.1.6 → 4.3.3

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.
Files changed (42) hide show
  1. checksums.yaml +4 -4
  2. data/_config.yml +20 -0
  3. data/_data/nav.yml +18 -3
  4. data/_data/picture.yml +35 -5
  5. data/_data/sticky_tab_bar.yml +24 -0
  6. data/_data/universal_nav.yml +23 -10
  7. data/_includes/blog/post_search_fess.html +11 -0
  8. data/_includes/components/breadcrumb.html +5 -2
  9. data/_includes/components/cookie_manager.html +2 -2
  10. data/_includes/components/github_edit.html +5 -5
  11. data/_includes/components/head.html +4 -2
  12. data/_includes/components/jumbotron.html +30 -11
  13. data/_includes/components/sticky_tab_bar.html +76 -0
  14. data/_includes/js_bundles/vendor.html +1 -0
  15. data/_includes/nav/nav.html +24 -14
  16. data/_includes/nav/universal_nav.html +39 -8
  17. data/_layouts/documentation.html +19 -0
  18. data/_layouts/flow.html +3 -0
  19. data/_sass/app/overrides.scss +27 -9
  20. data/_sass/core.scss +2 -0
  21. data/_sass/core/blog.scss +6 -1
  22. data/_sass/core/breadcrumb.scss +36 -13
  23. data/_sass/core/carousel-header.scss +53 -61
  24. data/_sass/core/cookies.scss +104 -90
  25. data/_sass/core/documentation.scss +39 -0
  26. data/_sass/core/flow.scss +5 -0
  27. data/_sass/core/fontello.scss +180 -45
  28. data/_sass/core/footer.scss +58 -53
  29. data/_sass/core/jumbotron.scss +32 -31
  30. data/_sass/core/navbar.scss +171 -58
  31. data/_sass/core/sticky_tab_bar.scss +35 -0
  32. data/_sass/core/theme.scss +78 -46
  33. data/assets/fonts/fontello/fontello.eot +0 -0
  34. data/assets/fonts/fontello/fontello.svg +34 -0
  35. data/assets/fonts/fontello/fontello.ttf +0 -0
  36. data/assets/fonts/fontello/fontello.woff +0 -0
  37. data/assets/fonts/fontello/fontello.woff2 +0 -0
  38. data/assets/images/breadcrumb-banner.png +0 -0
  39. data/assets/js/app/main.js +156 -24
  40. data/assets/js/vendor/ofi.js +132 -0
  41. metadata +26 -19
  42. data/_includes/sticky-tab-bar.html +0 -61
@@ -1,28 +1,82 @@
1
1
  #wrapper {
2
+ @include media-breakpoint-up($nav_expand_point) {
3
+ .navbar.hover_animated .nav-item > .dropdown-menu {
4
+ display: block;
5
+ opacity: 0;
6
+ visibility: hidden;
7
+ transition: 0.3s;
8
+ margin-top: 0;
9
+ }
10
+ .navbar.hover_animated .nav-item:hover .nav-link {
11
+ color: #fff;
12
+ }
13
+ .navbar.hover_animated .dropdown-menu.fade-down {
14
+ top: 80%;
15
+ transform: rotateX(-75deg);
16
+ transform-origin: 0% 0%;
17
+ }
18
+ .navbar.hover_animated .dropdown-menu.fade-up {
19
+ top: 180%;
20
+ }
21
+ .navbar.hover_animated .nav-item:hover > .dropdown-menu {
22
+ transition: 0.3s;
23
+ opacity: 1;
24
+ visibility: visible;
25
+ top: 100%;
26
+ transform: rotateX(0deg);
27
+ }
28
+ }
29
+
2
30
  #universal_nav {
31
+ z-index: 2;
32
+ position: static;
3
33
  padding-top: $universal_navbar_height_padding;
4
34
  padding-bottom: $universal_navbar_height_padding;
5
35
  background-color: $universal_navbar_bg_color;
6
36
  color: $universal_navbar_text_color;
7
37
  .nav-item {
8
- &.active {
9
- background-color: $secondary;
10
- }
38
+ &.nav-item-icon {
11
39
  a.nav-link {
40
+ padding: 5px 12px;
41
+ }
42
+ &:hover {
43
+ span {
12
44
  color: $universal_navbar_text_color;
45
+ }
13
46
  }
14
- }
15
- .navbar-toggler {
16
- .icon-bar {
17
- background-color: $universal_navbar_text_color;
47
+ span {
48
+ color: #fff;
49
+ }
50
+ }
51
+ &:hover {
52
+ a.nav-link {
53
+ color: $universal_navbar_active_text_hover_color;
18
54
  }
55
+ }
56
+ &.active {
57
+ background-color: $universal_navbar_active_bg_color;
58
+ a.nav-link {
59
+ color: $universal_navbar_active_text_color;
60
+ }
61
+ }
62
+ a.nav-link {
63
+ color: $universal_navbar_text_color;
64
+ padding: 5px 20px;
65
+ }
66
+ }
67
+ .navbar-toggler,
68
+ .dropdown_hamburger {
69
+ .icon-bar {
70
+ background-color: $universal_navbar_text_color;
71
+ }
19
72
  }
20
73
  .dropdown-menu {
21
- z-index: 9999999;
74
+ z-index: 9999999;
22
75
  }
23
76
  }
24
77
  #main-navigation {
25
78
  padding-top: $navbar_height_padding;
79
+ z-index: 999;
26
80
  padding-bottom: $navbar_height_padding;
27
81
  background-color: $navbar_bg_color !important;
28
82
  color: $navbar_text_color;
@@ -33,43 +87,42 @@
33
87
  }
34
88
  }
35
89
  .nav-item {
36
- &.active {
37
- a::before {
38
- display: block;
39
- opacity: 1;
40
- width: 100% !important;
41
- left: 0 !important;
42
- }
43
- }
44
- a.nav-link {
45
- color: $navbar_text_color;
46
- }
47
- }
48
- .navbar-toggler {
49
- .icon-bar {
50
- background-color: $navbar_text_color;
90
+ &.active {
91
+ a::before {
92
+ display: block;
93
+ opacity: 1;
94
+ width: 100% !important;
95
+ left: 0 !important;
51
96
  }
97
+ }
98
+ a.nav-link {
99
+ color: $navbar_text_color;
100
+ }
52
101
  }
53
- .navbar-toggler {
102
+ .navbar-toggler,
103
+ .dropdown_hamburger {
54
104
  .icon-bar {
55
105
  background-color: $navbar_text_color;
56
106
  }
57
107
  }
58
108
  .search {
59
- .dropdown-menu.show {
60
- right: 0 !important;
61
- min-width: 300px;
62
- left: auto;
63
- }
109
+ .dropdown-menu.show {
110
+ right: 0 !important;
111
+ min-width: 300px;
112
+ left: auto;
113
+ }
114
+ button.btn.btn-outline-primary.border-0 {
115
+ display: block;
116
+ border-radius: 0px;
117
+ }
64
118
  }
65
119
  }
66
120
  // Multi-level dropdowns
67
121
  .navbar {
68
122
  li {
69
- @include media-breakpoint-down(sm) {
70
- text-align: center;
71
- }
72
-
123
+ @include media-breakpoint-down(sm) {
124
+ text-align: center;
125
+ }
73
126
  }
74
127
  .nav-item {
75
128
  @include media-breakpoint-down(sm) {
@@ -91,7 +144,7 @@
91
144
  height: 3px;
92
145
  left: 50%;
93
146
  position: absolute;
94
- background:$primary;
147
+ background: $primary;
95
148
  transition: width 0.3s ease 0s, left 0.3s ease 0s;
96
149
  width: 0;
97
150
  }
@@ -119,39 +172,39 @@
119
172
  }
120
173
  }
121
174
  .dropdown-menu {
122
- background-color: #f9f9f9;
123
- padding-top:0px;
124
- padding-bottom:0px;
125
- border-radius:0px;
126
- @include media-breakpoint-down(sm) {
127
- padding: 10px;
128
- padding-top:10px;
129
- padding-bottom: 10px;
130
- }
175
+ background-color: #f9f9f9;
176
+ padding-top: 0px;
177
+ padding-bottom: 0px;
178
+ border-radius: 0px;
179
+ @include media-breakpoint-down(sm) {
180
+ padding: 10px;
181
+ padding-top: 10px;
182
+ padding-bottom: 10px;
183
+ }
131
184
  a {
132
185
  cursor: pointer;
133
- color: #000;
134
- padding: .5rem 1.5rem;
135
- width:100%;
186
+ color: #000;
187
+ padding: 0.5rem 1.5rem;
188
+ width: 100%;
136
189
  display: inline-block;
137
190
  }
138
191
  li {
139
192
  &:hover {
140
- background-color: $primary;
193
+ background-color: $primary;
194
+ color: #fff;
195
+ & > a {
141
196
  color: #fff;
142
- &> a {
143
- color: #fff;
144
- text-decoration: none;
145
- }
197
+ text-decoration: none;
198
+ }
146
199
  }
147
200
  }
148
201
  }
149
202
 
150
203
  .dropdown-item {
151
- padding: 0;
152
- @include media-breakpoint-down(sm) {
153
- text-align: center;
154
- }
204
+ padding: 0;
205
+ @include media-breakpoint-down(sm) {
206
+ text-align: center;
207
+ }
155
208
  &.active {
156
209
  color: inherit;
157
210
  text-decoration: none;
@@ -165,9 +218,9 @@
165
218
  &:hover {
166
219
  background-color: $primary;
167
220
  color: #fff;
168
- &> a {
169
- color: #fff;
170
- text-decoration: none;
221
+ & > a {
222
+ color: #fff;
223
+ text-decoration: none;
171
224
  }
172
225
  }
173
226
  }
@@ -238,4 +291,64 @@
238
291
  }
239
292
  }
240
293
  }
294
+ .dropdown_hamburger {
295
+ button {
296
+ background: none;
297
+ border: none;
298
+ /* remove the blue outline when active or focused */
299
+ &:active,
300
+ &:focus {
301
+ outline: 0;
302
+ }
303
+ }
304
+
305
+ .icon-bar {
306
+ display: block;
307
+ width: 22px;
308
+ height: 2px;
309
+ border-radius: 1px;
310
+ margin: 4px 0 4px 0;
311
+ transition: transform opacity filter transform-origin 0.2s;
312
+ }
313
+ .icon-bar {
314
+ /* .navbar closed top .icon-bar no rotation - straight */
315
+ &:nth-of-type(1) {
316
+ transform: rotate(0);
317
+ }
318
+
319
+ /* .navbar open middle .icon-bar visible */
320
+ &:nth-of-type(2) {
321
+ opacity: 1;
322
+ filter: alpha(opacity=100);
323
+ }
324
+
325
+ /* .navbar open bottom .icon-bar no rotation - straight */
326
+ &:nth-of-type(3) {
327
+ transform: rotate(0);
328
+ }
329
+ }
330
+ /* styles for when .navbar is closed */
331
+ &.show {
332
+ /* basic styles for each icon bar */
333
+ .icon-bar {
334
+ /* .navbar open top .icon-bar rotated down 45° */
335
+ &:nth-of-type(1) {
336
+ transform: rotate(45deg);
337
+ transform-origin: 10% 10%;
338
+ }
339
+
340
+ /* .navbar open middle .icon-bar invisible */
341
+ &:nth-of-type(2) {
342
+ opacity: 0;
343
+ filter: alpha(opacity=0);
344
+ }
345
+
346
+ /* .navbar open bottom .icon-bar rotated up 45° */
347
+ &:nth-of-type(3) {
348
+ transform: rotate(-45deg);
349
+ transform-origin: 10% 90%;
350
+ }
351
+ }
352
+ }
353
+ }
241
354
  }
@@ -0,0 +1,35 @@
1
+ #wrapper {
2
+ #tabbed-nav-bar {
3
+ z-index: 9999999;
4
+ position: inherit;
5
+ &.fixed-top {
6
+ z-index: 999999;
7
+ position: fixed;
8
+ }
9
+ nav.navbar {
10
+ min-height: $tabbed_nav_height !important;
11
+ background-color: $tabbed_nav_bg !important;
12
+ span.icon-bar {
13
+ background-color: $tabbed_nav_text_colour;
14
+ }
15
+ a#sub-navigation-header {
16
+ color: $tabbed_nav_text_colour;
17
+ }
18
+ .nav-item {
19
+ a.nav-link {
20
+ display: block;
21
+ color: $tabbed_nav_text_colour;
22
+ &.active {
23
+ background-color: $tabbed_nav_active_bg_colour !important;
24
+ color: $tabbed_nav_active_colour !important;
25
+ }
26
+ }
27
+ }
28
+ .nav-item.dropdown.show {
29
+ a.nav-link.dropdown-toggle {
30
+ color: $tabbed_nav_active_colour !important;
31
+ }
32
+ }
33
+ }
34
+ }
35
+ }
@@ -1,56 +1,88 @@
1
1
  #wrapper {
2
- overflow-x:hidden;
3
- .btn{
4
- &.btn-primary {
5
- color: #fff;
2
+ #main_content {
3
+ ul {
4
+ list-style: none;
5
+ li {
6
+ &::before {
7
+ content: "\2022";
8
+ color: $primary;
9
+ font-weight: bold;
10
+ display: inline-block;
11
+ width: 1em;
12
+ margin-left: -1em;
6
13
  }
7
- &.btn-secondary {
8
- color: #fff;
14
+ ul > li {
15
+ &::before {
16
+ content: "\2022";
17
+ color: transparent;
18
+ font-weight: bold;
19
+ display: block;
20
+ width: 0.5em;
21
+ left: -0.5em;
22
+ height: 0.5em;
23
+ border: 1px solid $primary;
24
+ border-radius: 100%;
25
+ position: relative;
26
+ top: 0.5em;
27
+ }
9
28
  }
29
+ }
10
30
  }
11
- .dotted {
12
- border: 6px dotted $primary;
13
- border-radius: 10px;
31
+ }
32
+ .btn {
33
+ &.btn-primary {
34
+ color: #fff;
14
35
  }
15
- .blog-content {
16
- @include media-breakpoint-up(xl){
17
- font-size: 1.4rem;
18
- }
36
+ &.btn-secondary {
37
+ color: #fff;
19
38
  }
20
- blockquote {
21
- width:100%;
22
- font-family:Open Sans;
23
- font-style:italic;
24
- color: #555555;
25
- padding:1.2em 30px 1.2em 75px;
26
- border-left:8px solid $primary ;
27
- line-height:1.6;
28
- position: relative;
29
- background:#EDEDED;
30
- &::before{
31
- font-family:Arial;
32
- content: "\201C";
33
- color:$primary;
34
- font-size:6em;
35
- position: absolute;
36
- left: 10px;
37
- top:-10px;
38
- }
39
+ }
40
+ .dotted {
41
+ border: 6px dotted $primary;
42
+ border-radius: 10px;
43
+ }
44
+ .blog-content {
45
+ @include media-breakpoint-up(xl) {
46
+ font-size: 1.4rem;
39
47
  }
40
- .card {
41
- &.background_image {
42
- img {
43
- filter: brightness(0.6);
44
- height: 100%;
45
- }
46
- }
47
- .card-img-top {
48
- height: 150px;
49
- width: 100%;
50
- object-fit: cover;
51
- }
48
+ }
49
+ blockquote {
50
+ width: 100%;
51
+ font-family: "Lato";
52
+ font-display: swap;
53
+ font-style: italic;
54
+ color: #555555;
55
+ padding: 1.2em 30px 1.2em 75px;
56
+ border-left: 8px solid $primary;
57
+ line-height: 1.6;
58
+ position: relative;
59
+ background: #ededed;
60
+ &::before {
61
+ font-family: "Lato";
62
+ font-display: swap;
63
+ content: "\201C";
64
+ color: $primary;
65
+ font-size: 6em;
66
+ position: absolute;
67
+ left: 10px;
68
+ top: -10px;
69
+ }
70
+ }
71
+ .card {
72
+ &.background_image {
73
+ img {
74
+ filter: brightness(0.6);
75
+ height: 100%;
76
+ }
52
77
  }
53
- .darken {
54
- filter: brightness(0.5);
78
+ .card-img-top {
79
+ height: 150px;
80
+ width: 100%;
81
+ object-fit: cover;
82
+ font-family: "object-fit: cover;";
55
83
  }
84
+ }
85
+ .darken {
86
+ filter: brightness(0.5);
87
+ }
56
88
  }