Browse Source

created third perspective

master
alicestrt 4 years ago
parent
commit
8b9db01a45
  1. 5
      hello.py
  2. 26
      static/css/style.css
  3. 4
      templates/perspectiveA.html
  4. 18
      templates/perspectiveC.html

5
hello.py

@ -18,7 +18,7 @@ def dated_url_for(endpoint, **values):
@app.route('/') @app.route('/')
def hello_world(): def hello_world():
return 'Hello, World!' return 'VVVW'
# @app.route('/hello/<name>') # @app.route('/hello/<name>')
@ -28,3 +28,6 @@ def perspectiveB():
@app.route('/perspectiveA/') @app.route('/perspectiveA/')
def perspectiveA(): def perspectiveA():
return render_template('perspectiveA.html') return render_template('perspectiveA.html')
@app.route('/perspectiveC/')
def perspectiveC():
return render_template('perspectiveC.html')

26
static/css/style.css

@ -1,7 +1,3 @@
* {
background-color: gray;
}
#video1 { #video1 {
margin-top: 300px; margin-top: 300px;
} }
@ -24,3 +20,25 @@
#audio1 { #audio1 {
margin-left: 400px; margin-left: 400px;
} }
#background_a {
background-image: url("../images/map.png");
background-repeat: no-repeat;
background-color: silver;
}
#poem1 {
width: 40%;
margin-left: 400px;
margin-top: 50px;
}
#poem1:hover {
background-color: white;
}
#background_c {
background-image: url("../images/test2_opacity.jpeg");
}

4
templates/perspectiveA.html

@ -7,7 +7,8 @@
<link rel="stylesheet" href="../static/css/style.css?q=1280549780"> <link rel="stylesheet" href="../static/css/style.css?q=1280549780">
<title>Perspective A</title> <title>Perspective A</title>
</head> </head>
<body> <body id="background_a">
<div>
<h1>Perspective A</h1> <h1>Perspective A</h1>
<div id="audio1"> <div id="audio1">
<audio controls src="../static/audio/turkish_march.ogg" type="audio/ogg"></audio> <audio controls src="../static/audio/turkish_march.ogg" type="audio/ogg"></audio>
@ -19,5 +20,6 @@
<div class="draggable"> <div class="draggable">
<iframe id="video2" width="120" height="120" src="https://www.youtube.com/embed/5_9PAugYb4s" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> <iframe id="video2" width="120" height="120" src="https://www.youtube.com/embed/5_9PAugYb4s" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div> </div>
</div>
</body> </body>
</html> </html>

18
templates/perspectiveC.html

@ -0,0 +1,18 @@
<!doctype html>
<html>
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script src="../static/js/draggable.js"></script>
<head>
<link rel="stylesheet" href="../static/css/style.css?q=1280549780">
<title>Perspective A</title>
</head>
<body id="background_c">
<div>
<h1>Perspective C</h1>
<div class="draggable">
<img id="poem1" src="../static/images/poem.png" alt="poem">
</div>
</div>
</body>
</html>
Loading…
Cancel
Save