diff options
Diffstat (limited to 'src/layouts/PortfolioPageLayout.astro')
| -rw-r--r-- | src/layouts/PortfolioPageLayout.astro | 113 |
1 files changed, 113 insertions, 0 deletions
diff --git a/src/layouts/PortfolioPageLayout.astro b/src/layouts/PortfolioPageLayout.astro new file mode 100644 index 0000000..0ade4ba --- /dev/null +++ b/src/layouts/PortfolioPageLayout.astro @@ -0,0 +1,113 @@ +--- +import Layout from "./Layout.astro"; +import { useTranslations } from "../i18n"; +import TechnologyBadge from "../partials/TechnologyBadge.astro"; + +const t = useTranslations(Astro.currentLocale); + +const schema = { + "@context": "https://schema.org", + "@type": "WebPage", + url: "https://www.costas.dev/portfolio", + headline: t.portfolioPage.headline, +}; +--- + +<Layout title={t.portfolioPage.title} description={t.portfolioPage.description}> + <script + is:inline + type="application/ld+json" + slot="head-jsonld" + set:html={JSON.stringify(schema)} + ></script> + + <h1>{t.portfolioPage.headline}</h1> + + <p set:html={t.portfolioPage.intro} /> + + <h2>{t.portfolioPage.freelanceTitle}</h2> + + <p>{t.portfolioPage.freelanceDesc}</p> + + <section> + <article> + <h3>{t.portfolioPage.orderExtractorTitle}</h3> + + <p set:html={t.portfolioPage.orderExtractorDesc} /> + + <TechnologyBadge code="java" /> + <TechnologyBadge code="windows" /> + </article> + + <article> + <h3>{t.portfolioPage.touristInfoTitle}</h3> + + <p set:html={t.portfolioPage.touristInfoDesc} /> + + <TechnologyBadge code="php" /> + <TechnologyBadge code="mysql" /> + </article> + + <article> + <h3>{t.portfolioPage.wpConsultingTitle}</h3> + + <p set:html={t.portfolioPage.wpConsultingDesc} /> + + <TechnologyBadge code="php" /> + </article> + </section> + + <h2>{t.portfolioPage.ownProjectsTitle}</h2> + + <p>{t.portfolioPage.ownProjectsDesc}</p> + + <section> + <article> + <h3>{t.portfolioPage.personalWebTitle}</h3> + + <p>{t.portfolioPage.personalWebDesc}</p> + + <TechnologyBadge code="astro" /> + <TechnologyBadge code="azure" /> + </article> + + <article> + <h3>{t.portfolioPage.mientrenoTitle}</h3> + + <p set:html={t.portfolioPage.mientrenoDesc} /> + + <TechnologyBadge code="dotnet" /> + <TechnologyBadge code="sqlserver" /> + <TechnologyBadge code="azure" /> + <TechnologyBadge code="rabbitmq" /> + </article> + + <article> + <h3>{t.portfolioPage.vigo360Title}</h3> + + <p set:html={t.portfolioPage.vigo360Desc} /> + + <TechnologyBadge code="go" /> + <TechnologyBadge code="mysql" /> + <TechnologyBadge code="linux" /> + </article> + </section> +</Layout> + +<style> + section { + display: grid; + grid-template-columns: repeat(auto-fill, minmax(400px, 1fr)); + gap: 1rem; + } + + article { + padding: 1rem; + border: 1px solid var(--accent); + border-radius: 0.5rem; + } + + article h3 { + margin-top: 0; + } +</style>
\ No newline at end of file |