128 lines
6.3 KiB
HTML
128 lines
6.3 KiB
HTML
<!doctype html>
|
|
<html>
|
|
<head>
|
|
<title>Wroten - Code 2 College</title>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<link href="https://unpkg.com/tailwindcss@^2/dist/tailwind.min.css" rel="stylesheet">
|
|
</head>
|
|
|
|
<body class="bg-gray-100">
|
|
<header>
|
|
<nav class="bg-white shadow">
|
|
<div class="max-w-7xl mx-auto px-2 sm:px-6 lg:px-8">
|
|
<div class="relative flex justify-between h-16">
|
|
<div class="absolute inset-y-0 left-0 flex items-center sm:hidden">
|
|
<!-- Mobile menu button -->
|
|
<button class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500" aria-expanded="false">
|
|
<span class="sr-only">Open main menu</span>
|
|
<!-- Icon when menu is closed. -->
|
|
<!--
|
|
Heroicon name: menu
|
|
|
|
Menu open: "hidden", Menu closed: "block"
|
|
-->
|
|
<svg class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
|
|
</svg>
|
|
<!-- Icon when menu is open. -->
|
|
<!--
|
|
Heroicon name: x
|
|
|
|
Menu open: "block", Menu closed: "hidden"
|
|
-->
|
|
<svg class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
<div class="flex-1 flex items-center justify-center sm:items-stretch sm:justify-start">
|
|
<div class="flex-shrink-0 flex items-center">
|
|
<img class="h-12 w-12 rounded-full w-auto" src="https://images.unsplash.com/photo-1472099645785-5658abf4ff4e?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80" alt="">
|
|
</div>
|
|
<div class="hidden sm:ml-6 sm:flex sm:space-x-8"><a
|
|
href="/"
|
|
class="border-transparent text-gray-500 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium"
|
|
|
|
>
|
|
Welcome
|
|
</a><a
|
|
href="/repos/"
|
|
class="border-transparent text-gray-500 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium"
|
|
|
|
>
|
|
Repos
|
|
</a><a
|
|
href="/work-history/"
|
|
class="border-transparent text-gray-500 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium"
|
|
|
|
>
|
|
Work
|
|
</a><a
|
|
href="/volunteering/"
|
|
class="border-transparent text-gray-500 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium"
|
|
|
|
>
|
|
Volunteering
|
|
</a><a
|
|
href="/uses/"
|
|
class="border-transparent text-gray-500 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium"
|
|
|
|
>
|
|
About | Uses
|
|
</a></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!--
|
|
Mobile menu, toggle classes based on menu state.
|
|
|
|
Menu open: "block", Menu closed: "hidden"
|
|
-->
|
|
<div class="hidden sm:hidden">
|
|
<div class="pt-2 pb-4 space-y-1">
|
|
<!-- Current: "bg-indigo-50 border-indigo-500 text-indigo-700", Default: "border-transparent text-gray-500 hover:bg-gray-50 hover:border-gray-300 hover:text-gray-700" -->
|
|
<a href="#" class="bg-indigo-50 border-indigo-500 text-indigo-700 block pl-3 pr-4 py-2 border-l-4 text-base font-medium">Dashboard</a>
|
|
<a href="#" class="border-transparent text-gray-500 hover:bg-gray-50 hover:border-gray-300 hover:text-gray-700 block pl-3 pr-4 py-2 border-l-4 text-base font-medium">Team</a>
|
|
<a href="#" class="border-transparent text-gray-500 hover:bg-gray-50 hover:border-gray-300 hover:text-gray-700 block pl-3 pr-4 py-2 border-l-4 text-base font-medium">Projects</a>
|
|
<a href="#" class="border-transparent text-gray-500 hover:bg-gray-50 hover:border-gray-300 hover:text-gray-700 block pl-3 pr-4 py-2 border-l-4 text-base font-medium">Calendar</a>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
</header>
|
|
|
|
|
|
<main class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<div class="max-w-3x1 mx-auto mb-5">
|
|
<div class="-ml-2 mt-8 flex flex-wrap items-baseline">
|
|
<h1 class="ml-8 mt-2 text-lg font-medium text-gray-900">
|
|
Code 2 College
|
|
</h1>
|
|
<p class="ml-2 mt-1 text-sm text-gray-500 truncate">in Volunteering</p>
|
|
</div>
|
|
</div>
|
|
<div class="bg-white overflow-hidden shadow sm:rounded-lg">
|
|
<div class="px-4 py-5 sm:p-6">
|
|
<h2>Preparing the Next Generation for Success</h2>
|
|
<p>There's more than one way to volunteer in today's world. Offering one's skills as a web designer and developer is a great way to give back while tackling unique challenges.</p>
|
|
<p><img src="/code2college.jpg" alt="Volunteers"></p>
|
|
<p>Homegrown tech talent is what Code2College is all about. Eager students from underrepresented groups are ready to learn STEM field topics and Code2College reaches out to those in the industry to help them get there.</p>
|
|
<p>Meeting with these excited young minds for interview preparation really changed the way I connect with potential hires.</p>
|
|
<p><img src="/code2college2.png" alt="Curriculum"></p>
|
|
<p>Recently they've opened their curriculum planning to outside collaboration. It's been an exciting challenge to carefully consider the best ways to teach the fundamentals of web development from "What is HTML?" to "I can build my own web app!".</p>
|
|
|
|
</div>
|
|
</div>
|
|
</main>
|
|
|
|
<footer class="mt-12 max-w-7xl mx-auto py-12 px-4 sm:px-6 md:flex md:items-center md:justify-between lg:px-8">
|
|
<div class="text-gray-500">
|
|
Built in <a href="https://www.11ty.dev/">Eleventy</a> with <a href="https://tailwindui.com/">Tailwind UI</a>
|
|
</div>
|
|
</footer>
|
|
</body>
|
|
</html>
|
|
|
|
|
|
|