/********************************************************************************** * * Copyright (C) 2017 MuK IT GmbH * * This program is free software: you can redistribute it and/or modify * it under the terms of the GNU Affero General Public License as * published by the Free Software Foundation, either version 3 of the * License, or (at your option) any later version. * * This program is distributed in the hope that it will be useful, * but WITHOUT ANY WARRANTY; without even the implied warranty of * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the * GNU Affero General Public License for more details. * * You should have received a copy of the GNU Affero General Public License * along with this program. If not, see . * **********************************************************************************/ .o_preview_viewerjs, .o_preview_viewerjs iframe { position: absolute; display: block; width: 100%; height: 100%; } .o_preview_pdfjs, .o_preview_pdfjs iframe { position: absolute; display: block; width: 100%; height: 100%; } .o_preview_unsupported { padding: 20px 30px 20px 30px; .o_preview_unsupported_body { padding-top: 25px; } .o_preview_unsupported_info { padding-bottom: 15px; } .o_preview_unsupported_icon { padding-top: 15px; } .o_preview_unsupported_table > tbody > tr { border-top: 1px solid rgb(221, 221, 221); } .o_preview_unsupported_table > tbody > tr:first-child { border-top: 0; } .o_preview_unsupported_table > tbody > tr > td { border-top: 0; } .o_preview_unsupported_download { padding-top: 25px; padding-bottom: 5px; } } /* Based on a CodePen Snippet by Dave McCarthy */ .loader { height: 20px; width: 250px; position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; .loader--dot { animation-name: loader; animation-timing-function: ease-in-out; animation-duration: 3s; animation-iteration-count: infinite; height: 20px; width: 20px; border-radius: 100%; background-color: black; position: absolute; border: 2px solid white; } .loader--dot:first-child { background-color: #8cc759; animation-delay: 0.5s; } .loader--dot:nth-child(2) { background-color: #8c6daf; animation-delay: 0.4s; } .loader--dot:nth-child(3) { background-color: #ef5d74; animation-delay: 0.3s; } .loader--dot:nth-child(4) { background-color: #f9a74b; animation-delay: 0.2s; } .loader--dot:nth-child(5) { background-color: #60beeb; animation-delay: 0.1s; } .loader--dot:nth-child(6) { background-color: #fbef5a; animation-delay: 0s; } .loader--text { position: absolute; top: 200%; left: 0; right: 0; width: 4rem; margin: auto; } .loader--text:after { content: "Loading"; font-weight: bold; animation-name: loading-text; animation-duration: 3s; animation-iteration-count: infinite; } @keyframes loader { 15% { transform: translateX(0); } 45% { transform: translateX(230px); } 65% { transform: translateX(230px); } 95% { transform: translateX(0); } } @keyframes loading-text { 0% { content: "Loading"; } 25% { content: "Loading."; } 50% { content: "Loading.."; } 75% { content: "Loading..."; } } }