-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
129 lines (120 loc) · 9.71 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
<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">
<!--linking logo-->
<link rel="shortcut icon" href="./img/20346307_v1057-logo-30.jpg" type="image/x-icon">
<!--for linking flickity-->
<link rel="stylesheet" href="https://unpkg.com/flickity@2/dist/flickity.min.css">
<!--linking main style sheet-->
<link rel="stylesheet" href="./style/style.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css"
integrity="sha512-c42qTSw/wPZ3/5LBzD+Bw5f7bSF2oxou6wEb+I/lqeaKV5FDIfMvvRp772y4jcJLKuGUOpbJMdg/BTl50fJYAw=="
crossorigin="anonymous" referrerpolicy="no-referrer" />
<link href='https://unpkg.com/[email protected]/css/boxicons.min.css' rel='stylesheet'>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css"
integrity="sha512-c42qTSw/wPZ3/5LBzD+Bw5f7bSF2oxou6wEb+I/lqeaKV5FDIfMvvRp772y4jcJLKuGUOpbJMdg/BTl50fJYAw=="
crossorigin="anonymous" referrerpolicy="no-referrer" />
<link href='https://unpkg.com/[email protected]/css/boxicons.min.css' rel='stylesheet'>
<title>womeni.com</title>
</head>
<body>
<header>
<div class="container">
<div id="fashion" class="logo">
<img src="./assets/img/20346307_v1057-logo-30.jpg" alt="logo" id="logo">
<h1 class="animate__lightSpeedInRight animate__animated"><span class="highlight">womeni</span></h1>
</div>
<nav>
<ul>
<li class="current"><a href="./index.html">Home</a></li>
<li><a href="./components/about.html">About Us</a></li>
<li><a href="./components/shop.html">Shop</a></li>
<li><a href="./components/contact.html">Contact</a></li>
</ul>
</nav>
</div>
</header>
<main>
<section >
<h2><span>collection</span></h2>
<div class="carousel js-flickity" data-flickity-options='{ "wrapAround": true }'>
<div class="carousel-cell"><img src="./assets/img/dom-hill-nimElTcTNyY-unsplash.jpg" alt="fash"></div>
<div class="carousel-cell"><img src="./assets/img/kateryna-hliznitsova-vbnxgxj6cJg-unsplash.jpg" alt="fash"></div>
<div class="carousel-cell"><img src="./assets/img/alexi-romano-CCx6Fz_CmOI-unsplash.jpg" alt="fash"></div>
<div class="carousel-cell"><img src="./assets/img/max-ducourneau-6uv43p1ePrk-unsplash.jpg" alt="fash"></div>
<div class="carousel-cell"><img src="./assets/img/nati-melnychuk-5ngCICAXiH0-unsplash.jpg" alt="fash"></div>
</div>
</section>
<section class="new_arrival">
<h2><span>new arravials</span></h2>
<div class="carousel js-flickity" data-flickity-options='{ "wrapAround": true }'>
<div class="carousel-cell">
<a target="_blank" href="assets/img/pexels-athena-2043590.jpg"><img
class="img-responsive" src="assets/img/pexels-athena-2043590.jpg"></a>
</div>
<div class="carousel-cell">
<a target="_blank" href="assets/img/pexels-eduardo-romero-1750776.jpg"><img class="img-responsive"
src="assets/img/pexels-eduardo-romero-1750776.jpg"></a>
</div>
<div class="carousel-cell">
<a target="_blank" href="assets/img/pexels-evg-kowalievska-1040173.jpg"><img class="img-responsive"
src="assets/img/pexels-evg-kowalievska-1040173.jpg"></a>
</div>
<div class="carousel-cell">
<a target="_blank" href="assets/img/pexels-leticia-ribeiro-2112651.jpg"><img class="img-responsive"
src="assets/img/pexels-leticia-ribeiro-2112651.jpg"></a>
</div>
<div class="carousel-cell">
<a target="_blank" href="assets/img/pexels-timothy-paule-ii-2002717.jpg"><img class="img-responsive"
src="assets/img/pexels-timothy-paule-ii-2002717.jpg"></a>
</div>
</div>
<button><a href="./components/shop.html">shop now</a></button>
</section>
<section>
<div class="text">
<img src="./assets/img/natalie-sysko-0IOY1_3d-r0-unsplash.jpg" alt="" style="width:100%; height:100%";>
<div class="acessories"> Accessories </div>
<div class="statement">
<p>our fashionable accessories are the perfect way to express your personality!</p>
</div>
</div>
<button><a href="./components/shop.html">shop now</a></button>
</section>
<section id="newsletter">
<div class="container1">
<div class="news1"><h1>JOIN OUR NEWSLETTER</h1></div>
<div class="news">
<p>Get 10% of your next order when you sign up for our newsletter</p>
</div>
<form action="">
<input type="email" placeholder="[email protected]" required>
<button type="submit" class="button_1">join</button>
</form>
</div>
</section>
</main>
<footer>
<p>Say hi <i class='bx bxs-ghost bx-tada'></i> to us in these platform.</p>
<ul class="social">
<li class="social-icons"><a href="http://www.facebook.com"><i class='bx bxl-facebook'></i></a></li>
<li class="social-icons"><a href="http://www.instagram.com"><i class='bx bxl-instagrassm'></i></a></li>
<li class="social-icons"><a href="http://www.linkedin.com"><i class='bx bxl-linkedin'></i></a></li>
<li class="social-icons"><a href="http://www.twitter.com"><i class='bx bxl-twitter'></i></a></li>
</ul>
<p>Womeni © 2023 All Rights Reserved.</p>
<div class="navbar">
<a href="./components/FAQ.html" class="active">FAQ</a>
<a href="./components/terms_of_use.html" >Terms of use</a>
<a href="./components/refund_policy.html">Refund policy</a>
<a href="./components/privacy_policy.html">Privacy policy</a>
</div>
</footer>
<!-- Flickity JS files -->
<script src="https://unpkg.com/flickity@2/dist/flickity.pkgd.min.js"></script>
<!--another js files-->
<script> configObj = { "buttonD": "M8 18.568L10.8 21.333 16 16.198 21.2 21.333 24 18.568 16 10.667z", "buttonT": "translate(-1148 -172) translate(832 140) translate(32 32) translate(284)", "shadowSize": "0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04)", "roundnessSize": "6px", "buttonDToBottom": "40px", "buttonDToRight": "40px", "selectedBackgroundColor": "#c0ff9e", "selectedIconColor": "#626a7e", "buttonWidth": "48px", "buttonHeight": "48px", "svgWidth": "40px", "svgHeight": "40px" }; function createButton(obj, pageSimulator) { const body = document.querySelector("body"); backToTopButton = document.createElement("span"); backToTopButton.classList.add("softr-back-to-top-button"); backToTopButton.id = "softr-back-to-top-button"; pageSimulator ? pageSimulator.appendChild(backToTopButton) : body.appendChild(backToTopButton); backToTopButton.style.width = obj.buttonWidth; backToTopButton.style.height = obj.buttonHeight; backToTopButton.style.marginRight = obj.buttonDToRight; backToTopButton.style.marginBottom = obj.buttonDToBottom; backToTopButton.style.borderRadius = obj.roundnessSize; backToTopButton.style.boxShadow = obj.shadowSize; backToTopButton.style.color = obj.selectedBackgroundColor; backToTopButton.style.backgroundColor = obj.selectedBackgroundColor; pageSimulator ? backToTopButton.style.position = "absolute" : backToTopButton.style.position = "fixed"; backToTopButton.style.outline = "none"; backToTopButton.style.bottom = "0px"; backToTopButton.style.right = "0px"; backToTopButton.style.cursor = "pointer"; backToTopButton.style.textAlign = "center"; backToTopButton.style.border = "solid 2px currentColor"; backToTopButton.innerHTML = '<svg class="back-to-top-button-svg animate__jello animate__animated" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" > <g fill="none" fill-rule="evenodd"> <path d="M0 0H32V32H0z" transform="translate(-1028 -172) translate(832 140) translate(32 32) translate(164) matrix(1 0 0 -1 0 32)" /> <path class="back-to-top-button-img" fill-rule="nonzero" d="M11.384 13.333h9.232c.638 0 .958.68.505 1.079l-4.613 4.07c-.28.246-.736.246-1.016 0l-4.613-4.07c-.453-.399-.133-1.079.505-1.079z" transform="translate(-1028 -172) translate(832 140) translate(32 32) translate(164) matrix(1 0 0 -1 0 32)" /> </g> </svg>'; backToTopButtonSvg = document.querySelector(".back-to-top-button-svg"); backToTopButtonSvg.style.verticalAlign = "middle"; backToTopButtonSvg.style.margin = "auto"; backToTopButtonSvg.style.justifyContent = "center"; backToTopButtonSvg.style.width = obj.svgWidth; backToTopButtonSvg.style.height = obj.svgHeight; backToTopButton.appendChild(backToTopButtonSvg); backToTopButtonImg = document.querySelector(".back-to-top-button-img"); backToTopButtonImg.style.fill = obj.selectedIconColor; backToTopButtonSvg.appendChild(backToTopButtonImg); backToTopButtonImg.setAttribute("d", obj.buttonD); backToTopButtonImg.setAttribute("transform", obj.buttonT); if (!pageSimulator) { backToTopButton.style.display = "none"; window.onscroll = function () { if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) { backToTopButton.style.display = "block"; } else { backToTopButton.style.display = "none"; } }; backToTopButton.onclick = function () { document.body.scrollTop = 0; document.documentElement.scrollTop = 0; }; } }; document.addEventListener("DOMContentLoaded", function () { createButton(configObj, null); });</script>
</body>
</html>