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.
 
 
 

110 lines
7.0 KiB

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8" />
  5. <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
  6. <meta name="description" content="" />
  7. <meta name="author" content="" />
  8. <title>Hi, K!</title>
  9. <!-- Favicon-->
  10. <link rel="icon" type="image/x-icon" href="assets/favicon.ico" />
  11. <!-- Bootstrap icons-->
  12. <link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.4.1/font/bootstrap-icons.css" rel="stylesheet" />
  13. <!-- Core theme CSS (includes Bootstrap)-->
  14. <link href="css/styles.css" rel="stylesheet" />
  15. </head>
  16. <body>
  17. <!-- Responsive navbar-->
  18. <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
  19. <div class="container px-lg-5">
  20. <a class="navbar-brand" href="#!">Hi, K!</a>
  21. </div>
  22. </nav>
  23. <!-- Header-->
  24. <header class="py-5">
  25. <!-- This header intentionally left blank -->
  26. </header>
  27. <!-- Page Content-->
  28. <section class="pt-4">
  29. <div class="container px-lg-5">
  30. <!-- Page Features-->
  31. <div class="row gx-lg-5">
  32. <div class="col-lg-6 col-xxl-4 col-sm-6 mb-5">
  33. <div class="card bg-light border-0 h-100">
  34. <div class="card-body text-center p-4 p-lg-5 pt-0 pt-lg-0">
  35. <div class="feature bg-primary bg-gradient text-white rounded-3 mb-4 mt-n4"><i class="bi bi-check2-square"></i></div>
  36. <h2 class="fs-4 fw-bold"><a href="https://todoist.com/app/today" id='todoist'>Todoist</a></h2>
  37. <p class="mb-0">Tasks, to-dos &amp; project tracking.</p>
  38. </div>
  39. </div>
  40. </div>
  41. <div class="col-lg-6 col-xxl-4 col-sm-6 mb-5">
  42. <div class="card bg-light border-0 h-100">
  43. <div class="card-body text-center p-4 p-lg-5 pt-0 pt-lg-0">
  44. <div class="feature bg-primary bg-gradient text-white rounded-3 mb-4 mt-n4"><i class="bi bi-journals"></i></div>
  45. <h2 class="fs-4 fw-bold"><a href="https://www.icloud.com/notes/" id='icloud_notes'>iCloud notes</a></h2>
  46. <p class="mb-0">Free-form notes.</p>
  47. </div>
  48. </div>
  49. </div>
  50. <div class="col-lg-6 col-xxl-4 col-sm-6 mb-5">
  51. <div class="card bg-light border-0 h-100">
  52. <div class="card-body text-center p-4 p-lg-5 pt-0 pt-lg-0">
  53. <div class="feature bg-primary bg-gradient text-white rounded-3 mb-4 mt-n4" style="margin-right: 10px;"><i class="bi bi-envelope"></i></div><div class="feature bg-primary bg-gradient text-white rounded-3 mb-4 mt-n4"><i class="bi bi-person-lines-fill"></i></div><div class="feature bg-primary bg-gradient text-white rounded-3 mb-4 mt-n4" style="margin-left: 10px;"><i class="bi bi-calendar-event"></i></div>
  54. <h2 class="fs-4 fw-bold"><a href="https://mail.mania.systems" id='fastmail'>Fastmail</a></h2>
  55. <p class="mb-0">Email, contacts &amp; most calendaring.<br/>Also stores some older backups.</p>
  56. </div>
  57. </div>
  58. </div>
  59. <div class="col-lg-6 col-xxl-4 col-sm-6 mb-5">
  60. <div class="card bg-light border-0 h-100">
  61. <div class="card-body text-center p-4 p-lg-5 pt-0 pt-lg-0">
  62. <div class="feature bg-primary bg-gradient text-white rounded-3 mb-4 mt-n4" style="margin-right: 10px;"><i class="bi bi-cloud"></i></div><div class="feature bg-primary bg-gradient text-white rounded-3 mb-4 mt-n4"><i class="bi bi-pen"></i></div><div class="feature bg-primary bg-gradient text-white rounded-3 mb-4 mt-n4" style="margin-left: 10px;"><i class="bi bi-rss"></i></div>
  63. <h2 class="fs-4 fw-bold"><a href="https://docs.mania.systems" id='nextcloud'>Nextcloud</a></h2>
  64. <p class="mb-0">File storage &amp; sync, document editing, RSS aggregator.</p>
  65. </div>
  66. </div>
  67. </div>
  68. <div class="col-lg-6 col-xxl-4 col-sm-6 mb-5">
  69. <div class="card bg-light border-0 h-100">
  70. <div class="card-body text-center p-4 p-lg-5 pt-0 pt-lg-0">
  71. <div class="feature bg-primary bg-gradient text-white rounded-3 mb-4 mt-n4"><i class="bi bi-file-earmark-lock"></i></div>
  72. <h2 class="fs-4 fw-bold"><a href="https://pad.mania.systems" id='cryptpad'>CryptPad</a></h2>
  73. <p class="mb-0">Collaborative and E2EE, but non-synced, document editing and storage.</p>
  74. </div>
  75. </div>
  76. </div>
  77. <div class="col-lg-6 col-xxl-4 col-sm-6 mb-5">
  78. <div class="card bg-light border-0 h-100">
  79. <div class="card-body text-center p-4 p-lg-5 pt-0 pt-lg-0">
  80. <div class="feature bg-primary bg-gradient text-white rounded-3 mb-4 mt-n4"><i class="bi bi-images"></i></div>
  81. <h2 class="fs-4 fw-bold"><a href="https://www.icloud.com/photos" id='icloud_photos'>iCloud Photos</a></h2>
  82. <p class="mb-0">Photos &amp; albums.</p>
  83. </div>
  84. </div>
  85. </div>
  86. <div class="col-lg-6 col-xxl-4 col-sm-6 mb-5">
  87. <div class="card bg-light border-0 h-100">
  88. <div class="card-body text-center p-4 p-lg-5 pt-0 pt-lg-0">
  89. <div class="feature bg-primary bg-gradient text-white rounded-3 mb-4 mt-n4"><i class="bi bi-music-player"></i></div>
  90. <h2 class="fs-4 fw-bold"><a href="https://beta.music.apple.com" id='apple_music'>Apple Music</a></h2>
  91. <p class="mb-0">Music library &amp; playlists.</p>
  92. </div>
  93. </div>
  94. </div>
  95. </div>
  96. </div>
  97. </section>
  98. <!-- Footer-->
  99. <footer class="py-5 bg-dark">
  100. <!-- Footer intentionally left blank <3 -->
  101. </footer>
  102. <script src="https://code.jquery.com/jquery-3.6.0.slim.min.js"></script>
  103. <!-- Bootstrap core JS-->
  104. <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js"></script>
  105. <!-- Core theme JS-->
  106. <script src="js/scripts.js"></script>
  107. </body>
  108. </html>