Skip to content

Commit a4e7eea

Browse files
committed
Adds teaser for dependency firewall
Signed-off-by: Sebastian Kawelke <sebastian.kawelke@l3montree.com>
1 parent e544edf commit a4e7eea

File tree

10 files changed

+1335
-23
lines changed

10 files changed

+1335
-23
lines changed

components.json

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,12 +10,15 @@
1010
"cssVariables": true,
1111
"prefix": ""
1212
},
13+
"iconLibrary": "lucide",
1314
"aliases": {
1415
"components": "@/components",
1516
"utils": "@/lib/utils",
1617
"ui": "@/components/ui",
1718
"lib": "@/lib",
1819
"hooks": "@/hooks"
1920
},
20-
"iconLibrary": "lucide"
21-
}
21+
"registries": {
22+
"@react-bits": "https://reactbits.dev/r/{name}.json"
23+
}
24+
}

package-lock.json

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

package.json

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -50,6 +50,7 @@
5050
"nextra": "3.3.1",
5151
"nextra-theme-docs": "3.3.1",
5252
"p-limit": "^6.2.0",
53+
"postprocessing": "^6.38.0",
5354
"radix-ui": "^1.4.3",
5455
"react": "^18.3.1",
5556
"react-dom": "^18.3.1",
@@ -63,10 +64,12 @@
6364
"sharp": "^0.34.5",
6465
"tailwind-merge": "^3.3.1",
6566
"tailwindcss-animate": "^1.0.7",
67+
"three": "^0.181.2",
6668
"winston": "^3.17.0"
6769
},
6870
"devDependencies": {
6971
"@types/node": "24.0.15",
72+
"@types/three": "^0.181.0",
7073
"autoprefixer": "^10.4.22",
7174
"eslint-config-next": "^14.2.33",
7275
"eslint-plugin-prettier": "^5.4.1",

src/components/top-level-pages/FeatureSection.tsx

Lines changed: 19 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -4,23 +4,25 @@ import { Heading, Subheading } from './text'
44

55
export default function FeatureSection() {
66
return (
7-
<div className="overflow-hidden">
8-
<Container className="p-36">
9-
<Subheading className="text-l3-400 sm:text-center">
10-
For your Code & Dependencies
11-
</Subheading>
12-
<Heading as="h2" className="mt-2 text-white sm:text-center">
13-
Central Vulnerability Management
14-
</Heading>
15-
<div className="flex flex-col items-center justify-center">
16-
<Screenshot
17-
width={1216}
18-
height={702}
19-
src="/screenshots/management.png"
20-
className="mt-8 h-auto sm:mt-16 sm:w-[76rem]"
21-
/>
22-
</div>
23-
</Container>
7+
<div className="py-28">
8+
<div className="mx-12 mt-2 overflow-hidden rounded-2xl bg-bgSecondary py-16 max-sm:mx-4 max-sm:py-10">
9+
<Container className="">
10+
<Subheading className="text-l3-400 sm:text-center">
11+
For your Code & Dependencies
12+
</Subheading>
13+
<Heading as="h2" className="mt-2 text-white sm:text-center">
14+
Central Vulnerability Management
15+
</Heading>
16+
<div className="flex flex-col items-center justify-center">
17+
<Screenshot
18+
width={1216}
19+
height={702}
20+
src="/screenshots/management.png"
21+
className="mt-8 h-auto sm:mt-16 sm:w-[76rem]"
22+
/>
23+
</div>
24+
</Container>
25+
</div>
2426
</div>
2527
)
2628
}
Lines changed: 62 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,62 @@
1+
import { CalendarDaysIcon, HandRaisedIcon } from '@heroicons/react/24/outline'
2+
import { Container } from './container'
3+
import Lightning from './lightning'
4+
import { Badge } from '../ui/badge'
5+
import Link from 'next/link'
6+
import { Button } from './button'
7+
8+
export default function FirewallSection() {
9+
return (
10+
<Container className="pb-36">
11+
<div className="relative isolate overflow-hidden rounded-2xl py-16 ring-1 ring-white/15 sm:py-24">
12+
<div className="absolute inset-0 -z-10 max-sm:opacity-30">
13+
<Lightning
14+
hue={39}
15+
xOffset={-0.1}
16+
speed={0.5}
17+
intensity={0.5}
18+
size={1.5}
19+
backgroundColor="#0D1017"
20+
/>
21+
</div>
22+
<div className="mx-auto max-w-7xl px-6 lg:px-16">
23+
<div className="mx-auto grid max-w-2xl grid-cols-1 gap-x-8 gap-y-16 lg:max-w-none lg:grid-cols-3">
24+
<div className="max-w-xl lg:max-w-lg">
25+
<Badge variant="upcoming">
26+
Upcoming Feature 🎉
27+
</Badge>
28+
<h2 className="mt-4 text-4xl font-semibold tracking-tight text-white">
29+
Dependency Firewall
30+
</h2>
31+
<p className="mt-4 text-base text-gray-300">
32+
DevGuard will soon introduce a Dependency
33+
Firewall, blocking the install of known
34+
malicious packages. It will support npm and GO.
35+
</p>
36+
</div>
37+
<div></div>
38+
<dl className="flex items-center justify-end">
39+
<div className="flex flex-col items-end text-right">
40+
<div className="rounded-md bg-white/5 p-2 ring-1 ring-white/10">
41+
<HandRaisedIcon
42+
aria-hidden="true"
43+
className="size-6 text-white"
44+
/>
45+
</div>
46+
<dt className="mt-4 text-base font-semibold text-white">
47+
Prevent Supply Chain Attacks
48+
</dt>
49+
<dd className="mt-2 text-sm/6 text-gray-400">
50+
Prevent attacks like the recent Shai Hulud
51+
incident. Protect your software supply chain
52+
by blocking malicious dependencies before
53+
they reach your codebase.
54+
</dd>
55+
</div>
56+
</dl>
57+
</div>
58+
</div>
59+
</div>
60+
</Container>
61+
)
62+
}
Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
import Link from 'next/link'
2+
import { Container } from './container'
3+
import { GridScan } from './grid-scan'
4+
import { Button } from './button'
5+
6+
export default function GridScanSection() {
7+
return (
8+
<div className="pb-28">
9+
<Container className="">
10+
<div className="relative h-[500px] w-full overflow-hidden rounded-xl bg-bgSecondary/50 ring-1 ring-inset ring-white/10">
11+
<GridScan
12+
sensitivity={0.55}
13+
lineThickness={1}
14+
linesColor="#FCCE5C"
15+
gridScale={0.1}
16+
scanColor="#FCC743"
17+
scanOpacity={0.3}
18+
enablePost
19+
bloomIntensity={0.6}
20+
chromaticAberration={0.0}
21+
noiseIntensity={0.01}
22+
/>
23+
<div className="absolute inset-0 z-10 flex flex-col items-center justify-center">
24+
<h2 className="text-balance text-center text-4xl font-semibold tracking-tight text-white sm:text-5xl">
25+
X-Ray your Dependencies
26+
</h2>
27+
<p className="mx-auto mt-6 max-w-xl text-pretty text-center text-lg/8 text-gray-200">
28+
DevGuard provides you with insights into your
29+
dependencies. Inlcuding licenses, the location in
30+
your dependency tree, OpenSSF Scorecard data, GitHub
31+
Stars/ Forks/ Issues and more.
32+
</p>
33+
<div className="mt-10 flex items-center justify-center gap-x-6">
34+
<Link
35+
href="https://app.devguard.org/login"
36+
target="_blank"
37+
rel="noopener noreferrer"
38+
>
39+
<Button
40+
variant="default"
41+
data-umami-event="look-at-devguard"
42+
>
43+
Try DevGuard
44+
</Button>
45+
</Link>
46+
</div>
47+
</div>
48+
</div>
49+
</Container>
50+
</div>
51+
)
52+
}

src/components/top-level-pages/ThreeColumnBentoSection.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import { Subheading, Heading } from './text'
44

55
export default function ThreeColumnBentoSection() {
66
return (
7-
<Container className="pb-36">
7+
<Container className="pb-4">
88
<Subheading className="text-l3-400">
99
Insights & Innovation
1010
</Subheading>

0 commit comments

Comments
 (0)