-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
146 lines (138 loc) · 7.44 KB
/
index.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
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="author" content="Onikoko Abdullahi">
<meta name="description" content="Brief description">
<meta property="og:title" content="Your Page Title">
<meta property="og:description" content="Brief description">
<meta property="og:image" content="/some-image.png">
<meta property="og:url" content="/this-page.html">
<meta property="og:site_name" content="Your Site Name">
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:image:alt" content="image description">
<link href="./style.css" rel="stylesheet">
<link rel="icon" type="image/svg+xml" href="/favicon.svg">
<title>kokoforbes/github-profile</title>
</head>
<body>
<!-- PRIMARY NAV BEGINS -->
<div class="nav__primary">
<div class="hamburger">
<div></div>
<div></div>
<div></div>
</div>
<div class="nav__left">
<!-- LOGO -->
<div class="logo">
<a href="/index.html"><svg class="octicon octicon-mark-github v-align-middle" height="32" viewBox="0 0 16 16"
version="1.1" width="32" aria-hidden="true">
<path fill-rule="evenodd"
d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0016 8c0-4.42-3.58-8-8-8z" />
</svg></a>
</div>
<!-- SEARCH -->
<div class="search">
<input type="text" name="search" id="search" placeholder="Search or jump to.." class="search__input">
<div></div>
</div>
<ul class="nav__links">
<li><a href="#" class="nav__item">Pull requests</a></li>
<li><a href="#" class="nav__item">Issues</a></li>
<li><a href="#" class="nav__item">Codespaces</a></li>
<li><a href="#" class="nav__item">Marketplace</a></li>
<li><a href="#" class="nav__item">Explore</a></li>
</ul>
</div>
<div class="nav__right">
<div class="notification">
<svg class="octicon octicon-bell" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true">
<path d="M8 16a2 2 0 001.985-1.75c.017-.137-.097-.25-.235-.25h-3.5c-.138 0-.252.113-.235.25A2 2 0 008 16z">
</path>
<path fill-rule="evenodd"
d="M8 1.5A3.5 3.5 0 004.5 5v2.947c0 .346-.102.683-.294.97l-1.703 2.556a.018.018 0 00-.003.01l.001.006c0 .002.002.004.004.006a.017.017 0 00.006.004l.007.001h10.964l.007-.001a.016.016 0 00.006-.004.016.016 0 00.004-.006l.001-.007a.017.017 0 00-.003-.01l-1.703-2.554a1.75 1.75 0 01-.294-.97V5A3.5 3.5 0 008 1.5zM3 5a5 5 0 0110 0v2.947c0 .05.015.098.042.139l1.703 2.555A1.518 1.518 0 0113.482 13H2.518a1.518 1.518 0 01-1.263-2.36l1.703-2.554A.25.25 0 003 7.947V5z">
</path>
</svg>
</div>
<div class="new">
<svg class="octicon octicon-plus" viewBox="0 0 16 16" version="1.1" width="16" height="16" aria-hidden="true">
<path fill-rule="evenodd"
d="M8 2a.75.75 0 01.75.75v4.5h4.5a.75.75 0 010 1.5h-4.5v4.5a.75.75 0 01-1.5 0v-4.5h-4.5a.75.75 0 010-1.5h4.5v-4.5A.75.75 0 018 2z">
</path>
</svg>
<span class="dropdown"></span>
</div>
<div class="profile">
<img src="" id="navImg" alt="" class="profile__img--small">
<span class="dropdown"></span>
</div>
</div>
</div>
<!-- /PRIMARY NAV END -->
<!-- SECONDARY NAV BEGINS -->
<div class="secondary__nav">
<div class="tab flex__row">
<svg class="octicon octicon-book UnderlineNav-octicon hide-on-mobile" height="16" viewBox="0 0 16 16"
version="1.1" width="16" aria-hidden="true">
<path fill-rule="evenodd"
d="M0 1.75A.75.75 0 01.75 1h4.253c1.227 0 2.317.59 3 1.501A3.744 3.744 0 0111.006 1h4.245a.75.75 0 01.75.75v10.5a.75.75 0 01-.75.75h-4.507a2.25 2.25 0 00-1.591.659l-.622.621a.75.75 0 01-1.06 0l-.622-.621A2.25 2.25 0 005.258 13H.75a.75.75 0 01-.75-.75V1.75zm8.755 3a2.25 2.25 0 012.25-2.25H14.5v9h-3.757c-.71 0-1.4.201-1.992.572l.004-7.322zm-1.504 7.324l.004-5.073-.002-2.253A2.25 2.25 0 005.003 2.5H1.5v9h3.757a3.75 3.75 0 011.994.574z">
</path>
</svg>
<a href="http://" class="tab__text">Overview</a>
</div>
<div class="tab flex__row active">
<svg class="octicon octicon-repo UnderlineNav-octicon hide-on-mobile" height="16" viewBox="0 0 16 16"
version="1.1" width="16" aria-hidden="true">
<path fill-rule="evenodd"
d="M2 2.5A2.5 2.5 0 014.5 0h8.75a.75.75 0 01.75.75v12.5a.75.75 0 01-.75.75h-2.5a.75.75 0 110-1.5h1.75v-2h-8a1 1 0 00-.714 1.7.75.75 0 01-1.072 1.05A2.495 2.495 0 012 11.5v-9zm10.5-1V9h-8c-.356 0-.694.074-1 .208V2.5a1 1 0 011-1h8zM5 12.25v3.25a.25.25 0 00.4.2l1.45-1.087a.25.25 0 01.3 0L8.6 15.7a.25.25 0 00.4-.2v-3.25a.25.25 0 00-.25-.25h-3.5a.25.25 0 00-.25.25z">
</path>
</svg>
<a href="http://" class="tab__text">Repositoires</a>
<div class="repo__count">80</div>
</div>
<div class="tab flex__row">
<svg class="octicon octicon-project UnderlineNav-octicon hide-on-mobile" height="16" viewBox="0 0 16 16"
version="1.1" width="16" aria-hidden="true">
<path fill-rule="evenodd"
d="M1.75 0A1.75 1.75 0 000 1.75v12.5C0 15.216.784 16 1.75 16h12.5A1.75 1.75 0 0016 14.25V1.75A1.75 1.75 0 0014.25 0H1.75zM1.5 1.75a.25.25 0 01.25-.25h12.5a.25.25 0 01.25.25v12.5a.25.25 0 01-.25.25H1.75a.25.25 0 01-.25-.25V1.75zM11.75 3a.75.75 0 00-.75.75v7.5a.75.75 0 001.5 0v-7.5a.75.75 0 00-.75-.75zm-8.25.75a.75.75 0 011.5 0v5.5a.75.75 0 01-1.5 0v-5.5zM8 3a.75.75 0 00-.75.75v3.5a.75.75 0 001.5 0v-3.5A.75.75 0 008 3z">
</path>
</svg>
<a href="http://" class="tab__text">Projects</a>
</div>
<div class="tab flex__row">
<svg class="octicon octicon-package UnderlineNav-octicon hide-on-mobile" height="16" viewBox="0 0 16 16"
version="1.1" width="16" aria-hidden="true">
<path fill-rule="evenodd"
d="M8.878.392a1.75 1.75 0 00-1.756 0l-5.25 3.045A1.75 1.75 0 001 4.951v6.098c0 .624.332 1.2.872 1.514l5.25 3.045a1.75 1.75 0 001.756 0l5.25-3.045c.54-.313.872-.89.872-1.514V4.951c0-.624-.332-1.2-.872-1.514L8.878.392zM7.875 1.69a.25.25 0 01.25 0l4.63 2.685L8 7.133 3.245 4.375l4.63-2.685zM2.5 5.677v5.372c0 .09.047.171.125.216l4.625 2.683V8.432L2.5 5.677zm6.25 8.271l4.625-2.683a.25.25 0 00.125-.216V5.677L8.75 8.432v5.516z">
</path>
</svg>
<a href="http://" class="tab__text">Packages</a>
</div>
</div>
<!-- SECONDARY NAV END -->
<div class="main__content">
<!-- profile details -->
<div class="desktop__profile"></div>
<div class="mobile__profile"></div>
<!-- repositories tab -->
<div class="repo__tab">
<div class="search__container">
<input type="text" name="" id="repositories_input" class="repo__search" placeholder="Find a repository...">
</div>
<div class="search__result">
<span class="pub__count text--bold">124</span>
<span>results for</span>
<span class="text--bold">Public</span>
<span>repositories</span>
</div>
<div class="repos"></div>
</div>
</div>
</div>
</section>
<script type="module" src="./script.js"></script>
</body>
</html>