forked from PaulleDemon/awesome-landing-pages
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
158 lines (120 loc) · 6.52 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
147
148
149
150
151
152
153
154
155
156
157
158
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Notion Portfolio</title>
<meta name="description" content="" />
<link
rel="shortcut icon"
href="./assets/logo.png"
type="image/x-icon"
/>
<!-- Open Graph / Facebook -->
<meta property="og:title" content="Title of the project" />
<meta property="og:description" content="" />
<meta property="og:type" content="website" />
<meta property="og:url" content="https://github.com/PaulleDemon" />
<!--Replace with the current website url-->
<meta property="og:image" content="" />
<!-- <link rel="stylesheet" href="../../tailwind-css/tailwind-runtime.css" /> -->
<link rel="stylesheet" href="./css/tailwind-build.css" />
<link rel="stylesheet" href="css/index.css" />
<link rel="stylesheet" href="css/content.css" />
<link
rel="stylesheet"
href="https://fonts.googleapis.com/icon?family=Material+Icons"
/>
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-icons/1.11.3/font/bootstrap-icons.min.css"
integrity="sha512-dPXYcDub/aeb08c63jRq/k6GaKccl256JQy/AnOq7CAnEZ9FzSL9wSbcZkMp4R26vBsMLFYH4kQ67/bbV8XaCQ=="
crossorigin="anonymous"
referrerpolicy="no-referrer"
/>
</head>
<body
class="tw-flex tw-min-h-[100vh] tw-flex-col tw-text-base tw-bg-[#fff] tw-overflow-hidden tw-font-sans"
>
<div class="tw-flex tw-h-[100vh] tw-w-full">
<section
class="tw-relative tw-bg-secondary tw-text-textColor tw-flex tw-min-h-[100vh] tw-max-w-[240px] tw-min-w-[240px] tw-flex-col
tw-overflow-hidden max-md:tw-mt-[50px] "
>
<div class="tw-w-full tw-gap-2 tw-flex tw-p-4 tw-flex-col">
<div class="page-link tw-flex tw-flex-gap-1">
<div class="icon">
<img src="./assets/images/home/paul.png" class="tw-object-contain">
</div>
<div class="">Paul's Portfolio</div>
<i class="bi bi-chevron-down tw-text-sm"></i>
</div>
<button onclick="openSearch()" class="page-link tw-text-base tw-flex tw-flex-gap-1">
<i class="bi bi-search"></i>
<div class="">Search</div>
</button>
<button onclick="loadPage('/about')" class="page-link tw-text-base tw-flex tw-flex-gap-1">
<i class="bi bi-house"></i>
<div class="">Home</div>
</butto>
</div>
<div class="tw-mt-4 tw-px-4 tw-text-sm">
private
</div>
<div
class="tw-flex tw-px-4 tw-p-1 tw tw-overflow-y-auto tw-h-full tw-min-h-[100vh] tw-w-full tw-gap-1 tw-flex-col"
id="sidebar-content"
>
</div>
</section>
<section
class="tw-relative tw-bg-white tw-flex tw-h-full tw-w-full tw-max-w-[100vw] tw-flex-col"
>
<div class="tw-flex tw-w-full tw-text-sm tw-p-2" id="title">
</div>
<div class="tw-overflow-auto tw-min-h-[30vh] tw-h-full tw-px-[25%] tw-w-full">
<div class="tw-w-full tw-flex tw-mt-[140px]">
<div class="tw-w-[85px] tw-h-[85px] tw-flex tw-place-content-center tw-items-center tw-text-6xl tw-overflow-hidden tw-text-6xl tw-rounded-lg" id="content-icon">
</div>
</div>
<div
class="tw-mt-8 tw-gap-10 content tw-pb-[30vh]" id="content"
>
</div>
</div>
</section>
</div>
<div class="tw-fixed tw-hidden tw-z-10 tw-top-0 tw-flex tw-w-full tw-h-full tw-bg-[#2f2f2fb3]" id="search-bg-container">
<div class="tw-relative tw-flex tw-w-full tw-h-full ">
<div id="search-container" class="tw-absolute tw-text-gray-500 tw-overflow-hidden tw-left-[50%] tw--translate-x-[50%] tw-top-24 tw-w-[750px] tw-h-[500px] tw-bg-white tw-rounded-xl">
<div class="tw-flex tw-px-4 tw-p-2 tw-text-lg tw-w-full tw-place-items-center tw-gap-2">
<i class="bi bi-search"></i>
<input type="text" oninput="updateSearch(event)" class="tw-w-full input" autofocus placeholder="Search" id="search-input">
</div>
<div class="tw-w-full tw-h-[2px] tw-bg-[#ededec]"></div>
<div class="tw-flex tw-flex-col tw-p-2 tw-text-textColor tw-h-[400px] tw-overflow-y-auto">
<div class="tw-text-[12px] tw-text-[#93928f]">
Today
</div>
<div class="tw-flex tw-flex-col" id="search-dropdown">
<div class="tw-flex tw-rounded-md tw-p-2 tw-px-3 tw-w-full hover:tw-bg-[#f1f0ef]">
edwed
</div>
</div>
</div>
<div class="tw-w-full tw-h-[2px] tw-bg-[#ededec]"></div>
<div class="tw-w-full tw-h-[30px]">
</div>
</div>
</div>
</div>
</body>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.10.0/styles/arduino-light.min.css" integrity="sha512-M4nH9C7TRCVWLGruh9fHTfYxGWDiKpOGNjpfC9irhF06aLiYmJczZlW+/6IKOZ+75AGk4Wn4clgd6J13T0zzXg==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.10.0/highlight.min.js" integrity="sha512-6yoqbrcLAHDWAdQmiRlHG4+m0g/CT/V9AGyxabG8j7Jk8j3r3K6due7oqpiRMZqcYe9WM2gPcaNNxnl2ux+3tA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="
https://cdn.jsdelivr.net/npm/[email protected]/dist/markdown-it.min.js
"></script>
<script src="./scripts/utils.js"></script>
<script src="./scripts/plugins.js"></script>
<script src="./index.js"></script>
</html>