diff options
Diffstat (limited to 'examples/portfolio-svelte/src/layouts/project.astro')
-rw-r--r-- | examples/portfolio-svelte/src/layouts/project.astro | 91 |
1 files changed, 0 insertions, 91 deletions
diff --git a/examples/portfolio-svelte/src/layouts/project.astro b/examples/portfolio-svelte/src/layouts/project.astro deleted file mode 100644 index e60be99ae..000000000 --- a/examples/portfolio-svelte/src/layouts/project.astro +++ /dev/null @@ -1,91 +0,0 @@ ---- -import MainHead from '../components/MainHead.astro'; -import Button from '../components/Button.svelte'; -import Footer from '../components/Footer.svelte'; -import Nav from '../components/Nav.svelte'; - -const { content } = Astro.props; ---- - -<html lang={content.lang || 'en'}> - <head> - <MainHead title={content.title} description={content.description} /> - <style lang="scss"> - .hero { - padding: 8rem; - display: flex; - background-color: var(--t-fg); - background-repeat: no-repeat; - background-size: cover; - min-height: 25vw; - color: white; - flex-direction: column; - align-items: center; - justify-content: center; - } - - .tag { - margin-left: 0.5em; - margin-right: 0.5em; - text-transform: uppercase; - - &:nth-of-type(1n) { - color: var(--c-green); - } - &:nth-of-type(2n) { - color: var(--c-orange); - } - &:nth-of-type(3n) { - color: var(--c-blue); - } - &:nth-of-type(4n) { - color: var(--c-pink); - } - } - - .title { - font-size: var(--f-u10); - font-weight: 900; - text-transform: uppercase; - letter-spacing: 0.0625em; - } - - .leadIn { - color: var(--t-bg); - background-color: var(--t-fg); - } - - .tagline { - font-weight: 300; - font-size: var(--f-u3); - line-height: 1.5; - } - - .content { - font-size: var(--f-u1); - line-height: 2.2; - } - </style> - </head> - <body> - <Nav /> - <header style={`background-image:url(${content.img})`} class="hero"> - <h1 class="title">{content.title}</h1> - </header> - <div class="leadIn"> - <div class="wrapper pt8 pb8 mb8 tac"> - {content.tags.map((t) => <span class="tag">{t}</span>)} - <h3 class="tagline">{content.description}</h3> - </div> - </div> - <div class="wrapper wrapper__readable"> - <div class="content"><slot /></div> - </div> - <footer class="tac mt6"> - <a href="/projects"> - <Button>View More</Button> - </a> - </footer> - <Footer /> - </body> -</html> |