Skip to content

Commit f504843

Browse files
Update styles & content (#6)
Co-authored-by: GitButler <gitbutler@gitbutler.com>
1 parent 71b1311 commit f504843

20 files changed

Lines changed: 5840 additions & 1277 deletions

package-lock.json

Lines changed: 4609 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.
Lines changed: 15 additions & 0 deletions
Loading

src/assets/images/logo/ff-kawaii.svg

Lines changed: 1 addition & 0 deletions
Loading
8.21 KB
Loading
Lines changed: 1 addition & 0 deletions
Loading

src/assets/images/sticker.svg

Lines changed: 1 addition & 1 deletion
Loading

src/index.html

Lines changed: 14 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@
99
<link rel="preconnect" href="https://fonts.googleapis.com">
1010
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
1111
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700&display=swap" rel="stylesheet">
12+
<link rel="preload" href="https://wearefrank.nl/assets/fonts/Gilroy-Regular.woff2" as="font" type="font/woff2" crossorigin="">
1213

1314
<link rel="apple-touch-icon" sizes="180x180" href="/assets/favicon/apple-touch-icon.png?v=2">
1415
<link rel="icon" type="image/png" sizes="32x32" href="/assets/favicon/favicon-32x32.png?v=2">
@@ -43,12 +44,9 @@
4344

4445
<body>
4546
<div class="page">
46-
<section class="hero p-3">
47+
<section class="hero p-5">
4748
<div class="container">
4849
<div class="row">
49-
<div class="col">
50-
<img class="logo" src="assets/images/logo/logo-yellow.svg" alt="Frank!Framework logo" />
51-
</div>
5250
<div class="col tar">
5351
<a class="hero__github" id="gh-url" href="https://github.com/frankframework/frankframework" target="_blank" rel="noreferrer">
5452
<svg class="gh-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32.58 31.77"><path d="M16.29,0a16.29,16.29,0,0,0-5.15,31.75c.82.15,1.11-.36,1.11-.79s0-1.41,0-2.77C7.7,29.18,6.74,26,6.74,26a4.36,4.36,0,0,0-1.81-2.39c-1.47-1,.12-1,.12-1a3.43,3.43,0,0,1,2.49,1.68,3.48,3.48,0,0,0,4.74,1.36,3.46,3.46,0,0,1,1-2.18c-3.62-.41-7.42-1.81-7.42-8a6.3,6.3,0,0,1,1.67-4.37,5.94,5.94,0,0,1,.16-4.31s1.37-.44,4.48,1.67a15.41,15.41,0,0,1,8.16,0c3.11-2.11,4.47-1.67,4.47-1.67A5.91,5.91,0,0,1,25,11.07a6.3,6.3,0,0,1,1.67,4.37c0,6.26-3.81,7.63-7.44,8a3.85,3.85,0,0,1,1.11,3c0,2.18,0,3.94,0,4.47s.29.94,1.12.78A16.29,16.29,0,0,0,16.29,0Z"/></svg>
@@ -57,8 +55,9 @@
5755
</div>
5856
</div>
5957
<div class="row mt-1">
60-
<div class="col col--50 col-sm--100">
61-
<h1>A Low-Code Java-based messaging framework to connect your system and application data</h1>
58+
<div class="col">
59+
<img class="logo" src="assets/images/logo/logo-black.svg" alt="Frank!Framework logo" />
60+
<h1>A Low-Code Java-based messaging framework <br> to connect your system and application data</h1>
6261
<a href="https://frank-manual.readthedocs.io/en/latest/gettingStarted/gettingStarted.html"
6362
target="_blank" rel="noreferrer" class="btn mt-1">get started</a>
6463
</div>
@@ -138,25 +137,15 @@ <h2 class="mt-0">Frank!Flow</h2>
138137
</div>
139138
</div>
140139
</section>
141-
<section class="companies p-3">
142-
<div class="container">
143-
<h2>Companies building with the Frank!Framework:</h2>
144-
<div class="row row--gap-xl row--break-sm mb-3">
145-
<div class="icon col">
146-
<img class="contain" src="assets/images/logo/Logo_FRANK_Blok_RGB.svg" alt="Frank block logo" />
147-
</div>
148-
<div class=" icon col">
149-
<img src="assets/images/logo/logo-conduction.svg" alt="conduction logo" />
150-
</div>
151-
<div class=" icon col">
152-
<img src="assets/images/logo/logo-syntouch.png" alt="syntouch logo" />
153-
</div>
154-
</div>
155-
</section>
156140
<footer class="footer p-3">
157141
<div class="container">
158142
<div class="row">
159-
<img class="logo" src="assets/images/logo/logo-black.svg" alt="Frank!Framework logo" />
143+
<div class="col">
144+
<img class="logo" src="assets/images/logo/logo-black.svg" alt="Frank!Framework logo" />
145+
</div>
146+
<div class="col tar">
147+
<a class="github-button" href="https://github.com/frankframework/frankframework" data-color-scheme="no-preference: light; light: light; dark: dark;" data-size="large" data-show-count="true" aria-label="Star frankframework/frankframework on GitHub">Star</a>
148+
</div>
160149
</div>
161150
<div class="row row--gap-xl mt-2">
162151
<div class="col col--33">
@@ -183,6 +172,7 @@ <h2>links</h2>
183172
<div class="col">
184173
Frank!Framework is open source and licensed under the <a href="https://github.com/frankframework/frankframework/blob/master/LICENSE" target="_blank" rel="noreferrer">Apache License 2.0</a>
185174
</div>
175+
186176
</div>
187177
</div>
188178
</footer>
@@ -192,9 +182,10 @@ <h2>links</h2>
192182
</div>
193183
<div class="container tac">
194184
<a href="https://wearefrank.nl" target="_blank" rel="noreferrer"><img alt="WeAreFrank! Logo"
195-
src="assets/images/sponsor-logo/logo-wearefrank.svg" /></a>
185+
src="assets/images/sponsor-logo/Logo_FRANK_RGB.svg" /></a>
196186
</div>
197187
</section>
198188
</div>
189+
<script async defer src="https://buttons.github.io/buttons.js"></script>
199190
</body>
200191
</html>

src/style/components/_button.scss

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
display: inline-block;
33
background-color: $bg-color-dark;
44
padding: 0.8em 2.5em;
5-
color: $bg-color !important;
5+
color: $primary-color !important;
66
text-transform: lowercase;
77
border-radius: 999px;
88
text-decoration: none !important;

src/style/components/_companies.scss

Lines changed: 9 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -5,42 +5,18 @@
55
color: #E1E1E1;
66
}
77

8-
.icon {
9-
background-color: #F8F8F8;
10-
border-radius: 1em;
11-
display: flex;
12-
justify-content: center;
8+
.logos {
139
align-items: center;
14-
flex-direction: column;
15-
filter: grayscale(100%);
16-
width: 100%;
17-
transition: all 200ms;
18-
aspect-ratio: 1 / 1;
19-
20-
&--plus {
21-
img {
22-
position: relative;
23-
max-height: 40%;
24-
margin-top: 1em;
25-
}
26-
}
10+
justify-content: space-between;
11+
}
2712

28-
img {
29-
display: block;
30-
padding-left: 2em;
31-
padding-right: 2em;
32-
max-width: 100%;
33-
}
13+
img {
14+
display: inline-block;
15+
height: auto;
16+
max-width: 5em;
17+
max-height: 4em;
18+
filter: grayscale(100%);
3419

35-
span {
36-
font-weight: bold;
37-
color: #fdc300;
38-
filter: grayscale(20%);
39-
text-align: center;
40-
}
4120

42-
&:hover {
43-
filter: grayscale(0%);
44-
}
4521
}
4622
}

src/style/components/_doorway.scss

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@
1818
right: 0;
1919
top: 0;
2020
transform: translate(30%, -30%) rotate(12deg);
21-
color: $bg-color;
21+
color: $primary-color;
2222
font-weight: bold;
2323
height: 4em;
2424
width: 4em;

0 commit comments

Comments
 (0)