anglk/web-narrowcast
1
0
Fork 0
forked from varia/web-narrowcast
Code Issues Pull Requests Projects Releases Wiki Activity

testing style mobile user cond event

Browse Source 
added styles @media only screen and (max-width: 768px) for /* SILVIO*/ classes
This commit is contained in:
JoanaChicau 2021-03-21 15:58:02 +01:00
parent 2d06afa9e0
commit 3f45aa17b0
2 changed files with 46 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
index.html
View File

@ -58,10 +58,8 @@
<audio controls loop="" class="audio" src="http://w-i-t-m.net:8001/meander" type="audio/mp3"> </audio> <audio controls loop="" class="audio" src="http://w-i-t-m.net:8001/meander" type="audio/mp3"> </audio>
<!-- lil face --> <!-- lil face -->
<div class="lil-face loading" style="position: absolute; <div class="lil-face loading">
bottom: 50px; <a href="https://silviolorusso.com" target="_blank">
right: 38px;">
<a href="https://silviolorusso.com">
<img src="https://i.ytimg.com/vi/AsFBRdkFKx8/mqdefault.jpg" style="width: 100px; border-radius: 25px; box-shadow: 0.3rem 0.2rem 0.3rem #ffe4fd;"/> <img src="https://i.ytimg.com/vi/AsFBRdkFKx8/mqdefault.jpg" style="width: 100px; border-radius: 25px; box-shadow: 0.3rem 0.2rem 0.3rem #ffe4fd;"/>
</a> </a>
</div> </div>

45
narrowstyle.css
View File

@ -354,13 +354,14 @@ button.minimize:hover {
} }
.chat { .chat {
margin-left: 1%; margin: 0% 2% 0% 1%;
width: 44%; width: 42%;
} }
.chat iframe { .chat iframe {
width: 100%; width: 100%;
height: 80vh; height: 80vh;
padding-top: 3rem;
} }
.audio { .audio {
@ -370,20 +371,56 @@ button.minimize:hover {
bottom: 60px; bottom: 60px;
} }
.lil-face{
position: absolute;
bottom: 50px;
right: 38px;
}
/* :::::::::::::::::::::::::::::::::::::::::::::: Responsiveness :::::::::::::::::::::::::::::::::::::::::::::: */ /* :::::::::::::::::::::::::::::::::::::::::::::: Responsiveness :::::::::::::::::::::::::::::::::::::::::::::: */
@media only screen and (max-width: 768px) { @media only screen and (max-width: 768px) {
.live-flex { /* .live-flex {
flex-direction: column; flex-direction: column;
} }*/
.halfscreen , .thirdscreen { .halfscreen , .thirdscreen {
width: 100%; width: 100%;
} }
/* SILVIO MOBILE*/
.essay {
width: 85%;
} }
.essay iframe {
width: 100%;
height: 50vh;
}
.chat {
width: 85%;
}
.chat iframe {
height: 50vh;
}
.audio {
width: 80%;
position: relative;
margin: 6rem 0% 0% 6rem;
}
.lil-face{
position: relative;
margin: 0% 0% 2rem 1rem;
bottom: inherit;
right: inherit;
}
}