f7cloud-office: полная выгрузка (browser, service, конфиги)
This commit is contained in:
root
BIN
Binary file not shown.
|
After Width: | Height: | Size: 1.0 KiB |
Vendored
BIN
Binary file not shown.
|
After Width: | Height: | Size: 2.3 KiB |
BIN
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
Vendored
BIN
Binary file not shown.
|
After Width: | Height: | Size: 38 KiB |
Vendored
BIN
Binary file not shown.
|
After Width: | Height: | Size: 73 KiB |
Vendored
+418
@@ -0,0 +1,418 @@
|
||||
:root {
|
||||
--welcome-text: #222;
|
||||
--welcome-anchor: #444;
|
||||
--welcome-gradient: 186, 186, 186;
|
||||
--welcome-highlight: #efefef;
|
||||
--welcome-btn-border: #444;
|
||||
--welcome-glow-img: #e5e5e5;
|
||||
}
|
||||
[data-theme='dark'] {
|
||||
--welcome-text: #e8e8e8;
|
||||
--welcome-anchor: #121212;
|
||||
--welcome-gradient: 69, 69, 69;
|
||||
--welcome-highlight: black;
|
||||
--welcome-btn-border: #e8e8e8;
|
||||
--welcome-glow-img: black;
|
||||
}
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
scrollbar-color: transparent transparent;
|
||||
scrollbar-width: 0;
|
||||
-ms-overflow-style: none;
|
||||
}
|
||||
|
||||
/* Hiding scroll bar */
|
||||
*::-webkit-scrollbar {
|
||||
width: 0;
|
||||
}
|
||||
|
||||
*::-webkit-scrollbar-track {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
*::-webkit-scrollbar-thumb {
|
||||
background: transparent;
|
||||
border: none;
|
||||
}
|
||||
|
||||
.slider,
|
||||
.slides > div {
|
||||
width: 96%;
|
||||
}
|
||||
|
||||
.slider {
|
||||
text-align: center;
|
||||
overflow: hidden;
|
||||
height: auto;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.slides {
|
||||
display: flex;
|
||||
overflow-x: auto;
|
||||
scroll-snap-type: x mandatory;
|
||||
scroll-behavior: smooth;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
}
|
||||
|
||||
.slides::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.slides::-webkit-scrollbar-thumb {
|
||||
background: black;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.slides::-webkit-scrollbar-track {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.slides > div {
|
||||
scroll-snap-align: start;
|
||||
flex-shrink: 0;
|
||||
margin-right: 50px;
|
||||
border-radius: 10px;
|
||||
transform-origin: center center;
|
||||
transform: scale(1);
|
||||
transition: transform 0.5s;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.slider > a {
|
||||
display: inline-flex;
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
background: linear-gradient(to top, rgba(var(--welcome-gradient), 0.7), rgba(var(--welcome-gradient), 1));
|
||||
text-decoration: none;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 50%;
|
||||
margin: 0 0 0.5rem 0.5rem;
|
||||
position: relative;
|
||||
color: transparent;
|
||||
-webkit-user-select: none; /* Safari */
|
||||
-moz-user-select: none; /* Firefox */
|
||||
-ms-user-select: none; /* IE10+/Edge */
|
||||
user-select: none; /* Standard */
|
||||
}
|
||||
|
||||
.slides h2 > a {
|
||||
text-decoration: none;
|
||||
color: var(--welcome-text);
|
||||
background: var(--welcome-highlight);
|
||||
padding: 0 4px;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.slides h2 > a:hover {
|
||||
color: #000;
|
||||
background: white;
|
||||
box-shadow: 0 0 4px 1px #00000024;
|
||||
}
|
||||
|
||||
.slider > a:active,
|
||||
.slider > a.active {
|
||||
background: var(--welcome-anchor);
|
||||
}
|
||||
|
||||
.slider > a:focus {
|
||||
background: var(--welcome-anchor);
|
||||
}
|
||||
|
||||
/* Don't need button navigation */
|
||||
@supports (scroll-snap-type) {
|
||||
.slider > a {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
html,
|
||||
body {
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
scrollbar-color: auto;
|
||||
scrollbar-width: thin;
|
||||
/* Same font as used in dialogs */
|
||||
font-family: 'Helvetica Neue', sans-serif;
|
||||
}
|
||||
|
||||
.slides h1 {
|
||||
font-size: 1.375rem;
|
||||
font-weight: normal;
|
||||
margin-bottom: 4px;
|
||||
color: var(--welcome-text);
|
||||
}
|
||||
|
||||
.slides h2 {
|
||||
font-size: 1rem;
|
||||
font-weight: normal;
|
||||
margin-top: 0;
|
||||
color: var(--welcome-text);
|
||||
}
|
||||
|
||||
.slides p {
|
||||
font-size: 0.875rem;
|
||||
font-weight: normal;
|
||||
color: var(--welcome-text);
|
||||
}
|
||||
|
||||
.slides a {
|
||||
text-decoration: none;
|
||||
color: #0b87e7;
|
||||
}
|
||||
|
||||
.slides fig {
|
||||
height: 232px;
|
||||
display: block;
|
||||
margin: 16px auto 12px auto;
|
||||
}
|
||||
|
||||
html:not([data-theme='dark']) #slide-1 fig {
|
||||
background: linear-gradient(to top, #e6e6e6c4, #e6e6e64f 3%, white 33%);
|
||||
}
|
||||
#slide-1 fig {
|
||||
border-radius: 0 0 50% 50%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
#slide-1 #fig-slide1-l {
|
||||
background: url('slide1-left.png') no-repeat center;
|
||||
width: 68px;
|
||||
height: 68px;
|
||||
box-shadow: 0 0 8px 1px #00000040;
|
||||
border-radius: 100%;
|
||||
}
|
||||
|
||||
#slide-1 #fig-slide1-c {
|
||||
background: url('slide1-center.png') no-repeat center;
|
||||
width: 96px;
|
||||
height: 96px;
|
||||
box-shadow: 0 0 12px 1px #00000040;
|
||||
border-radius: 100%;
|
||||
margin: 42px 32px 0;
|
||||
}
|
||||
|
||||
#slide-1 #fig-slide1-r {
|
||||
background: url('slide1-right.png') no-repeat center;
|
||||
width: 68px;
|
||||
height: 68px;
|
||||
box-shadow: 0 0 8px 1px #0000005e;
|
||||
border-radius: 100%;
|
||||
}
|
||||
|
||||
#slide-2 fig {
|
||||
background: url('slide2.png') no-repeat center;
|
||||
}
|
||||
|
||||
#slide-3 fig {
|
||||
background: url('slide3.png') no-repeat center;
|
||||
box-shadow: 0 0 8px 1px var(--welcome-glow-img);
|
||||
width: 342px;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
#view-supported-versions {
|
||||
text-align: center;
|
||||
display: block;
|
||||
}
|
||||
|
||||
#user-welcome--buttons {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: flex-end;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.arrow {
|
||||
border: solid var(--welcome-btn-border);
|
||||
border-width: 0 3px 3px 0;
|
||||
display: inline-block;
|
||||
padding: 3px;
|
||||
margin-left: -3px;
|
||||
}
|
||||
|
||||
.arrow.right {
|
||||
transform: rotate(-45deg);
|
||||
}
|
||||
|
||||
.arrow.left {
|
||||
transform: rotate(135deg);
|
||||
-webkit-transform: rotate(135deg);
|
||||
}
|
||||
|
||||
.arrow.left.close {
|
||||
margin-left: 1px;
|
||||
display: none;
|
||||
}
|
||||
|
||||
#slide-3-button {
|
||||
width: auto;
|
||||
border-radius: 18px;
|
||||
height: 32px;
|
||||
margin: 1.5px;
|
||||
border-color: #0084d145;
|
||||
font-weight: bold;
|
||||
color: #0084d1;
|
||||
border-width: 2px;
|
||||
}
|
||||
|
||||
#slide-3-button:hover {
|
||||
background-color: #0084d1;
|
||||
color: white;
|
||||
}
|
||||
|
||||
button {
|
||||
border: 1px solid var(--welcome-btn-border);
|
||||
background-color: transparent;
|
||||
border-radius: 50%;
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
appearance: none;
|
||||
}
|
||||
|
||||
button:active {
|
||||
box-shadow: inset 0 0 3px 2px #00000024;
|
||||
}
|
||||
|
||||
button:hover {
|
||||
background-color: var(--welcome-highlight);
|
||||
}
|
||||
|
||||
button:hover .arrow.right.close {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
button:hover .arrow.left.close {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
#welcome-close {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#welcome-close::before {
|
||||
border: 1px solid transparent;
|
||||
border-radius: 50%;
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
line-height: 48px;
|
||||
font-size: 2.25rem;
|
||||
position: absolute;
|
||||
content: '\00D7';
|
||||
font-weight: normal;
|
||||
text-align: center;
|
||||
top: 3px;
|
||||
right: 3px;
|
||||
color: #bbb;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
#welcome-close:hover::before,
|
||||
#welcome-close:active::before {
|
||||
border-radius: 100px;
|
||||
color: white;
|
||||
background-color: #bbb;
|
||||
}
|
||||
|
||||
@media only screen
|
||||
and (max-width: 500px)
|
||||
and (orientation: portrait) {
|
||||
.slider,
|
||||
.slides > div {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
button {
|
||||
width: 62px;
|
||||
height: 62px;
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
}
|
||||
|
||||
.slides p {
|
||||
margin-left: 14px;
|
||||
margin-right: 14px;
|
||||
}
|
||||
|
||||
.arrow {
|
||||
padding: 4px;
|
||||
}
|
||||
|
||||
#slide-3-button {
|
||||
background-color: #0084d1;
|
||||
color: white;
|
||||
width: 100%;
|
||||
height: 44px;
|
||||
border-radius: 3px;
|
||||
margin: 8px;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
a[id^='slide-'] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#view-supported-versions {
|
||||
height: 44px;
|
||||
margin-top: 24px;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen
|
||||
and (max-height: 500px)
|
||||
and (orientation: landscape) {
|
||||
.slider,
|
||||
.slides > div {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
button {
|
||||
width: 62px;
|
||||
height: 62px;
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
}
|
||||
|
||||
.arrow {
|
||||
padding: 4px;
|
||||
}
|
||||
|
||||
html,
|
||||
body {
|
||||
overflow-y: scroll;
|
||||
}
|
||||
|
||||
.slides p {
|
||||
margin-left: 14px;
|
||||
margin-right: 14px;
|
||||
}
|
||||
|
||||
.slides fig {
|
||||
height: 116px;
|
||||
}
|
||||
|
||||
#slide-3-button {
|
||||
background-color: #0084d1;
|
||||
color: white;
|
||||
width: 100%;
|
||||
height: 44px;
|
||||
border-radius: 3px;
|
||||
margin: 8px;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
a[id^='slide-'] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#view-supported-versions {
|
||||
height: 44px;
|
||||
margin-top: 24px;
|
||||
}
|
||||
}
|
||||
Vendored
+63
@@ -0,0 +1,63 @@
|
||||
<!DOCTYPE html>
|
||||
|
||||
<html data-theme="%UI_THEME%">
|
||||
<head>
|
||||
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate">
|
||||
<meta http-equiv="Pragma" content="no-cache">
|
||||
<meta http-equiv="Expires" content="0">
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<title>F7 Office Welcome</title>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="stylesheet" type="text/css" href="welcome.css">
|
||||
<script src="welcome.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="user-welcome">
|
||||
<div class="slider">
|
||||
<div class="slides">
|
||||
<div id="slide-1">
|
||||
<fig>
|
||||
<fig id="fig-slide1-l"></fig>
|
||||
<fig id="fig-slide1-c"></fig>
|
||||
<fig id="fig-slide1-r"></fig>
|
||||
</fig>
|
||||
<h1 id="welcome-slide1-heading-1" data-translate="true">Explore The New {coolversion}</h1>
|
||||
<h2 id="welcome-slide1-heading-2" data-translate="true">F7 Office</h2>
|
||||
<p id="welcome-slide1-content" data-translate="true">Enjoy the latest developments in online productivity, free for you to use, to explore and to use with others in the browser.</p>
|
||||
<div id="user-welcome--buttons">
|
||||
<form action="#slide-2">
|
||||
<button type="button" id="slide-1-button"><i class="arrow right"></i></button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<div id="slide-2">
|
||||
<fig></fig>
|
||||
<h1 id="welcome-slide2-heading-1" data-translate="true">Discover All The Changes</h1>
|
||||
<h2 id="welcome-slide2-heading-2" data-translate="true">F7 Office</h2>
|
||||
<p id="welcome-slide2-content" data-translate="true">Learn all about: The latest F7 Office, aimed at home users and small teams. </p>
|
||||
<div id="user-welcome--buttons">
|
||||
<form action="#slide-3">
|
||||
<button type="button" id="slide-2-button"><i class="arrow right"></i></button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<div id="slide-3">
|
||||
<fig></fig>
|
||||
<h1 id="welcome-slide3-heading-1" data-translate="true">Get Involved</h1>
|
||||
<h2 id="welcome-slide3-heading-2" data-translate="true">F7 Office</h2>
|
||||
<p id="welcome-slide3-content" data-translate="true">Welcome to F7 Office. </p>
|
||||
<div id="user-welcome--buttons">
|
||||
<button type="button" id="slide-3-button" data-translate="true">Close</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<a id="slide-1-indicator" class="active" href="#slide-1" data-translate="true">1</a>
|
||||
<a id="slide-2-indicator" href="#slide-2" data-translate="true">2</a>
|
||||
<a id="slide-3-indicator" href="#slide-3" data-translate="true">3</a>
|
||||
</div>
|
||||
</div>
|
||||
<div id="welcome-close"></div>
|
||||
</body>
|
||||
</html>
|
||||
Vendored
+90
@@ -0,0 +1,90 @@
|
||||
window.onload = onLoaded;
|
||||
|
||||
function onLoaded() {
|
||||
window.addEventListener('message', onMessage, false);
|
||||
|
||||
document.getElementById('welcome-close').onclick = function () {
|
||||
onClose();
|
||||
}
|
||||
|
||||
document.getElementById('slide-1-button').onclick = function () {
|
||||
onSlideClick('slide-2-indicator', true);
|
||||
};
|
||||
|
||||
document.getElementById('slide-2-button').onclick = function () {
|
||||
onSlideClick('slide-3-indicator', true);
|
||||
};
|
||||
|
||||
document.getElementById('slide-3-button').onclick = function () {
|
||||
onClose();
|
||||
};
|
||||
|
||||
document.getElementById('slide-1-indicator').onclick = function () {
|
||||
onSlideClick('slide-1-indicator');
|
||||
};
|
||||
|
||||
document.getElementById('slide-2-indicator').onclick = function () {
|
||||
onSlideClick('slide-2-indicator');
|
||||
};
|
||||
|
||||
document.getElementById('slide-3-indicator').onclick = function () {
|
||||
onSlideClick('slide-3-indicator');
|
||||
};
|
||||
|
||||
if (window.parent !== window.self) {
|
||||
var message = {
|
||||
MessageId: 'welcome-translate',
|
||||
strings: {}
|
||||
};
|
||||
getTranslatable(document.body, message.strings);
|
||||
window.parent.postMessage(JSON.stringify(message), '*');
|
||||
}
|
||||
}
|
||||
|
||||
function onClose() {
|
||||
if (window.parent !== window.self) {
|
||||
window.parent.postMessage('{"MessageId":"welcome-close"}', '*');
|
||||
}
|
||||
}
|
||||
|
||||
function onSlideClick(e, isButton = false) {
|
||||
for (var i = 1; i < 4; i++)
|
||||
document.getElementById('slide-' + i + '-indicator').classList.remove("active");
|
||||
|
||||
document.getElementById(e).classList.add("active");
|
||||
if (isButton)
|
||||
document.location = '#' + e.replace('-indicator', '');
|
||||
}
|
||||
|
||||
function onMessage(e) {
|
||||
try {
|
||||
var msg = JSON.parse(e.data);
|
||||
if (e.origin === window.origin && window.parent !== window.self
|
||||
&& msg.MessageId === 'welcome-translate') {
|
||||
setTranslatable(document.body, msg.strings);
|
||||
window.parent.postMessage('{"MessageId":"welcome-show"}', '*');
|
||||
}
|
||||
} catch (err) {
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
function getTranslatable(root, strings) {
|
||||
var children = root.children;
|
||||
for (var i = 0; i < children.length; ++i) {
|
||||
if (children[i].dataset.translate === 'true') {
|
||||
strings[children[i].innerHTML.trim().replace('\n', '')] = '';
|
||||
}
|
||||
getTranslatable(children[i], strings);
|
||||
}
|
||||
}
|
||||
|
||||
function setTranslatable(root, strings) {
|
||||
var children = root.children;
|
||||
for (var i = 0; i < children.length; ++i) {
|
||||
if (children[i].dataset.translate === 'true') {
|
||||
children[i].innerHTML = strings[children[i].innerHTML.trim().replace('\n', '')];
|
||||
}
|
||||
setTranslatable(children[i], strings);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user