Ifeanyi commited on
Commit
e1e90cf
1 Parent(s): 603ab12

Upload 2 files

Browse files
Files changed (2) hide show
  1. code.js +9 -0
  2. style.css +165 -0
code.js ADDED
@@ -0,0 +1,9 @@
 
 
 
 
 
 
 
 
 
 
1
+ /* program the keyboard "Enter" key*/
2
+
3
+ document
4
+ .addEventListener("keydown",function(event){
5
+ if(event.key === "Enter"){
6
+ event.preventDefault();
7
+ document.getElementById("search").click();
8
+ }
9
+ })
style.css ADDED
@@ -0,0 +1,165 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ .centered {
2
+ text-align: center;
3
+ width: 100%;
4
+
5
+ }
6
+
7
+ #main {
8
+ text-align: center;
9
+
10
+ }
11
+
12
+ #text {
13
+ border-color:#9022c7;
14
+ border-width: 6px;
15
+ box-shadow: 2px 2px 2px 2px rgb(59, 59, 59);
16
+ }
17
+
18
+
19
+ /* Search button */
20
+ #search {
21
+ align-items: center;
22
+ appearance: none;
23
+ background-image: radial-gradient(100% 100% at 100% 0, #b615e7 0, #9f0be4 100%);
24
+ border: 0;
25
+ border-radius: 6px;
26
+ box-shadow: rgba(45, 35, 66, .4) 0 2px 4px,rgba(45, 35, 66, .3) 0 7px 13px -3px,rgba(58, 65, 111, .5) 0 -3px 0 inset;
27
+ box-sizing: border-box;
28
+ color: #fff;
29
+ cursor: pointer;
30
+ display: inline-flex;
31
+ font-family: "JetBrains Mono",monospace;
32
+ height: 48px;
33
+ justify-content: center;
34
+ line-height: 1;
35
+ list-style: none;
36
+ overflow: hidden;
37
+ padding-left: 16px;
38
+ padding-right: 16px;
39
+ position: relative;
40
+ text-align: left;
41
+ text-decoration: none;
42
+ transition: box-shadow .15s,transform .15s;
43
+ user-select: none;
44
+ -webkit-user-select: none;
45
+ touch-action: manipulation;
46
+ white-space: nowrap;
47
+ will-change: box-shadow,transform;
48
+ font-size: 18px;
49
+ }
50
+
51
+ #search:focus {
52
+ box-shadow: #670e94 0 0 0 1.5px inset, rgba(45, 35, 66, .4) 0 2px 4px, rgba(45, 35, 66, .3) 0 7px 13px -3px, #670e94 0 -3px 0 inset;
53
+ }
54
+
55
+ #search:hover {
56
+ box-shadow: rgba(45, 35, 66, .4) 0 4px 8px, rgba(45, 35, 66, .3) 0 7px 13px -3px, #670e94 0 -3px 0 inset;
57
+ transform: translateY(-2px);
58
+ }
59
+
60
+ #search:active {
61
+ box-shadow: #670e94 0 3px 7px inset;
62
+ transform: translateY(2px);
63
+ }
64
+
65
+ /* Nodes download button */
66
+ #down_nodes {
67
+ align-items: center;
68
+ appearance: none;
69
+ background-image: radial-gradient(100% 100% at 100% 0, #b615e7 0, #9f0be4 100%);
70
+ border: 0;
71
+ border-radius: 6px;
72
+ box-shadow: rgba(45, 35, 66, .4) 0 2px 4px,rgba(45, 35, 66, .3) 0 7px 13px -3px,rgba(58, 65, 111, .5) 0 -3px 0 inset;
73
+ box-sizing: border-box;
74
+ color: #fff;
75
+ cursor: pointer;
76
+ display: inline-flex;
77
+ font-family: "JetBrains Mono",monospace;
78
+ height: 48px;
79
+ justify-content: center;
80
+ line-height: 1;
81
+ list-style: none;
82
+ overflow: hidden;
83
+ padding-left: 16px;
84
+ padding-right: 16px;
85
+ position: relative;
86
+ text-align: left;
87
+ text-decoration: none;
88
+ transition: box-shadow .15s,transform .15s;
89
+ user-select: none;
90
+ -webkit-user-select: none;
91
+ touch-action: manipulation;
92
+ white-space: nowrap;
93
+ will-change: box-shadow,transform;
94
+ font-size: 18px;
95
+ }
96
+
97
+ #down_nodes:focus {
98
+ box-shadow: #670e94 0 0 0 1.5px inset, rgba(45, 35, 66, .4) 0 2px 4px, rgba(45, 35, 66, .3) 0 7px 13px -3px, #670e94 0 -3px 0 inset;
99
+ }
100
+
101
+ #down_nodes:hover {
102
+ box-shadow: rgba(45, 35, 66, .4) 0 4px 8px, rgba(45, 35, 66, .3) 0 7px 13px -3px, #670e94 0 -3px 0 inset;
103
+ transform: translateY(-2px);
104
+ }
105
+
106
+ #down_nodes:active {
107
+ box-shadow: #670e94 0 3px 7px inset;
108
+ transform: translateY(2px);
109
+ }
110
+
111
+ #down_nodes {
112
+ margin-top: 40px;
113
+ margin-left: 500px;
114
+ }
115
+
116
+ /* Edges download button */
117
+ #down_edges {
118
+ margin-top: 40px;
119
+ margin-right: 500px;
120
+ }
121
+
122
+ #down_edges {
123
+ align-items: center;
124
+ appearance: none;
125
+ background-image: radial-gradient(100% 100% at 100% 0, #b615e7 0, #9f0be4 100%);
126
+ border: 0;
127
+ border-radius: 6px;
128
+ box-shadow: rgba(45, 35, 66, .4) 0 2px 4px,rgba(45, 35, 66, .3) 0 7px 13px -3px,rgba(58, 65, 111, .5) 0 -3px 0 inset;
129
+ box-sizing: border-box;
130
+ color: #fff;
131
+ cursor: pointer;
132
+ display: inline-flex;
133
+ font-family: "JetBrains Mono",monospace;
134
+ height: 48px;
135
+ justify-content: center;
136
+ line-height: 1;
137
+ list-style: none;
138
+ overflow: hidden;
139
+ padding-left: 16px;
140
+ padding-right: 16px;
141
+ position: relative;
142
+ text-align: left;
143
+ text-decoration: none;
144
+ transition: box-shadow .15s,transform .15s;
145
+ user-select: none;
146
+ -webkit-user-select: none;
147
+ touch-action: manipulation;
148
+ white-space: nowrap;
149
+ will-change: box-shadow,transform;
150
+ font-size: 18px;
151
+ }
152
+
153
+ #down_edges:focus {
154
+ box-shadow: #670e94 0 0 0 1.5px inset, rgba(45, 35, 66, .4) 0 2px 4px, rgba(45, 35, 66, .3) 0 7px 13px -3px, #670e94 0 -3px 0 inset;
155
+ }
156
+
157
+ #down_edges:hover {
158
+ box-shadow: rgba(45, 35, 66, .4) 0 4px 8px, rgba(45, 35, 66, .3) 0 7px 13px -3px, #670e94 0 -3px 0 inset;
159
+ transform: translateY(-2px);
160
+ }
161
+
162
+ #down_edges:active {
163
+ box-shadow: #670e94 0 3px 7px inset;
164
+ transform: translateY(2px);
165
+ }