Bazkidetza sortzen du (#4)

* feat: back-en propietatea sortzen du * feat: bazkidetzarako testua sartzen du * feat: maketazioa konpontzen du * feat: gezia sartzen du * fix: consola zuzenketak egiten ditu * feat: margina konpontzen du * fix: html-a konpontzen du * feat: izena aldatzen du * feat: lege oharra sortzen du * feat: pribatutasun politika sortzen du
2022-05-30 18:48:29 +02:00
parent 07d8ced8d3
commit a35ac68e39
25 changed files with 1878 additions and 40 deletions
--- a/front/src/pages/lege-oharra.tsx
+++ b/front/src/pages/lege-oharra.tsx
@@ -0,0 +1,106 @@
+import { graphql, PageProps, useStaticQuery } from 'gatsby';
+import React from 'react';
+import { GlobalStyles } from '../ui/GlobalStyles';
+
+import { Helmet } from 'react-helmet';
+import { Container } from '../components/Container';
+import ReactMarkdown from 'react-markdown';
+import styled from 'styled-components';
+import { font, fontWeight, size } from '../ui/theme';
+import { rem } from 'polished';
+import { Gainburua } from '../components/Gainburua';
+import { Oina } from '../components/Oina';
+
+interface DataProps {
+  strapiLegeOharra: {
+    data: {
+      attributes: {
+        izenburua: string;
+        edukia: string;
+      };
+    };
+  };
+}
+
+const LegeOharra: React.VFC<PageProps> = () => {
+  const { strapiLegeOharra } = useStaticQuery<DataProps>(graphql`
+    {
+      strapiLegeOharra {
+        data {
+          attributes {
+            izenburua
+            edukia
+          }
+        }
+      }
+    }
+  `);
+
+  return (
+    <>
+      <Helmet
+        title={`${strapiLegeOharra.data.attributes.izenburua} | Laba`}
+        htmlAttributes={{ lang: 'eu' }}
+      />
+
+      <GlobalStyles />
+
+      <Gainburua />
+
+      <Container>
+        <Atala>
+          <Edukia>{strapiLegeOharra.data.attributes.edukia}</Edukia>
+        </Atala>
+      </Container>
+
+      <Oina />
+    </>
+  );
+};
+
+const Atala = styled.section`
+  padding-top: ${rem(size.base)};
+`;
+
+const Edukia = styled(ReactMarkdown)`
+  font-weight: ${fontWeight.regular};
+  ${font.base()};
+
+  p:not(-last-child) {
+    margin-bottom: ${rem(size.base)};
+  }
+
+  h1 {
+    ${font.gargantuan()};
+    font-weight: ${fontWeight.bold};
+    margin-bottom: ${rem(size.base)};
+  }
+
+  h2 {
+    ${font.huge()};
+    font-weight: ${fontWeight.bold};
+    margin-bottom: ${rem(size.base)};
+  }
+
+  h3 {
+    ${font.large()};
+    font-weight: ${fontWeight.bold};
+    margin-bottom: ${rem(size.base)};
+  }
+
+  h4 {
+    font-weight: ${fontWeight.bold};
+    margin-bottom: ${rem(size.mini)};
+  }
+
+  ul {
+    margin-bottom: ${rem(size.base)};
+  }
+
+  li {
+    list-style: disc inside;
+    margin-bottom: ${rem(size.small)};
+  }
+`;
+
+export default LegeOharra;