Skip to content

Commit 2402b51

Browse files
quantum9Innovationquantum9Innovation
authored
Update index.html
New and improved version from that of @Quantalabs
1 parent 6a6c27d commit 2402b51

File tree

1 file changed

+90
-67
lines changed

1 file changed

+90
-67
lines changed

‎index.html

+90-67
Original file line numberDiff line numberDiff line change
@@ -1,71 +1,94 @@
11
<!DOCTYPE html>
2-
<html lang="en" dir="ltr">
3-
<head>
4-
<meta charset="utf-8">
5-
<title>Word Space</title>
2+
<html>
3+
<head>
4+
5+
<meta charset="utf-8">
6+
<title>Word Couch</title>
7+
8+
</head>
69
<style>
7-
body{
8-
background-image: url("https://dynaimage.cdn.cnn.com/cnn/c_fill,g_auto,w_1200,h_675,ar_16:9/https%3A%2F%2Fcdn.cnn.com%2Fcnnnext%2Fdam%2Fassets%2F200416164101-3-underscored-creative-writing-lead.jpg");
9-
background-repeat: no-repeat;
10-
background-size: cover;
11-
}
12-
#header{
13-
width: 45vw;
14-
height: 35px;
15-
resize: none;
16-
margin-left: 27.5vw;
17-
font-family: Poppins;
18-
margin-top: 20vh;
19-
font-size: 30px;
20-
text-align: center;
21-
}
22-
#doc {
23-
width: 45vw;
24-
height: 33vh;
25-
resize: none;
26-
margin-left: 27.5vw;
27-
font-family: Poppins;
28-
}
29-
#font{
30-
float: left;
31-
}
32-
#style{
33-
height: 20px;
34-
margin-bottom: auto;
35-
margin-top: auto;
36-
width: 80vh;
37-
resize: none;
38-
margin-left: 27.5vw;
39-
font-family: Poppins;
40-
41-
}
42-
#styleButton{
43-
float: right, 5px;
44-
}
10+
11+
body {
12+
13+
background-image: url("https://www.incimages.com/uploaded_files/image/970x450/rey-seven-nm-mZ4Cs2I-unsplash_397351.jpg");
14+
15+
}
16+
textarea {
17+
18+
resize: none;
19+
width: 50%;
20+
height: 50vh;
21+
display: block;
22+
text-align: left;
23+
font-size: 14px;
24+
font-family: georgia;
25+
margin: auto;
26+
padding: 15px;
27+
margin-top: 15vh;
28+
border-color: rgb(0, 127, 185);
29+
border-width: 5px;
30+
31+
}
32+
33+
input {
34+
35+
display: block;
36+
margin: auto;
37+
margin-top: 15px;
38+
width: 35%;
39+
height: 20px;
40+
41+
}
42+
43+
44+
#banner {
45+
46+
position: absolute;
47+
margin-top: 8%;
48+
margin-left: 85%;
49+
color: white;
50+
font-family: georgia;
51+
font-size: 24px;
52+
53+
}
54+
4555
</style>
46-
</head>
47-
<body>
48-
<textarea id="header" placeholder="Title"></textarea>
49-
<textarea id="doc" placeholder="Write something great..."></textarea>
50-
<textarea id="style" placeholder="styleProperty.value"></textarea>
51-
<button type="button" id="styleButton">select</button>
52-
<div class="d">
53-
54-
</div>
55-
</body>
56-
<script>
57-
var style = function () {
58-
var a = document.getElementById("styleButton");
59-
var styleFunc = function () {
60-
var style = document.getElementById("style").value;
61-
var doc = document.getElementById("doc");
62-
63-
var a = style.split(".");
64-
console.log(a[0])
65-
doc.style[a[0]] = [a[1]];
66-
};
67-
a.addEventListener("click",styleFunc);
68-
}
69-
style();
70-
</script>
56+
<body>
57+
58+
<textarea id="story" placeholder="Start your story ..." spellcheck="false" ></textarea>
59+
<input placeholder="Paste format code here" id="format" ></input>
60+
<p id="banner" >#NaNoWriMo</p>
61+
62+
</body>
63+
<script>
64+
65+
story = document.getElementById("story")
66+
input = document.getElementById("format")
67+
68+
var parseCode = function()
69+
{
70+
71+
code = input.value.split(",")
72+
flag = false
73+
for ( var i = 0; i < code.length; i++ )
74+
{
75+
76+
if ( flag )
77+
{
78+
79+
story.style[code[i-1]] = code[i]
80+
flag = false
81+
82+
}
83+
84+
if ( i%2 == 0 )
85+
{flag = true}
86+
87+
}
88+
89+
};
90+
91+
input.addEventListener("input", parseCode)
92+
93+
</script>
7194
</html>

0 commit comments

Comments
 (0)