liangsheng8708
/
ruffle
mirror of https://mirror.ghproxy.com/https://github.com/ruffle-rs/ruffle.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

chore: Formatted demo index.html

This commit is contained in:
Nathan Adams 2020-05-26 20:16:30 +02:00 committed by Mike Welsh
parent 75759d9b3b
commit d02223c816
1 changed files with 158 additions and 152 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

42
web/packages/demo/www/index.html
View File

@ -1,11 +1,13 @@
<!DOCTYPE html> <!DOCTYPE html>
<html data-ruffle-optout> <html data-ruffle-optout>
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Ruffle Web Demo</title> <title>Ruffle Web Demo</title>
<link href="https://fonts.googleapis.com/css?family=Lato" rel="stylesheet"> <link
href="https://fonts.googleapis.com/css?family=Lato"
rel="stylesheet"
/>
<style> <style>
body { body {
position: absolute; position: absolute;
@ -15,7 +17,7 @@
padding: 0; padding: 0;
width: 100%; width: 100%;
height: 100%; height: 100%;
font-family: 'Lato', sans-serif; font-family: "Lato", sans-serif;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
@ -30,8 +32,7 @@
max-height: calc(100vh - 70px); max-height: calc(100vh - 70px);
} }
#container #container {
{
height: calc(100vh - 70px); height: calc(100vh - 70px);
width: 100vw; width: 100vw;
} }
@ -44,12 +45,12 @@
#nav { #nav {
width: 100%; width: 100%;
background: #37528C; background: #37528c;
border: 0; border: 0;
border-color: darkgray; border-color: darkgray;
border-bottom: 2px #37528C; border-bottom: 2px #37528c;
border-style: solid; border-style: solid;
box-shadow: 0 5px 5px #37528C; box-shadow: 0 5px 5px #37528c;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
justify-content: space-around; justify-content: space-around;
@ -97,7 +98,8 @@
} }
@media only screen and (max-width: 800px) { @media only screen and (max-width: 800px) {
#local-file-container,#sample-swfs-container { #local-file-container,
#sample-swfs-container {
display: block; display: block;
} }
@ -147,13 +149,17 @@
<div id="nav"> <div id="nav">
<div id="title"> <div id="title">
<a href="https://ruffle.rs" target="_blank"> <a href="https://ruffle.rs" target="_blank">
<img src="https://ruffle.rs/assets/logo.png" alt="Ruffle" data-canonical-src="https://ruffle.rs/assets/logo.png"> <img
src="https://ruffle.rs/assets/logo.png"
alt="Ruffle"
data-canonical-src="https://ruffle.rs/assets/logo.png"
/>
</a> </a>
</div> </div>
<div id="file-picker"> <div id="file-picker">
<div id="local-file-container"> <div id="local-file-container">
Local SWF: Local SWF:
<input type="file" id="local-file"> <input type="file" id="local-file" />
</div> </div>
<div id="sample-swfs-container"> <div id="sample-swfs-container">
<span id="sample-swfs-label">Sample SWF:</span> <span id="sample-swfs-label">Sample SWF:</span>
@ -161,15 +167,15 @@
<option value="none">None</option> <option value="none">None</option>
<optgroup id="anim-optgroup" label="Animations"> <optgroup id="anim-optgroup" label="Animations">
</optgroup> </optgroup>
<optgroup id="games-optgroup" label="Games"> <optgroup id="games-optgroup" label="Games"> </optgroup>
</optgroup>
</select> </select>
<span id="author-container">Author: <a href="#" target="_blank" id="author"></a></span> <span id="author-container"
>Author: <a href="#" target="_blank" id="author"></a
></span>
</div> </div>
</div> </div>
</div> </div>
<div id="main"> <div id="main"></div>
</div>
<script src="./index.js"></script> <script src="./index.js"></script>
</body> </body>
</html> </html>