balean-theme 0.1.6 → 0.2.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.
- checksums.yaml +4 -4
- data/_sass/balean/components/_boxes.scss +27 -0
- data/_sass/balean/components/_buttons.scss +2 -2
- data/_sass/balean/components/_index.scss +2 -1
- data/_sass/balean/components/_shapes.scss +2 -2
- data/_sass/balean/settings/_color-scheme.scss +36 -32
- data/_sass/balean/variables/_index.scss +4 -5
- data/assets/images/arrow_left_icon.svg +17 -0
- data/assets/images/arrow_right_icon.svg +17 -0
- data/assets/images/balean-eap-icon.png +0 -0
- data/assets/images/balean-favicon.png +0 -0
- data/assets/images/balean-logo.svg +291 -0
- data/assets/images/bucket_100_icon.svg +3 -0
- data/assets/images/donate_icon.svg +9 -0
- data/assets/images/droplets_icon.svg +5 -0
- data/assets/images/home_icon.svg +3 -0
- data/assets/images/icon-512x512-eap.svg +90 -0
- data/assets/images/icon-512x512.png +0 -0
- data/assets/images/info_icon.svg +17 -0
- data/assets/images/location_icon.svg +4 -0
- data/assets/images/logo-dark.png +0 -0
- data/assets/images/logo-dark.svg +274 -42
- data/assets/images/logo-light.png +0 -0
- data/assets/images/logo-light.svg +295 -0
- data/assets/images/mobile_menu_wave_about.svg +4 -0
- data/assets/images/mobile_menu_wave_home.svg +4 -0
- data/assets/images/mobile_menu_wave_projects.svg +4 -0
- data/assets/images/mobile_menu_wave_stories.svg +4 -0
- data/assets/images/primary_icon.svg +98 -0
- data/assets/images/projects_icon.svg +3 -0
- data/assets/images/share_icon.svg +3 -0
- data/assets/images/star-icon.svg +3 -0
- data/assets/images/stories_icon.svg +6 -0
- metadata +25 -6
- data/assets/fonts/comfortaa-v45-latin-regular.woff2 +0 -0
- data/assets/images/icon-512x512.svg +0 -74
- data/assets/images/logo-yellow.png +0 -0
- data/assets/images/logo-yellow.svg +0 -63
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: bc2d4d20e213edc8334521121de33c2fb625cedcdb78859cb4cc345ffe469481
|
|
4
|
+
data.tar.gz: d75f54d60947b4099c37e5f6670a3f1d8619bb2efbf95c571cde445385a56893
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: ae61d350bd0e9cc7fcb63366cdaf7e388b262a1c1d490f21e76f07b66f2c95192490b186f622f4e88d72dbc749cdd6371d03e476974f4d2ca5ec90af917ea3a7
|
|
7
|
+
data.tar.gz: b45601ce5f2d493ef8f353110a37c0f8eefbbb6dbbd82b44487da4aa27bc6f0bdfcdc6f2fcc5ea36372cfff8e45048eca5bf605f3d3e0bb600f30539f9495654
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
.project-card {
|
|
2
|
+
width: 335px;
|
|
3
|
+
border-radius: 10px;
|
|
4
|
+
box-shadow: 4px 4px 4px 4px rgba(0, 0, 0, 0.25);
|
|
5
|
+
padding: 5px;
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
h1, h2, h3, p {
|
|
9
|
+
margin-top: 0;
|
|
10
|
+
margin-bottom: 0;
|
|
11
|
+
}
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
.kpi-card {
|
|
15
|
+
width: 82px;
|
|
16
|
+
aspect-ratio: 1 / 1;
|
|
17
|
+
border-radius: 10px;
|
|
18
|
+
box-shadow: 2px 2px 4px 1px rgba(0, 0, 0, 0.25);
|
|
19
|
+
padding: 5px;
|
|
20
|
+
text-align: center;
|
|
21
|
+
margin: 10px;
|
|
22
|
+
|
|
23
|
+
h1, h2, h3, p {
|
|
24
|
+
margin-top: 0;
|
|
25
|
+
margin-bottom: 0;
|
|
26
|
+
}
|
|
27
|
+
}
|
|
@@ -13,8 +13,8 @@
|
|
|
13
13
|
outline: none;
|
|
14
14
|
cursor: pointer;
|
|
15
15
|
transition: vars.$global-transition;
|
|
16
|
-
color: var(--
|
|
17
|
-
background: var(--primary-color);
|
|
16
|
+
color: var(--bui-white);
|
|
17
|
+
background: var(--bui-primary-color-1);
|
|
18
18
|
|
|
19
19
|
&:hover {
|
|
20
20
|
color: var(--button-color);
|
|
@@ -5,14 +5,14 @@
|
|
|
5
5
|
|
|
6
6
|
&--rounded-rectangle {
|
|
7
7
|
min-height: 150px;
|
|
8
|
-
background: var(--bui-
|
|
8
|
+
background: var(--bui-primary-color-2);
|
|
9
9
|
// x1 x2 x3 x4 / y1 y2 y3 y4 -> 1 = up-left, 2 = up right, 3 = down-right, 4 = down-left
|
|
10
10
|
border-radius: 60px;
|
|
11
11
|
}
|
|
12
12
|
|
|
13
13
|
&--organic-shape {
|
|
14
14
|
aspect-ratio: 3 / 2;
|
|
15
|
-
background: var(--bui-
|
|
15
|
+
background: var(--bui-primary-color-2);
|
|
16
16
|
// x1 x2 x3 x4 / y1 y2 y3 y4 -> 1 = up-left, 2 = up right, 3 = down-right, 4 = down-left
|
|
17
17
|
border-radius: 68% 23% 70% 21% / 40% 35% 66% 53%;
|
|
18
18
|
}
|
|
@@ -2,38 +2,25 @@
|
|
|
2
2
|
// Color definitions
|
|
3
3
|
// *****************
|
|
4
4
|
|
|
5
|
-
$balean-primary-1: #
|
|
6
|
-
$balean-primary-2: #
|
|
7
|
-
$balean-primary-3: #
|
|
8
|
-
$balean-primary-4: #a8dadcff; // Soft Aqua
|
|
5
|
+
$balean-primary-1: #002557ff; // Pantone 2757C - Dark blue
|
|
6
|
+
$balean-primary-2: #FBD872ff; // Pantone 2740C - Octopus Yellow
|
|
7
|
+
$balean-primary-3: #ffffffff; // White
|
|
9
8
|
|
|
10
|
-
$balean-
|
|
11
|
-
$balean-
|
|
12
|
-
$balean-secondary-3: #ff8600ff; // Orange
|
|
13
|
-
$balean-secondary-4: #ff6b6bff; // Coral
|
|
14
|
-
$balean-secondary-5: #9ae6b4ff; // Seafoam green
|
|
15
|
-
|
|
16
|
-
$balean-bg-1: #ffffffff; // White
|
|
17
|
-
$balean-bg-2: #fdfcdcff; // Soft beige
|
|
18
|
-
$balean-bg-3: #003049ff; // Dark navy
|
|
9
|
+
$balean-accent-1: #00B5E2ff; // Pantone 3545C - Whale blue
|
|
10
|
+
$balean-accent-2: #FF585Dff; // Pantone 1787C - Coral
|
|
19
11
|
|
|
20
12
|
.bui-bgcolor {
|
|
21
|
-
@for $i from
|
|
13
|
+
@for $i from 1 through 3 {
|
|
22
14
|
&__bui-primary-color-#{$i} {
|
|
23
15
|
background-color: var(--bui-primary-color-#{$i}) !important;
|
|
24
16
|
}
|
|
25
17
|
}
|
|
26
|
-
@for $i from
|
|
27
|
-
&__bui-
|
|
28
|
-
background-color: var(--bui-
|
|
29
|
-
}
|
|
30
|
-
}
|
|
31
|
-
@for $i from 0 through 3 {
|
|
32
|
-
&__bui-bg-color-#{$i} {
|
|
33
|
-
background-color: var(--bui-bg-#{$i}) !important;
|
|
18
|
+
@for $i from 1 through 2 {
|
|
19
|
+
&__bui-accent-color-#{$i} {
|
|
20
|
+
background-color: var(--bui-accent-color-#{$i}) !important;
|
|
34
21
|
}
|
|
35
22
|
}
|
|
36
|
-
&__bui-
|
|
23
|
+
&__bui-primary-color-1 {
|
|
37
24
|
color: white;
|
|
38
25
|
}
|
|
39
26
|
}
|
|
@@ -42,17 +29,34 @@ $balean-bg-3: #003049ff; // Dark navy
|
|
|
42
29
|
/* Color Scheme */
|
|
43
30
|
:root {
|
|
44
31
|
--bui-primary-color-1: #{$balean-primary-1};
|
|
32
|
+
--bui-primary-color-1-lighter: color-mix(in srgb, var(--bui-primary-color-1) 60%, white);
|
|
33
|
+
--bui-primary-color-1-light: color-mix(in srgb, var(--bui-primary-color-1) 40%, white);
|
|
34
|
+
--bui-primary-color-1-lightest: color-mix(in srgb, var(--bui-primary-color-1) 20%, white);
|
|
35
|
+
--bui-primary-color-1-darker: color-mix(in srgb, var(--bui-primary-color-1) 60%, black);
|
|
36
|
+
--bui-primary-color-1-dark: color-mix(in srgb, var(--bui-primary-color-1) 40%, black);
|
|
37
|
+
--bui-primary-color-1-darkest: color-mix(in srgb, var(--bui-primary-color-1) 20%, black);
|
|
45
38
|
--bui-primary-color-2: #{$balean-primary-2};
|
|
39
|
+
--bui-primary-color-2-lighter: color-mix(in srgb, var(--bui-primary-color-2) 60%, white);
|
|
40
|
+
--bui-primary-color-2-light: color-mix(in srgb, var(--bui-primary-color-2) 40%, white);
|
|
41
|
+
--bui-primary-color-2-lightest: color-mix(in srgb, var(--bui-primary-color-2) 20%, white);
|
|
42
|
+
--bui-primary-color-2-darker: color-mix(in srgb, var(--bui-primary-color-2) 60%, black);
|
|
43
|
+
--bui-primary-color-2-dark: color-mix(in srgb, var(--bui-primary-color-2) 40%, black);
|
|
44
|
+
--bui-primary-color-2-darkest: color-mix(in srgb, var(--bui-primary-color-2) 20%, black);
|
|
46
45
|
--bui-primary-color-3: #{$balean-primary-3};
|
|
47
|
-
--bui-
|
|
48
|
-
--bui-
|
|
49
|
-
--bui-
|
|
50
|
-
--bui-
|
|
51
|
-
--bui-
|
|
52
|
-
--bui-
|
|
53
|
-
--bui-
|
|
54
|
-
--bui-
|
|
55
|
-
--bui-
|
|
46
|
+
--bui-accent-color-1: #{$balean-accent-1};
|
|
47
|
+
--bui-accent-color-1-lighter: color-mix(in srgb, var(--bui-accent-color-1) 60%, white);
|
|
48
|
+
--bui-accent-color-1-light: color-mix(in srgb, var(--bui-accent-color-1) 40%, white);
|
|
49
|
+
--bui-accent-color-1-lightest: color-mix(in srgb, var(--bui-accent-color-1) 20%, white);
|
|
50
|
+
--bui-accent-color-1-darker: color-mix(in srgb, var(--bui-accent-color-1) 60%, black);
|
|
51
|
+
--bui-accent-color-1-dark: color-mix(in srgb, var(--bui-accent-color-1) 40%, black);
|
|
52
|
+
--bui-accent-color-1-darkest: color-mix(in srgb, var(--bui-accent-color-1) 20%, black);
|
|
53
|
+
--bui-accent-color-2: #{$balean-accent-2};
|
|
54
|
+
--bui-accent-color-2-lighter: color-mix(in srgb, var(--bui-accent-color-2) 60%, white);
|
|
55
|
+
--bui-accent-color-2-light: color-mix(in srgb, var(--bui-accent-color-2) 40%, white);
|
|
56
|
+
--bui-accent-color-2-lightest: color-mix(in srgb, var(--bui-accent-color-2) 20%, white);
|
|
57
|
+
--bui-accent-color-2-darker: color-mix(in srgb, var(--bui-accent-color-2) 60%, black);
|
|
58
|
+
--bui-accent-color-2-dark: color-mix(in srgb, var(--bui-accent-color-2) 40%, black);
|
|
59
|
+
--bui-accent-color-2-darkest: color-mix(in srgb, var(--bui-accent-color-2) 20%, black);
|
|
56
60
|
--bui-white: #fff;
|
|
57
61
|
--bui-light-gray: #eaecef;
|
|
58
62
|
--bui-gray: #767676;
|
|
@@ -23,8 +23,7 @@ $base-font-family: 'Lato', Helvetica Neue, Helvetica, Arial, sans-serif;
|
|
|
23
23
|
$base-line-height: 1.5;
|
|
24
24
|
|
|
25
25
|
// Headings
|
|
26
|
-
$heading-font-family: "
|
|
27
|
-
"Helvetica Neue", "Lucida Grande", Arial, sans-serif;
|
|
26
|
+
$heading-font-family: "Alata", Helvetica Neue, Helvetica, Arial, sans-serif;
|
|
28
27
|
$heading-font-weight: 700;
|
|
29
28
|
|
|
30
29
|
$font-size-h1: 36px !default;
|
|
@@ -49,6 +48,6 @@ $mobile: 576px;
|
|
|
49
48
|
|
|
50
49
|
$mq: (
|
|
51
50
|
$mobile: $columns,
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
51
|
+
$tablet: $columns,
|
|
52
|
+
$desktop: $columns
|
|
53
|
+
);
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
<svg width="57" height="57" viewBox="0 0 57 57" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<g filter="url(#filter0_d_111_558)">
|
|
3
|
+
<path d="M17.6602 19.8563L30.1597 19.9634M30.1597 19.9634L23.8564 26.1596M30.1597 19.9634L23.9635 13.6601M42.6593 20.0705C42.5706 30.4255 34.1043 38.7479 23.7493 38.6592C13.3944 38.5704 5.07193 30.1042 5.16066 19.7492C5.24939 9.39424 13.7157 1.07182 24.0706 1.16055C34.4256 1.24927 42.748 9.71555 42.6593 20.0705Z" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" shape-rendering="crispEdges"/>
|
|
4
|
+
</g>
|
|
5
|
+
<defs>
|
|
6
|
+
<filter id="filter0_d_111_558" x="0.159958" y="0.159912" width="47.5" height="47.5" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
|
7
|
+
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
|
|
8
|
+
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
|
|
9
|
+
<feOffset dy="4"/>
|
|
10
|
+
<feGaussianBlur stdDeviation="2"/>
|
|
11
|
+
<feComposite in2="hardAlpha" operator="out"/>
|
|
12
|
+
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
|
|
13
|
+
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_111_558"/>
|
|
14
|
+
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_111_558" result="shape"/>
|
|
15
|
+
</filter>
|
|
16
|
+
</defs>
|
|
17
|
+
</svg>
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
<svg width="57" height="57" viewBox="0 0 57 57" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<g filter="url(#filter0_d_111_559)">
|
|
3
|
+
<path d="M30 19.75H17.5M17.5 19.75L23.75 13.5M17.5 19.75L23.75 26M5 19.75C5 9.39466 13.3947 1 23.75 1C34.1053 1 42.5 9.39466 42.5 19.75C42.5 30.1053 34.1053 38.5 23.75 38.5C13.3947 38.5 5 30.1053 5 19.75Z" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" shape-rendering="crispEdges"/>
|
|
4
|
+
</g>
|
|
5
|
+
<defs>
|
|
6
|
+
<filter id="filter0_d_111_559" x="0" y="0" width="47.5" height="47.5" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
|
7
|
+
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
|
|
8
|
+
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
|
|
9
|
+
<feOffset dy="4"/>
|
|
10
|
+
<feGaussianBlur stdDeviation="2"/>
|
|
11
|
+
<feComposite in2="hardAlpha" operator="out"/>
|
|
12
|
+
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
|
|
13
|
+
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_111_559"/>
|
|
14
|
+
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_111_559" result="shape"/>
|
|
15
|
+
</filter>
|
|
16
|
+
</defs>
|
|
17
|
+
</svg>
|
|
Binary file
|
|
Binary file
|