Skip to content

abalsh / Garlix

Go to a project
Commit 526c85b7 by Florian Shllaku
Options

changes

parent cb8c340f
Inline Side-by-side
Showing with 178 additions and 15 deletions
contact.php 0 → 100644
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="Currency Exchange Website">
<meta name="author" content="Florian Shllaku, Hakeem Shrief">
<title>Currency Exchange</title>
<!-- Connecting with Google Material for websit's logo/icon autorenew-->
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<!-- Setting up BootstrapCDN -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
<!-- Main Custom styles for the website -->
<link href="css/main.css" rel="stylesheet">
<link rel="stylesheet" href="css/contact.css">
</head>
<body class="text-center" background="img/background.jpg">
<div class="cover-container d-flex w-100 h-100 p-3 mx-auto flex-column">
<header class="masthead mb-auto">
<div class="inner">
<i class="material-icons masthead-brand img-fluid">autorenew</i>
<h3 class="masthead-brand">XCHANGE</h3>
<nav class="nav nav-masthead justify-content-center">
<a class="nav-link" href="index.html">Home</a>
<a class="nav-link" href="fiat.html">Fiat</a>
<a class="nav-link" href="crypto.html">Crypto</a>
<a class="nav-link" href="charts.html">Charts</a>
<a class="nav-link active" href="subscribe.html">Subscribe</a>
</nav>
</div>
</header>
<br> <br>
<div class="page-wrapper bg-gra-01 p-t-180 p-b-100 font-poppins">
<div class="wrapper wrapper--w780">
<div class="card card-3">
<div class="card-heading"></div>
<div class="card-body">
<h2 class="title">Contact Us</h2>
<br>
<p id="contact-left">Get in-touch with us.</p>
<form id="form" class="topBefore">
<div class="input-group">
<input id="name" type="text" placeholder="NAME">
</div>
<div class="input-group">
<input id="email" type="text" placeholder="E-MAIL">
</div>
<div class="input-group">
<textarea id="message" type="text" placeholder="MESSAGE"></textarea>
</div>
<div class="input-group">
<input id="submit" type="submit" value="Submit">
</div>
</form>
</div>
</div>
</div>
</div>
<footer class="mastfoot mt-auto">
<div class="inner">
<p>Develeoped and Designed by <a href="#">&#169;Garlix</a>.</p>
</div>
</footer>
</div>
</body>
</html>
\ No newline at end of file
css/contact.css 0 → 100644
@import url(https://fonts.googleapis.com/css?family=Lato:100,300,400);
body {
font-family: 'Lato', sans-serif;
color: #b3aca7;
}
#form {
position: relative;
width: 500px;
margin: 50px auto 100px auto;
}
input {
font-family: 'Lato', sans-serif;
font-size: 0.875em;
width: 470px;
height: 50px;
padding: 0px 15px 0px 15px;
background: transparent;
outline: none;
color: #726659;
border: solid 1px #b3aca7;
border-bottom: none;
}
input:hover {
background: #b3aca7;
color: #e2dedb;
}
textarea {
width: 470px;
max-width: 470px;
height: 110px;
max-height: 110px;
padding: 15px;
background: transparent;
outline: none;
color: #726659;
font-family: 'Lato', sans-serif;
font-size: 0.875em;
border: solid 1px #b3aca7;
}
textarea:hover {
background: #b3aca7;
color: #e2dedb;
}
#submit {
width: 470px;
padding: 0;
margin: -5px 0px 0px 0px;
font-family: 'Lato', sans-serif;
font-size: 0.875em;
color: #b3aca7;
outline:none;
cursor: pointer;
border: solid 1px #b3aca7;
border-top: none;
}
#submit:hover {
color: #e2dedb;
}
#contact-left{
margin-right: 320px;
}
\ No newline at end of file
css/main.css
...@@ -61,11 +61,11 @@ body { ...@@ -61,11 +61,11 @@ body {
.nav-masthead .nav-link:hover, .nav-masthead .nav-link:hover,
.nav-masthead .nav-link:focus { .nav-masthead .nav-link:focus {
color: #85bb65; color: #645394;
} }
.nav-masthead .active { .nav-masthead .active {
background-color: #85bb65; background-color: #645394;
color: #fff; color: #fff;
border-radius: 1px; border-radius: 1px;
} }
......
css/subscribe.css
...@@ -14,9 +14,9 @@ ...@@ -14,9 +14,9 @@
-webkit-border-radius: 3px; -webkit-border-radius: 3px;
-moz-border-radius: 3px; -moz-border-radius: 3px;
border-radius: 3px; border-radius: 3px;
background: #85bb65; background: #645394;
width: 960px; width: 720px;
height: 700px; height: 550px;
position: relative; position: relative;
margin:0 auto; margin:0 auto;
line-height: 1.4em; line-height: 1.4em;
...@@ -68,20 +68,23 @@ ...@@ -68,20 +68,23 @@
.input--style-3 { .input--style-3 {
padding: 5px 0; padding: 5px 0;
font-size: 16px; font-size: 16px;
color: #ccc; color: #fff;
background: transparent; background: transparent;
border: 1px; border: 1px;
} }
.input--style-3::-webkit-input-placeholder { .input--style-3::-webkit-input-placeholder {
/* WebKit, Blink, Edge */ /* WebKit, Blink, Edge */
color: #ccc; color: #fff;
} }
.input--style-3:-moz-placeholder { .input--style-3:-moz-placeholder {
/* Mozilla Firefox 4 to 18 */ /* Mozilla Firefox 4 to 18 */
color: #ccc; color: #fff;
opacity: 1; opacity: 1;
} }
.paragraph{
text-align: left;
}
\ No newline at end of file
fiat.html → currency.php
<!Doctype html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
...@@ -23,9 +22,9 @@ ...@@ -23,9 +22,9 @@
<h3 class="masthead-brand">XCHANGE</h3> <h3 class="masthead-brand">XCHANGE</h3>
<nav class="nav nav-masthead justify-content-center"> <nav class="nav nav-masthead justify-content-center">
<a class="nav-link" href="index.html">Home</a> <a class="nav-link" href="index.html">Home</a>
<a class="nav-link active" href="fiat.html">Fiat</a> <a class="nav-link active" href="currency.php">Currency</a>
<a class="nav-link" href="crypto.html">Crypto</a> <a class="nav-link" href="crypto.html">Crypto</a>
<a class="nav-link" href="charts.html">Charts</a> <a class="nav-link" href="contact.php">Contact</a>
<a class="nav-link" href="subscribe.html">Subscribe</a> <a class="nav-link" href="subscribe.html">Subscribe</a>
</nav> </nav>
</div> </div>
......
index.html
...@@ -22,9 +22,9 @@ ...@@ -22,9 +22,9 @@
<h3 class="masthead-brand">XCHANGE</h3> <h3 class="masthead-brand">XCHANGE</h3>
<nav class="nav nav-masthead justify-content-center"> <nav class="nav nav-masthead justify-content-center">
<a class="nav-link active" href="index.html">Home</a> <a class="nav-link active" href="index.html">Home</a>
<a class="nav-link" href="fiat.html">Fiat</a> <a class="nav-link" href="currency.php">Currency</a>
<a class="nav-link" href="crypto.html">Crypto</a> <a class="nav-link" href="crypto.html">Crypto</a>
<a class="nav-link" href="charts.html">Charts</a> <a class="nav-link" href="contact.php">Contact</a>
<a class="nav-link" href="subscribe.html">Subscribe</a> <a class="nav-link" href="subscribe.html">Subscribe</a>
</nav> </nav>
</div> </div>
......
subscribe.html
...@@ -36,9 +36,10 @@ ...@@ -36,9 +36,10 @@
<div class="card card-3"> <div class="card card-3">
<div class="card-heading"></div> <div class="card-heading"></div>
<div class="card-body"> <div class="card-body">
<p>Subscribe to Us to get the latest news on fiat currency!</p>
<br>
<h2 class="title">Subscription Info</h2> <h2 class="title">Subscription Info</h2>
<br>
<p class="paragraph">Subscribe to our Newsletter to get more information about fiat and crypto currencies. By subscribing to us, you will be receiving everyday five main news article stories to get updated on what is going on in the currency world.</p>
<br>
<form method="POST"> <form method="POST">
<div class="input-group"> <div class="input-group">
<input class="input--style-3" type="text" placeholder="Name" name="name"> <input class="input--style-3" type="text" placeholder="Name" name="name">
......
worksapce.code-workspace 0 → 100644
{
"folders": [
{
"path": "."
}
],
"settings": {}
}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment