1
0
Fork 0
mirror of https://gitlab.com/Oreolek/salet.git synced 2024-06-30 13:55:06 +03:00

Salet 1.5 - CSS animations

This commit is contained in:
Alexander Yakovlev 2016-09-20 22:05:09 +07:00
parent a6b9ba0be4
commit 612d0aede9
4 changed files with 9 additions and 13 deletions

View file

@ -4,7 +4,7 @@ oneOf = require('../../lib/oneOf.coffee')
require('salet') require('salet')
salet.game_id = "your-game-id-here" salet.game_id = "your-game-id-here"
salet.game_version = "1.3" salet.game_version = "1.5"
$(document).ready(() -> $(document).ready(() ->
window.addEventListener('popstate', (event) -> window.addEventListener('popstate', (event) ->
salet.goBack() salet.goBack()

View file

@ -6,6 +6,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<link href='https://fonts.googleapis.com/css?family=PT+Sans:400,400italic|PT+Sans+Caption' rel='stylesheet' type='text/css'> <link href='https://fonts.googleapis.com/css?family=PT+Sans:400,400italic|PT+Sans+Caption' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="css/main.css"> <link rel="stylesheet" href="css/main.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css">
</head> </head>
<body> <body>
<div id="page" class="container"> <div id="page" class="container">

View file

@ -11,3 +11,4 @@ $secondary-bg: #F1EED9;
$waycolor: $link-color; $waycolor: $link-color;
$text_background: $body-bg; // can be btn-bg $text_background: $body-bg; // can be btn-bg
$animation_duration: 2s;

View file

@ -190,18 +190,12 @@ hr {
border-color: $body-color; border-color: $body-color;
} }
// fade-in animation // here we redefine animate.css animation duration, see variables.scss
@keyframes fadeIn { #ways_hint, ul.options {
from { -moz-animation-duration: $animation_duration !important;
opacity: 0; -webkit-animation-duration: $animation_duration !important;
} -o-animation-duration: $animation_duration !important;
to { animation-duration: $animation_duration !important;
opacity: 1;
}
}
.fadeIn {
animation-name: fadeIn;
} }
.center { .center {