Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Made Corrections #14

Merged
merged 8 commits into from
Jun 28, 2024
Merged

Made Corrections #14

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
8ae214d
Add FAQ page
Dheelyte Jun 9, 2024
b3c57a3
Add Contact us and privacy pages
Dheelyte Jun 16, 2024
ec4b48a
Make Contact Us responsive
Dheelyte Jun 16, 2024
a98be26
Merge branch 'dev' into delight
Dheelyte Jun 16, 2024
ad15bfc
Replace dummy text with actual content
Dheelyte Jun 16, 2024
b0ba37b
Add privacy policy
Dheelyte Jun 23, 2024
89b6f26
Style Privacy policy page
Dheelyte Jun 23, 2024
69e5f06
Fix merge conflict
Dheelyte Jun 23, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
104 changes: 104 additions & 0 deletions contact.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,104 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Privacy Policy - DSC UNILAG</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="author" content="DSC University of Lagos"/>
<meta name="description" content="Developer Student Clubs (DSC) UNILAG is a Google Developers program for university students to learn mobile and web development skills.">
<meta name="keywords" content="dsc,dsc unilag,programming in unilag, clubs in unilag, google developers,programming, extra-curriculars, sub saharan africa, computer science"/>
<meta name="theme-color" content="#2F5BE7"/>
<link rel="manifest" href="manifest.json"/>
<link rel="icon" href="images/icon3.png" type="image/png"/>
<link rel="dns-prefetch" href="https://docs.google.com">
<link href='https://fonts.googleapis.com/css?family=Google+Sans:400,500,700|Material+Icons' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="css/styles.css">

</head>
<body style="background: #fff;">
<header style="background: #f1f3f4;">
<a class="header-logo" href="index.html">
<img src="images/assets/hero/gdsc_logo.svg" width="200" alt="DSC icon">
</a>
<ul class="header-links">
<li class="header-link"><a class="header-link" href="#about">About</a></li>
<li class="header-link"><a href="#technologies" class="header-link">Programs</a></li>
<li class="header-link"><a href="learn.html" class="header-link">Events</a></li>
<li class="header-link"><a href="#workshops" class="header-link">Blogs</a></li>
<li class="header-link"><a href="#team" class="header-link">Team</a></li>
<li class="header-link"><a href="contact.html" class="header-link">Contact Us</a></li>
<li class="header-link"><a href="faq.html" class="header-link">FAQs</a></li>
</ul>
<a href="http://dscunilag.dev/join" class="header-cta" rel="noreferrer" target="_blank">Join GDSC</a>
<span class="menubar">&#9776;</span>
</header>

<nav>
<span class="close">&#10006;</span>
<ul>
<li><a href="#about">About</a></li>
<li><a href="#technologies">Programs</a></li>
<li><a href="learn.html">Events</a></li>
<li><a href="#workshops">Blogs</a></li>
<li><a href="#team">Team</a></li>
<li><a href="contact.html">Contact Us</a></li>
<li><a href="faq.html">FAQs</a></li>
</ul>
</nav>

<main style="padding: 20px;">
<div class="contact">
<div class="sidebar">
<p class="title">Get in Touch</p>
<div class="info-container">
<p>Chat With Us</p>
<p>dscunilag@gmail.com</p>
</div>
<div class="info-container">
<p>Call Us</p>
<p>+2349035131946</p>
</div>
<div class="info-container">
<p>Socials</p>
<p>2972</p>
</div>
</div>
<div class="form">
<form action="">
<div class="row">
<div class="input">
<label for="name">First Name</label>
<input type="text" placeholder="first name">
</div>
<div class="input">
<label for="name">Last Name</label>
<input type="text" placeholder="Last name">
</div>
</div>

<label for="name">Company Name</label>
<input type="text" placeholder="Company name">

<label for="name">Email Address</label>
<input type="text" placeholder="Email address">

<label for="name">Phone Number</label>
<input type="text" placeholder="Phone Number">

<label for="name">Message</label>
<textarea name="" id="" cols="30" rows="10"></textarea>

<div class="confirm">
<input type="checkbox" class="checkbox">
<label style="font-weight: 100;">I'd like to recieve more information about the company i understand and agree with Privacy Policy </label>
</div>

<button type="submit" class="submit">Submit</button>
</form>
</div>
</div>
</main>
<script src="js/custom.js"></script>
</body>
</html>
162 changes: 156 additions & 6 deletions css/styles.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,11 +4,6 @@
box-sizing: border-box;
}

html, body {
/* width: 100vw; */
/* overflow-x: hidden; */
}

body {
background: #f1f3f4;
font-family: 'Google Sans';
Expand Down Expand Up @@ -120,6 +115,11 @@ nav ul li a:hover {
color: #4285F4;
background: #fff;
}
.main {
max-width: 1200px;
margin: 0 auto;
padding: 0 20px 20px;
}

.hero {
position: relative;
Expand Down Expand Up @@ -709,6 +709,157 @@ header.hidden-sm {
align-items: center;
padding: 0 0.3rem;
}
.hero .doodle {
position: absolute;
z-index: -1;
}
.hero .doodle:nth-child(1) {
top: 50px;
left: 7%;
}
.hero .doodle:nth-child(2) {
top: 200px;
right: 5%;
}
.faq-container {
max-width: 1000px;
margin: 0 auto 100px;
}
.faq-card {
padding: 15px 20px;
margin: 0 15px 15px;
border-radius: 10px;
cursor: pointer;
}
.question-expand {
display: flex;
align-items: center;
justify-content: space-between;
}
.question {
font-weight: bold;
}
.expand {
border-radius: 100%;
padding: 1.5px 2px 0 2px;
opacity: 0.8;
background-color: #000;
background-blend-mode: multiply;
}
.answer {
display: none;
}
.answer ul {
padding: 10px 0 0 20px;
}
.faq-card:nth-child(1), .faq-card:nth-child(5) {
background-color: #B3CEFB;
border: 1px #b4d1ff solid;
}
.faq-card:nth-child(2), .faq-card:nth-child(6) {
background-color: #ADDCBC;
border: 1px #75ffa3 solid;
}
.faq-card:nth-child(3), .faq-card:nth-child(7) {
background-color: #FDDDA6;
border: 1px #ffb73b solid;
}
.faq-card:nth-child(4), .faq-card:nth-child(8) {
background-color: #FBD9D7;
border: 1px #ffb4b0 solid;
}
.privacy-hero {
display: flex;
justify-content: center;
background: #31A858;
padding: 30px;
color: #fff;
border-radius: 18.17px;
margin: 40px 0;
}
.privacy h1 {
text-align: center;
}
.privacy h2, h3 {
margin: 20px 0;
}
.privacy p {
margin: 20px 0;
}
.privacy ul {
margin-left: 20px;
}
.contact {
display: flex;
gap: 50px;
flex-direction: row;
margin: 20px auto;
max-width: 1000px;
}
.contact .sidebar {
padding: 30px;
color: #fff;
background: #0F9D58;
border-radius: 20px;
width: 30%;
}
.contact p.title {
font-size: 20px;
margin-bottom: 15px;
}
.contact .info-container {
margin: 20px 0;
font-size: 15px;
}
.contact .form {
flex: 1
}
.contact .row {
display: flex;
gap: 40px;
justify-content: space-between;
margin: 10px 0;
}
.contact .input {
flex: 1;
}
.contact label {
font-weight: bold;
}
.contact input:not(.checkbox), .contact textarea {
display: block;
padding: 10px;
margin: 10px 0 20px;
width: 100%;
border-radius: 5px;
border: 1px solid #AEAEAE;
}
.contact .confirm {
display: flex;
gap: 10px;
align-items: flex-start;
}
.submit {
width: 100%;
padding: 15px;
margin-top: 20px;
background: #31A858;
color: #fff;
font-size: 17px;
border: none;
border-radius: 15px;
}
@media only screen and (max-width: 600px){
.contact {
flex-direction: column;
}
.contact .sidebar {
width: 100%;
}
.contact .form {
width: 100%;
}
}

.join-us-content img {
width: 85%;
Expand Down Expand Up @@ -1274,7 +1425,6 @@ footer,

/* End of footer section */


/* html, body {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
Expand Down
Loading