-
Notifications
You must be signed in to change notification settings - Fork 4
/
Copy pathwelcome.html
119 lines (119 loc) · 5.22 KB
/
welcome.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>CodeHub</title>
<link rel="stylesheet" href="./css/welcome.css" />
</head>
<body>
<main>
<img src="assets/codehubLogoTransparentWhite.png" id="logo" />
<p>Automatically sync your code from Codewars to GitHub</p>
<hr />
<div id="authenticate-request">
<p>Authenticate with GitHub</p>
<button id="authenticate-btn">
<img src="assets/githubLogo.png" id="github-logo" />Authenticate
</button>
</div>
<div id="link-repo-request">
<label for="repo-options">Choose an option:</label>
<select name="repo-options" id="repo-options">
<option value="new-repo">Create a new repository</option>
<option value="existing-repo">Select an existing repository</option>
</select>
<div class="input-container">
<input placeholder="Repository name" type="text" id="user-input" />
<span class="tooltip-wrapper">
<svg
xmlns="http://www.w3.org/2000/svg"
width="16"
height="16"
fill="currentColor"
class="bi bi-info-circle"
viewBox="0 0 16 16"
>
<path
d="M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14m0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16"
/>
<path
d="m8.93 6.588-2.29.287-.082.38.45.083c.294.07.352.176.288.469l-.738 3.468c-.194.897.105 1.319.808 1.319.545 0 1.178-.252 1.465-.598l.088-.416c-.2.176-.492.246-.686.246-.275 0-.375-.193-.304-.533zM9 4.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0"
/>
</svg>
<div class="tooltip-text">
Enter the repository name followed by an optional directory path.
For example: coding_challenges/codewars
</div>
</span>
</div>
<button id="get-started-btn">Get Started</button>
</div>
<div id="repo-connected">
<p>Successfully linked <a href="#" id="repo-url"></a> to CodeHub!</p>
<p><a href="" id="unlink-repo">Unlink repository</a></p>
<p>
You're all set! Solve additional problems
<a href="https://www.codewars.com/dashboard" target="_blank">here</a>.
</p>
</div>
<footer>
<button id="star-repo-button">⭐️ Star CodeHub on GitHub</button>
<div id="footer-icons">
<a
href="https://github.com/febinbellamy/CodeHub/labels/bug"
target="_blank"
>
<svg
xmlns="http://www.w3.org/2000/svg"
width="30"
height="30"
fill="currentColor"
class="bi bi-bug"
viewBox="0 0 16 16"
>
<path
d="M4.355.522a.5.5 0 0 1 .623.333l.291.956A5 5 0 0 1 8 1c1.007 0 1.946.298 2.731.811l.29-.956a.5.5 0 1 1 .957.29l-.41 1.352A5 5 0 0 1 13 6h.5a.5.5 0 0 0 .5-.5V5a.5.5 0 0 1 1 0v.5A1.5 1.5 0 0 1 13.5 7H13v1h1.5a.5.5 0 0 1 0 1H13v1h.5a1.5 1.5 0 0 1 1.5 1.5v.5a.5.5 0 1 1-1 0v-.5a.5.5 0 0 0-.5-.5H13a5 5 0 0 1-10 0h-.5a.5.5 0 0 0-.5.5v.5a.5.5 0 1 1-1 0v-.5A1.5 1.5 0 0 1 2.5 10H3V9H1.5a.5.5 0 0 1 0-1H3V7h-.5A1.5 1.5 0 0 1 1 5.5V5a.5.5 0 0 1 1 0v.5a.5.5 0 0 0 .5.5H3c0-1.364.547-2.601 1.432-3.503l-.41-1.352a.5.5 0 0 1 .333-.623M4 7v4a4 4 0 0 0 3.5 3.97V7zm4.5 0v7.97A4 4 0 0 0 12 11V7zM12 6a4 4 0 0 0-1.334-2.982A3.98 3.98 0 0 0 8 2a3.98 3.98 0 0 0-2.667 1.018A4 4 0 0 0 4 6z"
/>
</svg>
</a>
<a
href="https://github.com/febinbellamy/CodeHub/labels/enhancement"
target="_blank"
>
<svg
xmlns="http://www.w3.org/2000/svg"
width="30"
height="30"
fill="currentColor"
class="bi bi-lightbulb"
viewBox="0 0 16 16"
>
<path
d="M2 6a6 6 0 1 1 10.174 4.31c-.203.196-.359.4-.453.619l-.762 1.769A.5.5 0 0 1 10.5 13a.5.5 0 0 1 0 1 .5.5 0 0 1 0 1l-.224.447a1 1 0 0 1-.894.553H6.618a1 1 0 0 1-.894-.553L5.5 15a.5.5 0 0 1 0-1 .5.5 0 0 1 0-1 .5.5 0 0 1-.46-.302l-.761-1.77a2 2 0 0 0-.453-.618A5.98 5.98 0 0 1 2 6m6-5a5 5 0 0 0-3.479 8.592c.263.254.514.564.676.941L5.83 12h4.342l.632-1.467c.162-.377.413-.687.676-.941A5 5 0 0 0 8 1"
/>
</svg>
</a>
<a
href="mailto:[email protected]?subject=CodeHub"
target="_blank"
>
<svg
xmlns="http://www.w3.org/2000/svg"
width="30"
height="30"
fill="currentColor"
class="bi bi-envelope"
viewBox="0 0 16 16"
>
<path
d="M0 4a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2zm2-1a1 1 0 0 0-1 1v.217l7 4.2 7-4.2V4a1 1 0 0 0-1-1zm13 2.383-4.708 2.825L15 11.105zm-.034 6.876-5.64-3.471L8 9.583l-1.326-.795-5.64 3.47A1 1 0 0 0 2 13h12a1 1 0 0 0 .966-.741M1 11.105l4.708-2.897L1 5.383z"
/>
</svg>
</a>
</div>
</footer>
</main>
<script src="scripts/welcome.js" type="module"></script>
</body>
</html>