Merge branch 'staging' of github.com:xwiki-labs/cryptpad into accounting
This commit is contained in:
ansuz
commit
a7d61aa562
@ -1,6 +1,11 @@
|
|||||||
/* Logs are shown to inform the user that something has happened
|
/* Logs are shown to inform the user that something has happened
|
||||||
They are only displayed briefly
|
They are only displayed briefly
|
||||||
*/
|
*/
|
||||||
|
@media print {
|
||||||
|
.alertify-logs {
|
||||||
|
visibility: hidden;
|
||||||
|
}
|
||||||
|
}
|
||||||
.alertify-logs > * {
|
.alertify-logs > * {
|
||||||
padding: 12px 48px;
|
padding: 12px 48px;
|
||||||
color: #fafafa;
|
color: #fafafa;
|
||||||
@ -1000,11 +1005,6 @@ html.cp,
|
|||||||
.cp #main_other .buttons {
|
.cp #main_other .buttons {
|
||||||
margin-top: 15px;
|
margin-top: 15px;
|
||||||
}
|
}
|
||||||
.cp #fileManagerIframe {
|
|
||||||
width: 100%;
|
|
||||||
height: 500px;
|
|
||||||
margin-top: 15px;
|
|
||||||
}
|
|
||||||
.cp .create,
|
.cp .create,
|
||||||
.cp .action {
|
.cp .action {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
@ -1294,196 +1294,6 @@ html.cp,
|
|||||||
.cp div.realtime #addoption {
|
.cp div.realtime #addoption {
|
||||||
border-bottom-left-radius: 5px;
|
border-bottom-left-radius: 5px;
|
||||||
}
|
}
|
||||||
.cp.slide #modal .button {
|
|
||||||
position: absolute;
|
|
||||||
cursor: pointer;
|
|
||||||
font-size: 30px;
|
|
||||||
opacity: 0.6;
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
.cp.slide #modal .button:hover {
|
|
||||||
opacity: 1;
|
|
||||||
display: block !important;
|
|
||||||
}
|
|
||||||
.cp.slide #modal #button_exit {
|
|
||||||
left: 20px;
|
|
||||||
top: 20px;
|
|
||||||
z-index: 9001;
|
|
||||||
}
|
|
||||||
.cp.slide #modal #button_left {
|
|
||||||
left: 6vw;
|
|
||||||
bottom: 10vh;
|
|
||||||
}
|
|
||||||
.cp.slide #modal #button_right {
|
|
||||||
right: 6vw;
|
|
||||||
bottom: 10vh;
|
|
||||||
}
|
|
||||||
.cp.slide #modal #content p,
|
|
||||||
.cp.slide #modal #content ul,
|
|
||||||
.cp.slide #modal #content ol {
|
|
||||||
font-size: 26px;
|
|
||||||
}
|
|
||||||
.cp.slide #modal #content img {
|
|
||||||
position: relative;
|
|
||||||
min-width: 1%;
|
|
||||||
max-width: 90%;
|
|
||||||
max-height: 90%;
|
|
||||||
margin: auto;
|
|
||||||
}
|
|
||||||
.cp div.modal,
|
|
||||||
.cp div#modal {
|
|
||||||
box-sizing: border-box;
|
|
||||||
z-index: 9001;
|
|
||||||
position: fixed;
|
|
||||||
top: 0px;
|
|
||||||
left: 0px;
|
|
||||||
width: 100%;
|
|
||||||
height: 100vh;
|
|
||||||
display: none;
|
|
||||||
background-color: #000;
|
|
||||||
}
|
|
||||||
.cp div.modal #content,
|
|
||||||
.cp div#modal #content {
|
|
||||||
box-sizing: border-box;
|
|
||||||
border: 1px solid white;
|
|
||||||
vertical-align: middle;
|
|
||||||
padding: 2.5vw;
|
|
||||||
/* center things as much as possible
|
|
||||||
|
|
||||||
margin-top: 50vh;
|
|
||||||
margin-bottom: 50vh;
|
|
||||||
transform: translateY(-50%);
|
|
||||||
|
|
||||||
*/
|
|
||||||
width: 100vw;
|
|
||||||
height: 56.25vw;
|
|
||||||
max-height: 100vh;
|
|
||||||
max-width: 177.78vh;
|
|
||||||
margin: auto;
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
bottom: 0;
|
|
||||||
left: 0;
|
|
||||||
right: 0;
|
|
||||||
}
|
|
||||||
.cp div.modal #content p,
|
|
||||||
.cp div#modal #content p,
|
|
||||||
.cp div.modal #content li,
|
|
||||||
.cp div#modal #content li,
|
|
||||||
.cp div.modal #content pre,
|
|
||||||
.cp div#modal #content pre,
|
|
||||||
.cp div.modal #content code,
|
|
||||||
.cp div#modal #content code {
|
|
||||||
font-size: 2.75vw;
|
|
||||||
line-height: 3.025vw;
|
|
||||||
}
|
|
||||||
.cp div.modal #content h1,
|
|
||||||
.cp div#modal #content h1 {
|
|
||||||
font-size: 5vw;
|
|
||||||
line-height: 5.5vw;
|
|
||||||
}
|
|
||||||
.cp div.modal #content h2,
|
|
||||||
.cp div#modal #content h2 {
|
|
||||||
font-size: 4.2vw;
|
|
||||||
line-height: 4.62vw;
|
|
||||||
}
|
|
||||||
.cp div.modal #content h3,
|
|
||||||
.cp div#modal #content h3 {
|
|
||||||
font-size: 3.6vw;
|
|
||||||
line-height: 3.96vw;
|
|
||||||
}
|
|
||||||
.cp div.modal #content h4,
|
|
||||||
.cp div#modal #content h4 {
|
|
||||||
font-size: 3vw;
|
|
||||||
line-height: 3.3vw;
|
|
||||||
}
|
|
||||||
.cp div.modal #content h5,
|
|
||||||
.cp div#modal #content h5 {
|
|
||||||
font-size: 2.2vw;
|
|
||||||
line-height: 2.42vw;
|
|
||||||
}
|
|
||||||
.cp div.modal #content h6,
|
|
||||||
.cp div#modal #content h6 {
|
|
||||||
font-size: 1.6vw;
|
|
||||||
line-height: 1.76vw;
|
|
||||||
}
|
|
||||||
.cp div.modal #content h1,
|
|
||||||
.cp div#modal #content h1,
|
|
||||||
.cp div.modal #content h2,
|
|
||||||
.cp div#modal #content h2,
|
|
||||||
.cp div.modal #content h3,
|
|
||||||
.cp div#modal #content h3,
|
|
||||||
.cp div.modal #content h4,
|
|
||||||
.cp div#modal #content h4,
|
|
||||||
.cp div.modal #content h5,
|
|
||||||
.cp div#modal #content h5,
|
|
||||||
.cp div.modal #content h6,
|
|
||||||
.cp div#modal #content h6 {
|
|
||||||
color: inherit;
|
|
||||||
}
|
|
||||||
.cp div.modal #content pre > code,
|
|
||||||
.cp div#modal #content pre > code {
|
|
||||||
display: block;
|
|
||||||
position: relative;
|
|
||||||
border: 1px solid #333;
|
|
||||||
width: 90%;
|
|
||||||
margin: auto;
|
|
||||||
padding-left: .25vw;
|
|
||||||
}
|
|
||||||
.cp div.modal #content ul,
|
|
||||||
.cp div#modal #content ul,
|
|
||||||
.cp div.modal #content ol,
|
|
||||||
.cp div#modal #content ol {
|
|
||||||
min-width: 50%;
|
|
||||||
max-width: 100%;
|
|
||||||
display: table;
|
|
||||||
margin: 0 auto;
|
|
||||||
}
|
|
||||||
.cp div.modal .center,
|
|
||||||
.cp div#modal .center {
|
|
||||||
position: relative;
|
|
||||||
width: 80%;
|
|
||||||
height: 80%;
|
|
||||||
margin: auto;
|
|
||||||
border: 1px solid #ffffff;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
.cp div.modal.shown,
|
|
||||||
.cp div#modal.shown {
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
.cp div.modal table,
|
|
||||||
.cp div#modal table {
|
|
||||||
margin: 30px;
|
|
||||||
border-collapse: collapse;
|
|
||||||
}
|
|
||||||
.cp div.modal table input,
|
|
||||||
.cp div#modal table input {
|
|
||||||
height: 100%;
|
|
||||||
width: 90%;
|
|
||||||
border: 3px solid #fff;
|
|
||||||
}
|
|
||||||
.cp div.modal table tfoot tr td,
|
|
||||||
.cp div#modal table tfoot tr td {
|
|
||||||
z-index: 4000;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
.cp div.modal #addtime,
|
|
||||||
.cp div#modal #addtime,
|
|
||||||
.cp div.modal #adddate,
|
|
||||||
.cp div#modal #adddate {
|
|
||||||
color: #46E981;
|
|
||||||
border: 1px solid #46E981;
|
|
||||||
padding: 15px;
|
|
||||||
}
|
|
||||||
.cp div.modal #adddate,
|
|
||||||
.cp div#modal #adddate {
|
|
||||||
border-top-left-radius: 5px;
|
|
||||||
}
|
|
||||||
.cp div.modal #addtime,
|
|
||||||
.cp div#modal #addtime {
|
|
||||||
border-bottom-left-radius: 5px;
|
|
||||||
}
|
|
||||||
#cors-store {
|
#cors-store {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,11 +1,6 @@
|
|||||||
(function () {
|
(function () {
|
||||||
var LS_LANG = "CRYPTPAD_LANG";
|
var LS_LANG = "CRYPTPAD_LANG";
|
||||||
|
|
||||||
var getStoredLanguage = function () { return localStorage.getItem(LS_LANG); };
|
|
||||||
var getBrowserLanguage = function () { return navigator.language || navigator.userLanguage; };
|
|
||||||
var getLanguage = function () { return getStoredLanguage() || getBrowserLanguage(); };
|
|
||||||
var language = getLanguage();
|
|
||||||
|
|
||||||
// add your module to this map so it gets used
|
// add your module to this map so it gets used
|
||||||
var map = {
|
var map = {
|
||||||
'fr': 'Français',
|
'fr': 'Français',
|
||||||
@ -15,6 +10,19 @@ var map = {
|
|||||||
'pt-br': 'Português do Brasil'
|
'pt-br': 'Português do Brasil'
|
||||||
};
|
};
|
||||||
|
|
||||||
|
var getStoredLanguage = function () { return localStorage.getItem(LS_LANG); };
|
||||||
|
var getBrowserLanguage = function () { return navigator.language || navigator.userLanguage; };
|
||||||
|
var getLanguage = function () {
|
||||||
|
if (getStoredLanguage()) { return getStoredLanguage(); }
|
||||||
|
var l = getBrowserLanguage() || '';
|
||||||
|
if (Object.keys(map).indexOf(l) !== -1) {
|
||||||
|
return l;
|
||||||
|
}
|
||||||
|
// Edge returns 'fr-FR' --> transform it to 'fr' and check again
|
||||||
|
return Object.keys(map).indexOf(l.split('-')[0]) !== -1 ? l.split('-')[0] : 'en';
|
||||||
|
};
|
||||||
|
var language = getLanguage();
|
||||||
|
|
||||||
var req = ['/customize/translations/messages.js'];
|
var req = ['/customize/translations/messages.js'];
|
||||||
if (language && map[language]) { req.push('/customize/translations/messages.' + language + '.js'); }
|
if (language && map[language]) { req.push('/customize/translations/messages.' + language + '.js'); }
|
||||||
req.push('/bower_components/jquery/dist/jquery.min.js');
|
req.push('/bower_components/jquery/dist/jquery.min.js');
|
||||||
|
|||||||
@ -4,6 +4,9 @@
|
|||||||
They are only displayed briefly
|
They are only displayed briefly
|
||||||
*/
|
*/
|
||||||
.alertify-logs {
|
.alertify-logs {
|
||||||
|
@media print {
|
||||||
|
visibility: hidden;
|
||||||
|
}
|
||||||
> * {
|
> * {
|
||||||
padding: @padding-base @padding-base * 4;
|
padding: @padding-base @padding-base * 4;
|
||||||
color: @alertify-fore;
|
color: @alertify-fore;
|
||||||
|
|||||||
@ -494,12 +494,6 @@ noscript {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
#fileManagerIframe {
|
|
||||||
width: 100%;
|
|
||||||
height: 500px;
|
|
||||||
margin-top: 15px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* buttons */
|
/* buttons */
|
||||||
|
|
||||||
.create, .action {
|
.create, .action {
|
||||||
@ -816,192 +810,6 @@ form.realtime, div.realtime {
|
|||||||
#adduser { .top-left; }
|
#adduser { .top-left; }
|
||||||
#addoption { .bottom-left; }
|
#addoption { .bottom-left; }
|
||||||
}
|
}
|
||||||
|
|
||||||
// used for slides
|
|
||||||
.viewportRatio (@x, @y, @p: 100) {
|
|
||||||
width: @p * 100vw;
|
|
||||||
height: @y * (@p * 100vw) / @x;
|
|
||||||
max-width: @x / @y * (@p * 100vh);
|
|
||||||
max-height: (@p * 100vh);
|
|
||||||
}
|
|
||||||
|
|
||||||
&.slide {
|
|
||||||
#modal {
|
|
||||||
.button {
|
|
||||||
position: absolute;
|
|
||||||
cursor: pointer;
|
|
||||||
font-size: 30px;
|
|
||||||
opacity: 0.6;
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
.button:hover {
|
|
||||||
opacity: 1;
|
|
||||||
display: block !important;
|
|
||||||
}
|
|
||||||
#button_exit {
|
|
||||||
left: 20px;
|
|
||||||
top: 20px;
|
|
||||||
z-index: 9001;
|
|
||||||
}
|
|
||||||
#button_left {
|
|
||||||
left: 6vw;
|
|
||||||
bottom: 10vh;
|
|
||||||
}
|
|
||||||
#button_right {
|
|
||||||
right: 6vw;
|
|
||||||
bottom: 10vh;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
#modal #content {
|
|
||||||
p, ul, ol { font-size: 26px; }
|
|
||||||
|
|
||||||
img {
|
|
||||||
position: relative;
|
|
||||||
min-width: 1%;
|
|
||||||
max-width: 90%;
|
|
||||||
max-height: 90%;
|
|
||||||
margin: auto;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
div.modal, div#modal {
|
|
||||||
display: none;
|
|
||||||
|
|
||||||
#content {
|
|
||||||
box-sizing: border-box;
|
|
||||||
border: 1px solid white;
|
|
||||||
|
|
||||||
vertical-align: middle;
|
|
||||||
padding: 2.5vw;
|
|
||||||
|
|
||||||
/* center things as much as possible
|
|
||||||
|
|
||||||
margin-top: 50vh;
|
|
||||||
margin-bottom: 50vh;
|
|
||||||
transform: translateY(-50%);
|
|
||||||
|
|
||||||
*/
|
|
||||||
|
|
||||||
width: 100vw;
|
|
||||||
height: 56.25vw; // height:width ratio = 9/16 = .5625
|
|
||||||
max-height: 100vh;
|
|
||||||
max-width: 177.78vh; // 16/9 = 1.778
|
|
||||||
margin: auto;
|
|
||||||
position: absolute;
|
|
||||||
top:0;bottom:0; // vertical center
|
|
||||||
left:0;right:0; // horizontal center
|
|
||||||
|
|
||||||
p, li, pre, code {
|
|
||||||
.size(2.75);
|
|
||||||
}
|
|
||||||
|
|
||||||
h1 { .size(5); }
|
|
||||||
h2 { .size(4.2); }
|
|
||||||
h3 { .size(3.6); }
|
|
||||||
h4 { .size (3); }
|
|
||||||
h5 { .size(2.2); }
|
|
||||||
h6 { .size(1.6); }
|
|
||||||
|
|
||||||
h1, h2, h3, h4, h5, h6 {
|
|
||||||
color: inherit;
|
|
||||||
}
|
|
||||||
|
|
||||||
pre > code {
|
|
||||||
display: block;
|
|
||||||
position: relative;
|
|
||||||
border: 1px solid #333;
|
|
||||||
width: 90%;
|
|
||||||
margin: auto;
|
|
||||||
padding-left: .25vw;
|
|
||||||
}
|
|
||||||
|
|
||||||
ul, ol {
|
|
||||||
min-width: 50%;
|
|
||||||
max-width: 100%;
|
|
||||||
display: table;
|
|
||||||
margin: 0 auto;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
box-sizing: border-box;
|
|
||||||
z-index: 9001;
|
|
||||||
position: fixed;
|
|
||||||
|
|
||||||
top: 0px;
|
|
||||||
left: 0px;
|
|
||||||
|
|
||||||
width: 100%;
|
|
||||||
height: 100vh;
|
|
||||||
display: none;
|
|
||||||
|
|
||||||
background-color: @slide-default-bg;
|
|
||||||
|
|
||||||
.center {
|
|
||||||
position: relative;
|
|
||||||
|
|
||||||
width: 80%;
|
|
||||||
height: 80%;
|
|
||||||
margin: auto;
|
|
||||||
border: 1px solid @light-base;
|
|
||||||
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.shown {
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
|
|
||||||
table {
|
|
||||||
margin: 30px;
|
|
||||||
|
|
||||||
border-collapse: collapse;
|
|
||||||
tr {
|
|
||||||
td {
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
input {
|
|
||||||
height: 100%;
|
|
||||||
width: 90%;
|
|
||||||
border: 3px solid @base;
|
|
||||||
}
|
|
||||||
|
|
||||||
thead {
|
|
||||||
tr {
|
|
||||||
th {
|
|
||||||
span.remove {
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
tbody {
|
|
||||||
tr {
|
|
||||||
td {
|
|
||||||
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
tfoot {
|
|
||||||
tr {
|
|
||||||
td {
|
|
||||||
z-index: 4000;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
#addtime,
|
|
||||||
#adddate {
|
|
||||||
color: @cp-green;
|
|
||||||
border: 1px solid @cp-green;
|
|
||||||
padding: 15px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#adddate { .top-left; }
|
|
||||||
#addtime { .bottom-left; }
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// hack for our cross-origin iframe
|
// hack for our cross-origin iframe
|
||||||
|
|||||||
@ -77,6 +77,14 @@ define(function () {
|
|||||||
out.backgroundButtonTitle = 'Changer la couleur de fond de la présentation';
|
out.backgroundButtonTitle = 'Changer la couleur de fond de la présentation';
|
||||||
out.colorButtonTitle = 'Changer la couleur du texte en mode présentation';
|
out.colorButtonTitle = 'Changer la couleur du texte en mode présentation';
|
||||||
|
|
||||||
|
out.printButton = "Imprimer";
|
||||||
|
out.printButtonTitle = "Imprimer votre présentation ou l'enregistrer au format PDF";
|
||||||
|
out.printOptions = "Options d'impression";
|
||||||
|
out.printSlideNumber = "Afficher le numéro des slides";
|
||||||
|
out.printDate = "Afficher la date";
|
||||||
|
out.printTitle = "Afficher le titre du pad";
|
||||||
|
out.printCSS = "Personnaliser l'apparence (CSS):";
|
||||||
|
|
||||||
out.editShare = "Lien d'édition";
|
out.editShare = "Lien d'édition";
|
||||||
out.editShareTitle = "Copier le lien d'édition dans le presse-papiers";
|
out.editShareTitle = "Copier le lien d'édition dans le presse-papiers";
|
||||||
out.editOpen = "Éditer dans un nouvel onglet";
|
out.editOpen = "Éditer dans un nouvel onglet";
|
||||||
|
|||||||
@ -79,6 +79,14 @@ define(function () {
|
|||||||
out.backgroundButtonTitle = 'Change the background color in the presentation';
|
out.backgroundButtonTitle = 'Change the background color in the presentation';
|
||||||
out.colorButtonTitle = 'Change the text color in presentation mode';
|
out.colorButtonTitle = 'Change the text color in presentation mode';
|
||||||
|
|
||||||
|
out.printButton = "Print";
|
||||||
|
out.printButtonTitle = "Print your slides or export them as a PDF file";
|
||||||
|
out.printOptions = "Print options";
|
||||||
|
out.printSlideNumber = "Display the slide number";
|
||||||
|
out.printDate = "Display the date";
|
||||||
|
out.printTitle = "Display the pad title";
|
||||||
|
out.printCSS = "Custom style rules (CSS):";
|
||||||
|
|
||||||
out.editShare = "Editing link";
|
out.editShare = "Editing link";
|
||||||
out.editShareTitle = "Copy the editing link to clipboard";
|
out.editShareTitle = "Copy the editing link to clipboard";
|
||||||
out.editOpen = "Open editing link in a new tab";
|
out.editOpen = "Open editing link in a new tab";
|
||||||
@ -94,7 +102,7 @@ define(function () {
|
|||||||
|
|
||||||
out.okButton = 'OK (enter)';
|
out.okButton = 'OK (enter)';
|
||||||
|
|
||||||
out.cancel = "Cancel"; // Not used?
|
out.cancel = "Cancel";
|
||||||
out.cancelButton = 'Cancel (esc)';
|
out.cancelButton = 'Cancel (esc)';
|
||||||
|
|
||||||
// Polls
|
// Polls
|
||||||
|
|||||||
@ -16,7 +16,7 @@
|
|||||||
"scripts": {
|
"scripts": {
|
||||||
"lint": "jshint --config .jshintrc --exclude-path .jshintignore .",
|
"lint": "jshint --config .jshintrc --exclude-path .jshintignore .",
|
||||||
"test": "node TestSelenium.js",
|
"test": "node TestSelenium.js",
|
||||||
"style": "lessc ./customize.dist/src/less/cryptpad.less > ./customize.dist/main.css && lessc ./customize.dist/src/less/toolbar.less > ./customize.dist/toolbar.css && lessc ./www/drive/file.less > ./www/drive/file.css && lessc ./www/settings/main.less > ./www/settings/main.css",
|
"style": "lessc ./customize.dist/src/less/cryptpad.less > ./customize.dist/main.css && lessc ./customize.dist/src/less/toolbar.less > ./customize.dist/toolbar.css && lessc ./www/drive/file.less > ./www/drive/file.css && lessc ./www/settings/main.less > ./www/settings/main.css && lessc ./www/slide/slide.less > ./www/slide/slide.css",
|
||||||
"template": "cd customize.dist/src && node build.js"
|
"template": "cd customize.dist/src && node build.js"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -35,19 +35,21 @@
|
|||||||
}
|
}
|
||||||
/* We use !important here to override the 96% set to the element in DecorateToolbar.js
|
/* We use !important here to override the 96% set to the element in DecorateToolbar.js
|
||||||
when we enter fullscreen mode. It allows us to avoid changing the iframe's size in JS */
|
when we enter fullscreen mode. It allows us to avoid changing the iframe's size in JS */
|
||||||
#pad-iframe.fullscreen {
|
body #pad-iframe.fullscreen {
|
||||||
top: 0px;
|
top: 0px;
|
||||||
height: 100% !important;
|
height: 100%;
|
||||||
}
|
}
|
||||||
#iframe-container.fullscreen {
|
body #iframe-container.fullscreen {
|
||||||
top: 0px;
|
top: 0px;
|
||||||
height: 100% !important;
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div id="iframe-container">
|
<div id="iframe-container">
|
||||||
<iframe id="pad-iframe"></iframe><script src="/common/noscriptfix.js"></script>
|
<iframe id="pad-iframe", name="pad-iframe"></iframe><script src="/common/noscriptfix.js"></script>
|
||||||
</div>
|
</div>
|
||||||
<div id="loading">
|
<div id="loading">
|
||||||
<div class="loadingContainer">
|
<div class="loadingContainer">
|
||||||
|
|||||||
@ -5,6 +5,7 @@
|
|||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
|
||||||
|
|
||||||
<link rel="stylesheet" href="/customize/main.css">
|
<link rel="stylesheet" href="/customize/main.css">
|
||||||
|
<link rel="stylesheet" href="./slide.css">
|
||||||
<link rel="stylesheet" href="/bower_components/components-font-awesome/css/font-awesome.min.css">
|
<link rel="stylesheet" href="/bower_components/components-font-awesome/css/font-awesome.min.css">
|
||||||
<script src="/bower_components/jquery/dist/jquery.min.js"></script>
|
<script src="/bower_components/jquery/dist/jquery.min.js"></script>
|
||||||
<script src="/bower_components/codemirror/lib/codemirror.js"></script>
|
<script src="/bower_components/codemirror/lib/codemirror.js"></script>
|
||||||
@ -34,55 +35,6 @@
|
|||||||
<script src="/bower_components/codemirror/addon/fold/markdown-fold.js"></script>
|
<script src="/bower_components/codemirror/addon/fold/markdown-fold.js"></script>
|
||||||
<script src="/bower_components/codemirror/addon/fold/comment-fold.js"></script>
|
<script src="/bower_components/codemirror/addon/fold/comment-fold.js"></script>
|
||||||
<script src="/bower_components/codemirror/addon/display/placeholder.js"></script>
|
<script src="/bower_components/codemirror/addon/display/placeholder.js"></script>
|
||||||
<style>
|
|
||||||
html, body{
|
|
||||||
height: 100%;
|
|
||||||
width: 100%;
|
|
||||||
padding: 0px;
|
|
||||||
margin: 0px;
|
|
||||||
overflow: hidden;
|
|
||||||
box-sizing: border-box;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
body {
|
|
||||||
display: flex;
|
|
||||||
flex-flow: column;
|
|
||||||
}
|
|
||||||
#modal.shown {
|
|
||||||
display: block;
|
|
||||||
position: fixed;
|
|
||||||
top: 0px;
|
|
||||||
left: 0px;
|
|
||||||
z-index: 100;
|
|
||||||
background-color: black;
|
|
||||||
color: white;
|
|
||||||
height: 100vh;
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
#content h1, h2, h3, h4, h5, h6 {
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
h1 { font-size: 40px; }
|
|
||||||
h2 { font-size: 37px; }
|
|
||||||
h3 { font-size: 34px; }
|
|
||||||
h4 { font-size: 31px; }
|
|
||||||
h5 { font-size: 27px; }
|
|
||||||
h6 { font-size: 24px; }
|
|
||||||
|
|
||||||
.CodeMirror {
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
.CodeMirror-focused .cm-matchhighlight {
|
|
||||||
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAYAAABytg0kAAAAFklEQVQI12NgYGBgkKzc8x9CMDAwAAAmhwSbidEoSQAAAABJRU5ErkJggg==);
|
|
||||||
background-position: bottom;
|
|
||||||
background-repeat: repeat-x;
|
|
||||||
}
|
|
||||||
#colorPicker_check {
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div id="bar"></div>
|
<div id="bar"></div>
|
||||||
@ -98,6 +50,7 @@
|
|||||||
<div id="button_right" class="button"><span class="fa fa-chevron-right"></span></div>
|
<div id="button_right" class="button"><span class="fa fa-chevron-right"></span></div>
|
||||||
<div id="content"></div>
|
<div id="content"></div>
|
||||||
</div>
|
</div>
|
||||||
|
<div id="print"></div>
|
||||||
</span>
|
</span>
|
||||||
<div id="nope"></div>
|
<div id="nope"></div>
|
||||||
<div id="colorPicker_check"></div>
|
<div id="colorPicker_check"></div>
|
||||||
|
|||||||
@ -136,6 +136,7 @@ define([
|
|||||||
|
|
||||||
var $modal = $pad.contents().find('#modal');
|
var $modal = $pad.contents().find('#modal');
|
||||||
var $content = $pad.contents().find('#content');
|
var $content = $pad.contents().find('#content');
|
||||||
|
var $print = $pad.contents().find('#print');
|
||||||
|
|
||||||
Slide.setModal($modal, $content, $pad, ifrw, initialState);
|
Slide.setModal($modal, $content, $pad, ifrw, initialState);
|
||||||
|
|
||||||
@ -411,6 +412,80 @@ define([
|
|||||||
onLocal();
|
onLocal();
|
||||||
};
|
};
|
||||||
|
|
||||||
|
var createPrintDialog = function () {
|
||||||
|
var printOptions = {
|
||||||
|
title: true,
|
||||||
|
slide: true,
|
||||||
|
date: true
|
||||||
|
};
|
||||||
|
|
||||||
|
var $container = $('<div class="alertify">');
|
||||||
|
var $container2 = $('<div class="dialog">').appendTo($container);
|
||||||
|
var $div = $('<div id="printOptions">').appendTo($container2);
|
||||||
|
var $p = $('<p>', {'class': 'msg'}).appendTo($div);
|
||||||
|
$('<b>').text(Messages.printOptions).appendTo($p);
|
||||||
|
$p.append($('<br>'));
|
||||||
|
// Slide number
|
||||||
|
$('<input>', {type: 'checkbox', id: 'checkNumber', checked: 'checked'}).on('change', function () {
|
||||||
|
var c = this.checked;
|
||||||
|
console.log(c);
|
||||||
|
printOptions.slide = c;
|
||||||
|
}).appendTo($p).css('width', 'auto');
|
||||||
|
$('<label>', {'for': 'checkNumber'}).text(Messages.printSlideNumber).appendTo($p);
|
||||||
|
$p.append($('<br>'));
|
||||||
|
// Date
|
||||||
|
$('<input>', {type: 'checkbox', id: 'checkDate', checked: 'checked'}).on('change', function () {
|
||||||
|
var c = this.checked;
|
||||||
|
printOptions.date = c;
|
||||||
|
}).appendTo($p).css('width', 'auto');
|
||||||
|
$('<label>', {'for': 'checkDate'}).text(Messages.printDate).appendTo($p);
|
||||||
|
$p.append($('<br>'));
|
||||||
|
// Title
|
||||||
|
$('<input>', {type: 'checkbox', id: 'checkTitle', checked: 'checked'}).on('change', function () {
|
||||||
|
var c = this.checked;
|
||||||
|
printOptions.title = c;
|
||||||
|
}).appendTo($p).css('width', 'auto');
|
||||||
|
$('<label>', {'for': 'checkTitle'}).text(Messages.printTitle).appendTo($p);
|
||||||
|
$p.append($('<br>'));
|
||||||
|
// CSS
|
||||||
|
$('<label>', {'for': 'cssPrint'}).text(Messages.printCSS).appendTo($p);
|
||||||
|
$p.append($('<br>'));
|
||||||
|
var $textarea = $('<textarea>', {'id':'cssPrint'}).css({'width':'100%', 'height':'100px'}).appendTo($p);
|
||||||
|
|
||||||
|
var fixCSS = function (css) {
|
||||||
|
var append = '.cp #print ';
|
||||||
|
css = css.replace(/(\n*)([^\n]+)\s*\{/g, '$1' + append + '$2 {')
|
||||||
|
return css;
|
||||||
|
};
|
||||||
|
|
||||||
|
var todo = function () {
|
||||||
|
var $style = $('<style>').text(fixCSS($textarea.val()));
|
||||||
|
$print.prepend($style);
|
||||||
|
var length = $print.find('.slide-frame').length;
|
||||||
|
$print.find('.slide-frame').each(function (i, el) {
|
||||||
|
if (printOptions.slide) {
|
||||||
|
$('<div>', {'class': 'slideNumber'}).text((i+1)+'/'+length).appendTo($(el));
|
||||||
|
}
|
||||||
|
if (printOptions.date) {
|
||||||
|
$('<div>', {'class': 'slideDate'}).text(new Date().toLocaleDateString()).appendTo($(el));
|
||||||
|
}
|
||||||
|
if (printOptions.title) {
|
||||||
|
$('<div>', {'class': 'slideTitle'}).text(APP.title).appendTo($(el));
|
||||||
|
}
|
||||||
|
});
|
||||||
|
window.frames["pad-iframe"].focus();
|
||||||
|
window.frames["pad-iframe"].print();
|
||||||
|
$container.remove();
|
||||||
|
};
|
||||||
|
|
||||||
|
var $nav = $('<nav>').appendTo($div);
|
||||||
|
var $ok = $('<button>', {'class': 'ok'}).text(Messages.printButton).appendTo($nav).click(todo);
|
||||||
|
var $cancel = $('<button>', {'class': 'cancel'}).text(Messages.cancel).appendTo($nav).click(function () {
|
||||||
|
$container.remove();
|
||||||
|
});
|
||||||
|
return $container;
|
||||||
|
};
|
||||||
|
|
||||||
var onInit = config.onInit = function (info) {
|
var onInit = config.onInit = function (info) {
|
||||||
userList = info.userList;
|
userList = info.userList;
|
||||||
|
|
||||||
@ -466,6 +541,16 @@ define([
|
|||||||
var $forgetPad = Cryptpad.createButton('forget', true, {}, forgetCb);
|
var $forgetPad = Cryptpad.createButton('forget', true, {}, forgetCb);
|
||||||
$rightside.append($forgetPad);
|
$rightside.append($forgetPad);
|
||||||
|
|
||||||
|
var $printButton = $('<button>', {
|
||||||
|
title: Messages.printButtonTitle,
|
||||||
|
'class': 'rightside-button fa fa-print',
|
||||||
|
style: 'font-size: 17px'
|
||||||
|
}).click(function () {
|
||||||
|
$print.html($content.html());
|
||||||
|
$('body').append(createPrintDialog());
|
||||||
|
});
|
||||||
|
$rightside.append($printButton);
|
||||||
|
|
||||||
var $present = Cryptpad.createButton('present', true)
|
var $present = Cryptpad.createButton('present', true)
|
||||||
.click(function () {
|
.click(function () {
|
||||||
enterPresentationMode(true);
|
enterPresentationMode(true);
|
||||||
@ -628,7 +713,8 @@ define([
|
|||||||
updateMetadata(userDoc);
|
updateMetadata(userDoc);
|
||||||
|
|
||||||
editor.setValue(newDoc || initialState);
|
editor.setValue(newDoc || initialState);
|
||||||
Slide.update(newDoc);
|
Slide.update(newDoc, true);
|
||||||
|
Slide.draw();
|
||||||
|
|
||||||
if (Cryptpad.initialName && APP.title === defaultName) {
|
if (Cryptpad.initialName && APP.title === defaultName) {
|
||||||
updateTitle(Cryptpad.initialName);
|
updateTitle(Cryptpad.initialName);
|
||||||
|
|||||||
322
www/slide/slide.css
Normal file
322
www/slide/slide.css
Normal file
@ -0,0 +1,322 @@
|
|||||||
|
html,
|
||||||
|
body {
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
padding: 0px;
|
||||||
|
margin: 0px;
|
||||||
|
overflow: hidden;
|
||||||
|
box-sizing: border-box;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
body {
|
||||||
|
display: flex;
|
||||||
|
flex-flow: column;
|
||||||
|
}
|
||||||
|
h1 {
|
||||||
|
font-size: 40px;
|
||||||
|
}
|
||||||
|
h2 {
|
||||||
|
font-size: 37px;
|
||||||
|
}
|
||||||
|
h3 {
|
||||||
|
font-size: 34px;
|
||||||
|
}
|
||||||
|
h4 {
|
||||||
|
font-size: 31px;
|
||||||
|
}
|
||||||
|
h5 {
|
||||||
|
font-size: 27px;
|
||||||
|
}
|
||||||
|
h6 {
|
||||||
|
font-size: 24px;
|
||||||
|
}
|
||||||
|
body .CodeMirror {
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
body .CodeMirror-focused .cm-matchhighlight {
|
||||||
|
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAYAAABytg0kAAAAFklEQVQI12NgYGBgkKzc8x9CMDAwAAAmhwSbidEoSQAAAABJRU5ErkJggg==);
|
||||||
|
background-position: bottom;
|
||||||
|
background-repeat: repeat-x;
|
||||||
|
}
|
||||||
|
#colorPicker_check {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
@media print {
|
||||||
|
@page {
|
||||||
|
margin: 0;
|
||||||
|
size: auto;
|
||||||
|
}
|
||||||
|
body {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
body .CodeMirror,
|
||||||
|
body #cme_toolbox {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
body * {
|
||||||
|
visibility: hidden;
|
||||||
|
height: auto;
|
||||||
|
max-height: none;
|
||||||
|
}
|
||||||
|
html,
|
||||||
|
body {
|
||||||
|
max-height: none;
|
||||||
|
overflow: visible;
|
||||||
|
}
|
||||||
|
html #print {
|
||||||
|
display: block;
|
||||||
|
visibility: visible;
|
||||||
|
}
|
||||||
|
html #print * {
|
||||||
|
visibility: visible;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
#print {
|
||||||
|
position: relative;
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
#print .slide-frame {
|
||||||
|
display: flex !important;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
flex-flow: column;
|
||||||
|
padding: 5vh 0;
|
||||||
|
height: 100vh;
|
||||||
|
width: 100%;
|
||||||
|
page-break-after: always;
|
||||||
|
position: relative;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
#print .slide-frame li {
|
||||||
|
min-width: 50vw;
|
||||||
|
}
|
||||||
|
#print .slide-frame h1 {
|
||||||
|
padding-top: 0;
|
||||||
|
}
|
||||||
|
#print .slide-frame .slideNumber {
|
||||||
|
position: absolute;
|
||||||
|
right: 5vh;
|
||||||
|
bottom: 5vh;
|
||||||
|
}
|
||||||
|
#print .slide-frame .slideDate {
|
||||||
|
position: absolute;
|
||||||
|
left: 5vh;
|
||||||
|
bottom: 5vh;
|
||||||
|
}
|
||||||
|
#print .slide-frame .slideTitle {
|
||||||
|
position: absolute;
|
||||||
|
top: 5vh;
|
||||||
|
left: 0px;
|
||||||
|
right: 0px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.cp.slide #modal .button {
|
||||||
|
position: absolute;
|
||||||
|
cursor: pointer;
|
||||||
|
font-size: 30px;
|
||||||
|
opacity: 0.6;
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
.cp.slide #modal .button:hover {
|
||||||
|
opacity: 1;
|
||||||
|
display: block !important;
|
||||||
|
}
|
||||||
|
.cp.slide #modal #button_exit {
|
||||||
|
left: 20px;
|
||||||
|
top: 20px;
|
||||||
|
z-index: 9001;
|
||||||
|
}
|
||||||
|
.cp.slide #modal #button_left {
|
||||||
|
left: 6vw;
|
||||||
|
bottom: 10vh;
|
||||||
|
}
|
||||||
|
.cp.slide #modal #button_right {
|
||||||
|
right: 6vw;
|
||||||
|
bottom: 10vh;
|
||||||
|
}
|
||||||
|
.cp.slide #modal #content h1,
|
||||||
|
.cp.slide #modal #content h2,
|
||||||
|
.cp.slide #modal #content h3,
|
||||||
|
.cp.slide #modal #content h4,
|
||||||
|
.cp.slide #modal #content h5,
|
||||||
|
.cp.slide #modal #content h6 {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.cp.slide #modal.shown {
|
||||||
|
display: block;
|
||||||
|
position: fixed;
|
||||||
|
top: 0px;
|
||||||
|
left: 0px;
|
||||||
|
z-index: 100;
|
||||||
|
background-color: black;
|
||||||
|
color: white;
|
||||||
|
height: 100vh;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
.cp.slide #modal #content p,
|
||||||
|
.cp.slide #modal #content ul,
|
||||||
|
.cp.slide #modal #content ol {
|
||||||
|
font-size: 26px;
|
||||||
|
}
|
||||||
|
.cp.slide #modal #content img {
|
||||||
|
position: relative;
|
||||||
|
min-width: 1%;
|
||||||
|
max-width: 90%;
|
||||||
|
max-height: 90%;
|
||||||
|
margin: auto;
|
||||||
|
}
|
||||||
|
.cp div.modal,
|
||||||
|
.cp div#modal {
|
||||||
|
box-sizing: border-box;
|
||||||
|
z-index: 9001;
|
||||||
|
position: fixed;
|
||||||
|
top: 0px;
|
||||||
|
left: 0px;
|
||||||
|
width: 100%;
|
||||||
|
height: 100vh;
|
||||||
|
display: none;
|
||||||
|
background-color: #000;
|
||||||
|
}
|
||||||
|
.cp div.modal #content,
|
||||||
|
.cp div#modal #content {
|
||||||
|
box-sizing: border-box;
|
||||||
|
border: 1px solid white;
|
||||||
|
vertical-align: middle;
|
||||||
|
padding: 2.5vw;
|
||||||
|
/* center things as much as possible
|
||||||
|
|
||||||
|
margin-top: 50vh;
|
||||||
|
margin-bottom: 50vh;
|
||||||
|
transform: translateY(-50%);
|
||||||
|
|
||||||
|
*/
|
||||||
|
width: 100vw;
|
||||||
|
height: 56.25vw;
|
||||||
|
max-height: 100vh;
|
||||||
|
max-width: 177.78vh;
|
||||||
|
margin: auto;
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
}
|
||||||
|
.cp div.modal #content p,
|
||||||
|
.cp div#modal #content p,
|
||||||
|
.cp div.modal #content li,
|
||||||
|
.cp div#modal #content li,
|
||||||
|
.cp div.modal #content pre,
|
||||||
|
.cp div#modal #content pre,
|
||||||
|
.cp div.modal #content code,
|
||||||
|
.cp div#modal #content code {
|
||||||
|
font-size: 2.75vw;
|
||||||
|
line-height: 3.025vw;
|
||||||
|
}
|
||||||
|
.cp div.modal #content h1,
|
||||||
|
.cp div#modal #content h1 {
|
||||||
|
font-size: 5vw;
|
||||||
|
line-height: 5.5vw;
|
||||||
|
}
|
||||||
|
.cp div.modal #content h2,
|
||||||
|
.cp div#modal #content h2 {
|
||||||
|
font-size: 4.2vw;
|
||||||
|
line-height: 4.62vw;
|
||||||
|
}
|
||||||
|
.cp div.modal #content h3,
|
||||||
|
.cp div#modal #content h3 {
|
||||||
|
font-size: 3.6vw;
|
||||||
|
line-height: 3.96vw;
|
||||||
|
}
|
||||||
|
.cp div.modal #content h4,
|
||||||
|
.cp div#modal #content h4 {
|
||||||
|
font-size: 3vw;
|
||||||
|
line-height: 3.3vw;
|
||||||
|
}
|
||||||
|
.cp div.modal #content h5,
|
||||||
|
.cp div#modal #content h5 {
|
||||||
|
font-size: 2.2vw;
|
||||||
|
line-height: 2.42vw;
|
||||||
|
}
|
||||||
|
.cp div.modal #content h6,
|
||||||
|
.cp div#modal #content h6 {
|
||||||
|
font-size: 1.6vw;
|
||||||
|
line-height: 1.76vw;
|
||||||
|
}
|
||||||
|
.cp div.modal #content h1,
|
||||||
|
.cp div#modal #content h1,
|
||||||
|
.cp div.modal #content h2,
|
||||||
|
.cp div#modal #content h2,
|
||||||
|
.cp div.modal #content h3,
|
||||||
|
.cp div#modal #content h3,
|
||||||
|
.cp div.modal #content h4,
|
||||||
|
.cp div#modal #content h4,
|
||||||
|
.cp div.modal #content h5,
|
||||||
|
.cp div#modal #content h5,
|
||||||
|
.cp div.modal #content h6,
|
||||||
|
.cp div#modal #content h6 {
|
||||||
|
color: inherit;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.cp div.modal #content pre > code,
|
||||||
|
.cp div#modal #content pre > code {
|
||||||
|
display: block;
|
||||||
|
position: relative;
|
||||||
|
border: 1px solid #333;
|
||||||
|
width: 90%;
|
||||||
|
margin: auto;
|
||||||
|
padding-left: .25vw;
|
||||||
|
}
|
||||||
|
.cp div.modal #content ul,
|
||||||
|
.cp div#modal #content ul,
|
||||||
|
.cp div.modal #content ol,
|
||||||
|
.cp div#modal #content ol {
|
||||||
|
min-width: 50%;
|
||||||
|
max-width: 100%;
|
||||||
|
display: table;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
.cp div.modal .center,
|
||||||
|
.cp div#modal .center {
|
||||||
|
position: relative;
|
||||||
|
width: 80%;
|
||||||
|
height: 80%;
|
||||||
|
margin: auto;
|
||||||
|
border: 1px solid #ffffff;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.cp div.modal.shown,
|
||||||
|
.cp div#modal.shown {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
.cp div.modal table,
|
||||||
|
.cp div#modal table {
|
||||||
|
margin: 30px;
|
||||||
|
border-collapse: collapse;
|
||||||
|
}
|
||||||
|
.cp div.modal table input,
|
||||||
|
.cp div#modal table input {
|
||||||
|
height: 100%;
|
||||||
|
width: 90%;
|
||||||
|
border: 3px solid #fff;
|
||||||
|
}
|
||||||
|
.cp div.modal table tfoot tr td,
|
||||||
|
.cp div#modal table tfoot tr td {
|
||||||
|
z-index: 4000;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
.cp div.modal #addtime,
|
||||||
|
.cp div#modal #addtime,
|
||||||
|
.cp div.modal #adddate,
|
||||||
|
.cp div#modal #adddate {
|
||||||
|
color: #46E981;
|
||||||
|
border: 1px solid #46E981;
|
||||||
|
padding: 15px;
|
||||||
|
}
|
||||||
|
.cp div.modal #adddate,
|
||||||
|
.cp div#modal #adddate {
|
||||||
|
border-top-left-radius: 5px;
|
||||||
|
}
|
||||||
|
.cp div.modal #addtime,
|
||||||
|
.cp div#modal #addtime {
|
||||||
|
border-bottom-left-radius: 5px;
|
||||||
|
}
|
||||||
@ -29,7 +29,7 @@ define([
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
var getNumberOfSlides = function () {
|
var getNumberOfSlides = Slide.getNumberOfSlides = function () {
|
||||||
return $content.find('.' + slideClass).length;
|
return $content.find('.' + slideClass).length;
|
||||||
};
|
};
|
||||||
|
|
||||||
@ -170,8 +170,8 @@ define([
|
|||||||
$modal.removeClass('shown');
|
$modal.removeClass('shown');
|
||||||
};
|
};
|
||||||
|
|
||||||
var update = Slide.update = function (content) {
|
var update = Slide.update = function (content, init) {
|
||||||
if (!Slide.shown) { return; }
|
if (!Slide.shown && !init) { return; }
|
||||||
if (!content) { content = ''; }
|
if (!content) { content = ''; }
|
||||||
var old = Slide.content;
|
var old = Slide.content;
|
||||||
Slide.content = content.replace(/\n\s*\-\-\-\s*\n/g, '\n\n'+separator+'\n\n');
|
Slide.content = content.replace(/\n\s*\-\-\-\s*\n/g, '\n\n'+separator+'\n\n');
|
||||||
|
|||||||
314
www/slide/slide.less
Normal file
314
www/slide/slide.less
Normal file
@ -0,0 +1,314 @@
|
|||||||
|
@import "../../customize.dist/src/less/variables.less";
|
||||||
|
@import "../../customize.dist/src/less/mixins.less";
|
||||||
|
|
||||||
|
// used for slides
|
||||||
|
.viewportRatio (@x, @y, @p: 100) {
|
||||||
|
width: @p * 100vw;
|
||||||
|
height: @y * (@p * 100vw) / @x;
|
||||||
|
max-width: @x / @y * (@p * 100vh);
|
||||||
|
max-height: (@p * 100vh);
|
||||||
|
}
|
||||||
|
|
||||||
|
html, body{
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
padding: 0px;
|
||||||
|
margin: 0px;
|
||||||
|
overflow: hidden;
|
||||||
|
box-sizing: border-box;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
body {
|
||||||
|
display: flex;
|
||||||
|
flex-flow: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
//.cp {
|
||||||
|
h1 { font-size: 40px; }
|
||||||
|
h2 { font-size: 37px; }
|
||||||
|
h3 { font-size: 34px; }
|
||||||
|
h4 { font-size: 31px; }
|
||||||
|
h5 { font-size: 27px; }
|
||||||
|
h6 { font-size: 24px; }
|
||||||
|
|
||||||
|
body {
|
||||||
|
.CodeMirror {
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
.CodeMirror-focused .cm-matchhighlight {
|
||||||
|
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAYAAABytg0kAAAAFklEQVQI12NgYGBgkKzc8x9CMDAwAAAmhwSbidEoSQAAAABJRU5ErkJggg==);
|
||||||
|
background-position: bottom;
|
||||||
|
background-repeat: repeat-x;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
#colorPicker_check {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media print {
|
||||||
|
@page {
|
||||||
|
margin: 0;
|
||||||
|
size: auto;
|
||||||
|
}
|
||||||
|
body {
|
||||||
|
.CodeMirror, #cme_toolbox {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
* {
|
||||||
|
visibility: hidden;
|
||||||
|
height: auto;
|
||||||
|
max-height: none;
|
||||||
|
}
|
||||||
|
display:block;
|
||||||
|
}
|
||||||
|
html, body {
|
||||||
|
max-height: none;
|
||||||
|
overflow: visible;
|
||||||
|
}
|
||||||
|
html {
|
||||||
|
#print {
|
||||||
|
display: block;
|
||||||
|
visibility: visible;
|
||||||
|
* {
|
||||||
|
visibility: visible;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
#print {
|
||||||
|
position: relative;
|
||||||
|
display: none;
|
||||||
|
.slide-frame {
|
||||||
|
display: flex !important;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
flex-flow: column;
|
||||||
|
padding: 5vh 0;
|
||||||
|
height: 100vh;
|
||||||
|
width: 100%;
|
||||||
|
page-break-after: always;
|
||||||
|
position: relative;
|
||||||
|
box-sizing: border-box;
|
||||||
|
li {
|
||||||
|
min-width: 50vw;
|
||||||
|
}
|
||||||
|
h1 {
|
||||||
|
padding-top: 0;
|
||||||
|
}
|
||||||
|
.slideNumber {
|
||||||
|
position: absolute;
|
||||||
|
right: 5vh;
|
||||||
|
bottom: 5vh;
|
||||||
|
}
|
||||||
|
.slideDate {
|
||||||
|
position: absolute;
|
||||||
|
left: 5vh;
|
||||||
|
bottom: 5vh;
|
||||||
|
}
|
||||||
|
.slideTitle {
|
||||||
|
position: absolute;
|
||||||
|
top: 5vh;
|
||||||
|
left: 0px; right: 0px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.cp {
|
||||||
|
|
||||||
|
&.slide {
|
||||||
|
#modal {
|
||||||
|
.button {
|
||||||
|
position: absolute;
|
||||||
|
cursor: pointer;
|
||||||
|
font-size: 30px;
|
||||||
|
opacity: 0.6;
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
.button:hover {
|
||||||
|
opacity: 1;
|
||||||
|
display: block !important;
|
||||||
|
}
|
||||||
|
#button_exit {
|
||||||
|
left: 20px;
|
||||||
|
top: 20px;
|
||||||
|
z-index: 9001;
|
||||||
|
}
|
||||||
|
#button_left {
|
||||||
|
left: 6vw;
|
||||||
|
bottom: 10vh;
|
||||||
|
}
|
||||||
|
#button_right {
|
||||||
|
right: 6vw;
|
||||||
|
bottom: 10vh;
|
||||||
|
}
|
||||||
|
#content {
|
||||||
|
h1, h2, h3, h4, h5, h6 {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
&.shown {
|
||||||
|
display: block;
|
||||||
|
position: fixed;
|
||||||
|
top: 0px;
|
||||||
|
left: 0px;
|
||||||
|
z-index: 100;
|
||||||
|
background-color: black;
|
||||||
|
color: white;
|
||||||
|
height: 100vh;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
#modal #content {
|
||||||
|
p, ul, ol { font-size: 26px; }
|
||||||
|
|
||||||
|
img {
|
||||||
|
position: relative;
|
||||||
|
min-width: 1%;
|
||||||
|
max-width: 90%;
|
||||||
|
max-height: 90%;
|
||||||
|
margin: auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
div.modal, div#modal {
|
||||||
|
display: none;
|
||||||
|
|
||||||
|
#content {
|
||||||
|
box-sizing: border-box;
|
||||||
|
border: 1px solid white;
|
||||||
|
|
||||||
|
vertical-align: middle;
|
||||||
|
padding: 2.5vw;
|
||||||
|
|
||||||
|
/* center things as much as possible
|
||||||
|
|
||||||
|
margin-top: 50vh;
|
||||||
|
margin-bottom: 50vh;
|
||||||
|
transform: translateY(-50%);
|
||||||
|
|
||||||
|
*/
|
||||||
|
|
||||||
|
width: 100vw;
|
||||||
|
height: 56.25vw; // height:width ratio = 9/16 = .5625
|
||||||
|
max-height: 100vh;
|
||||||
|
max-width: 177.78vh; // 16/9 = 1.778
|
||||||
|
margin: auto;
|
||||||
|
position: absolute;
|
||||||
|
top:0;bottom:0; // vertical center
|
||||||
|
left:0;right:0; // horizontal center
|
||||||
|
|
||||||
|
p, li, pre, code {
|
||||||
|
.size(2.75);
|
||||||
|
}
|
||||||
|
|
||||||
|
h1 { .size(5); }
|
||||||
|
h2 { .size(4.2); }
|
||||||
|
h3 { .size(3.6); }
|
||||||
|
h4 { .size (3); }
|
||||||
|
h5 { .size(2.2); }
|
||||||
|
h6 { .size(1.6); }
|
||||||
|
|
||||||
|
h1, h2, h3, h4, h5, h6 {
|
||||||
|
color: inherit;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
pre > code {
|
||||||
|
display: block;
|
||||||
|
position: relative;
|
||||||
|
border: 1px solid #333;
|
||||||
|
width: 90%;
|
||||||
|
margin: auto;
|
||||||
|
padding-left: .25vw;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul, ol {
|
||||||
|
min-width: 50%;
|
||||||
|
max-width: 100%;
|
||||||
|
display: table;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
box-sizing: border-box;
|
||||||
|
z-index: 9001;
|
||||||
|
position: fixed;
|
||||||
|
|
||||||
|
top: 0px;
|
||||||
|
left: 0px;
|
||||||
|
|
||||||
|
width: 100%;
|
||||||
|
height: 100vh;
|
||||||
|
display: none;
|
||||||
|
|
||||||
|
background-color: @slide-default-bg;
|
||||||
|
|
||||||
|
.center {
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
width: 80%;
|
||||||
|
height: 80%;
|
||||||
|
margin: auto;
|
||||||
|
border: 1px solid @light-base;
|
||||||
|
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.shown {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
table {
|
||||||
|
margin: 30px;
|
||||||
|
|
||||||
|
border-collapse: collapse;
|
||||||
|
tr {
|
||||||
|
td {
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
input {
|
||||||
|
height: 100%;
|
||||||
|
width: 90%;
|
||||||
|
border: 3px solid @base;
|
||||||
|
}
|
||||||
|
|
||||||
|
thead {
|
||||||
|
tr {
|
||||||
|
th {
|
||||||
|
span.remove {
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
tbody {
|
||||||
|
tr {
|
||||||
|
td {
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
tfoot {
|
||||||
|
tr {
|
||||||
|
td {
|
||||||
|
z-index: 4000;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
#addtime,
|
||||||
|
#adddate {
|
||||||
|
color: @cp-green;
|
||||||
|
border: 1px solid @cp-green;
|
||||||
|
padding: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#adddate { .top-left; }
|
||||||
|
#addtime { .bottom-left; }
|
||||||
|
}
|
||||||
|
}
|
||||||
Loading…
x
Reference in New Issue
Block a user