Website for visualizing a persons github network.
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.

103 lines
4.6 KiB

5 years ago
5 years ago
  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. <link rel="icon" href="./favicon.ico" type="image/x-icon" />
  7. <link rel="shortcut icon" href="./favicon.ico" type="image/x-icon" />
  8. <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
  9. <link rel="stylesheet" href="./style.css" />
  10. <script src="https://code.jquery.com/jquery-3.3.1.min.js"
  11. integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
  12. crossorigin="anonymous">
  13. </script>
  14. <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"
  15. integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM"
  16. crossorigin="anonymous">
  17. </script>
  18. </head>
  19. <body>
  20. <div id="header-bar" class="d-flex flex-column flex-md-row shadow-sm align-items-center">
  21. <div id="header-title">
  22. <a href="./index.html">
  23. <img id="logo" src="./logo.svg" />
  24. </a>
  25. </div>
  26. <div id="navigation">
  27. <ul class="nav">
  28. <li class="nav-item">
  29. <a href="./GraphGenerator.html">
  30. Generate graphs
  31. </a>
  32. </li>
  33. <div class="nav-sep"></div>
  34. <li class="nav-item">
  35. <a href="https://github.com/jrtechs/github-graphs">
  36. View on GitHub
  37. </a>
  38. </li>
  39. <div class="nav-sep"></div>
  40. <li class="nav-item">
  41. <a href="./about.html">
  42. About
  43. </a>
  44. </li>
  45. </ul>
  46. </div>
  47. </div>
  48. <div id="mainCarousel" class="carousel slide" data-ride="carousel">
  49. <div class="carousel-inner">
  50. <div class="carousel-item active">
  51. <div class="image-vert text-center">
  52. <img class="img-fluid carousel-img" src="./img/friends.png" />
  53. </div>
  54. </div>
  55. <div class="carousel-item">
  56. <div class="image-vert text-center">
  57. <img class="img-fluid carousel-img" src="./img/repos.png" />
  58. </div>
  59. </div>
  60. <div class="carousel-item">
  61. <div class="image-vert text-center">
  62. <img class="img-fluid carousel-img" src="./img/DolphinCroissant.png" />
  63. </div>
  64. </div>
  65. </div>
  66. <a class="carousel-control-prev" href="#mainCarousel" role="button" data-slide="prev" m="1">
  67. <span class="carousel-control-prev-icon" aria-hidden="true"></span>
  68. <span class="sr-only">Previous</span>
  69. </a>
  70. <a class="carousel-control-next" href="#mainCarousel" role="button" data-slide="next" m="1">
  71. <span class="carousel-control-next-icon" aria-hidden="true"></span>
  72. <span class="sr-only">Next</span>
  73. </a>
  74. </div>
  75. <div class="main container-fluid" style="top: -100px;">
  76. <div class="home-content row align-items-center">
  77. <div class="side-txt col">
  78. <div class="text-title text-center" style="padding: 10px;">
  79. <h1 class="m-title" style="padding-top: 5px;">What can I do here?</h1>
  80. </div>
  81. <div class="text-content">
  82. <p style="position: relative; padding: 10px;">
  83. Head over to the 'Generate graphs' page and enter
  84. the username of a GitHub user. You can then select
  85. what kind of graph to generate based on that user.
  86. </p>
  87. <p style="position: relative; padding: 10px;">
  88. If you'd like to see how everything works, follow
  89. the link to GitHub, where you can view everything
  90. that went into making this functional.
  91. </p>
  92. <p style="position: relative; padding: 10px;">
  93. If you're interested in knowing more about this
  94. project, additional information can be found on
  95. the About page.
  96. </p>
  97. </div>
  98. </div>
  99. <img class="side-img img-fluid col" src="./img/graphExample.png" />
  100. </div>
  101. <p>check</p>
  102. </div>
  103. </body>
  104. </html>