Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Revert "Added the announcement banner & updated the workshop page" #338

Merged
merged 4 commits into from
Dec 8, 2023
Merged

Revert "Added the announcement banner & updated the workshop page" #338

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
5d76db9
Revert "Added workshops to page"
taras Dec 8, 2023
5e75c07
Revert "Added emoji and padding"
taras Dec 8, 2023
fdbad5c
Revert "Added padding"
taras Dec 8, 2023
2f6729f
Revert "Added the announcement banner"
taras Dec 8, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 0 additions & 3 deletions legacy/.vscode/settings.json
View file
Open in desktop

This file was deleted.

25 changes: 2 additions & 23 deletions legacy/src/components/navbar/navbar.css.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,8 +1,9 @@
import vars, { laptopQuery, desktopQuery, darkThemeQuery, lightThemeQuery, colorValues } from '../../styles/frontside-theme.css';
import vars, { laptopQuery, desktopQuery, darkThemeQuery, colorValues } from '../../styles/frontside-theme.css';
import { style, globalStyle, styleVariants } from '@vanilla-extract/css';
import { pageWrap } from '../../styles/page.css';
import gradientDecor from '../../img/q3-2021/button-gradient.png';
import { boldCaps, fillBlueDashWhite, headingMd, headingSm, textBlue, textBlueDashWhite, textSm, textXs } from '../../styles/typography.css';
import { calc } from "@vanilla-extract/css-utils";

export const navWrap = style([pageWrap, {
display: 'flex',
Expand Down Expand Up @@ -199,25 +200,3 @@ export const projectLink = style({
display: 'flex',
flexFlow: 'row nowrap',
});

export const announcementsContainer = style({
display: "flex",
justifyContent: "center",
alignItems: "center",
backgroundColor: vars.colors.violet,
color: vars.colors.white,
textAlign: "center",
fontSize: vars.fontSize.sm,
paddingLeft: vars.space['sm'],
paddingRight: vars.space['sm'],
})

export const announcementsLink = style({
color: vars.colors.white,
textDecoration: 'underline'
})

export const announcementsEmoji = style({
fontSize: vars.fontSize.xl,
paddingRight: vars.space['2xs']
})
53 changes: 21 additions & 32 deletions legacy/src/components/navbar/navbar.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,9 +8,6 @@ import {
logoSVGFill,
linksGroup,
homeLink,
announcementsContainer,
announcementsLink,
announcementsEmoji
} from './navbar.css';
import ProjectSelect from './project-select';

Expand All @@ -23,37 +20,29 @@ const NavItems = [

export const Navbar = () => {
return (
<>
<div className={announcementsContainer}>
<span className={announcementsEmoji}>✨</span>
<p>
Few seats left for our <strong>Advanced Backstage Plugin Development</strong> workshop on December 7th. <a href="/workshops/advanced-backstage-plugin-development" className={announcementsLink}>Secure your seat today!</a>
</p>
</div>
<nav className={navWrap}>
<Link to="/" className={logoMargin}>
<Logo />
<nav className={navWrap}>
<Link to="/" className={logoMargin}>
<Logo />
</Link>
<div className={linksGroup}>
<Link to={NavItems[0].url} className={homeLink}>
{NavItems[0].text}
</Link>
<Link to={NavItems[1].url} className={navLink}>
{NavItems[1].text}
</Link>
<div className={linksGroup}>
<Link to={NavItems[0].url} className={homeLink}>
{NavItems[0].text}
</Link>
<Link to={NavItems[1].url} className={navLink}>
{NavItems[1].text}
</Link>
<Link to={NavItems[2].url} className={navLink}>
{NavItems[2].text}
</Link>
<ProjectSelect />
<Link to={NavItems[3].url} className={navLink}>
{NavItems[3].text}
</Link>
</div>
<Link to="/contact" className={contactButton}>
Contact
<Link to={NavItems[2].url} className={navLink}>
{NavItems[2].text}
</Link>
</nav>
</>
<ProjectSelect />
<Link to={NavItems[3].url} className={navLink}>
{NavItems[3].text}
</Link>
</div>
<Link to="/contact" className={contactButton}>
Contact
</Link>
</nav>
);
};

Expand Down
75 changes: 34 additions & 41 deletions routes/advanced-backstage-plugin-development-route.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,14 +24,6 @@ export function pluginWorkshopRoute(): JSXHandler {
author: "Frontside",
});

const signUpButton = <a
id="signup-for-workshop-top"
href="https://buy.stripe.com/bIY6se1t9bW77AcbII"
class="inline-block text-center text-xl m-auto w-full md:w-auto rounded-md bg-blue-primary px-14 py-7 text-sm font-semibold text-white shadow-blue-box hover:ring hover:outline-indigo-600"
>
Sign up for December 7th workshop
</a>;

return (
<AppHtml>
<article class="pt-14 text-blue-primary">
Expand All @@ -54,7 +46,20 @@ export function pluginWorkshopRoute(): JSXHandler {
Join a workshop loaded with best practices, insights, and
advanced engineering.
</p>
{signUpButton}
<a
data-tf-popup="fNHxMLVS"
data-tf-opacity="100"
data-tf-size="100"
data-tf-iframe-props="title=Advanced Plugin Develop Sign up Form"
data-tf-transitive-search-params
data-tf-medium="snippet"
id="signup-for-workshop-top"
href="#"
class="inline-block text-center text-xl m-auto w-full md:w-auto rounded-md bg-blue-primary px-14 py-7 text-sm font-semibold text-white shadow-blue-box hover:ring hover:outline-indigo-600"
>
Signup for Waitlist Today
</a>
<script defer src="//embed.typeform.com/next/embed.js"></script>
</div>
<img
class="w-3/5 md:w-2/5 lg:w-full m-auto mt-16 md:order-1"
Expand Down Expand Up @@ -775,38 +780,26 @@ export function pluginWorkshopRoute(): JSXHandler {
</div>
</div>
</section>
<section class="mt-32">
<div class="xl:w-2/3 mx-auto">
<H2 class="text-center mb-12">Upcoming Workshops</H2>
<div class="flex flex-col md:flex-row md:flex-col">
<div class="p-4 md:w-1/2">
<p class="text-center text-lg">
Join us to elevate your Backstage expertise and transform into a
proficient plugin developer. Discover, learn, and kick-start your
path to master the art of crafting sophisticated plugins for
Backstage in this comprehensive, hands-on workshop.
</p>
</div>
<div class="md:w-1/2 px-4 justify-self-center">
<div class="border-1 rounded-lg rounded-l-none border-l-4 border-slate-200 border-l-blue-300 p-3 flex flex-col ring-blue-500 pb-5" itemprop="event" itemscope itemtype="https://schema.org/EducationalEvent">
<h3 class="mb-2" itemprop="name">
<a class="text-xl font-bold" href="https://buy.stripe.com/bIY6se1t9bW77AcbII" itemprop="url">Advanced Plugin Development</a>
</h3>
<div class="flex mb-4">
<a class="text-lg pt-1" target="_blank" href="https://www.worldtimebuddy.com/?qm=1&lid=5&h=5&date=2023-12-7&sln=10-17&hf=1&c=1899">
<meta itemprop="startDate" content="2023-12-07T15:00:00" />
Dec 7th, 2023
</a>
<span itemprop="location" class="text-lg ring ring-neutral-100 rounded-md py-0.5 px-2 ml-5">Remote</span>
</div>
<div itemprop="offers" itemscope itemtype="https://schema.org/AggregateOffer">
<meta itemprop="priceCurrency" content="USD" />
<span class="mr-2" itemprop="lowPrice" content="499">$499</span> <a href="https://buy.stripe.com/bIY6se1t9bW77AcbII" itemprop="offers" class="btn-contact bg-contain rounded-lg text-white border p-2 uppercase font-bold text-sm md:text-base order-2">Buy ticket</a>
</div>
</div>
</div>
</div>
</div>
<section class="flex flex-col items-center mt-32 px-8">
<p class="prose text-center">
Join us to elevate your Backstage expertise and transform into a
proficient plugin developer. Discover, learn, and kick-start your
path to master the art of crafting sophisticated plugins for
Backstage in this comprehensive, hands-on workshop.
</p>
<a
data-tf-popup="fNHxMLVS"
data-tf-opacity="100"
data-tf-size="100"
data-tf-iframe-props="title=Advanced Plugin Develop Sign up Form"
data-tf-transitive-search-params
data-tf-medium="snippet"
id="signup-for-workshop-bottom"
href="#"
class="inline-block mt-16 text-center text-xl m-auto w-full md:w-auto rounded-md bg-blue-primary px-14 py-7 text-sm font-semibold text-white shadow-blue-box hover:ring hover:outline-indigo-600"
>
Signup for the Waitlist Today
</a>
</section>
</article>
</AppHtml>
Expand Down
Loading