forked from amyyalex/simple-contribution
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
151 lines (146 loc) · 5.67 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1,0" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<title>Simple Contribution</title>
<link href="./image/design-files/logo/sc-logo-favicon-lightmode.ico" rel="icon" type="image/x-icon"
media="(prefers-color-scheme: light)" />
<link href="./image/design-files/logo/sc-logo-favicon-darkmode.ico" rel="icon" type="image/x-icon"
media="(prefers-color-scheme: dark)" />
<link rel="stylesheet" href="style/style.css" />
<link rel="stylesheet" href="style/banner.css" />
<link type="css" rel="stylesheet" href="css/navbar-btn.css" crossorigin="anonymous">
<link rel="stylesheet" href="https://unicons.iconscout.com/release/v2.1.6/css/unicons.css" />
<script src="https://kit.fontawesome.com/a076d05399.js"></script>
<link href="https://fonts.googleapis.com/css2?family=Space+Mono:ital,wght@0,400;0,700;1,400;1,700&display=swap"
rel="stylesheet">
<link rel="stylesheet" href="https://unpkg.com/aos@next/dist/aos.css" />
</head>
<body>
<nav class="navbar" id="navbar">
<div class="navbar-innner-parent">
<img src="./image/design-files/logo/simple-contribution.svg" class="navbar-logo-1"
alt="Simple Contribution Logo" />
<img src="./image/design-files/logo/icon-menu.svg" id="navbar-menu-icon-1" alt="MENU Icone" />
<div class="navbar-link-list">
<div id="navbar-link-list-container">
<div>
<a href="#discription-title-id"><i class="uil-users-alt navbar-mobile-icon"></i> Meet Our Contributors</a>
</div>
<div>
<a href="https://github.com/amyyalex/simple-contribution?tab=readme-ov-file#simple-contribution"
target="_blank"><i class="uil-question-circle navbar-mobile-icon"></i> About Our Community</a>
</div>
<div>
<a href="https://discord.gg/JhCdztuAcm" target="_blank"><i class="uil-user-plus navbar-mobile-icon"></i>
Join Our Community</a>
</div>
</div>
<div class="navbar-space-evenly-on-mobile" id="navbar-social-media-container">
<a href="https://github.com/amyyalex/simple-contribution" target="_self"><i class="uil uil-github"
id="github-icon"></i></a>
</div>
<div class="navbar-space-evenly-on-mobile" id="google_translate_element"></div>
<script src="https://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
<script>
function googleTranslateElementInit() {
new google.translate.TranslateElement(
{ pageLanguage: 'en' },
'google_translate_element'
);
}
</script>
</div>
</div>
</nav>
<section>
<div class="banner">
<div class="box" id="boxContainer"></div>
<h1>HI CONTRIBUTORS!</h1>
<p>
This is a simple project that will not only help you contribute to your first open source
project, but will also guide you through the entire process,<span>so whether this is your first time
contributing or you're looking for a project to
contribute to, this project is for you!</span>
</p>
<a href="https://discord.gg/JhCdztuAcm" target="_blank" class="button">
<span class="button_lg">
<span class="button_sl"></span>
<span>😄 </span>
<span class="button_text">Join a Community</span>
</span>
</a>
</div>
</section>
<section class="home-content">
<div class="discription-title" id="discription-title-id">
<div class="detail-title">
<h2>Add your Contribution!</h2>
<p>
Add your different social media platform and get other contributors to see your work and
follow you!
</p>
</div>
<div class="search-section">
<div class="search-form">
<input type="text" placeholder="Insert a name" name="search" id="search" class="search-input" />
<i class="uil uil-search-alt"></i>
</div>
</div>
</div>
<!-- Template for contributor cards -->
<template id="contributor-card">
<div class="card" data-aos="fade-up">
<div class="card-details">
<h1></h1>
<h5></h5>
<p></p>
</div>
<div class="social-icon">
<!-- Social icons will be added here -->
</div>
<p class="connect">Let's Connect!</p>
</div>
</template>
<!-- END OF TEMPLATE-->
<div class="cards"></div>
<!-- Template for pagination -->
<template id="pages">
<div class="page-details">
<p class=""></p>
</div>
</template>
<!-- END OF TEMPLATE -->
<div class="pagination"></div>
</section>
<section>
<div class="contribute" data-aos="fade-up" data-aos-delay="300">
<div class="contribute-container">
<h1>Thanks for your Contribution</h1>
<hr class="line" />
<p>
I appreciate you for contributing and being part of this amazing project, I hope you
feel proud of yourself.
<br />
Don't forget to leave a star⭐!
Thank you❤️
</p>
<a href="https://github.com/amyyalex/simple-contribution" class="click-button1" target="_blank">
Contribute here
</a>
</div>
</div>
</section>
<footer id="footer">
<div class="copyright">Copyright © Designed by Simple Contribution 2024</div>
</footer>
<script src="./app.js"></script>
<script src="./banner.js"></script>
<script src="https://unpkg.com/aos@next/dist/aos.js"></script>
<script>
AOS.init();
</script>
</body>
</html>