@ecl/splash-page 5.0.0-aplha.13 → 5.0.0
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.
- package/README.md +17 -27
- package/package.json +8 -6
- package/splash-page.html.twig +13 -20
- package/splash-page.scss +8 -4
package/README.md
CHANGED
|
@@ -8,33 +8,23 @@ npm install --save @ecl/splash-page
|
|
|
8
8
|
|
|
9
9
|
### Parameters
|
|
10
10
|
|
|
11
|
-
- **"logo"** (
|
|
12
|
-
- "title" (string) (default: '')
|
|
13
|
-
- "alt" (string) (default: '')
|
|
14
|
-
- "path" (string) (default: '')
|
|
15
|
-
- "src_desktop" (string) (default: '')
|
|
16
|
-
- "src_mobile" (string) (default: '')
|
|
17
|
-
- **"title"** (string) (default: '')
|
|
18
|
-
- **"eu_category"** (string) (default: '')
|
|
19
|
-
- **"non_eu_category"** (string) (default: '')
|
|
20
|
-
- **"items"** (array) (default: [])
|
|
21
|
-
|
|
22
|
-
"
|
|
23
|
-
"
|
|
24
|
-
"
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
- **"non_eu_items"** (array) (default: []): (array) (default: []): format: [
|
|
29
|
-
{
|
|
30
|
-
"lang" (string) (default: '') Item language code, eg. 'en', 'fr', etc.
|
|
31
|
-
"label" (string) (default: '') Item language label, eg. 'English', 'Français', etc.
|
|
32
|
-
"path" (string) (default: '') Item language URL eg. '/example#language_en'.
|
|
33
|
-
"active" (boolean) (default: false) define if item is the active language.
|
|
34
|
-
},
|
|
35
|
-
],
|
|
36
|
-
- **"extra_classes"** (optional) (string) (default: '') Extra classes (space separated)
|
|
37
|
-
- **"extra_attributes"** (optional) (array) (default: []) Extra attributes
|
|
11
|
+
- **"logo"** (object) (default: {}) Logo image settings:
|
|
12
|
+
- "title" (string) (default: '') Logo title attribute
|
|
13
|
+
- "alt" (string) (default: '') Logo alt attribute
|
|
14
|
+
- "path" (string) (default: '') Logo link URL
|
|
15
|
+
- "src_desktop" (string) (default: '') Desktop logo image path
|
|
16
|
+
- "src_mobile" (string) (default: '') Mobile logo image path (EU only)
|
|
17
|
+
- **"title"** (string) (default: '') Page title, eg. 'Select your language'
|
|
18
|
+
- **"eu_category"** (string) (default: '') Label for EU languages group
|
|
19
|
+
- **"non_eu_category"** (string) (default: '') Label for non-EU languages group
|
|
20
|
+
- **"items"** (array) (default: []) EU language items; format:
|
|
21
|
+
- "lang" (string) (default: '') Language code, eg. 'en', 'fr'
|
|
22
|
+
- "label" (string) (default: '') Language label, eg. 'English', 'Français'
|
|
23
|
+
- "path" (string) (default: '') Language URL, eg. '/example#language_en'
|
|
24
|
+
- "active" (boolean) (default: false) Whether this is the currently active language
|
|
25
|
+
- **"non_eu_items"** (array) (default: []) Non-EU language items (same structure as items)
|
|
26
|
+
- **"extra_classes"** (string) (default: '') Extra classes (space separated)
|
|
27
|
+
- **"extra_attributes"** (array) (default: []) Extra attributes
|
|
38
28
|
- "name" (string) Attribute name, eg. 'data-test'
|
|
39
29
|
- "value" (string) Attribute value, eg: 'data-test-1'
|
|
40
30
|
|
package/package.json
CHANGED
|
@@ -2,19 +2,21 @@
|
|
|
2
2
|
"name": "@ecl/splash-page",
|
|
3
3
|
"author": "European Commission",
|
|
4
4
|
"license": "EUPL-1.2",
|
|
5
|
-
"version": "5.0.0
|
|
5
|
+
"version": "5.0.0",
|
|
6
6
|
"description": "ECL Splash Page",
|
|
7
7
|
"publishConfig": {
|
|
8
8
|
"access": "public"
|
|
9
9
|
},
|
|
10
10
|
"style": "splash-page.scss",
|
|
11
11
|
"dependencies": {
|
|
12
|
-
"@ecl/link": "5.0.0
|
|
13
|
-
"@ecl/picture": "5.0.0
|
|
12
|
+
"@ecl/link": "5.0.0",
|
|
13
|
+
"@ecl/picture": "5.0.0"
|
|
14
14
|
},
|
|
15
15
|
"devDependencies": {
|
|
16
|
-
"@ecl/
|
|
17
|
-
"@ecl/
|
|
16
|
+
"@ecl/grid": "5.0.0",
|
|
17
|
+
"@ecl/mixins-typography": "5.0.0",
|
|
18
|
+
"@ecl/resources-ec-logo": "5.0.0",
|
|
19
|
+
"@ecl/resources-eu-logo": "5.0.0"
|
|
18
20
|
},
|
|
19
21
|
"repository": {
|
|
20
22
|
"type": "git",
|
|
@@ -30,5 +32,5 @@
|
|
|
30
32
|
"design-system",
|
|
31
33
|
"twig"
|
|
32
34
|
],
|
|
33
|
-
"gitHead": "
|
|
35
|
+
"gitHead": "70ad1f5d6ae8b6e11c7d2422c3d5e7a1a74adf57"
|
|
34
36
|
}
|
package/splash-page.html.twig
CHANGED
|
@@ -12,29 +12,22 @@
|
|
|
12
12
|
- "title": (string) (default: ''): Page title, eg. 'Select your language'.
|
|
13
13
|
- "eu_category": (string) (default: ''): Label for EU languages
|
|
14
14
|
- "non_eu_category": (string) (default: ''): Label for non-EU languages
|
|
15
|
-
- "items"
|
|
15
|
+
- "items" (array) (default: []) EU language items; format: [
|
|
16
16
|
{
|
|
17
|
-
"lang" (string) (default: '')
|
|
18
|
-
"label" (string) (default: '')
|
|
19
|
-
"path" (string) (default: '')
|
|
20
|
-
"active" (boolean) (default: false)
|
|
21
|
-
},
|
|
22
|
-
]
|
|
23
|
-
- "non_eu_items"
|
|
24
|
-
|
|
25
|
-
"lang" (string) (default: '') Item language code, eg. 'en', 'fr', etc.
|
|
26
|
-
"label" (string) (default: '') Item language label, eg. 'English', 'Français', etc.
|
|
27
|
-
"path" (string) (default: '') Item language URL eg. '/example#language_en'.
|
|
28
|
-
"active" (boolean) (default: false) define if item is the active language.
|
|
29
|
-
},
|
|
30
|
-
],
|
|
31
|
-
- "extra_classes" (string) (default: '')
|
|
17
|
+
"lang" (string) (default: '') Language code, eg. 'en', 'fr'
|
|
18
|
+
"label" (string) (default: '') Language label, eg. 'English', 'Français'
|
|
19
|
+
"path" (string) (default: '') Language URL, eg. '/example#language_en'
|
|
20
|
+
"active" (boolean) (default: false) Whether this is the active language
|
|
21
|
+
}, ...
|
|
22
|
+
]
|
|
23
|
+
- "non_eu_items" (array) (default: []) Non-EU language items (same structure as items)
|
|
24
|
+
- "extra_classes" (string) (default: '') Extra classes (space separated)
|
|
32
25
|
- "extra_attributes" (array) (default: []): format: [
|
|
33
26
|
{
|
|
34
|
-
"name" (string)
|
|
35
|
-
"value" (
|
|
36
|
-
...
|
|
37
|
-
]
|
|
27
|
+
"name" (string) Attribute name, eg. 'data-test'
|
|
28
|
+
"value" (string) Attribute value, eg: 'data-test-1'
|
|
29
|
+
}, ...
|
|
30
|
+
]
|
|
38
31
|
#}
|
|
39
32
|
|
|
40
33
|
{# Internal properties #}
|
package/splash-page.scss
CHANGED
|
@@ -5,6 +5,7 @@
|
|
|
5
5
|
|
|
6
6
|
@use 'sass:map';
|
|
7
7
|
@use '@ecl/grid/mixins/breakpoints';
|
|
8
|
+
@use '@ecl/mixins-typography/mixins';
|
|
8
9
|
|
|
9
10
|
// Exposed variables
|
|
10
11
|
$theme: null !default;
|
|
@@ -61,12 +62,16 @@ $language-list: null !default;
|
|
|
61
62
|
}
|
|
62
63
|
|
|
63
64
|
.ecl-splash-page__language-title {
|
|
64
|
-
font: map.get($language-list, 'header-font-mobile');
|
|
65
65
|
margin: 0;
|
|
66
66
|
padding-inline-start: calc(
|
|
67
67
|
#{map.get($language-list, 'title-padding-start')} +
|
|
68
68
|
#{map.get($language-list, 'item-active-border-width')}
|
|
69
69
|
);
|
|
70
|
+
|
|
71
|
+
@include mixins.responsive-font(
|
|
72
|
+
map.get($language-list, 'header-typography'),
|
|
73
|
+
map.get($language-list, 'header-typography-font-weight')
|
|
74
|
+
);
|
|
70
75
|
}
|
|
71
76
|
|
|
72
77
|
.ecl-splash-page__language-content {
|
|
@@ -201,7 +206,6 @@ $language-list: null !default;
|
|
|
201
206
|
}
|
|
202
207
|
|
|
203
208
|
.ecl-splash-page__language-title {
|
|
204
|
-
font: map.get($language-list, 'header-font-desktop');
|
|
205
209
|
font-weight: map.get($language-list, 'header-font-weight');
|
|
206
210
|
}
|
|
207
211
|
|
|
@@ -268,8 +272,8 @@ $language-list: null !default;
|
|
|
268
272
|
|
|
269
273
|
// Horizontal sections
|
|
270
274
|
.ecl-splash-page__language-content:not(
|
|
271
|
-
|
|
272
|
-
|
|
275
|
+
.ecl-splash-page__language-content--stack
|
|
276
|
+
) {
|
|
273
277
|
flex-direction: row;
|
|
274
278
|
|
|
275
279
|
.ecl-splash-page__language-category {
|