Skip to content
Snippets Groups Projects
Commit 45410b91 authored by r2-witter's avatar r2-witter
Browse files

adding intial website files

parents
No related branches found
No related tags found
No related merge requests found
Show whitespace changes
Inline Side-by-side
About.html 0 → 100644
+ 31
− 0
View file @ 45410b91
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, intial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="Styles/Main.css">
<title>Ability Sports</title>
</head>
<body>
<header>
<h1>Ability Sports</h1>
</header>
<div class="topnav">
<button class="btn home" onclick="document.location='Home.html'"><a href="#home">Home</a></button>
<button class="btn activites" onclick="document.location='Activites.html'"><a href="#activties">Activites</a></button>
<button class="btn booking" onclick="document.location='Booking.html'"><a href="#booking">Booking</a></button>
<button class="btn about" onclick="document.location='About.html'"><a class="active" href="#about">About</a></button>
<button class="btn contact" onclick="document.location='Contact.html'"><a href="#contact">Contact</a></button>
</div>
<h2 class="heading">About Ability Sports Bristol</h2>
<p1 class = "info">
Every Saturaday 12:00-14:30 we provide sporting activites for young
people with additional needs at Ability Sports Bristol.
</p1>
</body>
</html>
\ No newline at end of file
Activites.html 0 → 100644
+ 36
− 0
View file @ 45410b91
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, intial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="Styles/Main.css">
<title>Ability Sports</title>
</head>
<body>
<header>
<h1>Ability Sports</h1>
</header>
<div class="topnav">
<button class="btn home" onclick="document.location='Home.html'"><a href="#home">Home</a></button>
<button class="btn activites" onclick="document.location='Activites.html'"><a class="active" href="#activties">Activites</a></button>
<button class="btn booking" onclick="document.location='Booking.html'"><a href="#booking">Booking</a></button>
<button class="btn about" onclick="document.location='About.html'"><a href="#about">About</a></button>
<button class="btn contact" onclick="document.location='Contact.html'"><a href="#contact">Contact</a></button>
</div>
<p1 class="para1">
<h2>Authistic Football Group</h2>
The duration for each football session varies.
Each session costs 5 pounds.
</p1>
<p2 class="para2">
<h2>Downs Multi-Sports Group</h2>
The duration for each downs multi-sports group session varies.
Each session costs 5 pounds.
</p2>
</body>
</html>
\ No newline at end of file
Booking.html 0 → 100644
+ 92
− 0
View file @ 45410b91
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, intial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="Styles/Main.css">
<title>Ability Sports</title>
</head>
<body>
<header>
<h1>Ability Sports</h1>
</header>
<div class="topnav">
<button class="btn home" onclick="document.location='Home.html'"><a href="#home">Home</a></button>
<button class="btn activites" onclick="document.location='Activites.html'"><a href="#activties">Activites</a></button>
<button class="btn booking" onclick="document.location='Booking.html'"><a class="active" href="#booking">Booking</a></button>
<button class="btn about" onclick="document.location='About.html'"><a href="#about">About</a></button>
<button class="btn contact" onclick="document.location='Contact.html'"><a href="#contact">Contact</a></button>
</div>
<h2 class="person">Personal Details</h2>
<form action="/action_page.php">
<label for="fname">First Name:</label><br>
<input type="text" id="fname" name="fname"><br>
<label for="lname">Surname:</label><br>
<input type="text" id="lname" name="lname"><br><br>
<label for="DOB">Date of Birth (DD/MM/YYYY)</label><br>
<input type="text" id="DOB" name="DOB"><br>
<label for="disability">Disability:</label><br>
<input type="disability" id="disability" name="disability"><br><br>
<h2>Gaurdian Details</h2>
<label for="fname1">First Name:</label><br>
<input type="text" id="fname1" name="fname1"><br><br>
<label for="lname1">Surame:</label><br>
<input type="text" id="lname1" name="lname1"><br><br>
<label for="contact">Contact Number:</label><br>
<input type="text" id="contact" name="contact"><br><br>
<h2>Payment Details</h2>
<label for="c/r">Country/Region:</label><br>
<select>
<option value="opt1" selected>Select Option</option>
<option value=“opt2”>Russia</option>
<option value=“opt3” selected>United States</option>
<option value=“opt4” selected>Cayman Islands</option>
<option value=“opt5” selected>Canada</option>
<option value=“opt6” selected>United Kingdom</option>
</select><br><br>
<label for="cname1">Cardholder First Name:</label><br>
<input type="cname1" id="cname1" name="cname1"><br><br>
<label for="cname2">Cardholder Surame:</label><br>
<input type="cname2" id="cname2" name="cname2"><br><br>
<label for="card">Card Type:</label><br>
<select>
<option value="opt1" selected>Select Option</option>
<option value=“opt2”>Visa Debit/Visa/Visa Electron</option>
<option value=“opt3” selected>Mastercard</option>
<option value=“opt4” selected>Discover</option>
<option value=“opt5” selected>Maestro</option>
<option value=“opt6” selected>American Express</option>
</select><br><br>
<label for="cardnum">Card Number:</label><br>
<input type="cardnum" id="cardnum" name="cardnum"><br><br>
<label for="exdate">Expiry Date:</label><br>
<input type="exdate" id="exdate" name="exdate"><br><br>
<label for="code">Security Code:</label><br>
<input type="code" id="code" name="code"><br><br>
<h2>Billing Address</h2>
<label for="address1">Address Line 1:</label><br>
<input type="address1" id="address1" name="address1"><br><br>
<label for="address2">Address Line 2:</label><br>
<input type="address2" id="address2" name="address2"><br><br>
<label for="city">Town/City:</label><br>
<input type="city" id="city" name="city"><br><br>
<label for="post">Postcode:</label><br>
<input type="post" id="post" name="post"><br><br>
<input type="submit" value="Submit">
</form>
</body>
</html>
\ No newline at end of file
Contact.html 0 → 100644
+ 35
− 0
View file @ 45410b91
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, intial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="Styles/Main.css">
<title>Ability Sports</title>
</head>
<body>
<header>
<h1>Ability Sports</h1>
</header>
<div class="topnav">
<button class="btn home" onclick="document.location='Home.html'"><a href="#home">Home</a></button>
<button class="btn activites" onclick="document.location='Activites.html'"><a href="#activties">Activites</a></button>
<button class="btn booking" onclick="document.location='Booking.html'"><a href="#booking">Booking</a></button>
<button class="btn about" onclick="document.location='About.html'"><a href="#about">About</a></button>
<button class="btn contact" onclick="document.location='Contact.html'"><a class="active" href="#contact">Contact</a></button>
</div>
<h2 class="contact">Contact details</h2>
<h3 class="tele">Telephone Number</h3>
<p1 class="c1">+44 (0) 734 034 4762</p1>
<h3 class="email">Email Address</h3>
<p2 class="c2">abilitysports@hotmail.co.uk</p2>
<h3 class="address">Address</h3>
</body>
</html>
\ No newline at end of file
Home.html 0 → 100644
+ 65
− 0
View file @ 45410b91
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, intial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="Styles/Main.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Ability Sports</title>
</head>
<body>
<header>
<h1>Ability Sports</h1>
</header>
<div class="topnav">
<button class="btn home" onclick="document.location='Home.html'"><a class="active" href="#home">Home</a></button>
<button class="btn activites" onclick="document.location='Activites.html'"><a href="#activties">Activites</a></button>
<button class="btn booking" onclick="document.location='Booking.html'"><a href="#booking">Booking</a></button>
<button class="btn about" onclick="document.location='About.html'"><a href="#about">About</a></button>
<button class="btn contact" onclick="document.location='Contact.html'"><a href="#contact">Contact</a></button>
</div>
<section>
<p1>
<h3>
Sporting Activties for Young People
</h3>
Ability Sports session are inclusive of all young people with disabilites.
We do have a core group of kids in both sessions.
</p1><br><br>
<button class="bttn" onclick="document.location='Activites.html'"><a href="#activties">Find out more</a></button><br><br>
<p2>This organisation is led by representives from the BAME community in
St.Pauls, Bristol.
</p2><br><br>
<button class="bttn" onclick="document.location='About.html'"><a href="#about">Find out more</a></button><br><br>
<p3>
All young people with a range of disabilities are welcome.
</p3><br><br>
<button class="bttn" onclick="document.location='Booking.html'"><a href="#booking">JOIN NOW</a></button><br><br>
<p4>
Join us in giving back to the community and follow us on our social medias.
</p4><br><br>
<form>
<a href="#" class="fa fa-facebook" onclick="window.location.href='https://www.facebook.com/abilitysportsbristol1/'"></a>
</form><br><br>
<form>
<a href="#" class="fa fa-instagram" onclick="window.location.href='https://www.instagram.com/abilitysportsteam/?hl=en'"></a>
</form><br><br>
</section>
</body>
</html>
\ No newline at end of file
Styles/Main.css 0 → 100644
+ 185
− 0
View file @ 45410b91
/*Global*/
body {
display:grid;
grid-template-columns: 1fr 2fr 2fr 1fr;
grid-template-rows: auto auto 1fr 1fr;
}
header {
grid-column: 1/6;
grid-row: 1;
color: darkblue;
}
.topnav {
overflow: hidden;
background-color: #3090C7;
top: 0;
width: 100%;
grid-column: 1/6;
grid-row: 2;
}
.topnav a {
float: left;
display: block;
color: #f2f2f2;
text-align: center;
padding: 14px 16px;
text-decoration: none;
font-size: 17px;
width: 17%;
}
.btn:hover {
background: rgb(155, 196, 250);
color: black;
}
.btn {
border: none;
background-color: #3090C7;
padding: 14px 70px;
font-size: 16px;
cursor: pointer;
display: inline-block;
width: 19%;
}
/*Home Page*/
Section{
grid-column: 2/4;
grid-row: 3/6;
text-align: center;
color: darkblue
}
.bttn {
border: 2px solid darkblue;
background-color: #3090C7;
padding: 14px 70px;
font-size: 16px;
cursor: pointer;
display: inline-block;
border-radius: 12px;
}
.bttn:hover{
background-color: lightblue;
}
.fa {
padding: 20px;
font-size: 30px;
width: 50px;
text-align: center;
text-decoration: none;
margin: 5px 2px;
}
.fa:hover {
opacity: 0.7;
}
.fa-facebook {
background: #3B5998;
color: white;
}
.fa-instagram {
background: #3f729b;
color: white;
}
/*Activites*/
.para1{
grid-column: 1/3;
grid-row: 3;
color: darkblue;
}
.para2{
grid-column: 3/5;
grid-row: 4;
color: darkblue;
}
/*Booking*/
.person{
grid-column: 1/5;
grid-row: 3;
color: darkblue;
}
.fname{
grid-column: 1/2;
grid-row: 4;
color: darkblue;
}
.lname{
grid-column: 3/5;
grid-row: 4;
color: darkblue;
}
.dob{
grid-column: 1/2;
grid-row: 5;
color: darkblue;
}
.disab{
grid-column: 3/5;
grid-row: 5;
color: darkblue;
}
.fname1{
grid-column: 1/2;
grid-row: 6;
color: darkblue;
}
.lname1{
grid-column: 3/5;
grid-row: 6;
color: darkblue;
}
.number{
grid-column: 1/5;
grid-row: 7;
color: darkblue;
}
/*About*/
.heading{
grid-column: 1/5;
grid-row: 3;
color: darkblue;
}
.info{
grid-column: 1/5;
grid-row: 4;
color: darkblue;
}
/*Contact*/
.contact {
grid-column: 1/5;
grid-row: 3;
color: darkblue;
}
.tele {
grid-column: 1/5;
grid-row: 4;
color: darkblue;
}
.c1 {
grid-column: 1/5;
grid-row: 5;
color: darkblue;
}
.email {
grid-column: 1/5;
grid-row: 6;
color: darkblue;
}
.c2 {
grid-column: 1/5;
grid-row: 7;
color: darkblue;
}
.address {
grid-column: 1/5;
grid-row: 8;
color: darkblue;
}
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment