-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathexample.html
83 lines (80 loc) · 2.85 KB
/
example.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
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>xcss example </title>
<link href="example.css" rel="stylesheet" type="text/css">
<link href="register.css" rel="stylesheet" type="text/css">
<style>
</style>
<template id="date-component">
<style>
input{
max-width:32%;
width:30%;
margin: 0px;
}
</style>
<input name='day'><input name='month'><input name='year'>
</template>
<link rel="stylesheet" type="text/css" href="register.css">
<!--polyfill for fetch in edge-->
<script src="fetch.js" type="text/javascript"></script>
<!--init xcss-->
<script src="xcss.js" type="text/javascript"></script>
<script>
var test='a test';
window.addEventListener('message',function registreer(evt){
if (evt.data.register){
alert('Geregistreerd!');
}
});
var person = {firstName: 'John', lastName: 'Doe'};
</script>
</head>
<body>
<div sizing>A senctence of some length</div>
<br>
<div id="dlg1" class="dlg">hi there it's xcss</div>
<button id='btn1' data-value="hello">add buttonclicked: + state</button>
<button id='btn2' data-value="hello">del buttonclicked: ~ state</button>
<button id='btn2a' data-value="hello">del buttonclicked: - state</button>
<button id='btn5' data-value="hello">replace last state: > state</button>
<button id='btn7' >allway add state : .state</button><br><br>
<button id='btn8' >absolute state (#state)</button>
<button id='btn9' >delete last state:~ * </button>
<button id='btn10'>toggle last state:> .state</button><br><br>
<button id='btn6' onclick="postMessage('buttonclicked','http://evil-domain.crime:666')">unsave event</button><br><br>
<button id='btn3' data-value="hello!">html content</button><br><br>
<button id='btn4' data-value="hello">fill textarea</button><br><br>
<button id='btn11'>exec js</button><br><br>
<input id="mytext" value="hi" style="background-color:red"><br>
<br>
<input id="mycheck"
type="checkbox" value="chk1">checkbox
<br>
<a href="#rotate?value=270deg&radius=10px">rotate</a><br><br>
<a href="#navigeer?link=register">register</a><br><br>
<a href="#">root</a><br><br>
Rotation angle:<br>
<input id="myrange" type="range" min="0" max="360" value="180">
<span id="angle"></span>
<nav>
<ul>
<li link="contacten">contact</li>
<li link="register">register</li>
<li link="mail">mail</li>
</ul>
<label>gender</label> <select name="gender"></select><br>
</nav>
<main>
<article></article>
<br>
<simple-component></simple-component>
date: <date-component date="25-01-2016"></date-component>
<br>
time:<time-component></time-component>
</main>
</body>
</html>