Skip to content

Commit c96e73e

Browse files
author
Simon L. Lange
committed
Bellcom theme: Update
1 parent 3c7cbf6 commit c96e73e

File tree

8 files changed

+795
-47
lines changed

8 files changed

+795
-47
lines changed

‎web/themes/custom/subsites/bellcom_theme/assets/css/bundle.css

Lines changed: 46 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -993,28 +993,29 @@ video {
993993
width: 100%
994994
}
995995
}
996-
.hero-wrapper .hero__inner-wrapper .hero__text-wrapper h1 {
997-
font-family: 'Playfair Display', serif;
998-
font-size: 52px;
999-
line-height: 1.1;
1000-
margin-bottom: 25px;
1001-
font-weight: 500;
1002-
}
996+
.hero-wrapper .hero__inner-wrapper .hero__text-wrapper h1 .hero-heading .hero-heading__item {
997+
font-family: 'Playfair Display', serif;
998+
font-size: 52px;
999+
line-height: 1.1;
1000+
margin-bottom: 25px;
1001+
font-weight: 500;
1002+
}
10031003
@media (max-width: 640px) {
1004-
.hero-wrapper .hero__inner-wrapper .hero__text-wrapper h1 {
1005-
font-size: 44px
1006-
}
1007-
}
1008-
.hero-wrapper .hero__inner-wrapper .hero__text-wrapper p {
1009-
font-family: 'Poppins', sans-serif;
1010-
font-size: 18px;
1011-
font-weight: 300;
1012-
margin-bottom: 20px;
1013-
}
1004+
.hero-wrapper .hero__inner-wrapper .hero__text-wrapper h1 .hero-heading .hero-heading__item {
1005+
font-size: 44px
1006+
}
1007+
}
1008+
.hero-wrapper .hero__inner-wrapper .hero__text-wrapper .hero__body-text .hero-body .hero-body__item {
1009+
font-family: 'Poppins', sans-serif;
1010+
font-size: 18px;
1011+
font-weight: 300;
1012+
margin-bottom: 20px;
1013+
}
10141014
.hero-wrapper .hero__inner-wrapper .hero__text-wrapper .hero__cta-wrapper {
10151015
display: flex;
10161016
width: 100%;
10171017
margin-top: 50px;
1018+
align-items: center;
10181019
}
10191020
@media (max-width: 640px) {
10201021
.hero-wrapper .hero__inner-wrapper .hero__text-wrapper .hero__cta-wrapper {
@@ -1032,16 +1033,43 @@ video {
10321033
}
10331034
.hero-wrapper .hero__inner-wrapper .hero__text-wrapper .hero__cta-wrapper .main-cta-btn-wrapper .main-cta-btn {
10341035
background-color: #344E41;
1035-
padding: 12px 20px;
1036+
padding: 12px 35px;
10361037
border-radius: 10px;
10371038
color: white;
10381039
font-weight: 600;
10391040
font-family: 'Poppins', sans-serif;
1041+
display: flex;
1042+
align-items: center;
1043+
transition: 0.3s ease;
1044+
position: relative;
10401045
}
1046+
.hero-wrapper .hero__inner-wrapper .hero__text-wrapper .hero__cta-wrapper .main-cta-btn-wrapper .main-cta-btn:hover svg {
1047+
opacity: 1;
1048+
transform: translateX(0);
1049+
}
1050+
.hero-wrapper .hero__inner-wrapper .hero__text-wrapper .hero__cta-wrapper .main-cta-btn-wrapper .main-cta-btn:hover span {
1051+
transform: translateX(-10px);
1052+
}
1053+
.hero-wrapper .hero__inner-wrapper .hero__text-wrapper .hero__cta-wrapper .main-cta-btn-wrapper .main-cta-btn span {
1054+
transition: 0.3s ease;
1055+
}
1056+
.hero-wrapper .hero__inner-wrapper .hero__text-wrapper .hero__cta-wrapper .main-cta-btn-wrapper .main-cta-btn svg {
1057+
opacity: 0;
1058+
transform: translateX(-25px);
1059+
transition: 0.3s ease;
1060+
position: absolute;
1061+
right: 15px;
1062+
}
1063+
.hero-wrapper .hero__inner-wrapper .hero__text-wrapper .hero__cta-wrapper .main-cta-btn-wrapper .main-cta-btn .ext {
1064+
display: none;
1065+
}
10411066
.hero-wrapper .hero__inner-wrapper .hero__text-wrapper .hero__cta-wrapper .secondary-cta-btn-wrapper .secondary-cta-btn {
10421067
display: flex;
10431068
align-items: center;
10441069
}
1070+
.hero-wrapper .hero__inner-wrapper .hero__text-wrapper .hero__cta-wrapper .secondary-cta-btn-wrapper .secondary-cta-btn .ext {
1071+
display: none;
1072+
}
10451073
.hero-wrapper .hero__inner-wrapper .hero__text-wrapper .hero__cta-wrapper .secondary-cta-btn-wrapper .secondary-cta-btn span {
10461074
margin-right: 20px;
10471075
}

‎web/themes/custom/subsites/bellcom_theme/assets/js/bundle.js

Lines changed: 650 additions & 3 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎web/themes/custom/subsites/bellcom_theme/config/webpack.common.js

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
12
const path = require('path')
23
const CopyPlugin = require('copy-webpack-plugin')
34
const ImageminPlugin = require('imagemin-webpack-plugin').default
@@ -42,8 +43,8 @@ module.exports = {
4243
// new CleanWebpackPlugin(),
4344
new CopyPlugin({
4445
patterns: [
45-
{ context: 'src', from: 'images/**/*.+(jpg|jpeg|png|gif|svg)' },
46-
{ context: 'src', from: 'fonts/*.+(woff|woff2|otf|eot|svg)' },
46+
{ context: 'src', from: 'images/!**!/!*.+(jpg|jpeg|png|gif|svg)' },
47+
{ context: 'src', from: 'fonts/!*.+(woff|woff2|otf|eot|svg)' },
4748
],
4849
}),
4950
new ImageminPlugin({

‎web/themes/custom/subsites/bellcom_theme/package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -41,6 +41,7 @@
4141
"webpack-merge": "^5.8.0"
4242
},
4343
"dependencies": {
44+
"aos": "^2.3.4",
4445
"tailwindcss": "^2.1.4"
4546
},
4647
"browserslist": [

‎web/themes/custom/subsites/bellcom_theme/src/js/main.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
'use strict'
1+
'use strict';
2+
23

34
document.addEventListener('DOMContentLoaded', () => {
4-
console.log('Webpack is working fine')
5-
})
5+
});

‎web/themes/custom/subsites/bellcom_theme/src/scss/sections/hero.scss

Lines changed: 56 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -26,26 +26,35 @@
2626
width: 100%;
2727
}
2828
h1 {
29-
font-family: 'Playfair Display', serif;
30-
font-size: 52px;
31-
line-height: 1.1;
32-
margin-bottom: 25px;
33-
font-weight: 500;
34-
35-
@media (max-width: 640px) {
36-
font-size: 44px;
29+
.hero-heading {
30+
.hero-heading__item {
31+
font-family: 'Playfair Display', serif;
32+
font-size: 52px;
33+
line-height: 1.1;
34+
margin-bottom: 25px;
35+
font-weight: 500;
36+
37+
@media (max-width: 640px) {
38+
font-size: 44px;
39+
}
40+
}
3741
}
3842
}
39-
p {
40-
font-family: 'Poppins', sans-serif;
41-
font-size: 18px;
42-
font-weight: 300;
43-
margin-bottom: 20px;
43+
.hero__body-text {
44+
.hero-body {
45+
.hero-body__item {
46+
font-family: 'Poppins', sans-serif;
47+
font-size: 18px;
48+
font-weight: 300;
49+
margin-bottom: 20px;
50+
}
51+
}
4452
}
4553
.hero__cta-wrapper {
4654
display: flex;
4755
width: 100%;
4856
margin-top: 50px;
57+
align-items: center;
4958

5059
@media (max-width: 640px) {
5160
flex-direction: column;
@@ -58,18 +67,51 @@
5867
}
5968
.main-cta-btn {
6069
background-color: #344E41;
61-
padding: 12px 20px;
70+
padding: 12px 35px;
6271
border-radius: 10px;
6372
color: white;
6473
font-weight: 600;
6574
font-family: 'Poppins', sans-serif;
75+
display: flex;
76+
align-items: center;
77+
transition: 0.3s ease;
78+
position: relative;
79+
80+
&:hover svg {
81+
opacity: 1;
82+
transform: translateX(0);
83+
}
84+
85+
&:hover span {
86+
transform: translateX(-10px);
87+
}
88+
89+
span {
90+
transition: 0.3s ease;
91+
}
92+
93+
svg {
94+
opacity: 0;
95+
transform: translateX(-25px);
96+
transition: 0.3s ease;
97+
position: absolute;
98+
right: 15px;
99+
}
100+
101+
.ext {
102+
display: none;
103+
}
66104
}
67105
}
68106
.secondary-cta-btn-wrapper {
69107
.secondary-cta-btn {
70108
display: flex;
71109
align-items: center;
72110

111+
.ext {
112+
display: none;
113+
}
114+
73115
span {
74116
margin-right: 20px;
75117
}

‎web/themes/custom/subsites/bellcom_theme/templates/paragraphs/paragraph--landingpage_hero_banner.html.twig

Lines changed: 16 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,28 @@
11
<div class="hero-wrapper">
22
<div class="hero__inner-wrapper">
33
<div class="hero__text-wrapper">
4-
<h1>Design bureau,<br>med intelligente løsninger</h1>
5-
<p>Bellcom dækker alle digitale behov indenfor udvikling, hosting og support.</p>
6-
<p>Vores primære kompetencer er teknisk rådgivning, agil udvikling, design og implementering af innovative hjemmesider
7-
i open source teknologi baseret på CMS platformen Drupal.</p>
4+
{% if paragraph.field_hero_heading.value %}
5+
<h1 data-aos="fade-in">{{ content.field_hero_heading }}</h1>
6+
{% endif %}
7+
{% if paragraph.field_hero_body.value %}
8+
<div class="hero__body-text">
9+
{{ content.field_hero_body }}
10+
</div>
11+
{% endif %}
12+
{% if paragraph.field_main_cta_button.value or paragraph.field_secondary_cta_button.value %}
813
<div class="hero__cta-wrapper">
14+
{% if paragraph.field_main_cta_button.value %}
915
<div class="main-cta-btn-wrapper">
10-
<a class="main-cta-btn" href="#">Læs mere om Bellcom</a>
16+
<a class="main-cta-btn" href="{{ paragraph.field_main_cta_button.0.url }}"><span>{{ paragraph.field_main_cta_button.0.title }}</span>{% include "@bellcom_theme/assets/images/arrow-right-small.svg" %}</a>
1117
</div>
18+
{% endif %}
19+
{% if paragraph.field_secondary_cta_button.value %}
1220
<div class="secondary-cta-btn-wrapper">
13-
<a class="secondary-cta-btn" href="#"><span>Gå til produkt oversigt</span> {% include "@bellcom_theme/assets/images/arrow-right.svg" %}</a>
21+
<a class="secondary-cta-btn" href="{{ paragraph.field_secondary_cta_button.0.url }}"><span>{{ paragraph.field_secondary_cta_button.0.title }}</span> {% include "@bellcom_theme/assets/images/arrow-right.svg" %}</a>
1422
</div>
23+
{% endif %}
1524
</div>
25+
{% endif %}
1626
</div>
1727
<div class="hero__element-wrapper">
1828
<a href="#" class="hero__element hero__element-one">

‎web/themes/custom/subsites/bellcom_theme/yarn.lock

Lines changed: 20 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1376,6 +1376,15 @@ anymatch@^3.0.0, anymatch@~3.1.2:
13761376
normalize-path "^3.0.0"
13771377
picomatch "^2.0.4"
13781378

1379+
aos@^2.3.4:
1380+
version "2.3.4"
1381+
resolved "https://registry.npmjs.org/aos/-/aos-2.3.4.tgz#eb1c29f5c1806a197cf6323080747547edd3db8e"
1382+
integrity sha512-zh/ahtR2yME4I51z8IttIt4lC1Nw0ktsFtmeDzID1m9naJnWXhCoARaCgNOGXb5CLy3zm+wqmRAEgMYB5E2HUw==
1383+
dependencies:
1384+
classlist-polyfill "^1.0.3"
1385+
lodash.debounce "^4.0.6"
1386+
lodash.throttle "^4.0.1"
1387+
13791388
arch@^2.1.0:
13801389
version "2.2.0"
13811390
resolved "https://registry.npmjs.org/arch/-/arch-2.2.0.tgz#1bc47818f305764f23ab3306b0bfc086c5a29d11"
@@ -1860,6 +1869,11 @@ class-utils@^0.3.5:
18601869
isobject "^3.0.0"
18611870
static-extend "^0.1.1"
18621871

1872+
classlist-polyfill@^1.0.3:
1873+
version "1.2.0"
1874+
resolved "https://registry.npmjs.org/classlist-polyfill/-/classlist-polyfill-1.2.0.tgz#935bc2dfd9458a876b279617514638bcaa964a2e"
1875+
integrity sha512-GzIjNdcEtH4ieA2S8NmrSxv7DfEV5fmixQeyTmqmRmRJPGpRBaSnA2a0VrCjyT8iW8JjEdMbKzDotAJf+ajgaQ==
1876+
18631877
clean-webpack-plugin@^3.0.0:
18641878
version "3.0.0"
18651879
resolved "https://registry.npmjs.org/clean-webpack-plugin/-/clean-webpack-plugin-3.0.0.tgz#a99d8ec34c1c628a4541567aa7b457446460c62b"
@@ -4161,7 +4175,7 @@ locate-path@^5.0.0:
41614175
dependencies:
41624176
p-locate "^4.1.0"
41634177

4164-
lodash.debounce@^4.0.8:
4178+
lodash.debounce@^4.0.6, lodash.debounce@^4.0.8:
41654179
version "4.0.8"
41664180
resolved "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz#82d79bff30a67c4005ffd5e2515300ad9ca4d7af"
41674181
integrity sha512-FT1yDzDYEoYWhnSGnpE/4Kj1fLZkDFyqRb7fNt6FdYOSxlUWAtp42Eh6Wb0rGIv/m9Bgo7x4GhQbm5Ys4SG5ow==
@@ -4176,6 +4190,11 @@ lodash.memoize@^4.1.2:
41764190
resolved "https://registry.npmjs.org/lodash.memoize/-/lodash.memoize-4.1.2.tgz#bcc6c49a42a2840ed997f323eada5ecd182e0bfe"
41774191
integrity sha512-t7j+NzmgnQzTAYXcsHYLgimltOV1MXHtlOWf6GjL9Kj8GK5FInw5JotxvbOs+IvV1/Dzo04/fCGfLVs7aXb4Ag==
41784192

4193+
lodash.throttle@^4.0.1:
4194+
version "4.1.1"
4195+
resolved "https://registry.npmjs.org/lodash.throttle/-/lodash.throttle-4.1.1.tgz#c23e91b710242ac70c37f1e1cda9274cc39bf2f4"
4196+
integrity sha512-wIkUCfVKpVsWo3JSZlc+8MB5it+2AN5W8J7YVMST30UrvcQNZ1Okbj+rbVniijTWE6FGYy4XJq/rHkas8qJMLQ==
4197+
41794198
lodash.topath@^4.5.2:
41804199
version "4.5.2"
41814200
resolved "https://registry.npmjs.org/lodash.topath/-/lodash.topath-4.5.2.tgz#3616351f3bba61994a0931989660bd03254fd009"

0 commit comments

Comments
 (0)