Skip to content

Commit 7213401

Browse files
4lb4lb
committed
basic presskit page
1 parent bef6c43 commit 7213401

File tree

6 files changed

+511
-0
lines changed

6 files changed

+511
-0
lines changed

‎public/images/data/key-visual-AW.png

53.3 KB
Loading

‎public/images/data/key-visual-BD.png

68 KB
Loading

‎public/images/press/defguard-presskit.zip

2.1 MB
Binary file not shown.

‎src/data/footer.json

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,11 @@
2222
"external": true,
2323
"link": "https://docs.defguard.net"
2424
},
25+
{
26+
"text": "Press",
27+
"external": false,
28+
"link": "/press/"
29+
},
2530
{
2631
"text": "Contact Us",
2732
"external": true,

‎src/pages/press.astro

Lines changed: 275 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,275 @@
1+
---
2+
import Navigation from "../components/base/Navigation.astro";
3+
import ProductLayout from "../layouts/ProductLayout.astro";
4+
import FlexibleSection from "../components/FlexibleSection.astro";
5+
import HomeSection from "../components/home/HomeSection.astro";
6+
import AstroButton from "../components/AstroButton.astro";
7+
import { Image } from "astro:assets";
8+
import brandAssets from "/public/images/data/key-visual-AW.png";
9+
import contactImage from "/public/images/data/key-visual-BD.png";
10+
const title = "defguard - Press Kit";
11+
const featuredImage =
12+
"github.com/DefGuard/defguard.github.io/raw/main/public/images/product/core/hero-image.png";
13+
const imageWidth = "1920";
14+
const imageHeight = "1080";
15+
const url = "https://defguard.net/press/";
16+
const tags = [
17+
"defguard",
18+
"open source",
19+
"sso & vpn",
20+
"vpn",
21+
"mfa",
22+
"2fa",
23+
"mfa/2fa",
24+
"WireGuard®",
25+
"ldap",
26+
"openldap",
27+
"postgresql",
28+
"postgres",
29+
"openid",
30+
"totp",
31+
"webauthn",
32+
"opensense",
33+
"freebsd",
34+
"rust",
35+
"secure",
36+
"desktop client",
37+
"desktop",
38+
"yubikey",
39+
"teonite",
40+
"docker",
41+
"kubernetes",
42+
"k8s",
43+
"press",
44+
"media",
45+
"press kit",
46+
"brand assets",
47+
"company information",
48+
"press release",
49+
"media contact",
50+
];
51+
---
52+
53+
<ProductLayout
54+
title={title}
55+
featuredImage={featuredImage}
56+
imageWidth={imageWidth}
57+
imageHeight={imageHeight}
58+
url={url}
59+
tags={tags}
60+
>
61+
<Navigation activeSlug="/press" />
62+
63+
<main id="home-page">
64+
65+
<HomeSection variant="white" contentId="press-header">
66+
<h1>defguard Press Kit</h1>
67+
<p>
68+
Welcome to the defguard press resource center. Find everything you need to accurately report on our open-source zero-trust enterprise VPN solution.
69+
</p>
70+
<div class="link-track">
71+
<AstroButton
72+
link={{
73+
href: "/images/press/defguard-presskit.zip",
74+
target: "_self",
75+
}}
76+
text="Download Press Kit"
77+
/>
78+
<!-- <AstroButton
79+
link={{
80+
href: "mailto:[email protected]",
81+
target: "_self",
82+
}}
83+
text="Contact Press Team"
84+
/> -->
85+
</div>
86+
</HomeSection>
87+
88+
<FlexibleSection
89+
title="Brand Assets"
90+
id="brand-assets"
91+
variant="gray"
92+
theme="light"
93+
>
94+
<div slot="left">
95+
<Image src={brandAssets} alt="defguard brand assets" />
96+
</div>
97+
98+
<div slot="right">
99+
<p>
100+
Download official defguard logos, screenshots, and brand assets for use in your publications. All assets are available in high-resolution formats suitable for both print and digital media.
101+
</p>
102+
<p>
103+
<strong>Usage Guidelines:</strong> When using our brand assets, please maintain the integrity of the design. Do not modify, distort, or alter the colors of our logo. Ensure adequate spacing around the logo and maintain its proportions when resizing.
104+
</p>
105+
<div class="learn-more">
106+
<a href="/images/press/defguard-presskit.zip" class="learn-more-link">Download Press Kit</a>
107+
</div>
108+
</div>
109+
</FlexibleSection>
110+
111+
<FlexibleSection
112+
title="Company Information"
113+
id="company-information"
114+
variant="white"
115+
theme="light"
116+
>
117+
<div slot="left">
118+
<p>
119+
defguard is developed by <a href="https://teonite.com">teonite</a>, a deep-tech software development company with over 15 years of experience building secure, high-performance systems for demanding environments.
120+
</p>
121+
<p>
122+
<strong>Our Mission:</strong> To provide organizations with a comprehensive, self-hosted solution for secure remote access that prioritizes privacy, security, and control.
123+
</p>
124+
</div>
125+
126+
<div slot="right">
127+
<h3>Key Facts</h3>
128+
<ul>
129+
<li><strong>Founded:</strong> 2023 (defguard), 2007 (teonite)</li>
130+
<li><strong>Headquarters:</strong> Szczecin, Poland</li>
131+
<li><strong>Product Type:</strong> Open-source identity and access management platform</li>
132+
<li><strong>Core Technology:</strong> WireGuard® with native MFA integration</li>
133+
<li><strong>Leadership:</strong> Founded by a team of security and infrastructure experts</li>
134+
</ul>
135+
<p>
136+
defguard is designed for organizations that require enterprise-grade security while maintaining complete control over their data and infrastructure.
137+
</p>
138+
</div>
139+
</FlexibleSection>
140+
141+
<FlexibleSection
142+
title="Press Contact"
143+
id="press-contact"
144+
variant="gray"
145+
theme="light"
146+
>
147+
<div slot="left">
148+
<p>
149+
For media inquiries, interview requests, or additional information about defguard, please contact our press team:
150+
</p>
151+
<div class="learn-more">
152+
<a href="mailto:[email protected]" class="learn-more-link">Contact Us</a>
153+
</div>
154+
</div>
155+
156+
<div slot="right">
157+
<Image src={contactImage} alt="contact information" />
158+
</div>
159+
</FlexibleSection>
160+
161+
</main>
162+
</ProductLayout>
163+
164+
<style lang="scss" is:global>
165+
#press-header {
166+
padding-bottom: page-spacing(100px);
167+
padding-top: 50px;
168+
169+
& > p {
170+
@include typography(paragraph);
171+
padding-bottom: 8px;
172+
max-width: 800px;
173+
margin: 0 auto;
174+
text-align: center;
175+
}
176+
177+
h1 {
178+
color: var(--text-body-primary);
179+
padding-bottom: 40px;
180+
max-width: 996px;
181+
text-align: center;
182+
text-wrap: balance;
183+
@include typography(title);
184+
}
185+
186+
.link-track {
187+
width: 100%;
188+
display: flex;
189+
flex-flow: row;
190+
align-items: center;
191+
justify-content: center;
192+
gap: 16px;
193+
padding: 40px 0px;
194+
195+
@include break-down(sm) {
196+
flex-flow: column;
197+
align-items: center;
198+
}
199+
}
200+
201+
}
202+
203+
#home-page {
204+
--page-spacing-factor: 0.5;
205+
@include break-up(lg) {
206+
--page-spacing-factor: 1;
207+
}
208+
209+
.flexible-content {
210+
padding-top: page-spacing(80px);
211+
padding-bottom: page-spacing(80px);
212+
213+
.section-title {
214+
@include typography(section); // Change back to section typography for main sections
215+
border-bottom: 1px solid var(--text-body-primary);
216+
padding-bottom: 1rem;
217+
margin-bottom: 2rem;
218+
}
219+
220+
h3 {
221+
@include typography(h3);
222+
margin-top: 0;
223+
margin-bottom: 1rem;
224+
}
225+
226+
p {
227+
@include typography(paragraph);
228+
margin-bottom: 1.5rem;
229+
}
230+
231+
.learn-more {
232+
margin-bottom: 1.5rem;
233+
}
234+
235+
.learn-more-link {
236+
display: inline-block;
237+
padding: 0.75rem 1.5rem;
238+
background-color: var(--primary-button-bg, #0C8CE0);
239+
color: var(--primary-button-text, white);
240+
border-radius: 6px;
241+
font-weight: 600;
242+
text-decoration: none;
243+
transition: background-color 0.2s ease-in-out;
244+
245+
&:hover {
246+
background-color: var(--primary-button-hover, #0A7BC5);
247+
}
248+
}
249+
250+
ul {
251+
margin: 0 0 1.5rem 0;
252+
padding-left: 20px;
253+
254+
li {
255+
@include typography(paragraph);
256+
margin-bottom: 0.5rem;
257+
}
258+
}
259+
260+
em {
261+
font-size: 0.9em;
262+
opacity: 0.8;
263+
}
264+
265+
.column {
266+
@media (max-width: 768px) {
267+
&.right-column {
268+
margin-top: 1rem;
269+
}
270+
}
271+
}
272+
}
273+
274+
}
275+
</style>

0 commit comments

Comments
 (0)