alicestrt/vvvw
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

styled a bit more the draggable objects

Browse Source
This commit is contained in:
nglk 2020-11-12 14:00:10 +01:00
parent ef43b8b658
commit ecb1c528d6
2 changed files with 19 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
wells/index.html
View File

@ -52,22 +52,22 @@
<img src="static/images/poem.png">
</div>
<div class="draggable" id="showasikA"><div class='text_audio'>Bio Aşık Ali İzzet</div><span onclick="this.parentElement.style.display='none'" class="topleft">&times</span><iframe width="560" height="280" src="https://www.youtube.com/embed/AnsVY_gjJns" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>
<div class="draggable" id="showasikA"><div class='text_audio'>Bio Aşık Ali İzzet</div><span onclick="this.parentElement.style.display='none'" class="topleft">&times</span><iframe width="400" height="200" src="https://www.youtube.com/embed/AnsVY_gjJns" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>
<div class="draggable" id="showasikV"><div class='text_audio'>Bio</div><iframe width="560" height="280" src="https://www.youtube.com/embed/5_9PAugYb4s" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
<div class="draggable" id="showasikV"><div class='text_audio'>Bio</div><iframe width="400" height="200" src="https://www.youtube.com/embed/5_9PAugYb4s" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
<iframe width="560" height="280" src="https://www.youtube.com/embed/t64yH04XWs8" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
<iframe width="400" height="200" src="https://www.youtube.com/embed/t64yH04XWs8" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="draggable" id="showmuharrem"><div class='text_audio'></div><iframe width="560" height="280" src="https://www.youtube.com/embed/Ffa2CONoW5Q" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>
<div class="draggable" id="showmuharrem"><div class='text_audio'></div><iframe width="400" height="200" src="https://www.youtube.com/embed/Ffa2CONoW5Q" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>
<div class="draggable" id="shownazim"><div class='text_audio'></div><iframe width="560" height="280" src="https://www.youtube.com/embed/11XRG-cz3lY" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>
<div class="draggable" id="shownazim"><div class='text_audio'></div><iframe width="400" height="200" src="https://www.youtube.com/embed/11XRG-cz3lY" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>
<div class="draggable" id="showneyzen"><div class='text_audio'></div><iframe width="560" height="280" src="https://www.youtube.com/embed/CD-CEeaLGdk" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>
<div class="draggable" id="showneyzen"><div class='text_audio'></div><iframe width="400" height="200" src="https://www.youtube.com/embed/CD-CEeaLGdk" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>
<div class="draggable" id="showruhisu"><div class='text_audio'></div><iframe width="560" height="280" src="https://www.youtube.com/embed/fKOKxuFyEdg" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>
<div class="draggable" id="showruhisu"><div class='text_audio'></div><iframe width="400" height="200" src="https://www.youtube.com/embed/fKOKxuFyEdg" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>
<div class="draggable" id="showasu"><div class='text_audio'></div><iframe width="560" height="280" src="https://www.youtube.com/embed/mETzamzufh4" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>
<div class="draggable" id="showasu"><div class='text_audio'></div><iframe width="400" height="200" src="https://www.youtube.com/embed/mETzamzufh4" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>
<!-- <img src="static/images/test_small.jpeg" alt="poem"> -->
<script src="static/js/d3_map.js"></script>

15
wells/static/css/style.css
View File

@ -9,6 +9,7 @@
body {
overflow: scroll;
font-size: .8em;
}
.container-fluid {
overflow: hidden;
@ -188,7 +189,7 @@ stroke-dasharray:6px;
.thesis {
display: none;
overflow-y: scroll;
max-height: 500px;
max-height: 300px;
max-width: 30%;
scroll-behavior: smooth;
font-size: .6em;
@ -202,7 +203,7 @@ scrollbar-color: #cdcec9 #bedbbb;
position: fixed;
z-index:4;
background: white;
left: 40%;
left: 60%;
top: 2%;
}
@ -260,13 +261,15 @@ h2 {
}
draggable {
position: absolute;
/* cursor: all-scroll; */
}
.draggable iframe {
padding: 20px;
padding: 1em;
}
#transcriptWrapper {
@ -289,15 +292,18 @@ draggable {
#showdadaloglu,#showasikA,#showasikV,#showmuharrem,#shownazim,#showneyzen,#showruhisu,#showasu {
display: none;
left: 20%;
width: 50% !important;
/* width: 10% !important; */
position: fixed;
z-index: 5;
border: 1px black solid;
}
.text_audio{
margin-bottom: 1.2em;
margin-top: 2em;
font-family:'Vesper Libre', serif;
font-size: .8em;
padding-left: 1em;
}
/* Style the close button */
@ -305,6 +311,7 @@ draggable {
float: right;
cursor: pointer;
font-size: 100%;
color: red;
}
/*d3 map*/