Updated website

This commit is contained in:
Erick Clark 2019-01-26 20:08:26 -06:00
parent 04fd64b223
commit 07ddca4e87
2 changed files with 71 additions and 17 deletions

View file

@ -1,6 +1,20 @@
body {
font-family: 'Fira Sans', sans-serif;
}
h2 {
text-align: center;
}
a, a:active, a:visited {
color: #6D5354;
}
a:hover {
text-decoration: underline;
}
.btn, .btn:visited {
background-color: #6D5354;
border-color: #6D5354;
color: #fff;
}
.atc-header {
background-color: #DCDCB0;
padding: 1rem 0;
@ -22,16 +36,27 @@ body {
margin: 0 auto;
}
.screens {
margin-top: 1rem;
margin-top: 2rem;
}
.screens img {
max-height: 144px;
max-height: 288px;
margin-top: 1rem;
border: 1px #6D5354 solid;
}
@media only screen and (max-width : 630px) {
@media (max-width : 768px) {
.atc-header h1 {
font-size: 1.6rem;
text-align: center;
}
}
@media (max-width : 576px) {
h2 {
font-size: 1.8rem;
text-align: center;
}
.atc-header h1 {
font-size: 1.4rem;
text-align: center;
}
.logo {
margin: 0 auto 15px auto;
@ -43,5 +68,8 @@ body {
width: 100%;
display: block;
margin: 0 auto;
}
}
.screens img {
max-height: 180px;
}
}

View file

@ -7,21 +7,22 @@
<title>Are There Cookies? Check for good stuff near you.</title>
<link href="https://fonts.googleapis.com/css?family=Fira+Sans:400,500,700" rel="stylesheet">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI706tWS" crossorigin="anonymous">
<link rel="stylesheet" href="styles.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/fancyapps/fancybox@3.5.6/dist/jquery.fancybox.min.css" />
<link rel="stylesheet" href="css/styles.css">
</head>
<body>
<div class="jumbotron jumbotron-fluid atc-header">
<div class="container">
<div class="row align-items-center justify-content-center no-gutters">
<div class="col-lg-1 col-md-2"><img src="img/atc-cookie-logo.png" class="logo img-fluid" alt="logo" /></div>
<div class="col-lg-5 col-md-6"><h1>Are There Cookies?</h1></div>
<div class="col-lg-1 col-sm-2"><img src="img/atc-cookie-logo.png" class="logo img-fluid" alt="logo" /></div>
<div class="col-lg-5 col-sm-6"><h1>Are There Cookies?</h1></div>
</div>
</div>
</div>
<div class="container">
<div class="row">
<div class="col-12">
<div class="row justify-content-center">
<div class="col-md-8">
<h2>Welcome to our Alpha testing program.</h2>
<p><strong>Are There Cookies?</strong> is an app that lets people share and learn what's available near by. Mainly food.</p>
<ul>
@ -34,19 +35,44 @@
see that there are only a few cookies left? Let other people know. This works for anything. Are you at that food truck
and see they are sold our of their special? Let everyone know. Do you want to know if that bakery has anyone cupcakes left? Look it up.</p> -->
<div class="screens">
<h5 class="text-center">Are There Cookies? Screens</h5>
<div class="row">
<div class="col-4 text-center">
<a data-fancybox="gallery" href="img/Screenshot3.jpg">
<img src="img/Screenshot3.jpg" alt="Screenshot 1" />
</a>
</div>
<div class="col-4 text-center">
<a data-fancybox="gallery" href="img/Screenshot2.jpg">
<img src="img/Screenshot2.jpg" alt="Screenshot 2" />
</a>
</div>
<div class="col-4 text-center">
<a data-fancybox="gallery" href="img/Screenshot1.png">
<img src="img/Screenshot1.png" alt="Screenshot 3" />
</a>
</div>
</div>
</div>
<div class="screens">
<p>
<a href="https://docs.google.com/forms/d/e/1FAIpQLSc_AilhtIsOm9B6ZrbstkCV1ks-V-5jJ692JScl9p9FSuXmxg/viewform?usp=sf_link" target="_blank">
Having a problem with our app? Let us know.
</a>
</p>
<p>&copy; Copyright 2019</p>
</div>
</div>
</div>
<br />
<h4 class="text-center">Are There Cookies? Screens</h4>
<div class="row justify-content-center screens">
<div class="col-sm-3 col-md-2 text-center"><img src="img/Screenshot3.jpg" class="img-fluid" alt="Screenshot 1" /></div>
<div class="col-sm-3 col-md-2 text-center"><img src="img/Screenshot2.jpg" class="img-fluid" alt="Screenshot 2" /></div>
<div class="col-sm-3 col-md-2 text-center"><img src="img/Screenshot1.png" class="img-fluid" alt="Screenshot 3" /></div>
</div>
</div>
</body>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.6/umd/popper.min.js" integrity="sha384-wHAiFfRlMFy6i5SRaxvfOCifBUQy1xHdJ/yoi7FRNXMRBu5WHdZYu1hA6ZOblgut" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js" integrity="sha384-B0UglyR+jN6CkvvICOB2joaf5I4l3gm9GU6Hc1og6Ls7i6U/mkkaduKaBhlAXv9k" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/gh/fancyapps/fancybox@3.5.6/dist/jquery.fancybox.min.js"></script>
</html>