jrtechs
/
jrtechs-github-graphs
mirror of https://github.com/jrtechs/github-graphs.git
1
0
Fork 0
Code Issues 0 Releases 1 Wiki Activity
Browse Source

Merge branch 'master' of github.com:jrtechs/github-graphs

pull/11/head
Bryce Murphy 5 years ago
parent
4522042586 bc400249e1
commit
4a5d628778
3 changed files with 57 additions and 15 deletions
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. +40
    -7
      public/index.html
  2. +3
    -3
      public/js/profileGen.js
  3. +14
    -5
      public/style.css

+ 40
- 7
public/index.html View File

@ -7,6 +7,14 @@
<link rel="shortcut icon" href="./favicon.ico" type="image/x-icon" /> <link rel="shortcut icon" href="./favicon.ico" type="image/x-icon" />
<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"> <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">
<link rel="stylesheet" href="./style.css" /> <link rel="stylesheet" href="./style.css" />
<script src="https://code.jquery.com/jquery-3.3.1.min.js"
integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
crossorigin="anonymous">
</script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"
integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM"
crossorigin="anonymous">
</script>
</head> </head>
<body> <body>
<div id="header-bar" class="d-flex flex-column flex-md-row shadow-sm align-items-center"> <div id="header-bar" class="d-flex flex-column flex-md-row shadow-sm align-items-center">
@ -37,23 +45,48 @@
</ul> </ul>
</div> </div>
</div> </div>
<div class="main container-fluid">
<div id="mainCarousel" class="carousel slide" data-ride="carousel">
<div class="carousel-inner">
<div class="carousel-item active">
<div class="text-center">
<img src="./img/DolphinCroissant.png" />
</div>
</div>
<div class="carousel-item">
<div class="text-center">
<img src="./img/DolphinCroissant.png" />
</div>
</div>
<div class="carousel-item">
<div class="text-center">
<img src="./img/DolphinCroissant.png" />
</div>
</div>
</div>
<a class="carousel-control-prev" href="#mainCarousel" role="button" data-slide="prev" m="1">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next" href="#mainCarousel" role="button" data-slide="next" m="1">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
<div class="main container-fluid" style="top: -100px;">
<div class="home-content row align-items-center"> <div class="home-content row align-items-center">
<div class="side-txt col"> <div class="side-txt col">
<div class="text-title text-center" style="padding: 10px;"> <div class="text-title text-center" style="padding: 10px;">
<h1 class="m-title" style="padding-top: 5px;">How to get started:</h1>
<h1 class="m-title" style="padding-top: 5px;">What can I do here?</h1>
</div> </div>
<div class="text-content"> <div class="text-content">
<p style="position: relative; padding: 10px;"> <p style="position: relative; padding: 10px;">
Head over to the 'Generate graphs' page and enter Head over to the 'Generate graphs' page and enter
the username of a GitHub user. The space on that
page will then populate with the requested GitHub
user and all the related user, visualizing the
connections between them.
the username of a GitHub user. You can then select
what kind of graph to generate based on that user.
</p> </p>
<p style="position: relative; padding: 10px;"> <p style="position: relative; padding: 10px;">
If you'd like to see how everything works, follow If you'd like to see how everything works, follow
the link to GitHub, where you can view all the work
the link to GitHub, where you can view everything
that went into making this functional. that went into making this functional.
</p> </p>
<p style="position: relative; padding: 10px;"> <p style="position: relative; padding: 10px;">

+ 3
- 3
public/js/profileGen.js View File

@ -11,14 +11,14 @@ function profileGen(username, container)
let html = let html =
"<div class=\"card\" style=\"w-100\"> \ "<div class=\"card\" style=\"w-100\"> \
<img class=\"card-img-top\" src=\""+user.avatar_url+"\"></img> \ <img class=\"card-img-top\" src=\""+user.avatar_url+"\"></img> \
<div class=\"row mx-0\"> \
<div class=\"col-9\"> \
<div class=\"row\"> \
<div class=\"col-8\"> \
<div class=\"card-body\"> \ <div class=\"card-body\"> \
<h5 class=\"card-title\">"+user.name+"</h1> \ <h5 class=\"card-title\">"+user.name+"</h1> \
<h6 class=\"card-subtitle\">"+user.login+"</h2> \ <h6 class=\"card-subtitle\">"+user.login+"</h2> \
</div> \ </div> \
</div> \ </div> \
<div class=\"col-sm\"> \
<div class=\"col-4\"> \
<button type=\"button\" class=\"btn btn-link pt-3\"> \ <button type=\"button\" class=\"btn btn-link pt-3\"> \
<a href=\""+makeUrl(user.login)+"\"> \ <a href=\""+makeUrl(user.login)+"\"> \
<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\"> \ <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\"> \

+ 14
- 5
public/style.css View File

@ -45,6 +45,15 @@
width: 300px; width: 300px;
} }
#mainCarousel {
height: 500px;
background-color: black;
}
.carousel-item {
height: 500px;
}
.error { .error {
color: rgb(208, 208, 208); color: rgb(208, 208, 208);
} }
@ -102,8 +111,8 @@
position: relative; position: relative;
width: 50%; width: 50%;
height: 100%; height: 100%;
max-height: 500px;
max-width: 500px;
max-height: 400px;
max-width: 400px;
} }
.side-txt { .side-txt {
@ -128,11 +137,11 @@
} }
.card { .card {
background-color: rgb(255, 255, 255);
background-color: rgb(208, 208, 208);
} }
.card-body { .card-body {
background-color: rgb(255, 255, 255);
background-color: rgb(242, 242, 242);
} }
.rounder { .rounder {
@ -141,7 +150,7 @@
.main { .main {
position: relative; position: relative;
top: 20px;
top: 10px;
} }
body { body {

Write Preview
Loading…
Cancel
Save