forked from prometheux-ar/cyberpunk
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
123 lines (117 loc) · 6.03 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel=StyleSheet href="page/index.css" type="text/css" media=screen>
<title>Cyberpunk</title>
</head>
<body>
<nav class="layout-padding layout-row layout-align-end-center">
<a href="#about_us">About us</a>
<a href="#contact">Contact</a>
<a href="#collaborate">Collaborate</a>
<a class="button" target="blank" href="https://ctt.ac/lvset">
<div class="decoration"></div>
#MyThemeIsTheFeature
</a>
</nav>
<section>
<div class="content-section">
<div class="layout-row layout-align-start-center">
<div class="flex-50">
<img
data-tilt
data-tilt-perspective="500"
data-tilt-reset="true"
data-tilt-max="5"
class="main-elements-margin tilt-wrap" src="/page/common/images/logo.svg">
<h1 class="main-elements-margin main-title main-title-decoration">A crazy theme, coming from
the future, or something
like that...</h1>
<div class="layout-row layout-align-start-start">
<div class="button-content">
<a style="z-index: 1;" class="button button-large tilt-wrap"
data-tilt
data-tilt-glare
data-tilt-max-glare="0.8"
data-tilt-perspective="400"
data-tilt-reset="true"
data-tilt-max="5"
href="#shared">
<div class="decoration"></div>
<span>¡Install now!_</span>
<!-- <span class="button-hint">Or also</span> -->
</a>
<div class="decoration--button"></div>
</div>
<div class="layout-row layout-align-start-start button-group">
<div style="width: 58px; height: 58px;" class="layout-row layout-align-end-center">
<div style="height: 2px; width: calc(100% - 8px); background-color: black;"></div>
</div>
<a data-tilt data-tilt-glare data-tilt-max-glare="0.9" data-tilt-max="0" href="#" class="button-compact">
<img height="24px" width="24px" src="/page/common/images/Github.svg">
</a>
<a data-tilt data-tilt-glare data-tilt-max-glare="0.9" data-tilt-max="0" href="#" class="button-compact">
<img height="24px" width="24px" src="/page/common/images/Twitter.svg">
</a>
<a data-tilt data-tilt-glare data-tilt-max-glare="0.9" data-tilt-max="0" href="#" class="button-compact">
<img height="24px" width="24px" src="/page/common/images/Spotify.svg">
</a>
</div>
</div>
</div>
<div class="flex-60 layout-row layout-align-end-center">
<img style="position: relative; z-index: 1;" class="tilt-wrap"
data-tilt
data-tilt-perspective="1000"
data-tilt-reset="true"
data-tilt-max="5"
src="/page/common/images/preview.png"
width="95%"
>
</div>
</div>
</div>
<div class="body-content-decoration"></div>
</section>
<section style="margin: 0; width: 100%;">
<div class="body-content">
<div class="content-section">
<br><br><br>
<h1 class="title-content">
<div class="title-content--decoration-secondary"></div>
<div class="title-content--decoration"></div>
<span>Why Cyberpunk</span>
</h1>
<p>I know, it may look like a rainbow and even give the sensation of distraction. But fundamentally I chose the cyberpunk theme, because it allows me to use a very wide color palette, this helps each fragment of code to have practically a color, so our eye quickly detects color changes and our brain is processing and memorizing the information received. This can help unconsciously improve your productivity when programming, as we recognize quickly, for example: if it is an object, a class, a method, etc...</p>
</div>
</div>
</section>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/vanilla-tilt/1.7.0/vanilla-tilt.min.js"></script>
<div style="position: absolute; bottom: 0;" id="sfcnwn6zulwkhh7qfmhrc34j7y3nhc8kcmq"></div>
<script
type="text/javascript"
src="https://counter10.stat.ovh/private/counter.js?c=nwn6zulwkhh7qfmhrc34j7y3nhc8kcmq&down=async"
async>
</script>
<noscript>
<a
href="https://www.contadorvisitasgratis.com"
title="contador de visitas para mi web">
<img
src="https://counter10.stat.ovh/private/contadorvisitasgratis.php?c=nwn6zulwkhh7qfmhrc34j7y3nhc8kcmq"
border="0"
title="contador de visitas para mi web"
alt="contador de visitas para mi web">
</a>
</noscript>
<div style="position: fixed; right: 16px; bottom: -5px; border: 1px solid black;">
<iframe
src="https://open.spotify.com/embed/playlist/7q7WsdjMCyA4I9M6UX4Trt"
width="300" height="80" frameborder="0" allowtransparency="true"
allow="encrypted-media">
</iframe>
</div>
</body>
</html>