-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathindex.html
131 lines (126 loc) · 3.82 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
<!doctype html>
<html lang="en">
<head>
<title>Is JS Enabled?</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="robots" content="index, follow">
<meta name="description" content="Check if Javascript is enabled in your browser.">
<meta name="author" content="Jordan Majd">
<link rel="canonical" href="https://isjsenabled.com/" />
<style>
html {
color: #262626;
font-family: 'Monaco', 'Lucida Console', 'Consolas', 'Sans-Serif';
}
body {
margin: 0;
background-color: #eeeeee;
}
a {
color:#262626;
}
header {
background-color: #ba6b6c;
height: 50px;
}
header #head-highlight {
background-color: #ef9a9a;
height: 10px;
}
header #head-container {
margin: auto;
width: 80vw;
}
header a {
text-decoration: none;
font-size: 1.35rem;
}
header h1 {
margin: 0;
font-weight: 100;
}
#status-container {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
text-align: center;
background-color: #f5f5f6;
padding: 3vh 3vw;
}
#status-img {
width: 20vw;
}
#status-text {
font-size: 2rem;
margin-top: 21px;
margin-bottom: 21px;
display:block;
}
#status-text b {
text-decoration: underline;
}
footer {
position: absolute;
bottom: 2%;
left: 50%;
transform: translate(-50%, 0%);
max-width: 90%;
text-align: center;
font-size: 0.75rem;
line-height: 1rem;
}
@media only screen and (max-width: 768px) {
#status-container {
width: 90vw;
}
#status-img {
width: 40vw;
}
#status-text {
font-size: 1.5rem;
}
footer {
width: 100%;
}
}
</style>
</head>
<body id="body">
<header id="head">
<div id="head-highlight"></div>
<div id="head-container">
<h1><a href="/">is js enabled?</a></h1>
</div>
</header>
<div id="status-container">
<img id="status-img" src="./img/js_is_disabled.svg" alt="Picture of a red browser window.">
<strong id="status-text">Javascript is <b id="status">disabled</b> in your browser.</strong>
<noscript>This text is in a <noscript> tag and should display if JS is disabled.</noscript>
</div>
<footer>
<div>
<Span><a href="https://github.com/JordanMajd/isjsenabled.com">Learn more on github</a>.</Span>
</div>
<div>
Copyright ©2019 <a href="https://jordanmajd.com/?ref=isjsenabled">Jordan Majd</a>
</div>
</footer>
<script>
(function(){
'use strict';
var status = document.getElementById('status');
var statusText = document.createTextNode("enabled");
status.removeChild(status.firstChild);
status.appendChild(statusText);
var statusImg = document.getElementById('status-img');
statusImg.src = './img/js_is_enabled.svg';
var headHighlight = document.getElementById('head-highlight');
headHighlight.style.backgroundColor = '#a5d6a7';
var header = document.getElementById('head');
header.style.backgroundColor = '#75a478';
})();
</script>
</body>
</html>