kieran-mcauliffe/healing-soundscapes
2
0
Fork 1
Code Issues 10 Pull Requests Actions Packages Projects Releases Wiki Activity

add html template that loads css file

Browse Source
This commit is contained in:
Eveline-97 2025-04-08 14:30:32 +02:00
parent 76bef9f32a
commit 892da17531
2 changed files with 72 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

63
index.html Normal file
View File

@ -0,0 +1,63 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
<!-- our stylesheet -->
<link rel="stylesheet" href="lib/drawsocket-defaults.css">
<!-- HSS -->
<link rel="stylesheet" href="./ui-style.css">
<!-- library dependencies -->
<script src="scripts/d3-selection/dist/d3-selection.min.js"></script>
<script src="scripts/pdfjs-dist/build/pdf.js"></script>
<script src="scripts/tone/build/Tone.js"></script>
<!--
<script src="scripts/startaudiocontext/StartAudioContext.js"></script>
-->
<script src="scripts/timesync/dist/timesync.js"></script>
<script src="scripts/gsap/dist/gsap.min.js"></script>
<script src="scripts/svg-points/dist/svg-points.min.js"></script>
<script src="lib/verovio-toolkit.js" ></script>
</head>
<body>
<h1>Healing Soundscapes</h1>
<!--main html setup -->
<div class="log" id="log"></div>
<div id="touchdiv"></div>
<!--main main main setup -->
<div id="main-div" >
<div id="main-html" ></div>
<svg id="svg"
version="1.1"
baseProfile="full"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink" >
<defs id="defs"></defs>
<g id="main-svg"></g>
</svg>
</div>
<div id="forms" ></div>
<div id="loading">
<p>synchronizing...</p>
</div>
<!-- our scripts -->
<script src="lib/drawsocket-client.js"></script>
</body>
</html>

9
ui-style.css
View File

@ -23,6 +23,15 @@ input[type=text] {
background-color: var(--background); background-color: var(--background);
} }
h1 {
font-size: 15px;
font-weight: 400;
color: var(--active);
position: relative;
width: fit-content;
margin: 0.3em auto;
}
/*navigation*/ /*navigation*/
#nav, #nav,
#navPlayers { #navPlayers {