Compare commits

..

No commits in common. "4131de86922728a5dc64aab51e2728b3e6d96e4e" and "7d88da66676f1f70f2e0376c88b7117b4c87c1f6" have entirely different histories.

6 changed files with 14 additions and 70 deletions

View File

@ -1,51 +0,0 @@
"use client"
import { useRouter } from "next/navigation";
import styled from "styled-components";
import { Button } from "@/styles";
export default function Contact() {
const router = useRouter();
return <ContactLayout>
<ContactSection>
<h1>Kontakt</h1>
<p>Telefon: <a href="tel:+48122723101">+48 12 272 31 01</a></p>
<p>E-mail: <a href="mailto:parafia@parafiaborzeta.pl">parafia@parafiaborzeta.pl</a></p>
</ContactSection>
<ContactSection>
<iframe
src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2571.774387915165!2d19.983823077009625!3d49.865482529309325!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x47166bf98a3e4c0d%3A0xf6450674984e2240!2sRoman%20Catholic%20Parish%20of%20the%20Immaculate%20Heart%20of%20Mary!5e0!3m2!1sen!2sid!4v1717164631849!5m2!1sen!2sid"
width="800"
height="600"
style={{ border: 0 }}
loading="lazy"
referrerPolicy="no-referrer-when-downgrade"
/>
<Button onClick={() => router.back()}>Powrót</Button>
</ContactSection>
</ContactLayout>;
}
const ContactLayout = styled.div`
display: flex;
flex-wrap: wrap;
flex-direction: row;
justify-content: center;
gap: ${({ theme }) => theme.space}vw;
@media screen and (max-width: 798px) {
flex-direction: column;
}
`
const ContactSection = styled.div`
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
gap: 5px;
`

View File

@ -1,4 +1,4 @@
"use client" 'use client'
import { Montserrat } from "next/font/google"; import { Montserrat } from "next/font/google";
import { useState, useEffect } from "react"; import { useState, useEffect } from "react";
@ -29,7 +29,7 @@ export default function RootLayout({
<html lang="en"> <html lang="en">
{/* {/*
can't use next.Metadata, can't use next.Metadata,
because "use client" + styled components are because 'use client' + styled components are
preventing it. preventing it.
next/head wouldn't work too, so legacy solution is used next/head wouldn't work too, so legacy solution is used

View File

@ -1,7 +1,7 @@
"use client" 'use client'
import { useTheme } from "@/providers/theme.provider"; import { useTheme } from "@/providers/theme.provider";
import { Button } from "@/styles"; import { Button } from "../styles";
export default function Home() { export default function Home() {
const { theme, toggleTheme } = useTheme(); const { theme, toggleTheme } = useTheme();

View File

@ -1,18 +1,18 @@
export type ThemeMode = 'light' | 'dark' export type ThemeMode = 'light' | 'dark'
export interface Theme { export interface Theme {
background: string, background: string,
space: number, space_px: number,
text: string text: string
} }
export const darkTheme: Theme = { export const darkTheme: Theme = {
space: 10, space_px: 10,
background: "#2f3136", background: "#2f3136",
text: "#fff" text: "#fff"
} }
export const lightTheme: Theme = { export const lightTheme: Theme = {
space: 10, space_px: 10,
background: "#eee", background: "#eee",
text: "#000" text: "#000"
} }

View File

@ -16,7 +16,7 @@ const Navigation = styled.nav`
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
padding: ${({ theme }) => theme.space}px; padding: ${({ theme }) => theme.space_px}px;
position: fixed; position: fixed;
width: 100%; width: 100%;
left: 0; left: 0;
@ -26,7 +26,7 @@ const Navigation = styled.nav`
const NavigationLinks = styled.ul` const NavigationLinks = styled.ul`
list-style-type: none; list-style-type: none;
li { li {
margin: ${({ theme }) => theme.space}px; margin: ${({ theme }) => theme.space_px}px;
display: block; display: block;
float: left; float: left;
} }

View File

@ -1,4 +1,4 @@
"use client" 'use client'
import styled, { createGlobalStyle } from "styled-components"; import styled, { createGlobalStyle } from "styled-components";
@ -16,8 +16,6 @@ export const GlobalLayout = createGlobalStyle`
overflow-x: hidden; overflow-x: hidden;
color: ${({ theme }) => theme.text}; color: ${({ theme }) => theme.text};
background-color: ${({ theme }) => theme.background}; background-color: ${({ theme }) => theme.background};
transition: background 0.3s ease-in-out;
} }
a { a {
@ -32,20 +30,17 @@ export const GlobalLayout = createGlobalStyle`
`; `;
export const MainBlock = styled.main` export const MainBlock = styled.main`
display: flex; display: grid;
height: 100vh; height: 100vh;
align-items: center; place-items: center;
flex-direction: column; align-content: center;
justify-content: center;
` `
export const Button = styled.button` export const Button = styled.button`
border: none; border: none;
outline: none; outline: none;
cursor: pointer; cursor: pointer;
padding: ${({ theme }) => theme.space_px}px;
color: ${({ theme }) => theme.background}; color: ${({ theme }) => theme.background};
background-color: ${({ theme }) => theme.text}; background-color: ${({ theme }) => theme.text};
margin: ${({ theme }) => theme.space}px;
padding: ${({ theme }) => theme.space}px;
`; `;