-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
153 lines (148 loc) · 8.05 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
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Film Vault Gazette</title>
<meta name="description" content="Discover the captivating world of film photography through monthly curated collections of talented Instagram artists. Their stories, film and analog cameras they wield, all brought together in one place.">
<meta name="keywords" content="Photography, Film photography, 35mm film, 120mm film, curated collections, analog art, monthly showcases, vintage photography, visual storytelling">
<meta name="author" content="Film Vault Gazette">
<!--Favicon-->
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="manifest" href="/site.webmanifest">
<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5">
<meta name="msapplication-TileColor" content="#da532c">
<meta name="theme-color" content="#000000">
<!--Open Graph Meta Tags-->
<meta property="og:image" content="http://www.filmvaultgazette.com/assets/logo_square.jpg" />
<meta property="og:image:secure_url" content="http://www.filmvaultgazette.com/assets/logo_square.jpg"/>
<meta property="og:image:type" content="image/jpg" />
<meta property="og:image:width" content="621" />
<meta property="og:image:height" content="621" />
<meta property="og:title" content="Film Vault Gazette">
<meta property="og:description" content="Discover the captivating world of film photography through monthly curated collections of talented Instagram artists. Their stories, film and analog cameras they wield, all brought together in one place."/>
<!--(gtag.js)-->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-9JET0VYD3C"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-9JET0VYD3C');
</script>
<script>
(function(h,o,t,j,a,r){
h.hj=h.hj||function(){(h.hj.q=h.hj.q||[]).push(arguments)};
h._hjSettings={hjid:5041979,hjsv:6};
a=o.getElementsByTagName('head')[0];
r=o.createElement('script');r.async=1;
r.src=t+h._hjSettings.hjid+j+h._hjSettings.hjsv;
a.appendChild(r);
})(window,document,'https://static.hotjar.com/c/hotjar-','.js?sv=');
</script>
<!--Google Fonts-->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Chonburi&family=Fira+Mono:wght@400;700&family=Monda&display=swap" rel="stylesheet">
<!--Stylesheets-->
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous">
<link rel="stylesheet" href="styles/index.css">
</head>
<body>
<header>
<nav class="navbar navbar-light bg-white navbar-expand-lg bg-body-tertiary fixed-top py-3">
<div class="container-fluid">
<button class="navbar-toggler collapsed d-flex d-lg-none flex-column justify-content-around" type="button" data-bs-toggle="collapse" data-bs-target="#navbarTogglerDemo03" aria-controls="navbarTogglerDemo03" aria-expanded="false" aria-label="Toggle navigation">
<span class="toggler-icon top-bar"></span>
<span class="toggler-icon middle-bar"></span>
<span class="toggler-icon bottom-bar"></span>
</button>
<a class="navbar-brand" href="index.html">
<img src="/assets/logo.jpg" alt="Film Vault Gazette logo" width="75" class="d-inline-block align-text-top">
</a>
<div class="collapse navbar-collapse" id="navbarTogglerDemo03">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link" href="aboutus.html">About Us</a>
</li>
<li class="nav-item">
<a class="nav-link" href="collections.html">Collections</a>
</li>
<li class="nav-item">
<a class="nav-link" href="contact.html">Contact</a>
</li>
</ul>
</div>
</div>
</nav>
</header>
<main>
<!--Showcase-->
<div class="bg-dark text-light showcase">
<div class="container container-showcase text-center">
<h1 class="h1-showcase">Welcome to <br> Film Vault Gazette</h1>
<p class="pt-5 join-us">"The ultimate destination for film photography enthusiasts" </p>
</div>
</div>
<!--About-->
<div class="about pt-5 pb-5">
<div class="container container-about">
<h2 class="h2-about">Discover the captivating world of film photography through monthly curated collections of talented Instagram artists. Their stories, film and analog cameras they wield, all brought together in one place.</h2>
</div>
</div>
<!--Recent Collection-->
<section class="text-light p-5 pb-5 content">
<div class="container">
<h2 class="h2 mt-4 pb-3">Recent Collection</h2>
<div class="row mt-4 align-items-center">
<a href="collections/2024/august-2024.html" class="card-link">
<div class="col-md mb-5 text-center">
<div class="card card-whole">
<img src="/images/2024/august-2024/aug24-5.jpg" class="card-img-top" alt="">
<div class="card-body">
<h3 class="card-title"><b>August Collection</b></h3>
<p class="card-text">2024</p>
</div>
</div>
</div>
</a>
</div>
</div>
<div class="container text-center">
<a class="btn btn-primary btn-view" href="collections.html" role="button">View All</a>
</div>
</section>
</main>
<footer class="p-5 bg-dark text-light footer-dark">
<div class="container">
<h3 class="mb-4">Join Us!</h3>
<div class="join">
<p class="p-join">Follow and tag us on Instagram at @filmvaultgazette or use #filmvaultgazette for a chance to get featured and added to our virtual vault!</p>
<a href="https://www.instagram.com/filmvaultgazette/?hl=en-gb">
<img class="img-fluid insta-logo" src="/assets/instagram.png" alt="Visit our Instagram page">
</a>
</div>
<div class="container">
<div class="d-sm-flex align-items-center justify-content-between">
<div>
<a class="footer-text" href="aboutus.html">About Us</a><br>
<a class="footer-text" href="collections.html">Collections</a><br>
<a class="footer-text" href="contact.html">Contact</a><br>
<img class="img-fluid fwg-logo" src="/assets/logo_nobg.png" alt="Film Vault Gazette logo">
</div>
<div>
<a class="footer-text" href="accessibility.html">Accessibility Policy</a><br>
<a class="footer-text" href="terms.html">Terms & Conditions</a><br>
<a class="footer-text" href="https://icons8.com" target="_blank">Icons by Icons8</a><br>
</div>
</div>
<p class="copyright">Copyright © 2024 Film Vault Gazette</p>
</div>
</div>
</footer>
<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js" integrity="sha384-IQsoLXl5PILFhosVNubq5LC7Qb9DXgDA9i+tQ8Zj3iwWAwPtgFTxbJ8NT4GN1R8p" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js" integrity="sha384-cVKIPhGWiC2Al4u+LWgxfKTRIcfu0JTxR+EQDz/bgldoEyl4H0zUF0QKbrJ0EcQF" crossorigin="anonymous"></script>
</body>
</html>