mirror of
https://github.com/hashicorp/packer.git
synced 2026-04-22 22:59:46 -04:00
website: upgrade content and global styles (#11151)
* website: upgrade global-styles packages * website: upgrade community page * website: hide alert-banner on mobile * website: replace g-container with g-grid-container * website: delete unused CSS * website: backfill missing type styles * website: fix style import path * website: bump to latest patched dependencies
This commit is contained in:
parent
54a4f59fc7
commit
adcd472873
12 changed files with 474 additions and 458 deletions
|
|
@ -3,7 +3,7 @@ import Link from 'next/link'
|
|||
export default function Footer({ openConsentManager }) {
|
||||
return (
|
||||
<footer className="g-footer">
|
||||
<div className="g-container">
|
||||
<div className="g-grid-container">
|
||||
<div className="left">
|
||||
<Link href="/intro">
|
||||
<a>Intro</a>
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
flex-shrink: 0;
|
||||
display: flex;
|
||||
|
||||
& .g-container {
|
||||
& .g-grid-container {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
|
|
|
|||
871
website/package-lock.json
generated
871
website/package-lock.json
generated
File diff suppressed because it is too large
Load diff
|
|
@ -4,24 +4,24 @@
|
|||
"version": "1.0.0",
|
||||
"author": "HashiCorp",
|
||||
"dependencies": {
|
||||
"@hashicorp/mktg-global-styles": "^3.1.0",
|
||||
"@hashicorp/mktg-global-styles": "4.0.0",
|
||||
"@hashicorp/mktg-logos": "^1.2.0",
|
||||
"@hashicorp/nextjs-scripts": "^19.0.3",
|
||||
"@hashicorp/platform-code-highlighting": "^0.1.1",
|
||||
"@hashicorp/platform-runtime-error-monitoring": "^0.1.0",
|
||||
"@hashicorp/platform-util": "^0.1.0",
|
||||
"@hashicorp/react-alert-banner": "^6.1.2",
|
||||
"@hashicorp/react-alert-banner": "6.2.0",
|
||||
"@hashicorp/react-button": "^5.2.1",
|
||||
"@hashicorp/react-command-line-terminal": "^2.0.3",
|
||||
"@hashicorp/react-consent-manager": "^6.0.0",
|
||||
"@hashicorp/react-docs-page": "^13.5.1",
|
||||
"@hashicorp/react-docs-page": "14.0.1",
|
||||
"@hashicorp/react-hashi-stack-menu": "^2.0.6",
|
||||
"@hashicorp/react-head": "^3.1.1",
|
||||
"@hashicorp/react-inline-svg": "^6.0.2",
|
||||
"@hashicorp/react-markdown-page": "^1.3.1",
|
||||
"@hashicorp/react-product-downloads-page": "^2.3.1",
|
||||
"@hashicorp/react-markdown-page": "1.4.2",
|
||||
"@hashicorp/react-product-downloads-page": "2.4.0",
|
||||
"@hashicorp/react-product-features-list": "^4.1.2",
|
||||
"@hashicorp/react-search": "^5.1.1",
|
||||
"@hashicorp/react-search": "5.1.2",
|
||||
"@hashicorp/react-section-header": "^5.0.3",
|
||||
"@hashicorp/react-subnav": "^8.4.0",
|
||||
"@hashicorp/react-text-split-with-image": "^4.2.2",
|
||||
|
|
|
|||
|
|
@ -17,7 +17,7 @@ export default function NotFound() {
|
|||
|
||||
return (
|
||||
<div id="p-404">
|
||||
<h1>Page Not Found</h1>
|
||||
<h1 className="g-type-display-1">Page Not Found</h1>
|
||||
<p>
|
||||
We're sorry but we can't find the page you're looking
|
||||
for.
|
||||
|
|
|
|||
|
|
@ -35,7 +35,7 @@ export default function App({ Component, pageProps }) {
|
|||
icon={[{ href: '/favicon.ico' }]}
|
||||
/>
|
||||
{ALERT_BANNER_ACTIVE && (
|
||||
<AlertBanner {...alertBannerData} product="packer" />
|
||||
<AlertBanner {...alertBannerData} product="packer" hideOnMobile />
|
||||
)}
|
||||
<HashiStackMenu />
|
||||
<ProductSubnav />
|
||||
|
|
|
|||
|
|
@ -1,10 +1,11 @@
|
|||
import VerticalTextBlockList from '@hashicorp/react-vertical-text-block-list'
|
||||
import SectionHeader from '@hashicorp/react-section-header'
|
||||
import Head from 'next/head'
|
||||
import s from './style.module.css'
|
||||
|
||||
export default function CommunityPage() {
|
||||
return (
|
||||
<div id="p-community">
|
||||
<div className={s.root}>
|
||||
<Head>
|
||||
<title key="title">Community | Packer by HashiCorp</title>
|
||||
</Head>
|
||||
|
|
|
|||
|
|
@ -1,8 +0,0 @@
|
|||
#p-community {
|
||||
max-width: var(--site-max-width);
|
||||
margin: 72px auto;
|
||||
|
||||
& .g-section-header {
|
||||
margin-bottom: 100px;
|
||||
}
|
||||
}
|
||||
9
website/pages/community/style.module.css
Normal file
9
website/pages/community/style.module.css
Normal file
|
|
@ -0,0 +1,9 @@
|
|||
.root {
|
||||
composes: g-grid-container from global;
|
||||
margin-top: 72px;
|
||||
margin-bottom: 72px;
|
||||
|
||||
& :global(.g-section-header) {
|
||||
margin-bottom: 100px;
|
||||
}
|
||||
}
|
||||
|
|
@ -1,9 +1,3 @@
|
|||
.root {
|
||||
composes: .g-container from global;
|
||||
margin-top: 72px;
|
||||
margin-bottom: 72px;
|
||||
}
|
||||
|
||||
.logo {
|
||||
width: 105px;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -70,7 +70,7 @@
|
|||
|
||||
@media print {
|
||||
/* @todo: remove alongside @hashicorp/react-global-styles/_temporary-to-remove/layout.css */
|
||||
.g-container {
|
||||
.g-grid-container {
|
||||
/*
|
||||
* A “measure” is the number of characters in a line of text.
|
||||
* Long lines fatique readers as they find the start of a new line of text.
|
||||
|
|
|
|||
|
|
@ -1,7 +1,5 @@
|
|||
/* Global Component Styles */
|
||||
@import '~@hashicorp/mktg-global-styles/style.css';
|
||||
@import '~@hashicorp/mktg-global-styles/_temporary-to-remove/layout.css';
|
||||
@import '~@hashicorp/mktg-global-styles/_temporary-to-remove/tables.css';
|
||||
|
||||
:root {
|
||||
--highlight-color: var(--packer-link);
|
||||
|
|
@ -11,8 +9,6 @@
|
|||
@import '~@hashicorp/react-alert-banner/style.css';
|
||||
@import '~@hashicorp/react-button/styles/index.css';
|
||||
@import '~@hashicorp/react-consent-manager/style.css';
|
||||
@import '~@hashicorp/react-content/style.css';
|
||||
@import '~@hashicorp/react-docs-page/style.css';
|
||||
@import '~@hashicorp/react-product-features-list/style.css';
|
||||
@import '~@hashicorp/react-search/style.css';
|
||||
@import '~@hashicorp/react-subnav/style.css';
|
||||
|
|
@ -25,9 +21,6 @@
|
|||
@import '../components/footer/style.css';
|
||||
@import '../components/search-bar/style.css';
|
||||
|
||||
/* Local Pages */
|
||||
@import './community/style.css';
|
||||
|
||||
/* Print Styles */
|
||||
@import './print.css';
|
||||
|
||||
|
|
@ -91,12 +84,12 @@
|
|||
padding-bottom: 96px;
|
||||
|
||||
& > .g-section-header + *,
|
||||
& > .g-container > .g-section-header + * {
|
||||
& > .g-grid-container > .g-section-header + * {
|
||||
margin-top: 72px;
|
||||
}
|
||||
|
||||
& > * + *,
|
||||
& > .g-container > * + * {
|
||||
& > .g-grid-container > * + * {
|
||||
margin-top: 96px;
|
||||
}
|
||||
}
|
||||
|
|
@ -111,7 +104,7 @@
|
|||
}
|
||||
|
||||
.g-section-block section > * + .button-container,
|
||||
.g-section-block section > .g-container > * + .button-container {
|
||||
.g-section-block section > .g-grid-container > * + .button-container {
|
||||
margin-top: 40px;
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue