Merge branch 'master' of github.com:FFinancial/miles-city-council

This commit is contained in:
scoliono 2021-12-27 07:02:16 +00:00
commit 83b514c69f
2 changed files with 59 additions and 8 deletions

View File

@ -77,11 +77,13 @@ nav a:hover {
.banner { .banner {
display: flex; display: flex;
background-color: var(--banner-bg); background-color: var(--banner-bg);
color: var(--button-text);
margin: 0 auto; margin: 0 auto;
justify-content: center; justify-content: center;
padding: 2rem 0; padding: 2rem 0;
width: 60%; width: 60%;
min-width: 400px; min-width: 400px;
flex-direction: column;
} }
.banner form { .banner form {
@ -165,6 +167,7 @@ nav a:hover {
} }
.container { .container {
display: block;
flex: 1 0 0; flex: 1 0 0;
font-size: 24px; font-size: 24px;
padding: 4rem; padding: 4rem;
@ -210,19 +213,41 @@ nav a:hover {
#joinus { #joinus {
background-image: url(../assets/bote.jpg); background-image: url(../assets/bote.jpg);
flex-direction: column;
text-align: center; text-align: center;
} }
#joinus .container { #contact .banner {
display: block; text-align: center;
} }
#joinus h1 { .header h1 {
background-color: var(--button-bg); background-color: var(--button-bg);
color: var(--button-text); color: var(--button-text);
font-size: 56px; font-size: 56px;
padding: 0 2rem; padding: 0 2rem;
margin: 0 auto 2rem auto; margin: 0 auto 2rem auto;
max-width: 200px; text-align: center;
max-width: 300px;
}
#donate .banner {
flex-direction: row;
align-items: center;
}
#donate .banner > div {
padding: 1rem;
}
.donate-buttons {
display: flex;
flex-wrap: wrap;
justify-content: center;
}
.donate-buttons button {
margin: 0.5rem;
width: 10rem;
text-align: center;
padding: 1rem 0;
} }

View File

@ -52,13 +52,13 @@
<div class="banner"> <div class="banner">
<form action="/subscribe.php" method="POST"> <form action="/subscribe.php" method="POST">
<div> <div>
<input type="text" name="full_name" placeholder="Full Name"> <input type="text" name="full_name" placeholder="Full Name" required>
</div> </div>
<div> <div>
<input type="email" name="email" placeholder="Email"> <input type="email" name="email" placeholder="Email" required>
</div> </div>
<div> <div>
<input type="phone" name="phone" placeholder="Phone Number"> <input type="tel" name="phone" placeholder="Phone Number" required>
</div> </div>
<div> <div>
<button type="submit">Stay Notified!</button> <button type="submit">Stay Notified!</button>
@ -68,8 +68,34 @@
</div> </div>
</div> </div>
<div id="donate" class="fullpage"> <div id="donate" class="fullpage">
<div class="container">
<div class="header">
<h1>Donate</h1>
</div>
<div class="banner">
<div>
<h2>What is your contribution?</h2>
</div>
<div class="donate-buttons">
<button>$10</button>
<button>$20</button>
<button>$50</button>
<button>$100</button>
<button>Other</button>
</div>
</div>
</div>
</div> </div>
<div id="contact" class="fullpage"> <div id="contact" class="fullpage">
<div class="container">
<div class="header">
<h1>Contact</h1>
</div>
<div class="banner">
<h2>For any further inquiries please email</h2>
<h2>contact@mileslinden.com</h2>
</div>
</div>
</div> </div>
</body> </body>
</html> </html>