-
Notifications
You must be signed in to change notification settings - Fork 0
/
routes.json
140 lines (140 loc) · 3.99 KB
/
routes.json
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
[
{
"url": "/post/CSS-HSL-color-theme",
"title": "CSS HSL Color Theme",
"description": "calculating colors using HSL",
"content": "",
"tags": [
"color",
"css"
]
},
{
"url": "/post/battery-api",
"title": "Responsive Battery API",
"description": "For chrome and android devices: track device battery life using Battery Status API [deprecated]",
"content": "This pen uses the Battery Status API, which is deprecated, and does not work for Safari and iOS Devices. ",
"tags": [
"javascript",
"animation"
]
},
{
"url": "/post/computedStyleMap",
"title": "computedStyleMap",
"description": "Access all the CSS properties and values — including custom properties — that are impacting an element",
"content": "",
"tags": [
"css"
]
},
{
"url": "/post/direction-aware-hover-effect",
"title": "Direction Aware Hover Effect",
"description": "Direction-aware 3D hover effect created by Noel Delgado",
"content": "",
"tags": [
"animation",
"css"
]
},
{
"url": "/post/drag-and-drop",
"title": "Drag And Drop",
"description": "",
"content": "",
"tags": [
"dom"
]
},
{
"url": "/post/event-delegation-menu",
"title": "Event Delegation Menu",
"description": "Event delegation handler reads the attribute and executes method on call",
"content": " > Note that `this.onClick` is bound to this in `(*)`. That’s important, because otherwise this inside it would reference the DOM element (elem), not the Menu object, and this[action] would not be what we need.",
"tags": [
"events"
]
},
{
"url": "/post/exportPathMap",
"title": "exportPathMap",
"description": "A simple popup modal using only CSS and HTML",
"content": "This feature is exclusive of `next export`. Please refer to [Static HTML export](https://nextjs.org/docs/advanced-features/static-html-export) if you want to learn more about it. Let's start with an example, to create a custom `exportPathMap` for an app with the following pages: - `pages/index.js` - `pages/about.js` - `pages/post.js` Open `next.config.js` and add the following `exportPathMap` config: ",
"tags": [
"nextjs",
"react"
]
},
{
"url": "/post/fetchJSON",
"title": "fetchJSON",
"description": "",
"content": "",
"tags": []
},
{
"url": "/post/grid-container",
"title": "Grid Container",
"description": "",
"content": "Created by [@TheAngularGuy](https://codepen.io/TheAngularGuy) ",
"tags": [
"grid",
"css"
]
},
{
"url": "/post/iframe-blob",
"title": "iframe blob",
"description": "Blob as HTML for iFrame",
"content": "",
"tags": [
"iframe"
]
},
{
"url": "/post/mouse-canvas",
"title": "Mouse Canvas",
"description": "Cursor like canvas tracking mouse position",
"content": "",
"tags": [
"canvas",
"game",
"events"
]
},
{
"url": "/post/resizeable_table",
"title": "Resizeable Table",
"description": "",
"content": "",
"tags": [
"dom"
]
},
{
"url": "/post/semi-circle-donut-chart",
"title": "Semi Circle Donut Chart",
"description": "Semi circle donut chart in pure css3 (adapted from Vineeth.TR (@vineethtr) on Codepen)",
"content": "",
"tags": [
"chart"
]
},
{
"url": "/post/simple-modal",
"title": "Simple Modal",
"description": "A simple popup modal using only CSS and HTML using `:target`",
"content": "Adapted from @peiche's [codepen](https://codepen.io/peiche/pen/vhqym) > A popup window/modal window experiment based on the `:target` pseudoclass. > * The first popup stays open until you click the \"X\" to close. > * The second will close when you click anywhere outside the popup. ",
"tags": [
"component"
]
},
{
"url": "/post/svg-code-to-base64",
"title": "Svg Code To Base 64",
"description": "",
"content": "",
"tags": []
}
]