Personal blog written from scratch using Node.js, Bootstrap, and MySQL. https://jrtechs.net
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.

113 lines
3.2 KiB

  1. <!-- Introduction menu -->
  2. <div class="w3-col l4">
  3. <!-- About Card -->
  4. <div class="w3-card w3-margin w3-margin-top">
  5. <img src="/w3images/avatar_g.jpg" style="width:100%">
  6. <div class="w3-container w3-white">
  7. <h4><b>My Name</b></h4>
  8. <p>Just me, myself and I, exploring the universe of uknownment. I have a heart of love and a interest of lorem ipsum and mauris neque quam blog. I want to share my world with you.</p>
  9. </div>
  10. </div><hr>
  11. <!-- Posts -->
  12. <div class="w3-card w3-margin">
  13. <div class="w3-container w3-padding">
  14. <h4>Popular Posts</h4>
  15. </div>
  16. <ul class="w3-ul w3-hoverable w3-white">
  17. <li class="w3-padding-16">
  18. <img src="/w3images/workshop.jpg" alt="Image" class="w3-left w3-margin-right" style="width:50px">
  19. <span class="w3-large">Lorem</span><br>
  20. <span>Sed mattis nunc</span>
  21. </li>
  22. <li class="w3-padding-16">
  23. <img src="/w3images/gondol.jpg" alt="Image" class="w3-left w3-margin-right" style="width:50px">
  24. <span class="w3-large">Ipsum</span><br>
  25. <span>Praes tinci sed</span>
  26. </li>
  27. <li class="w3-padding-16">
  28. <img src="/w3images/skies.jpg" alt="Image" class="w3-left w3-margin-right" style="width:50px">
  29. <span class="w3-large">Dorum</span><br>
  30. <span>Ultricies congue</span>
  31. </li>
  32. <li class="w3-padding-16 w3-hide-medium w3-hide-small">
  33. <img src="/w3images/rock.jpg" alt="Image" class="w3-left w3-margin-right" style="width:50px">
  34. <span class="w3-large">Mingsum</span><br>
  35. <span>Lorem ipsum dipsum</span>
  36. </li>
  37. </ul>
  38. </div>
  39. <hr>
  40. <!-- Labels / tags -->
  41. <div class="w3-card w3-margin">
  42. <div class="w3-container w3-padding">
  43. <h4>Tags</h4>
  44. </div>
  45. <div class="w3-container w3-white">
  46. <p><span class="w3-tag w3-black w3-margin-bottom">Travel</span> <span class="w3-tag w3-light-grey w3-small w3-margin-bottom">New York</span> <span class="w3-tag w3-light-grey w3-small w3-margin-bottom">London</span>
  47. <span class="w3-tag w3-light-grey w3-small w3-margin-bottom">IKEA</span> <span class="w3-tag w3-light-grey w3-small w3-margin-bottom">NORWAY</span> <span class="w3-tag w3-light-grey w3-small w3-margin-bottom">DIY</span>
  48. <span class="w3-tag w3-light-grey w3-small w3-margin-bottom">Ideas</span> <span class="w3-tag w3-light-grey w3-small w3-margin-bottom">Baby</span> <span class="w3-tag w3-light-grey w3-small w3-margin-bottom">Family</span>
  49. <span class="w3-tag w3-light-grey w3-small w3-margin-bottom">News</span> <span class="w3-tag w3-light-grey w3-small w3-margin-bottom">Clothing</span> <span class="w3-tag w3-light-grey w3-small w3-margin-bottom">Shopping</span>
  50. <span class="w3-tag w3-light-grey w3-small w3-margin-bottom">Sports</span> <span class="w3-tag w3-light-grey w3-small w3-margin-bottom">Games</span>
  51. </p>
  52. </div>
  53. </div>
  54. <!-- END Introduction Menu -->
  55. </div>