Skip to content

Commit e7a8755

Browse files
querkmachinequerkmachine
committed
Merge branch 'release/v1.10.0'
* release/v1.10.0: Bump version number to 1.10.0. Add component and template for listing a whole bunch of links.
2 parents 3e7484a + ed11a5f commit e7a8755

16 files changed

Lines changed: 387 additions & 3 deletions

‎components/links-group/README.md‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
## When to use this component
2+
3+
## When to consider something else
4+
5+
## Guidance
6+
7+
## Accessibility
8+
9+
## Browser considerations

‎components/links-group/_links-group.scss‎

Lines changed: 54 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
1+
@use "tokens.web" as tokens;
2+
@use "mixins/media";
3+
@use "mixins/theme";
4+
5+
.sb-links-group {
6+
margin-top: 2rem;
7+
margin-bottom: 2rem;
8+
&__header {
9+
display: flex;
10+
flex-direction: column;
11+
align-items: flex-start;
12+
margin-bottom: 2rem;
13+
position: relative;
14+
&::after {
15+
@include theme.shade($direction: horizontal);
16+
content: "";
17+
display: block;
18+
width: 100%;
19+
height: 1rem;
20+
position: absolute;
21+
top: 100%;
22+
left: 0;
23+
}
24+
@include media.mq(30em) {
25+
flex-direction: row;
26+
align-items: flex-end;
27+
}
28+
}
29+
&__heading {
30+
padding: 0.5rem 1rem;
31+
color: var(--theme-accent);
32+
background-color: var(--theme-accent-mod);
33+
}
34+
&__icon {
35+
flex-grow: 0;
36+
flex-shrink: 0;
37+
order: -1;
38+
width: 20%;
39+
max-width: 150px;
40+
}
41+
&__description {
42+
}
43+
&__links {
44+
padding: 0;
45+
column-width: 8em;
46+
column-gap: tokens.$grid-gutter;
47+
list-style-type: none;
48+
}
49+
&__item {
50+
padding-bottom: 0.5em;
51+
page-break-inside: avoid;
52+
break-inside: avoid;
53+
}
54+
}

‎components/links-group/links-group.config.yaml‎

Whitespace-only changes.

‎components/links-group/links-group.js‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
export default class LinksGroup {
2+
constructor($module) {
3+
this.$module = $module;
4+
// Put code here
5+
}
6+
}

‎components/links-group/links-group.twig‎

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
{% from "@components/links-group/macro.twig" import sbLinksGroup %}
2+
3+
{{ sbLinksGroup({
4+
heading: {
5+
html: 'Group of links'
6+
},
7+
icon: '//placeponi.es/150/150',
8+
html: '<p>Put some description content here.</p>',
9+
links: [
10+
{ href: '#', html: 'Twitter' },
11+
{ href: '#', html: 'Instagram' },
12+
{ href: '#', html: 'Facebook' },
13+
{ href: '#', html: 'Telegram' },
14+
{ href: '#', html: 'Discord' },
15+
{ href: '#', html: 'GitHub' }
16+
]
17+
}) }}

‎components/links-group/macro.twig‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{% macro sbLinksGroup(params) %}
2+
{%- include "@components/links-group/template.twig" -%}
3+
{% endmacro %}

‎components/links-group/params.yaml‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
params:
2+
- name: attributes
3+
type: object
4+
description: HTML attributes, such as data attributes, to add to the component.
5+
- name: classes
6+
type: string
7+
description: Classes to add to the component.

‎components/links-group/template.twig‎

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
{% from "@components/heading/macro.twig" import sbHeading %}
2+
{% from "@components/prose/macro.twig" import sbProse %}
3+
4+
<section
5+
data-module="sb-links-group"
6+
class="sb-links-group {%- if params.classes %} {{ params.classes }}{% endif %}"
7+
{%- for attribute, value in params.attributes %} {{ attribute }}="{{ value }}"{% endfor %}>
8+
<header class="sb-links-group__header">
9+
{{ sbHeading({
10+
classes: 'sb-links-group__heading',
11+
hierarchy: 2,
12+
element: 'h2'
13+
} | merge(params.heading)) }}
14+
{%- if params.icon %}
15+
<img class="sb-links-group__icon" alt="{{ params.heading.html }}" src="{{ params.icon }}">
16+
{%- endif %}
17+
</header>
18+
{%- if params.html %}
19+
{{ sbProse({
20+
classes: 'sb-links-group__description',
21+
html: params.html
22+
}) }}
23+
{%- endif %}
24+
{%- if params.links %}
25+
<ul class="sb-links-group__links">
26+
{%- for item in params.links %}
27+
<li class="sb-links-group__item">
28+
<a href="{{ item.href }}" rel="noreferrer noopener" target="_blank">
29+
{{- item.title -}}
30+
</a>
31+
</li>
32+
{%- endfor %}
33+
</ul>
34+
{%- endif %}
35+
</section>

‎functions.php‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -34,6 +34,7 @@ function my_acf_init()
3434
require get_template_directory() . '/inc/meet-archive.php';
3535
require get_template_directory() . '/inc/meet-runners.php';
3636
require get_template_directory() . '/inc/navigations.php';
37+
require get_template_directory() . '/inc/page-groups.php';
3738
require get_template_directory() . '/inc/phase-banner.php';
3839
require get_template_directory() . '/inc/search.php';
3940
require get_template_directory() . '/inc/signposts.php';
@@ -278,6 +279,14 @@ function twig_cookie_value_function($cookieName)
278279
}
279280
}
280281

282+
/**
283+
* Real basic function to turn a string into a WordPress-like URL slug
284+
*/
285+
function twig_slug_filter($string)
286+
{
287+
return strtolower(trim(preg_replace('/[^A-Za-z0-9-]+/', '-', $string)));
288+
}
289+
281290
/** This is where you can add your own functions to twig.
282291
*
283292
* @param string $twig get extension.
@@ -294,6 +303,9 @@ public function add_to_twig($twig)
294303
$twig->addFilter(
295304
new Twig\TwigFilter('castToArray', [$this, 'twig_cast_to_array'])
296305
);
306+
$twig->addFilter(
307+
new Twig\TwigFilter('slug', [$this, 'twig_slug_filter'])
308+
);
297309
$twig->addFunction(
298310
new Timber\Twig_Function('merge', [$this, 'twig_merge_function'])
299311
);

‎inc/page-groups.php‎

Lines changed: 165 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,165 @@
1+
<?php
2+
if (function_exists('acf_add_local_field_group')):
3+
acf_add_local_field_group([
4+
'key' => 'group_60b7eb71af170',
5+
'title' => 'Groups and subgroups links',
6+
'fields' => [
7+
[
8+
'key' => 'field_60b7eb76bbdfb',
9+
'label' => 'Categories',
10+
'name' => 'group_categories',
11+
'type' => 'repeater',
12+
'instructions' => '',
13+
'required' => 0,
14+
'conditional_logic' => 0,
15+
'wrapper' => [
16+
'width' => '',
17+
'class' => '',
18+
'id' => '',
19+
],
20+
'collapsed' => 'field_60b7eba3bbdfc',
21+
'min' => 0,
22+
'max' => 0,
23+
'layout' => 'block',
24+
'button_label' => 'Add category',
25+
'sub_fields' => [
26+
[
27+
'key' => 'field_60b7eba3bbdfc',
28+
'label' => 'Category name',
29+
'name' => 'group_category_name',
30+
'type' => 'text',
31+
'instructions' => '',
32+
'required' => 1,
33+
'conditional_logic' => 0,
34+
'wrapper' => [
35+
'width' => '',
36+
'class' => '',
37+
'id' => '',
38+
],
39+
'default_value' => '',
40+
'placeholder' => '',
41+
'prepend' => '',
42+
'append' => '',
43+
'maxlength' => '',
44+
],
45+
[
46+
'key' => 'field_60b7ebbfbbdfd',
47+
'label' => 'Category icon',
48+
'name' => 'group_category_icon',
49+
'type' => 'image',
50+
'instructions' => '',
51+
'required' => 0,
52+
'conditional_logic' => 0,
53+
'wrapper' => [
54+
'width' => '',
55+
'class' => '',
56+
'id' => '',
57+
],
58+
'return_format' => 'url',
59+
'preview_size' => 'medium',
60+
'library' => 'all',
61+
'min_width' => '',
62+
'min_height' => '',
63+
'min_size' => '',
64+
'max_width' => '',
65+
'max_height' => '',
66+
'max_size' => '',
67+
'mime_types' => '',
68+
],
69+
[
70+
'key' => 'field_60b7ec42bbdfe',
71+
'label' => 'Description',
72+
'name' => 'group_content',
73+
'type' => 'wysiwyg',
74+
'instructions' => '',
75+
'required' => 0,
76+
'conditional_logic' => 0,
77+
'wrapper' => [
78+
'width' => '',
79+
'class' => '',
80+
'id' => '',
81+
],
82+
'default_value' => '',
83+
'tabs' => 'all',
84+
'toolbar' => 'basic',
85+
'media_upload' => 0,
86+
'delay' => 0,
87+
],
88+
[
89+
'key' => 'field_60b800ba18d02',
90+
'label' => 'Links',
91+
'name' => 'group_links',
92+
'type' => 'repeater',
93+
'instructions' => '',
94+
'required' => 0,
95+
'conditional_logic' => 0,
96+
'wrapper' => [
97+
'width' => '',
98+
'class' => '',
99+
'id' => '',
100+
],
101+
'collapsed' => 'field_60b800e518d03',
102+
'min' => 0,
103+
'max' => 0,
104+
'layout' => 'table',
105+
'button_label' => 'Add link',
106+
'sub_fields' => [
107+
[
108+
'key' => 'field_60b800e518d03',
109+
'label' => 'Link text',
110+
'name' => 'title',
111+
'type' => 'text',
112+
'instructions' => '',
113+
'required' => 1,
114+
'conditional_logic' => 0,
115+
'wrapper' => [
116+
'width' => '',
117+
'class' => '',
118+
'id' => '',
119+
],
120+
'default_value' => '',
121+
'placeholder' => '',
122+
'prepend' => '',
123+
'append' => '',
124+
'maxlength' => '',
125+
],
126+
[
127+
'key' => 'field_60b8010218d04',
128+
'label' => 'Link URL',
129+
'name' => 'href',
130+
'type' => 'url',
131+
'instructions' => '',
132+
'required' => 1,
133+
'conditional_logic' => 0,
134+
'wrapper' => [
135+
'width' => '',
136+
'class' => '',
137+
'id' => '',
138+
],
139+
'default_value' => '',
140+
'placeholder' => '',
141+
],
142+
],
143+
],
144+
],
145+
],
146+
],
147+
'location' => [
148+
[
149+
[
150+
'param' => 'post_template',
151+
'operator' => '==',
152+
'value' => 'page-groups.php',
153+
],
154+
],
155+
],
156+
'menu_order' => 0,
157+
'position' => 'normal',
158+
'style' => 'default',
159+
'label_placement' => 'top',
160+
'instruction_placement' => 'label',
161+
'hide_on_screen' => '',
162+
'active' => true,
163+
'description' => '',
164+
]);
165+
endif;

0 commit comments

Comments
 (0)