nidza-test
Version:
Test instance for nidza.js
92 lines (82 loc) • 2.25 kB
HTML
<html lang="en">
<head>
<style>
body {
background: #373737 url("./imgs/bg.png") 0 0 repeat;
font: 14px/20px 'Helvetica Neue', Helvetica, Arial, sans-serif;
color: #6DA9CD;
overflow: hidden;
}
a {
outline: none;
text-decoration: none;
padding: 2px 1px 0;
}
a:link {
color: #0071f1;
}
a:visited {
color: #4d67ff;
}
a:focus {
border-bottom: 1px solid;
background: #07a9b8;
}
a:hover {
border-bottom: 1px solid;
background: #008cff;
}
a:active {
background: #00fff2;
color: #CDFEAA;
}
.holder {
position: absolute;
width: 50%;
height: 50%;
left:25%;
top:2%;
text-align: center;
}
.holderExamples {
position: absolute;
width: 50%;
height: 50%;
left:20%;
top:0;
text-align: center;
}
.leftMenu {
border-right:solid indianred 1px;
display:flex;
flex-direction: column;
position: absolute;
width: 20%;
height: 100%;
left:0;
top:0;
text-align: center;
}
</style>
<link defer href="css/nidza.css" />
<script src="./builds/examples-build.js" ></script>
<link rel="icon" type="image/png" sizes="96x96" href="imgs/icons/favicon-96x96.png" />
</head>
<body>
<div class="holderExamples" id="testHolder"></div>
<div class="loader" id="loader">LOADING</div>
<div class="leftMenu" id="leftMenu">
<a href="example-build.html?u=text-example.js">Text</a>
<a href="example-build.html?u=star-example.js">Star</a>
<a href="example-build.html?u=text-rotator-example.js">Text Rotation</a>
<a href="example-build.html?u=star-effect-1.js">Star effect</a>
<a href="example-build.html?u=star-effect-2.js">Moving Star on click event</a>
<a href="example-build.html?u=matrix-effect-1.js">Matrix effect 1</a>
<a href="example-build.html?u=shader-component-custom.js">Shader custom [default]</a>
<a href="example-build.html?u=shader-component-default.js">Shader default</a>
<a href="example-build.html?u=shader-inline.js">Shader inline [advanced]</a>
<a href="example-build.html?u=multi-nidza-3dindentity.js">Multi-nidza-3dindentity</a>
</div>
</body>
</html>