<![CDATA[
<div class="container-fluid bg-3 text-center">
<div class="row">
<div class="col-sm-4 icon">
<div class="menu-card">
<img style="width: 65%" src="./Front Page Pictures/brainstorming_icon.png" alt="week 1 placeholder" />
<a href="./01_intro/index.html" class="menu-link">Week 1: Intro</a>
</div>
</div>
<div class="col-sm-4 icon">
<div class="menu-card">
<img style="width: 65%" src="./Front Page Pictures/Laser_cutting_icon.png" alt="week 2 placeholder" />
<a href="./02_2Ddesign/index.html" class="menu-link">Week 2: 2D Design</a>
</div>
</div>
<div class="col-sm-4 icon">
<div class="menu-card">
<img style="width: 65%" src="./Front Page Pictures/hand_tools_icon.png" alt="week 3 placeholder" />
<a href="./03_fabrication/index.html" class="menu-link">Week 3: Hand Tools and Fabrication</a>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-4 icon">
<div class="menu-card">
<img style="width: 65%" src="./Front Page Pictures/microcontoller_icon.png" alt="week 4 placeholder" />
<a href="./04_microcontroller/index.html" class="menu-link">Week 4: Programming</a>
</div>
</div>
<div class="col-sm-4 icon">
<div class="menu-card">
<img style="width: 65%" src="./Front Page Pictures/3D_print_icon.png" alt="week 5 placeholder" />
<a href="./05_3Ddesign/index.html" class="menu-link">Week 5: 3D Design</a>
</div>
</div>
<div class="col-sm-4 icon">
<div class="menu-card">
<img style="width: 65%" src="./Front Page Pictures/input_device_icon.png" alt="week 6 placeholder" />
<a href="./06_inputs/index.html" class="menu-link">Week 6: Input Devices</a>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-4 icon">
<div class="menu-card">
<img style="width: 65%" src="./Front Page Pictures/output_device_icon.png" alt="week 7 placeholder" />
<a href="./07_outputs/index.html" class="menu-link">Week 7: Output Devices</a>
</div>
</div>
<div class="col-sm-4 icon">
<div class="menu-card">
<img style="width: 65%" src="./Front Page Pictures/CNC Milling Icon.png" alt="week 8 placeholder" />
<a href="./08_cnc/index.html" class="menu-link">Week 8: CNC Milling</a>
</div>
</div>
<div class="col-sm-4 icon">
<div class="menu-card">
<img style="width: 65%" src="./Front Page Pictures/Networking_icon.png" alt="week 9 placeholder" />
<a href="./09_networking/index.html" class="menu-link">Week 9: Networking</a>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-4 icon">
<div class="menu-card">
<img style="width: 65%" src="./Front Page Pictures/machine_building_icon.png" alt="machine building placeholder" />
<a href="./10_machine/index.html" class="menu-link">Machine Building</a>
</div>
</div>
<div class="col-sm-4 icon">
<div class="menu-card">
<img style="width: 65%" src="./Front Page Pictures/final_project_icon.png" alt="final project placeholder" />
<a href="./13_finalproject/index.html" class="menu-link">Final Project</a>
</div>
</div>
</div>
</div>
<style>
.menu-card {
padding: 15px;
border: 1px solid #ddd;
border-radius: 8px;
background-color: #f9f9f9;
transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.menu-card:hover {
transform: translateY(-5px);
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}
.menu-link {
display: block;
margin-top: 10px;
font-size: 1.2em;
text-decoration: none;
color: #333;
font-weight: bold;
transition: color 0.3s ease;
}
.menu-link:hover {
color: #007bff;
}
.icon {
margin-bottom: 20px;
}
</style>
]]>