Chapril/xmpp.chapril.org-conversejs
Chapril/xmpp.chapril.org-conversejs
24
0
Fork 0
Code Issues Pull Requests Projects Releases Activity

Fade in logo after a delay

Browse Source
This commit is contained in:
JC Brand 2018-09-07 15:39:08 +02:00
parent cfcab80147
commit d89a47b071
3 changed files with 22 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
css/converse.css
View File

@ -8633,7 +8633,19 @@ body.reset {
.converse-brand {
display: flex;
justify-content: space-between; }
justify-content: space-between;
-webkit-animation-name: fadein;
-moz-animation-name: fadein;
animation-name: fadein;
-webkit-animation-fill-mode: forwards;
-moz-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-duration: 750ms;
-moz-animation-duration: 750ms;
animation-duration: 750ms;
-webkit-animation-timing-function: ease;
-moz-animation-timing-function: ease;
animation-timing-function: ease; }
.converse-brand__padding {
position: relative;

6
fullscreen.html
View File

@ -12,7 +12,7 @@
<script src="dist/converse.js"></script>
</head>
<body class="reset">
<div class="content">
<div class="converse-content" style="display:none">
<div class="inner-content converse-brand row">
<div class="converse-brand__padding"></div>
<div class="converse-brand__heading">
@ -60,6 +60,10 @@
bosh_service_url: 'https://conversejs.org/http-bind/', // Please use this connection manager only for testing purposes
message_archiving: 'always',
view_mode: 'fullscreen'
}).then(function () {
setTimeout(function () {
document.querySelector('.converse-content').style = '';
}, 1000);
});
</script>
</body>

4
sass/_core.scss
View File

@ -43,6 +43,10 @@ body.reset {
.converse-brand {
display: flex;
justify-content: space-between;
@include animation-name(fadein);
@include animation-fill-mode(forwards);
@include animation-duration(750ms);
@include animation-timing-function(ease);
}
.converse-brand__padding {