moved buttons around and updated FAQ section

This commit is contained in:
AW_Dev 2024-05-10 22:32:43 -07:00
parent 78fe08c83c
commit e150ff14cf
2 changed files with 37 additions and 20 deletions

View file

@ -113,12 +113,21 @@
src="./icons/arrow.svg"></button> -->
</div>
</section>
<section class="project-idea-section section">
<section class="project-idea-section section container">
<div class="project-idea-container">
<h1 class="project-idea-title">What are you waiting for?</h1>
<button class="gambling-select hoverable redbutton">Get project ideas</button>
<button onclick="generateBuildLink(this)" class="gambling-build hoverable greenbutton disabled">Continue <img src="./icons/arrow.svg"></button>
<button onclick="location.href='./selector/'" class="gambling-select bluebutton hoverable">Full parts list</button>
<h1 class="project-idea-title">
What are you waiting for?
</h1>
<button onclick="location.href='./selector/'" class="gambling-select bluebutton hoverable">
Parts list
</button>
<button class="gambling-select hoverable redbutton">
What can I make?
</button>
<button onclick="generateBuildLink(this)" class="gambling-build hoverable greenbutton disabled">
Open the editor
<img src="./icons/arrow_white.svg">
</button>
<!-- <div class="project-idea-images">
<img src="./parts/humidity.png">
<img src="./parts/humidity.png">
@ -141,8 +150,8 @@
</button> -->
</div>
</section>
<section class="section container">
<h1>Readme</h1>
<section class="faq-section section container">
<h1>Frequently Asked Questions</h1>
<div class="faq-grid">
<div class="faq-item">
<h3>How many projects can I build?</h3>
@ -183,7 +192,8 @@
<div class="footer-information">
<p class="footer-information-header">
A project by
<a href="https://hackclub.com">Hack Club</a>. Always <a href="https://github.com/hackclub/site">open source</a>.
<a href="https://hackclub.com">Hack Club</a>. Always <a href="https://github.com/hackclub/site">open
source</a>.
</p>
<p>
<a href="https://hackclub.com/bin/prelaunch">Rewind</a>

View file

@ -292,6 +292,8 @@ button {
background-color: #9FEEB5;
filter: saturate(1) brightness(1);
transition: filter 500ms;
display: flex;
gap: 20px;
}
.gambling-build.disabled {
@ -324,14 +326,14 @@ button {
.project-idea-container {
margin: auto;
padding: 0 20px;
max-width: 52em;
padding: 50px;
width: inherit;
box-sizing: border-box;
}
.project-idea-container h1 {
font-size: 40px;
font-size: 50px;
margin-bottom: 10px;
}
.project-idea-images {
@ -647,15 +649,14 @@ button {
border-radius: 30px;
}
.project-idea-container {
margin: auto;
padding: 0 20px;
max-width: 52em;
.faq-section {
padding: 50px;
}
.project-idea-container h1 {
font-size: 40px;
margin-bottom: 10px;
.faq-section h1 {
font-size: 50px;
}
.faq-grid {
@ -668,10 +669,14 @@ button {
.faq-item {
padding: 20px;
border: 1px solid rgba(255, 255, 255, 0.4);
border-radius: 20px;
background-color: rgba(255, 255, 255, 0.2);
background-color: #EEEDED;
backdrop-filter: blur(10px);
filter: saturate(0.9);
}
.faq-item a {
color: black;
}
.faq-item p {
@ -697,6 +702,8 @@ button {
width: 80%;
}
@media only screen and (max-width: 52em) {
.timeline-list {
grid-template-columns: 1fr;