open-vault/website/pages/style.css
Alex Carpenter 927f46d5d7
Homepage redesign (#13159)
* homepage setup

* [Homepage] `<IoHomeHero />` component (#13160)

* init <Hero /> component

* adds loading animation

* updates variable naming

* makes index optional

* Update hero-pattern.svg

* prefix with IoHome

* updates usage

* [Homepage] `<IoHomePreFooter />` component (#13182)

* adds <IoHomePreFooter />

* adds interfaces

* [Homepage] `<IoHomeHero />` component (#13160)

* init <Hero /> component

* adds loading animation

* updates variable naming

* makes index optional

* Update hero-pattern.svg

* prefix with IoHome

* updates usage

* adds <IoHomePreFooter />

* adds interfaces

* adds key

* [Homepage] `<IoHomeCallToAction />` component (#13164)

* adding brand to cta

* cleanup homepage

* [Homepage] `<IoHomeVideo />` component (#13161)

* init <Video /> component

* adjusts sizing and border radius

* responsive styling

* fix hover svg gitter

* adjust play icon sizing

* include temp thumbnail

* dialog implementation

* conditionally display person and show helpers

* rename component

* updates dialog naming

* add homepage styling

* simplify background color

* page level styling

* [Homepage] `<IoHomeCaseStudies />` (#13190)

* adds <IoHomeCaseStudies />

* adds interface

* animate gradient

* update min-heights

* Homepage `<IoHomeCard />` component (#13151)

* init <Card /> component

* fixes heading color

* adds product logos and hover styles

* update naming

* simplifies inset spacing

* use ternary and add key

* removes repo link

* removes need for camelCase package

* adds keys

* adds in practice cards

* adds in practice background

* use case cards

* update min col sizing

* adds feature component (#13203)

* fixes card hover bug

* [Homepage] connect homepage to dato content (#13227)

* connect homepage to dato

* Check for internal link

* fix return types

* adds youtube video

* hook up meta tags and chunk cards

* removes chunking

* fix ts return

* fix prop naming

* fix return type

* mobile sizing adjustments

* [Homepage] Usecase pages (#13240)

* init usecase page

* updates use case call to action

* card container component

* themeing

* convert to using strictly props

* responsive spacing

* reworking sections component

* adds callout and hero patterns

* adds priority

* makes feature link optional

* [Homepage] connect use case template to dato (#13295)

* Start connecting to dato

* Fix spacing when no video is present

* Remove log

* adds images

* hook up cards

* pass eyebrow and products

* Delete index.tsx

* Use card container on homepage

* use react video player

* [Homepage] fix mobile video (#13309)

* Removing attributes

* update url

* spacing adjustments

* Allow previewing draft content (#13312)

* fix heading width

* fix feature max width

* adjust in practice padding

* increase icon sizing

* adjust icon alignment

* update eyebrow

* update hero pattern

* update usecase hero pattern

* add hover scale

* [Homepage] populate use case dropdown from use case pages (#13325)

* create standard layout

* removes unused subnav data

* removes static use case pages

* removes use cases style

* bump subnav and use hashicorp vault logo

* fixes use cases paths

* removes hashistack menu

* removes subnav top border

* conditionally render video callout avatar

* hook up data and conditionals

* update components to work with other products

* extract in practice section for reuse

* use Products type

* fix type error

* rework cta logic

* removes type

* updates accent method

* fix button prop

* refactor customer case study

* refactor case studies component

* cleanup margin

* refactor data props

* Spacing updates and introduce intro component

* adds intro interface

* Delete style.css

* fix intro description color

* add revalidate code to homepage

* bump subnav

* make stats optional

* adjust border radius based on customer story

* cleanup temp files

* redirect /home to homepage

* reorder resources

* fix: move heading and description

* fix: logo alignment

* fix: section background color

* feat: optional tutorial and docs links

* fix: removes case studies background

* formatting

* feat: sort use cases in nav

* fix: card overflow (#13429)

* fix: adjust overflow method

* fix: padding on desktop

* fix: scroll padding-right on mobile

* remove debugger

* increase last item width

* card container overflow method (#13434)

* use flex

* formatting

* add comment
2021-12-15 10:32:45 -05:00

61 lines
1.3 KiB
CSS

/* Global Component Styles */
@import '~@hashicorp/mktg-global-styles/style.css';
:root {
--highlight-color: var(--brand-link);
}
/* Local Components */
@import '../components/footer/style.css';
@import '../components/use-case-cta-section/style.css';
/* Pages */
@import './not-found/style.css';
/* Print Styles */
@import './print.css';
/*
* Layout Styles
*
* Note: this is possibly debt we want to replace.
* ref: https://app.asana.com/0/1100423001970639/1200768863236365/f
*/
.g-section-block section {
padding-top: 96px;
padding-bottom: 96px;
& > .g-section-header + *,
& > .g-grid-container > .g-section-header + * {
margin-top: 72px;
}
&:not(.no-section-spacing) > * + *,
&:not(.g-featured-slider-section) > .g-grid-container > * + * {
margin-top: 96px;
}
}
.g-section-block .button-container {
display: -webkit-box;
display: flex;
flex-wrap: wrap;
-webkit-box-pack: center;
justify-content: center;
margin: auto -8px -16px;
}
.g-section-block section > * + .button-container,
.g-section-block section > .g-grid-container > * + .button-container {
margin-top: 40px;
}
.g-section-block .button-container > * {
margin: auto 8px 16px;
}
.g-section-block.theme-black-background-white-text {
background: var(--gray-1);
color: white;
}