add head template

This commit is contained in:
2024-01-17 17:21:30 +01:00
parent ed57bda08e
commit 6b0e3857fb
9 changed files with 96 additions and 23 deletions

1
public/images/xing.svg Normal file
View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="16" width="14" viewBox="0 0 448 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path d="M448 96c0-35.3-28.7-64-64-64H64C28.7 32 0 60.7 0 96V416c0 35.3 28.7 64 64 64H384c35.3 0 64-28.7 64-64V96zM93.8 320.2c-5.5 0-8.7-5.3-6-10.3l49.3-86.7c.1 0 .1-.1 0-.2l-31.4-54c-3-5.6 .2-10.1 6-10.1h46.6c5.2 0 9.5 2.9 12.9 8.7l31.9 55.3c-1.3 2.3-18 31.7-50.1 88.2c-3.5 6.2-7.7 9.1-12.6 9.1H93.8zm163.5-33.4v.2l65.5 119c2.8 5.1 .1 10.1-6 10.1H270.2c-5.5 0-9.7-2.9-12.9-8.7l-66-120.3c1.8-3.2 22.9-40.4 63.3-111.6c11.7-20.7 25.1-44.3 40.1-70.8c3.3-5.8 7.4-8.7 12.5-8.7h46.9c5.7-.1 8.8 4.7 6 10L257.3 286.8z"/></svg>

After

Width:  |  Height:  |  Size: 754 B

View File

@@ -1,20 +1,13 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>LinkMeUp</title>
</head>
<!-- Head template will populate this section -->
<body>
<!-- Header template will populate this section -->
<main>
<hr/>
<hr />
<!-- Handlebars template will populate this section -->
<hr/>
<hr />
</main>
<!-- Footer template will populate this section -->
</body>
</html>

View File

@@ -10,12 +10,22 @@ html {
}
body {
margin: 2rem;
margin: 2rem 0;
width: 100%;
}
header {
text-align: center;
padding: 1rem;
padding: 2rem 0;
max-width: 100%;
}
header h1 {
font-size: 4rem;
}
header h2 {
font-size: 2rem;
}
footer {
@@ -26,9 +36,15 @@ footer {
padding: 1rem;
}
footer a {
text-decoration: none;
}
main {
padding: 2.5rem;
margin: 1.7rem auto;
max-width: 1000px;
max-width: 100%;
max-width: 1100px;
text-align: center;
align-items: center;
align-content: center;
@@ -56,7 +72,7 @@ main hr {
}
.link:hover {
transform: scale(1.05);
transform: scale(1.15);
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}
@@ -82,4 +98,24 @@ main hr {
.link h2 {
font-size: 24px;
}
@media (max-width: 700px) {
header {
padding: 1rem 0;
}
main {
padding: 0.3rem 1.7rem;
margin: 0.7rem auto;
}
main hr {
margin: 1.7rem auto;
}
footer {
text-align: center;
position: relative;
bottom: 0;
width: 100%;
padding: 1rem;
}
}