Code for my portfolio website
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

167 lines
8.2 KiB

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <title>Ravi Shah's Portfolio</title>
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <meta name="description" content="Find Ravi Shah's software and hardware projects, qualifications, interests, and more!">
  7. <meta charset="UTF-8">
  8. <link rel="preconnect" href="https://fonts.gstatic.com">
  9. <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300&display=swap" rel="stylesheet">
  10. <link href="css/styles.css" rel="stylesheet" media="screen">
  11. <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
  12. <link rel="manifest" href="static/site.webmanifest">
  13. <link rel="apple-touch-icon" sizes="180x180" href="static/apple-touch-icon.png">
  14. <link rel="icon" type="image/png" sizes="32x32" href="static/favicon-32x32.png">
  15. <link rel="icon" type="image/png" sizes="16x16" href="static/favicon-16x16.png">
  16. <!-- Matomo -->
  17. <script type="text/javascript">
  18. var _paq = window._paq = window._paq || [];
  19. /* tracker methods like "setCustomDimension" should be called before "trackPageView" */
  20. _paq.push(['trackPageView']);
  21. _paq.push(['enableLinkTracking']);
  22. (function() {
  23. var u = "//analytics.yeetpc.com/matomo/";
  24. _paq.push(['setTrackerUrl', u + 'matomo.php']);
  25. _paq.push(['setSiteId', '3']);
  26. var d = document,
  27. g = d.createElement('script'),
  28. s = d.getElementsByTagName('script')[0];
  29. g.type = 'text/javascript';
  30. g.async = true;
  31. g.src = u + 'matomo.js';
  32. s.parentNode.insertBefore(g, s);
  33. })();
  34. </script>
  35. <!-- End Matomo Code -->
  36. </head>
  37. <body>
  38. <div class="page-container">
  39. <div class="content-wrap">
  40. <!-- Top Navbar -->
  41. <div class="Navbar">
  42. <div class="Navbar__Link Navbar__Link-brand">
  43. <h1><a href="#">Ravi Shah's Portfolio</a></h1>
  44. </div>
  45. <div class="Navbar__Link Navbar__Link-toggle">
  46. <i class="fa fa-bars"></i>
  47. </div>
  48. <nav class="Navbar__Items Navbar__Items--right">
  49. <div class="Navbar__Link">
  50. <a href="/projects">Projects</a>
  51. </div>
  52. <div class="Navbar__Link">
  53. <a href="https://www.yeetpc.com/blog">Blog</a>
  54. </div>
  55. <div class="Navbar__Link">
  56. <a href="/gallery.html">Gallery</a>
  57. </div>
  58. <div class="Navbar__Link">
  59. <a href="mailto:ravi@yeetpc.com">Contact Me</a>
  60. </div>
  61. </nav>
  62. </div>
  63. <!-- End Top Navbar -->
  64. <!-- Begin Top Banner -->
  65. <div class="banner">
  66. <div class="card-top-banner">
  67. <p class="top-banner-text">HI 👋 I'M RAVI SHAH!</p>
  68. <p class="top-banner-text-smaller">
  69. I'm currently a freshman at
  70. <a href="https://westwood.roundrockisd.org/">Westwood High School</a>. Some of my projects include <a href="https://github.com/Rav4s/New-Pi-Garage-Door-Opener">a Raspberry Pi smart garage door controller</a>, <a href="https://www.yeetpc.com">a fully self-hosted website</a>,
  71. <a href="https://www.yeetpc.com/blog/entry.php">my ThinkPad X220 Tablet build</a>, and
  72. <a href="https://repairability.yeetpc.com">an iFixit repairability score dashboard</a>. I'm always looking for new projects to work on and contribute to. You can find me on <a href="https://www.reddit.com/user/rav4s">Reddit</a>,
  73. <a href="https://github.com/rav4s">GitHub</a>, and on my <a href="https://www.youtube.com/channel/UC3T95a3-KMIcSLYbDhdKiTA/featured">YouTube channel</a>.
  74. </p>
  75. <br />
  76. <p class="top-banner-text-medium">Popular Projects</p>
  77. </div>
  78. </div>
  79. <!-- End Top Banner -->
  80. <!-- Begin Responsive Layout -->
  81. <div class="row">
  82. <div class="column">
  83. <br />
  84. <div id="smartgaragedoor" class="card">
  85. <div class="card-header">
  86. Smart Garage Door Controller
  87. </div>
  88. <div class="card-image-box">
  89. <img src="static/img/projects/smart-garage-door-thumbnail.jpeg" alt="Smart Garage Door Opener Thumbnail" class="card-image" />
  90. </div>
  91. <div class="card-icon-container">
  92. <ul class="social-icons">
  93. <li>
  94. <a href="https://youtu.be/An7KQbmUnhs"><img src='static/img/common/YouTube.svg' alt="View the Smart Garage Door Build Video on YouTube" /></a>
  95. </li>
  96. <li>
  97. <a href="https://github.com/Rav4s/New-Pi-Garage-Door-Opener"><img src='static/img/common/Github.svg' alt="View the Smart Garage Door Github" /></a>
  98. </li>
  99. </ul>
  100. </div>
  101. </div>
  102. </div>
  103. <div class="column">
  104. <br />
  105. <div id="repairdashboard" class="card">
  106. <div class="card-header">
  107. Repairability Score Dashboard
  108. </div>
  109. <div class="card-image-box">
  110. <img src="static/img/projects/repairability-score-dashboard-thumbnail.png" alt="Repairability Score Dashboard Thumbnail" class="card-image" />
  111. </div>
  112. <div class="card-icon-container">
  113. <ul class="social-icons">
  114. <li>
  115. <a href="https://repairability.yeetpc.com"><img src='static/img/common/Internet.png' alt="View the live iFixit Repairability Score Dashboard" /></a>
  116. </li>
  117. <li>
  118. <a href="https://github.com/Rav4s/iFixit-Repairability-Dashboard"><img src='static/img/common/Github.svg' alt="View the Repairability Score Dashboard Github" /></a>
  119. </li>
  120. </ul>
  121. </div>
  122. </div>
  123. </div>
  124. <div class="column">
  125. <br />
  126. <div id="thinkpadx220" class="card">
  127. <div class="card-header">
  128. Thinkpad X220 Tablet Upgrades
  129. </div>
  130. <div class="card-image-box">
  131. <img src="static/img/projects/thinkpad-x220-tablet-upgrades-thumbnail.jpg" alt="Thinkpad X220 Tablet Upgrades Thumbnail" class="card-image" />
  132. </div>
  133. <div class="card-icon-container">
  134. <ul class="social-icons">
  135. <li>
  136. <a href="https://www.yeetpc.com/blog/entry.php"><img src='static/img/common/Internet.png' alt="View the Thinkpad X220 Tablet Upgrades Blog Post" /></a>
  137. </li>
  138. </ul>
  139. </div>
  140. </div>
  141. </div>
  142. </div>
  143. <!-- End Responsive Layout -->
  144. <!-- Begin Footer -->
  145. <div class="footer">
  146. <div class="footer-links">
  147. <a href="https://www.vecteezy.com/free-vector/social-media-icons">Icon Vectors by Vecteezy</a>
  148. <p>© 2021 Ravi Shah</p>
  149. </div>
  150. </div>
  151. <!-- End Footer -->
  152. </div>
  153. </div>
  154. <script src="js/redirects.js"></script>
  155. <script src="js/expandnavbar.js" defer></script>
  156. </body>
  157. </html>