Skip to content

Commit

Permalink
add google analytics
Browse files Browse the repository at this point in the history
  • Loading branch information
@jsladerman
jsladerman committed Oct 24, 2024
1 parent c159a3d commit 967332a
Show file tree
Hide file tree
Showing 3 changed files with 155 additions and 79 deletions.
37 changes: 22 additions & 15 deletions pages/_document.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -41,6 +41,17 @@ class MyDocument extends Document {
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/@docsearch/css@3"
/>
{/* <!-- Google Tag Manager --> */}
<script
dangerouslySetInnerHTML={{
__html: `(function(w,d,s,l,i){w[l]=w[l]||[];
w[l].push({'gtm.start':new Date().getTime(),event:'gtm.js'});
var f=d.getElementsByTagName(s)[0],j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';
j.async=true;j.src='https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f)
;})(window,document,'script','dataLayer','${process.env.NEXT_PUBLIC_GA_ID}');`,
}}
/>
{/* <!-- End Google Tag Manager --> */}
<script
id="Cookiebot"
src="https://consent.cookiebot.com/uc.js"
Expand All @@ -49,23 +60,19 @@ class MyDocument extends Document {
type="text/javascript"
data-widget-position="bottom-right"
/>
<script
async
src={`https://www.googletagmanager.com/gtag/js?id=${process.env.NEXT_PUBLIC_GA_ID}`}
/>
<script
dangerouslySetInnerHTML={{
__html: `window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('consent', 'default', {ad_storage:'denied', analytics_storage:'denied'});
gtag('set', 'ads_data_redaction', true);
gtag('set', 'url_passthrough', true);
gtag('js', new Date());
gtag('config', '${process.env.NEXT_PUBLIC_GA_ID}');`,
}}
/>
</Head>
<body>
{/* <!-- Google Tag Manager (noscript) --> */}
<noscript>
<iframe
title="Google Tag Manager"
src={`https://www.googletagmanager.com/ns.html?id=${process.env.NEXT_PUBLIC_GA_ID}`}
height="0"
width="0"
style={{ display: 'none', visibility: 'hidden' }}
/>
</noscript>
{/* <!-- End Google Tag Manager (noscript) --> */}
<Main />
<NextScript />
</body>
Expand Down
147 changes: 83 additions & 64 deletions pages/kubecon.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ import styled from 'styled-components'

import { TextColumnWithIcon } from '@src/components/custom-page/MultiColumnText'
import { FooterVariant } from '@src/components/FooterFull'
import { KubeconHeader } from '@src/components/Kubecon'
import { KubeconHeader, handleDownloadICS } from '@src/components/Kubecon'
import { StandardPageWidth } from '@src/components/layout/LayoutHelpers'
import { ImpactCardSection } from '@src/components/page-sections/ImpactCardSection'
import {
Expand All @@ -23,7 +23,7 @@ import { propsWithGlobalSettings } from '@src/utils/getGlobalProps'
export default function KubeCon() {
return (
<div className="bg-[#0F1116]">
<div className="relative">
<div className="relative opacity-60 transition-opacity lg:opacity-100">
<div
css={`
position: absolute;
Expand All @@ -36,6 +36,22 @@ export default function KubeCon() {
height: 200px;
`}
/>
<div
css={`
position: absolute;
top: 200px;
left: 50%;
transform: translateX(-50%);
border-radius: 50%;
background: #7075f5;
filter: blur(178px);
width: 150px;
height: 150px;
@media (max-width: 768px) {
display: none;
}
`}
/>
<div
css={`
position: absolute;
Expand All @@ -53,72 +69,76 @@ export default function KubeCon() {
className="absolute left-1/2 top-[400px] -translate-x-1/2"
/>
</div>
<div className="flex flex-col items-center gap-xxlarge py-xxxxxxlarge">
<KubeconHeader />
<div className="flex max-w-3xl flex-col items-center gap-small text-center">
<Hero1>Meet us at KubeCon</Hero1>
<Body1 $color="text-light">
Join Plural at KubeCon North America 2024 in Salt Lake City, UT.
We're excited to showcase our latest solutions that empower
organizations to streamline their Kubernetes deployments and
operations.
</Body1>
</div>
<Button
large
primary
rel="noopener noreferrer"
target="_blank"
as={Link}
href="/contact-sales"
className="mt-medium w-fit"
>
Book a demo
</Button>
</div>
<WhereToFindUsSection>
<div className="flex flex-col items-center">
<div className="flex flex-col items-center py-xlarge text-center">
<OverlineLabel>Where to find us</OverlineLabel>
<Hero2>
Visit our booth —{' '}
<span className="text-text-primary-accent">R23</span>
</Hero2>
<Body1
$color="text-light"
className="mt-small"
>
Booth R23 is near the CNCF project pavilion, across from the game
zone.
<StandardPageWidth>
<div className="flex flex-col items-center gap-xxlarge py-xxxxxxlarge">
<KubeconHeader />
<div className="flex max-w-3xl flex-col items-center gap-small text-center">
<Hero1>Meet us at KubeCon</Hero1>
<Body1 $color="text-light">
Join Plural at KubeCon North America 2024 in Salt Lake City, UT.
We're excited to showcase our latest solutions that empower
organizations to streamline their Kubernetes deployments and
operations.
</Body1>
</div>
<Image
className="w-[500px] rounded-large border border-solid border-[#ffffff99]"
src="/images/kubecon/booths-map.jpg"
alt="Booth map"
width={2366}
height={1432}
/>
<div className="flex flex-col gap-xlarge pb-large pt-xxlarge lg:flex-row">
<TextColumnWithIcon
heading="Experience live demos"
bodyText="See Plural in action and explore our platform's capabilities"
icon="StackRun"
<Button
large
primary
rel="noopener noreferrer"
target="_blank"
as={Link}
href="/contact-sales"
className="mt-medium w-fit"
>
Book a demo
</Button>
</div>
</StandardPageWidth>
<WhereToFindUsSection>
<StandardPageWidth>
<div className="flex flex-col items-center">
<div className="flex flex-col items-center py-xlarge text-center">
<OverlineLabel>Where to find us</OverlineLabel>
<Hero2>
Visit our booth —{' '}
<span className="text-text-primary-accent">R23</span>
</Hero2>
<Body1
$color="text-light"
className="mt-small"
>
Booth R23 is near the CNCF project pavilion, across from the
game zone.
</Body1>
</div>
<Image
className="w-[500px] rounded-large border border-solid border-[#ffffff99]"
src="/images/kubecon/booths-map.jpg"
alt="Booth map"
width={2366}
height={1432}
/>
<div className="pt-xxlarge">
<div className="flex flex-col gap-xlarge pb-large pt-xxlarge lg:flex-row">
<TextColumnWithIcon
heading="Experience live demos"
bodyText="See Plural in action and explore our platform's capabilities"
icon="StackRun"
/>
<div className="pt-xxlarge">
<TextColumnWithIcon
heading="Meet our experts"
bodyText="Chat with our team and Founders, about your Kubernetes management challenges — and how we can help!"
icon="People"
/>
</div>
<TextColumnWithIcon
heading="Meet our experts"
bodyText="Chat with our team and Founders, about your Kubernetes management challenges — and how we can help!"
icon="People"
heading="Exclusive swag"
bodyText="Swing by and pick up Plural swag we made exclusively for KubeCon 2024"
icon="MagicWand"
/>
</div>
<TextColumnWithIcon
heading="Exclusive swag"
bodyText="Swing by and pick up Plural swag we made exclusively for KubeCon 2024"
icon="MagicWand"
/>
</div>
</div>
</StandardPageWidth>
</WhereToFindUsSection>
<StandardPageWidth>
<div className="flex w-full flex-col items-center py-xxxxlarge">
Expand Down Expand Up @@ -168,10 +188,9 @@ export default function KubeCon() {
<Button
large
primary
as={Link}
href="#"
className="w-fit"
startIcon={<CalendarIcon />}
onClick={handleDownloadICS}
>
Add session to calendar
</Button>
Expand Down Expand Up @@ -273,7 +292,7 @@ export const getStaticProps = async () => {
})
}

const WhereToFindUsSection = styled(StandardPageWidth)(({ theme }) => {
const WhereToFindUsSection = styled.div(({ theme }) => {
const bgGradient = `linear-gradient(180deg, #0E1015 0%, rgba(14, 16, 21, 0.0) 50%, #0E1015 100%),
radial-gradient(81.85% 81.85% at 50% 18.15%, #0E1015 0%, rgba(14, 16, 21, 0.55) 100%)`

Expand Down
50 changes: 50 additions & 0 deletions src/components/Kubecon.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -58,3 +58,53 @@ export function KubeconHeader() {
</svg>
)
}

export const handleDownloadICS = () => {
const icsContent = `
BEGIN:VCALENDAR
VERSION:2.0
PRODID:-//Plural//EN
BEGIN:VTIMEZONE
TZID:America/Denver
LAST-MODIFIED:20240422T053451Z
TZURL:https://www.tzurl.org/zoneinfo-outlook/America/Denver
X-LIC-LOCATION:America/Denver
BEGIN:DAYLIGHT
TZNAME:MDT
TZOFFSETFROM:-0700
TZOFFSETTO:-0600
DTSTART:19700308T020000
RRULE:FREQ=YEARLY;BYMONTH=3;BYDAY=2SU
END:DAYLIGHT
BEGIN:STANDARD
TZNAME:MST
TZOFFSETFROM:-0600
TZOFFSETTO:-0700
DTSTART:19701101T020000
RRULE:FREQ=YEARLY;BYMONTH=11;BYDAY=1SU
END:STANDARD
END:VTIMEZONE
BEGIN:VEVENT
DTSTAMP:20241024T194031Z
UID:1729798817923
DTSTART;TZID=America/Denver:20241115T165500
DTEND;TZID=America/Denver:20241115T173000
SUMMARY:Navigating the Future: Exploring the Latest in Kubernetes Dashboard Development - Marcin Maciaszczyk & Sebastian Florek\\, Plural
URL:https://events.linuxfoundation.org/kubecon-cloudnativecon-north-america/program/schedule/
DESCRIPTION:Join us for an insightful presentation on the latest updates from the Kubernetes SIG-UI\\, focusing on the evolution of the Kubernetes Dashboard project. Dive into a comprehensive overview of key changes\\, enhancements\\, and advancements\\, including a detailed exploration of the project's new architecture. Gain valuable insights into how these developments shape the future of Kubernetes management and user experience. Whether you're a seasoned Kubernetes user or new to the ecosystem\\, this presentation promises to provide valuable perspectives on the cutting-edge developments in Kubernetes Dashboard.
LOCATION:Salt Palace | Level 3| 355 B
END:VEVENT
END:VCALENDAR
`.trim()

const blob = new Blob([icsContent], { type: 'text/calendar' })
const url = URL.createObjectURL(blob)
const a = document.createElement('a')

a.href = url
a.download = 'kubecon-session.ics'
document.body.appendChild(a)
a.click()
document.body.removeChild(a)
URL.revokeObjectURL(url)
}

0 comments on commit 967332a

Please sign in to comment.