-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
124 lines (114 loc) · 11.4 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Julia Makes Stuff</title>
<meta name="description" content="View home made product from Julia Gabriel">
<meta name="keywords" content="crochet, homemade, clothes, local">
<meta name="author" content="Amélie Tremblay">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.5.2/dist/umd/popper.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
<script type="module" src="js/main.js"></script>
<link rel="stylesheet" href="css/main.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css">
</head>
<body>
<header>
<nav class="navbar navbar-expand-lg header">
<div class="container-fluid">
<a class="navbar-brand" href="#">Julia Makes...</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNavAltMarkup">
<div class="navbar-nav">
<a class="nav-link active" aria-current="page" href="#">Home</a>
<a class="nav-link" href="custom.html">Custom Order</a>
<a class="nav-link" href="products.html">Products</a>
<div class="d-flex justify-content-evenly g-5 socials-container">
<a class="nav-link socials" href="https://www.facebook.com/groups/1628420123982783"><svg width="45" height="40" viewBox="0 0 53 58" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M53 29.1777C53 13.061 41.1346 -0.00354004 26.5 -0.00354004C11.8588 8.49611e-05 -0.00662231 13.061 -0.00662231 29.1813C-0.00662231 43.743 9.68575 55.8142 22.3528 58.0037V37.6131H15.6284V29.1813H22.3594V22.747C22.3594 15.4353 26.3178 11.3971 32.3698 11.3971C35.2715 11.3971 38.3024 11.9662 38.3024 11.9662V19.1437H34.9601C31.6708 19.1437 30.6439 21.3948 30.6439 23.704V29.1777H37.9911L36.8184 37.6095H30.6406V58.0001C43.3076 55.8106 53 43.7393 53 29.1777Z" fill="#7A7CEA"/>
</svg>
</a>
<a class="nav-link socials" href="https://www.instagram.com/julia_makesstuff/"><svg width="45" height="40" viewBox="0 0 57 62" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_2_65)">
<path d="M28.5 0C20.7658 0 19.7933 0.03875 16.7544 0.186C13.7156 0.341 11.6458 0.86025 9.8325 1.6275C7.92957 2.40376 6.20638 3.62467 4.78444 5.20413C3.33236 6.7508 2.20991 8.62515 1.49625 10.695C0.790875 12.6635 0.309938 14.9187 0.171 18.2125C0.035625 21.5256 0 22.5796 0 31.0039C0 39.4204 0.035625 40.4744 0.171 43.7798C0.3135 47.0813 0.790875 49.3326 1.49625 51.305C2.22656 53.3433 3.19913 55.0715 4.78444 56.7959C6.36619 58.5202 7.95506 59.582 9.82894 60.3725C11.6458 61.1398 13.7121 61.6629 16.7473 61.814C19.7897 61.9613 20.7587 62 28.5 62C36.2413 62 37.2068 61.9613 40.2491 61.814C43.2808 61.659 45.3577 61.1398 47.1711 60.3725C49.0727 59.5957 50.7947 58.3749 52.2156 56.7959C53.8009 55.0715 54.7734 53.3433 55.5037 51.305C56.2056 49.3326 56.6865 47.0813 56.829 43.7798C56.9644 40.4744 57 39.4204 57 31C57 22.5796 56.9644 21.5256 56.829 18.2164C56.6865 14.9188 56.2056 12.6635 55.5037 10.695C54.7901 8.62515 53.6676 6.7508 52.2156 5.20413C50.7936 3.62467 49.0704 2.40376 47.1675 1.6275C45.3506 0.86025 43.2772 0.337125 40.2456 0.186C37.2032 0.03875 36.2378 0 28.4929 0H28.5ZM25.9457 5.58775H28.5036C36.1131 5.58775 37.0144 5.61488 40.0176 5.766C42.7963 5.90163 44.3068 6.40925 45.3114 6.83162C46.6403 7.3935 47.5914 8.06775 48.5889 9.15275C49.5864 10.2378 50.2028 11.2685 50.7193 12.7178C51.1112 13.8066 51.5743 15.4496 51.699 18.4721C51.8379 21.7388 51.8664 22.7191 51.8664 30.9923C51.8664 39.2654 51.8379 40.2496 51.699 43.5162C51.5743 46.5387 51.1076 48.1779 50.7193 49.2706C50.2592 50.6149 49.5303 51.8312 48.5854 52.8317C47.5879 53.9167 46.6403 54.5871 45.3079 55.149C44.3104 55.5753 42.7999 56.079 40.0176 56.2185C37.0144 56.3658 36.1131 56.4006 28.5036 56.4006C20.8941 56.4006 19.9892 56.3658 16.986 56.2185C14.2073 56.079 12.7003 55.5753 11.6957 55.149C10.4589 54.6501 9.33944 53.8586 8.41819 52.8317C7.47154 51.8305 6.74142 50.6127 6.28069 49.2668C5.89237 48.1779 5.42569 46.5349 5.301 43.5124C5.16563 40.2458 5.13713 39.2654 5.13713 30.9845C5.13713 22.7036 5.16563 21.731 5.301 18.4644C5.42925 15.4419 5.89237 13.7989 6.28425 12.7061C6.80081 11.2607 7.42069 10.2261 8.41819 9.14112C9.41569 8.05612 10.3633 7.38575 11.6957 6.82387C12.7003 6.39762 14.2073 5.89388 16.986 5.75437C19.6151 5.62262 20.634 5.58388 25.9457 5.58V5.58775ZM43.7154 10.7338C43.2663 10.7338 42.8216 10.83 42.4067 11.0169C41.9917 11.2039 41.6147 11.4779 41.2971 11.8233C40.9796 12.1687 40.7276 12.5788 40.5558 13.0302C40.3839 13.4815 40.2954 13.9652 40.2954 14.4537C40.2954 14.9423 40.3839 15.426 40.5558 15.8773C40.7276 16.3287 40.9796 16.7388 41.2971 17.0842C41.6147 17.4296 41.9917 17.7036 42.4067 17.8906C42.8216 18.0775 43.2663 18.1737 43.7154 18.1737C44.6225 18.1737 45.4924 17.7818 46.1337 17.0842C46.7751 16.3866 47.1354 15.4404 47.1354 14.4537C47.1354 13.4671 46.7751 12.5209 46.1337 11.8233C45.4924 11.1257 44.6225 10.7338 43.7154 10.7338ZM28.5036 15.0815C26.5623 15.0486 24.6343 15.436 22.832 16.2213C21.0297 17.0066 19.389 18.174 18.0054 19.6556C16.6219 21.1373 15.5231 22.9034 14.7731 24.8514C14.0231 26.7993 13.6369 28.8901 13.6369 31.0019C13.6369 33.1138 14.0231 35.2046 14.7731 37.1525C15.5231 39.1004 16.6219 40.8666 18.0054 42.3482C19.389 43.8298 21.0297 44.9973 22.832 45.7826C24.6343 46.5679 26.5623 46.9553 28.5036 46.9224C32.3459 46.8572 36.0105 45.1512 38.7065 42.1726C41.4025 39.194 42.9135 35.1818 42.9135 31.0019C42.9135 26.8221 41.4025 22.8098 38.7065 19.8313C36.0105 16.8527 32.3459 15.1467 28.5036 15.0815ZM28.5036 20.6654C29.7513 20.6654 30.9868 20.9327 32.1395 21.4521C33.2922 21.9714 34.3397 22.7327 35.2219 23.6923C36.1042 24.652 36.804 25.7913 37.2815 27.0451C37.759 28.299 38.0047 29.6428 38.0047 31C38.0047 32.3572 37.759 33.701 37.2815 34.9549C36.804 36.2087 36.1042 37.348 35.2219 38.3077C34.3397 39.2673 33.2922 40.0286 32.1395 40.5479C30.9868 41.0673 29.7513 41.3346 28.5036 41.3346C25.9837 41.3346 23.567 40.2458 21.7852 38.3077C20.0034 36.3696 19.0024 33.7409 19.0024 31C19.0024 28.2591 20.0034 25.6304 21.7852 23.6923C23.567 21.7542 25.9837 20.6654 28.5036 20.6654Z" fill="#FF7474"/>
</g>
<defs>
<clipPath id="clip0_2_65">
<rect width="57" height="62" fill="white"/>
</clipPath>
</defs>
</svg>
</a>
</div>
</div>
</div>
</nav>
</header>
<main>
<div class="hero">
<div class="hero-text container">
<p>Handmade crafts and gifts for all to enjoy!</p>
</div>
</div>
<div class="about-me container pt-4 p-md-5">
<div class="card w-auto md-mx-auto" style="width: 18rem;">
<img src="img/About-me.png" class="card-img-top" alt="picture of Julia">
<div class="card-body">
<h5 class="card-title text-center">About Me</h5>
<p class="card-text text-center">Hi! I’m the Julia that makes stuff. I have been crafting since I was little, but it was having kids that really kicked off my love for making all the things I wanted them to have but couldn’t necessarily afford. From felt food to baby carriers, and bags, I have made my way through the crafting world, slowly discovering what I really loved making. My craft room is vast, and I really can do almost anything well, but crochet and sewing have remained my steadfast loves.
</p>
<p class="card-text text-center">I love nothing more than solving puzzles, and building new patterns, taking inspiration from the world around me. I love colour and texture in all things, but I don’t do velvet (ick).</p>
<p class="card-text text-center">I am a married mom to 5 who fills her days with a part time job as an optician, playing soccer mom for my youngest, and spending as much time with my adult children as I can before they fly the coop. I also love heading out with my camera occasionally.</p>
<p class="card-text text-center">Thanks for stopping by! I hope you find something you love here.</p>
</div>
</div>
</div>
<div class="shop container">
<h2 class="text-center">shop</h2>
<div class="d-flex flex-wrap justify-content-center gap-4 item-cards">
<a class="item-card image-background-1" href="products.html?category=Clothes">
<h3>Clothes</h3>
<img src="img/RainbowShawl2.jpg" alt="clothing">
<p>Check it Out > </p>
</a>
<a class="item-card image-background-2" href="products.html?category=Earrings">
<h3>Earrings</h3>
<img src="img/blueorangeearrings.png" alt="earrings">
<p>Check it Out > </p>
</a>
<a class="item-card image-background-3" href="products.html?category=Toys">
<h3>Toys</h3>
<img src="img/snakeplush.png" alt="toys">
<p>Check it Out > </p>
</a>
<a class="item-card image-background-4" href="products.html?category=Decor">
<h3>Decor</h3>
<img src="img/plantcrochet.png" alt="decor">
<p>Check it Out > </p>
</a>
</div>
</div>
</main>
<footer>
<div class="footer container">
<div class="contact container text-center ">
<nav class="footer-nav ">
<a href="#">Home</a>
<a href="custom.html">Custom Orders</a>
<a href="products.html">Products</a>
</nav>
<p class="p-2">Email: Justmejuliag@gmail.com</p>
<a href="https://www.facebook.com/groups/1628420123982783"><i class="bi bi-facebook"></i></a>
<a href="https://instagram.com/julia_makesstuff"><i class="bi bi-instagram"></i></a>
<p>Julia Makes Stuff</p>
</div>
</div>
</footer>
</body>
</html>