Skip to content

Commit 7589edd

Browse files
committed
Style updates to blog posts and add products page
Signed-off-by: Alex Ellis (OpenFaaS Ltd) <[email protected]>
1 parent b946153 commit 7589edd

File tree

10 files changed

+127
-29
lines changed

10 files changed

+127
-29
lines changed

_data/navigation.yml

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -7,9 +7,9 @@
77
- name: Pricing
88
class: navbar-item
99
link: /pricing/
10-
# - name: Products
11-
# class: navbar-item
12-
# link: /products/
10+
- name: Products
11+
class: navbar-item
12+
link: /products/
1313
- name: Support
1414
class: navbar-item
1515
link: /support/

_includes/landing-page/landing-bottom-cta-community.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@
1919
<div class="column is-6 is-3-desktop">
2020
<a class="cta-button button" href="https://github.com/openfaas/">
2121
<img src="{{ site.baseurl }}/images/openfaas/landing-page-github.png" alt="github">
22-
<span>Contribute on GitHub</span>
22+
<span>Check us out on GitHub</span>
2323
</a>
2424
</div>
2525
</div>

_includes/products-page/products-cards.html

Lines changed: 62 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -4,33 +4,74 @@
44
<div class="cards-wrapper">
55

66
<div class="card has-text-centered is-12">
7-
<div class="card-content">
8-
<div class="card-logo">
9-
<figure class="image is-96x96">
10-
<img src="{{ site.baseurl }}/images/openfaas/logo-whale-round.png" alt="logo">
11-
</figure>
7+
<div class="card-content is-justify-content-space-between">
8+
<div class="">
9+
<div class="card-logo">
10+
<figure class="image is-96x96 m-auto">
11+
<img src="{{ site.baseurl }}/images/openfaas/logo-whale-round.png" alt="logo">
12+
</figure>
13+
</div>
14+
<h3 class="title is-size-12 is-size-8-desktop has-text-grey-darker">
15+
OpenFaaS Standard & Enterprise
16+
</h3>
17+
<subtitle class="is-size-5 mb-3">
18+
A truly portable Serverless platform, built for developers
19+
</subtitle>
20+
<p style="padding-bottom: 20px" class="has-text-weight-light">Originally created in 2016, OpenFaaS is battle-tested technology.</p>
1221
</div>
13-
<h3 class="title is-size-12 is-size-8-desktop has-text-grey-darker">
14-
OpenFaaS Standard & Enterprise
15-
</h3>
16-
<subtitle class="is-size-5 mb-3">
17-
Portable serverless framework for Kubernetes
18-
</subtitle>
19-
<h3 class="title has-text-weight-light is-size-5 is-size-4-desktop">
20-
<p style="padding-bottom: 20px">Build functions and deploy them to production with the power of Kubernetes.</p>
22+
<div>
23+
<a class="button is-primary is-medium" href="https://openfaas.com">openfaas.com</a>
24+
</div>
25+
</div>
26+
</div>
2127

22-
<ul style="line-height: 2.5rem; text-align: left; padding-left: 20px; list-style-type: square;">
23-
<li>Highly scaleable functions scale up with demand or to zero.</li>
24-
<li>Focus on writing code instead of low-level Kubernetes YAML.</li>
25-
<li>Get expert support and assistance from the OpenFaaS team.</li>
26-
<li>Automate tasks, run scheduled jobs and ETL for your data.</li>
27-
<li>Integrate with the API, Helm, ArgoCD or our CLI/Dashboard.</li>
28-
</ul>
29-
</h3>
3028

29+
<div class="card has-text-centered is-12">
30+
<div class="card-content is-justify-content-space-between">
31+
<div class="">
32+
<div class="card-logo">
33+
<figure class="image is-96x96 m-auto">
34+
<img src="{{ site.baseurl }}/images/openfaas/logo-faasd.png" style="border-radius: 30px" alt="logo">
35+
</figure>
36+
</div>
37+
38+
<h3 class="title is-size-12 is-size-8-desktop has-text-grey-darker">
39+
OpenFaaS for Edge
40+
</h3>
41+
<subtitle class="is-size-5 mb-3">
42+
Run functions without Kubernetes
43+
</subtitle>
44+
<p style="padding-bottom: 20px" class="has-text-weight-light">Built for low-maintenance redistribution and packaging of functions.</p>
45+
</div>
46+
<div>
47+
<a class="button is-primary is-medium" href="https://docs.openfaas.com/deployment/edge/">docs.openfaas.com</a>
48+
</div>
3149
</div>
3250
</div>
3351

52+
<!--
53+
<div class="card has-text-centered is-12">
54+
<div class="card-content is-justify-content-space-between">
55+
<div class="">
56+
<div class="card-logo">
57+
<figure class="image is-96x96 m-auto">
58+
<img src="{{ site.baseurl }}/images/openfaas/logo-actuated.png" alt="logo">
59+
</figure>
60+
</div>
61+
<h3 class="title is-size-12 is-size-8-desktop has-text-grey-darker">
62+
Actuated
63+
</h3>
64+
<subtitle class="is-size-5 mb-3">
65+
Fast, secure, and supported self-hosted runners for GitHub Actions &;amp GitLab CI
66+
</subtitle>
67+
<p style="padding-bottom: 20px" class="has-text-weight-light">Built with Firecracker for bare-metal speed and fixed-rate costs.</p>
68+
</div>
69+
<div>
70+
<a class="button is-primary is-medium" href="https://openfaas.com">openfaas.com</a>
71+
</div>
72+
</div>
73+
</div> -->
74+
3475

3576
</div>
3677
</div>

_layouts/page.html

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,10 +3,14 @@
33
---
44

55
<div class="post-page-full">
6+
{% if page.hide_header_image %}
7+
<section class="hero is-medium is-bold cover-solid" {% include blog-page/relative-post-hero.html hide_header_image=page.hide_header_image src=page.image %}>
8+
{% else %}
69
<section class="hero is-medium is-bold cover" {% include blog-page/relative-post-hero.html hide_header_image=page.hide_header_image src=page.image %}>
10+
{% endif %}
711
<div class="hero-body">
812
<div class="container">
9-
<h1 class="title is-size-3 is-size-1-desktop has-text-weight-normal">
13+
<h1 class="title is-size-3 is-size-1-desktop has-text-weight-normal" style="padding-bottom: 10px;">
1014
{{ page.title }}
1115
</h1>
1216
<h2 class="subtitle is-size-4">
@@ -16,7 +20,7 @@ <h2 class="subtitle is-size-4">
1620
</div>
1721
</section>
1822

19-
<section class="hero is-medium">
23+
<section class="hero">
2024
<div class="hero-body hero-blog-content">
2125
<div class="container">
2226
{{ content }}

_sass/openfaas/includes/blog-page/list-posts.scss

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -29,13 +29,13 @@
2929
font-size: 17px;
3030
width: auto;
3131
height: auto;
32-
padding: 15px 30px;
32+
padding: 8px 22px;
3333
}
3434
}
3535

3636
&-date {
3737
font-size: 15px;
38-
color: #ffa74c;
38+
color: #3A4E55;
3939
}
4040
}
4141
}

_sass/openfaas/includes/blog-page/post-page.scss

Lines changed: 50 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -40,6 +40,9 @@
4040

4141
.hero-blog-content {
4242
background: white;
43+
padding-top: 4.5rem;
44+
padding-left: 4.5rem;
45+
padding-right: 4.5rem;
4346

4447
padding-bottom: 0rem;
4548
.content {
@@ -56,6 +59,53 @@
5659
}
5760
}
5861

62+
&.cover-solid {
63+
position: relative;
64+
65+
background-size: cover;
66+
background-repeat: no-repeat;
67+
68+
&:before {
69+
content: '';
70+
71+
position: absolute;
72+
73+
left: 0;
74+
right: 0;
75+
top: 0;
76+
bottom: 0;
77+
78+
background: rgba(58, 95, 233, 1);
79+
}
80+
81+
.hero-body {
82+
.title,
83+
.subtitle {
84+
color: white;
85+
}
86+
87+
.hero-blog-content {
88+
background: white;
89+
padding-top: 4.5rem;
90+
padding-left: 4.5rem;
91+
padding-right: 4.5rem;
92+
93+
padding-bottom: 0rem;
94+
.content {
95+
font-size: 20px;
96+
.post-content {
97+
98+
font-size: 20px;
99+
margin-left: auto;
100+
margin-right: auto;
101+
width: 90%;
102+
}
103+
104+
}
105+
}
106+
}
107+
}
108+
59109
}
60110

61111
.post-tabs-date {

_sass/openfaas/layouts/core.scss

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,3 +2,4 @@
22
// DO NOT ADD SAAS/CSS here! Use only for importing your files
33

44
@import "./default.scss";
5+

_sass/openfaas/variables/sizes.scss

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1 +1,3 @@
11
$padding-step: 12px;
2+
3+
$hero-body-padding-medium: 6rem 4.5rem !default

images/openfaas/logo-actuated.png

7.04 KB
Loading

images/openfaas/logo-faasd.png

30.4 KB
Loading

0 commit comments

Comments
 (0)