Merge pull request #6889 from KDSBrowne/2.2-Edge-support-01
Fix whiteboard toolbar icons not rendering
This commit is contained in:
commit
718c32a615
@ -3,7 +3,8 @@
|
||||
font-family: 'Source Sans Pro';
|
||||
font-style: normal;
|
||||
font-weight: 300;
|
||||
src: local('Source Sans Pro Light'), local('SourceSansPro-Light'), url('fonts/SourceSansPro/SourceSansPro-Light.ttf') format('ttf');
|
||||
src: local('Source Sans Pro Light'), local('SourceSansPro-Light'),
|
||||
url('fonts/SourceSansPro/SourceSansPro-Light.woff') format('woff');
|
||||
unicode-range: U+0102-0103, U+1EA0-1EF9, U+20AB;
|
||||
}
|
||||
/* latin-ext */
|
||||
@ -11,7 +12,8 @@
|
||||
font-family: 'Source Sans Pro';
|
||||
font-style: normal;
|
||||
font-weight: 300;
|
||||
src: local('Source Sans Pro Light'), local('SourceSansPro-Light'), url('fonts/SourceSansPro/SourceSansPro-Light.ttf') format('ttf');
|
||||
src: local('Source Sans Pro Light'), local('SourceSansPro-Light'),
|
||||
url('fonts/SourceSansPro/SourceSansPro-Light.woff') format('woff');
|
||||
unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
|
||||
}
|
||||
/* latin */
|
||||
@ -19,7 +21,8 @@
|
||||
font-family: 'Source Sans Pro';
|
||||
font-style: normal;
|
||||
font-weight: 300;
|
||||
src: local('Source Sans Pro Light'), local('SourceSansPro-Light'), url('fonts/SourceSansPro/SourceSansPro-Light.ttf') format('ttf');
|
||||
src: local('Source Sans Pro Light'), local('SourceSansPro-Light'),
|
||||
url('fonts/SourceSansPro/SourceSansPro-Light.woff') format('woff');
|
||||
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
|
||||
}
|
||||
/* vietnamese */
|
||||
@ -27,7 +30,8 @@
|
||||
font-family: 'Source Sans Pro';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: local('Source Sans Pro'), local('SourceSansPro-Regular'), url('fonts/SourceSansPro/SourceSansPro-Regular.ttf') format('ttf');
|
||||
src: local('Source Sans Pro'), local('SourceSansPro-Regular'),
|
||||
url('fonts/SourceSansPro/SourceSansPro-Regular.woff') format('woff');
|
||||
unicode-range: U+0102-0103, U+1EA0-1EF9, U+20AB;
|
||||
}
|
||||
/* latin-ext */
|
||||
@ -35,7 +39,8 @@
|
||||
font-family: 'Source Sans Pro';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: local('Source Sans Pro'), local('SourceSansPro-Regular'), url('fonts/SourceSansPro/SourceSansPro-Regular.ttf') format('ttf');
|
||||
src: local('Source Sans Pro'), local('SourceSansPro-Regular'),
|
||||
url('fonts/SourceSansPro/SourceSansPro-Regular.woff') format('woff');
|
||||
unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
|
||||
}
|
||||
/* latin */
|
||||
@ -43,7 +48,8 @@
|
||||
font-family: 'Source Sans Pro';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: local('Source Sans Pro'), local('SourceSansPro-Regular'), url('fonts/SourceSansPro/SourceSansPro-Regular.ttf') format('ttf');
|
||||
src: local('Source Sans Pro'), local('SourceSansPro-Regular'),
|
||||
url('fonts/SourceSansPro/SourceSansPro-Regular.woff') format('woff');
|
||||
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
|
||||
}
|
||||
/* vietnamese */
|
||||
@ -51,7 +57,8 @@
|
||||
font-family: 'Source Sans Pro';
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
src: local('Source Sans Pro Semibold'), local('SourceSansPro-Semibold'), url('fonts/SourceSansPro/SourceSansPro-Semibold.ttf') format('ttf');
|
||||
src: local('Source Sans Pro Semibold'), local('SourceSansPro-Semibold'),
|
||||
url('fonts/SourceSansPro/SourceSansPro-Semibold.woff') format('woff');
|
||||
unicode-range: U+0102-0103, U+1EA0-1EF9, U+20AB;
|
||||
}
|
||||
/* latin-ext */
|
||||
@ -59,7 +66,8 @@
|
||||
font-family: 'Source Sans Pro';
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
src: local('Source Sans Pro Semibold'), local('SourceSansPro-Semibold'), url('fonts/SourceSansPro/SourceSansPro-Semibold.ttf') format('ttf');
|
||||
src: local('Source Sans Pro Semibold'), local('SourceSansPro-Semibold'),
|
||||
url('fonts/SourceSansPro/SourceSansPro-Semibold.woff') format('woff');
|
||||
unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
|
||||
}
|
||||
/* latin */
|
||||
@ -67,7 +75,8 @@
|
||||
font-family: 'Source Sans Pro';
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
src: local('Source Sans Pro Semibold'), local('SourceSansPro-Semibold'), url('fonts/SourceSansPro/SourceSansPro-Semibold.ttf') format('ttf');
|
||||
src: local('Source Sans Pro Semibold'), local('SourceSansPro-Semibold'),
|
||||
url('fonts/SourceSansPro/SourceSansPro-Semibold.woff') format('woff');
|
||||
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
|
||||
}
|
||||
/* vietnamese */
|
||||
@ -75,7 +84,8 @@
|
||||
font-family: 'Source Sans Pro';
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
src: local('Source Sans Pro Bold'), local('SourceSansPro-Bold'), url('fonts/SourceSansPro/SourceSansPro-Bold.ttf') format('ttf');
|
||||
src: local('Source Sans Pro Bold'), local('SourceSansPro-Bold'),
|
||||
url('fonts/SourceSansPro/SourceSansPro-Bold.woff') format('woff');
|
||||
unicode-range: U+0102-0103, U+1EA0-1EF9, U+20AB;
|
||||
}
|
||||
/* latin-ext */
|
||||
@ -83,7 +93,8 @@
|
||||
font-family: 'Source Sans Pro';
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
src: local('Source Sans Pro Bold'), local('SourceSansPro-Bold'), url('fonts/SourceSansPro/SourceSansPro-Bold.ttf') format('ttf');
|
||||
src: local('Source Sans Pro Bold'), local('SourceSansPro-Bold'),
|
||||
url('fonts/SourceSansPro/SourceSansPro-Bold.woff') format('woff');
|
||||
unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
|
||||
}
|
||||
/* latin */
|
||||
@ -91,7 +102,8 @@
|
||||
font-family: 'Source Sans Pro';
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
src: local('Source Sans Pro Bold'), local('SourceSansPro-Bold'), url('fonts/SourceSansPro/SourceSansPro-Bold.ttf') format('ttf');
|
||||
src: local('Source Sans Pro Bold'), local('SourceSansPro-Bold'),
|
||||
url('fonts/SourceSansPro/SourceSansPro-Bold.woff') format('woff');
|
||||
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
|
||||
}
|
||||
/* vietnamese */
|
||||
@ -99,7 +111,8 @@
|
||||
font-family: 'Source Sans Pro';
|
||||
font-style: italic;
|
||||
font-weight: 300;
|
||||
src: local('Source Sans Pro Light Italic'), local('SourceSansPro-LightIt'), url('fonts/SourceSansPro/SourceSansPro-LightItalic.ttf') format('ttf');
|
||||
src: local('Source Sans Pro Light Italic'), local('SourceSansPro-LightIt'),
|
||||
url('fonts/SourceSansPro/SourceSansPro-LightItalic.woff') format('woff');
|
||||
unicode-range: U+0102-0103, U+1EA0-1EF9, U+20AB;
|
||||
}
|
||||
/* latin-ext */
|
||||
@ -107,7 +120,8 @@
|
||||
font-family: 'Source Sans Pro';
|
||||
font-style: italic;
|
||||
font-weight: 300;
|
||||
src: local('Source Sans Pro Light Italic'), local('SourceSansPro-LightIt'), url('fonts/SourceSansPro/SourceSansPro-LightItalic.ttf') format('ttf');
|
||||
src: local('Source Sans Pro Light Italic'), local('SourceSansPro-LightIt'),
|
||||
url('fonts/SourceSansPro/SourceSansPro-LightItalic.woff') format('woff');
|
||||
unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
|
||||
}
|
||||
/* latin */
|
||||
@ -115,7 +129,8 @@
|
||||
font-family: 'Source Sans Pro';
|
||||
font-style: italic;
|
||||
font-weight: 300;
|
||||
src: local('Source Sans Pro Light Italic'), local('SourceSansPro-LightIt'), url('fonts/SourceSansPro/SourceSansPro-LightItalic.ttf') format('ttf');
|
||||
src: local('Source Sans Pro Light Italic'), local('SourceSansPro-LightIt'),
|
||||
url('fonts/SourceSansPro/SourceSansPro-LightItalic.woff') format('woff');
|
||||
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
|
||||
}
|
||||
/* vietnamese */
|
||||
@ -123,7 +138,8 @@
|
||||
font-family: 'Source Sans Pro';
|
||||
font-style: italic;
|
||||
font-weight: 400;
|
||||
src: local('Source Sans Pro Italic'), local('SourceSansPro-It'), url('fonts/SourceSansPro/SourceSansPro-Italic.ttf') format('ttf');
|
||||
src: local('Source Sans Pro Italic'), local('SourceSansPro-It'),
|
||||
url('fonts/SourceSansPro/SourceSansPro-Italic.woff') format('woff');
|
||||
unicode-range: U+0102-0103, U+1EA0-1EF9, U+20AB;
|
||||
}
|
||||
/* latin-ext */
|
||||
@ -131,7 +147,8 @@
|
||||
font-family: 'Source Sans Pro';
|
||||
font-style: italic;
|
||||
font-weight: 400;
|
||||
src: local('Source Sans Pro Italic'), local('SourceSansPro-It'), url('fonts/SourceSansPro/SourceSansPro-Italic.ttf') format('ttf');
|
||||
src: local('Source Sans Pro Italic'), local('SourceSansPro-It'),
|
||||
url('fonts/SourceSansPro/SourceSansPro-Italic.woff') format('woff');
|
||||
unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
|
||||
}
|
||||
/* latin */
|
||||
@ -139,7 +156,8 @@
|
||||
font-family: 'Source Sans Pro';
|
||||
font-style: italic;
|
||||
font-weight: 400;
|
||||
src: local('Source Sans Pro Italic'), local('SourceSansPro-It'), url('fonts/SourceSansPro/SourceSansPro-Italic.ttf') format('ttf');
|
||||
src: local('Source Sans Pro Italic'), local('SourceSansPro-It'),
|
||||
url('fonts/SourceSansPro/SourceSansPro-Italic.woff') format('woff');
|
||||
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
|
||||
}
|
||||
/* vietnamese */
|
||||
@ -147,7 +165,8 @@
|
||||
font-family: 'Source Sans Pro';
|
||||
font-style: italic;
|
||||
font-weight: 600;
|
||||
src: local('Source Sans Pro Semibold Italic'), local('SourceSansPro-SemiboldIt'), url('fonts/SourceSansPro/SourceSansPro-SemiboldItalic.ttf') format('ttf');
|
||||
src: local('Source Sans Pro Semibold Italic'), local('SourceSansPro-SemiboldIt'),
|
||||
url('fonts/SourceSansPro/SourceSansPro-SemiboldItalic.woff') format('woff');
|
||||
unicode-range: U+0102-0103, U+1EA0-1EF9, U+20AB;
|
||||
}
|
||||
/* latin-ext */
|
||||
@ -155,7 +174,8 @@
|
||||
font-family: 'Source Sans Pro';
|
||||
font-style: italic;
|
||||
font-weight: 600;
|
||||
src: local('Source Sans Pro Semibold Italic'), local('SourceSansPro-SemiboldIt'), url('fonts/SourceSansPro/SourceSansPro-SemiboldItalic.ttf') format('ttf');
|
||||
src: local('Source Sans Pro Semibold Italic'), local('SourceSansPro-SemiboldIt'),
|
||||
url('fonts/SourceSansPro/SourceSansPro-SemiboldItalic.woff') format('woff');
|
||||
unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
|
||||
}
|
||||
/* latin */
|
||||
@ -163,7 +183,8 @@
|
||||
font-family: 'Source Sans Pro';
|
||||
font-style: italic;
|
||||
font-weight: 600;
|
||||
src: local('Source Sans Pro Semibold Italic'), local('SourceSansPro-SemiboldIt'), url('fonts/SourceSansPro/SourceSansPro-SemiboldItalic.ttf') format('ttf');
|
||||
src: local('Source Sans Pro Semibold Italic'), local('SourceSansPro-SemiboldIt'),
|
||||
url('fonts/SourceSansPro/SourceSansPro-SemiboldItalic.woff') format('woff');
|
||||
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
|
||||
}
|
||||
/* vietnamese */
|
||||
@ -171,7 +192,8 @@
|
||||
font-family: 'Source Sans Pro';
|
||||
font-style: italic;
|
||||
font-weight: 700;
|
||||
src: local('Source Sans Pro Bold Italic'), local('SourceSansPro-BoldIt'), url('fonts/SourceSansPro/SourceSansPro-BoldItalic.ttf') format('ttf');
|
||||
src: local('Source Sans Pro Bold Italic'), local('SourceSansPro-BoldIt'),
|
||||
url('fonts/SourceSansPro/SourceSansPro-BoldItalic.woff') format('woff');
|
||||
unicode-range: U+0102-0103, U+1EA0-1EF9, U+20AB;
|
||||
}
|
||||
/* latin-ext */
|
||||
@ -179,7 +201,8 @@
|
||||
font-family: 'Source Sans Pro';
|
||||
font-style: italic;
|
||||
font-weight: 700;
|
||||
src: local('Source Sans Pro Bold Italic'), local('SourceSansPro-BoldIt'), url('fonts/SourceSansPro/SourceSansPro-BoldItalic.ttf') format('ttf');
|
||||
src: local('Source Sans Pro Bold Italic'), local('SourceSansPro-BoldIt'),
|
||||
url('fonts/SourceSansPro/SourceSansPro-BoldItalic.woff') format('woff');
|
||||
unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
|
||||
}
|
||||
/* latin */
|
||||
@ -187,6 +210,7 @@
|
||||
font-family: 'Source Sans Pro';
|
||||
font-style: italic;
|
||||
font-weight: 700;
|
||||
src: local('Source Sans Pro Bold Italic'), local('SourceSansPro-BoldIt'), url('fonts/SourceSansPro/SourceSansPro-BoldItalic.ttf') format('ttf');
|
||||
src: local('Source Sans Pro Bold Italic'), local('SourceSansPro-BoldIt'),
|
||||
url('fonts/SourceSansPro/SourceSansPro-BoldItalic.woff') format('woff');
|
||||
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
|
||||
}
|
||||
|
@ -50,24 +50,22 @@ const handleClickQuickPoll = (slideId, poll) => {
|
||||
};
|
||||
|
||||
|
||||
const getAvailableQuickPolls = (slideId, parsedSlides) => {
|
||||
return parsedSlides.map((poll) => {
|
||||
const { poll: label, type } = poll;
|
||||
let itemLabel = label;
|
||||
const getAvailableQuickPolls = (slideId, parsedSlides) => parsedSlides.map((poll) => {
|
||||
const { poll: label, type } = poll;
|
||||
let itemLabel = label;
|
||||
|
||||
if (type !== 'YN' && type !== 'TF') {
|
||||
const { options } = itemLabel;
|
||||
itemLabel = options.join('/').replace(/[\n.)]/g, '');
|
||||
}
|
||||
if (type !== 'YN' && type !== 'TF') {
|
||||
const { options } = itemLabel;
|
||||
itemLabel = options.join('/').replace(/[\n.)]/g, '');
|
||||
}
|
||||
|
||||
return (
|
||||
<DropdownListItem
|
||||
label={itemLabel}
|
||||
key={_.uniqueId('quick-poll-item')}
|
||||
onClick={() => handleClickQuickPoll(slideId, poll)}
|
||||
/>);
|
||||
});
|
||||
};
|
||||
return (
|
||||
<DropdownListItem
|
||||
label={itemLabel}
|
||||
key={_.uniqueId('quick-poll-item')}
|
||||
onClick={() => handleClickQuickPoll(slideId, poll)}
|
||||
/>);
|
||||
});
|
||||
|
||||
const QuickPollDropdown = (props) => {
|
||||
const { isUserPresenter, intl, parseCurrentSlideContent } = props;
|
||||
|
@ -70,8 +70,11 @@
|
||||
width: 100%;
|
||||
height: 50%;
|
||||
opacity: 0;
|
||||
transition: opacity calc(var(--enableAnimation) * .3s);
|
||||
pointer-events: none;
|
||||
|
||||
[style~="--enableAnimation:1;"] & {
|
||||
transition: opacity .3s;
|
||||
}
|
||||
}
|
||||
|
||||
&:before {
|
||||
|
@ -33,6 +33,7 @@
|
||||
|
||||
&.glow {
|
||||
border-radius: 50%;
|
||||
|
||||
[style~="--enableAnimation:1;"] & {
|
||||
animation: pulse 1s infinite ease-in;
|
||||
}
|
||||
|
@ -138,10 +138,13 @@
|
||||
overflow: hidden;
|
||||
display: inline-block;
|
||||
vertical-align: bottom;
|
||||
animation: ellipsis steps(4,end) calc(var(--enableAnimation) * 900ms) infinite;
|
||||
content: "\2026"; /* ascii code for the ellipsis character */
|
||||
width: 0;
|
||||
margin-right: 1.25em;
|
||||
|
||||
[style~="--enableAnimation:1;"] & {
|
||||
animation: ellipsis steps(4,end) 900ms infinite;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -10,7 +10,10 @@
|
||||
|
||||
i {
|
||||
color: var(--color-primary);
|
||||
transition: all calc(var(--enableAnimation) * .2s) ease-in-out;
|
||||
|
||||
[style~="--enableAnimation:1;"] & {
|
||||
transition: all .2s ease-in-out;
|
||||
}
|
||||
}
|
||||
|
||||
&:hover,
|
||||
|
@ -3,18 +3,20 @@
|
||||
top: -50px;
|
||||
left: -20px;
|
||||
font-size: 20px;
|
||||
animation: bounce calc(var(--enableAnimation) * 2s) infinite;
|
||||
display: block;
|
||||
font-family: 'bbb-icons';
|
||||
content: "\E906";
|
||||
position: relative;
|
||||
|
||||
[style~="--enableAnimation:1;"] & {
|
||||
animation: bounce 2s infinite;
|
||||
}
|
||||
}
|
||||
|
||||
:global(.browser-edge) &:after {
|
||||
top: -50px;
|
||||
left: -15.5em;
|
||||
font-size: 20px;
|
||||
animation: bounceRotate calc(var(--enableAnimation) * 2s) infinite;
|
||||
}
|
||||
}
|
||||
|
||||
@ -45,7 +47,10 @@
|
||||
left: 0;
|
||||
right: 0;
|
||||
background-color: rgba(0, 0, 0, .85);
|
||||
animation: fade-in calc(var(--enableAnimation) * .5s) ease-in;
|
||||
|
||||
[style~="--enableAnimation:1;"] & {
|
||||
animation: fade-in .5s ease-in;
|
||||
}
|
||||
}
|
||||
|
||||
.hint {
|
||||
|
@ -49,6 +49,7 @@
|
||||
padding: 0 0 0 .5rem;
|
||||
}
|
||||
}
|
||||
|
||||
.joinButton,
|
||||
.button {
|
||||
flex: 0 1 48%;
|
||||
@ -81,16 +82,18 @@
|
||||
color: var(--color-gray);
|
||||
}
|
||||
|
||||
|
||||
.connectingAnimation{
|
||||
&:after {
|
||||
overflow: hidden;
|
||||
display: inline-block;
|
||||
vertical-align: bottom;
|
||||
animation: ellipsis steps(4,end) calc(var(--enableAnimation) * 900ms) infinite;
|
||||
content: "\2026"; /* ascii code for the ellipsis character */
|
||||
width: 0;
|
||||
margin-right: 1.25em;
|
||||
|
||||
[style~="--enableAnimation:1;"] & {
|
||||
animation: ellipsis steps(4,end) 900ms infinite;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -101,7 +104,6 @@
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.duration {
|
||||
display: flex;
|
||||
align-self: center;
|
||||
|
@ -52,7 +52,10 @@
|
||||
vertical-align: middle;
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
transition: all calc(var(--enableAnimation) * .2s) ease-in-out;
|
||||
|
||||
[style~="--enableAnimation:1;"] & {
|
||||
transition: all .2s ease-in-out;
|
||||
}
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
|
@ -26,9 +26,12 @@
|
||||
border-radius: var(--border-radius) 0 0 var(--border-radius);
|
||||
color: var(--color-gray-light);
|
||||
padding: var(--sm-padding-y) var(--sm-padding-x);
|
||||
transition: all calc(var(--enableAnimation) * .3s);
|
||||
cursor: pointer;
|
||||
|
||||
[style~="--enableAnimation:1;"] & {
|
||||
transition: all .3s;
|
||||
}
|
||||
|
||||
--bg-faded: rgba(167,179,189,0.25);
|
||||
|
||||
&:hover,
|
||||
|
@ -129,7 +129,10 @@
|
||||
font-weight: inherit;
|
||||
border: none;
|
||||
border-radius: 0.4rem;
|
||||
transition: box-shadow calc(var(--enableAnimation) * .2s);
|
||||
|
||||
[style~="--enableAnimation:1;"] & {
|
||||
transition: box-shadow .2s;
|
||||
}
|
||||
}
|
||||
|
||||
input:focus {
|
||||
@ -145,6 +148,9 @@
|
||||
.urlError {
|
||||
color: red;
|
||||
padding: 1em;
|
||||
transition: calc(var(--enableAnimation) * 1s);
|
||||
|
||||
[style~="--enableAnimation:1;"] & {
|
||||
transition: 1s;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -38,10 +38,12 @@
|
||||
height: 18px;
|
||||
margin: 0 5px;
|
||||
background-color: var(--loader-bullet);
|
||||
|
||||
border-radius: 100%;
|
||||
display: inline-block;
|
||||
animation: sk-bouncedelay calc(var(--enableAnimation) * 1.4s) infinite ease-in-out both;
|
||||
|
||||
[style~="--enableAnimation:1;"] & {
|
||||
animation: sk-bouncedelay 1.4s infinite ease-in-out both;
|
||||
}
|
||||
}
|
||||
|
||||
.spinner .bounce1 {
|
||||
|
@ -42,5 +42,8 @@
|
||||
|
||||
.appearActive {
|
||||
opacity: 1;
|
||||
transition: opacity calc(var(--enableAnimation) * 700ms) ease-in;
|
||||
|
||||
[style~="--enableAnimation:1;"] & {
|
||||
transition: opacity 700ms ease-in;
|
||||
}
|
||||
}
|
||||
|
@ -120,7 +120,10 @@
|
||||
transparent
|
||||
);
|
||||
background-size: 1rem 1rem;
|
||||
animation: bar-stripes calc(var(--enableAnimation) * 1s) linear infinite;
|
||||
|
||||
[style~="--enableAnimation:1;"] & {
|
||||
animation: bar-stripes 1s linear infinite;
|
||||
}
|
||||
}
|
||||
|
||||
.itemAction,
|
||||
@ -132,7 +135,11 @@
|
||||
font-size: 1.35rem;
|
||||
color: var(--color-gray-light);
|
||||
padding: 0;
|
||||
transition: all calc(var(--enableAnimation) * .25s);
|
||||
|
||||
[style~="--enableAnimation:1;"] & {
|
||||
transition: all .25s;
|
||||
}
|
||||
|
||||
:hover, :focus {
|
||||
padding: unset !important;
|
||||
}
|
||||
|
@ -7,7 +7,10 @@
|
||||
|
||||
.enterActive {
|
||||
opacity: 1;
|
||||
transition: opacity calc(var(--enableAnimation) * 400ms) ease-in;
|
||||
|
||||
[style~="--enableAnimation:1;"] & {
|
||||
transition: opacity 400ms ease-in;
|
||||
}
|
||||
}
|
||||
|
||||
.appear {
|
||||
@ -16,7 +19,10 @@
|
||||
|
||||
.appearActive {
|
||||
opacity: 1;
|
||||
transition: opacity calc(var(--enableAnimation) * 400ms) ease-in;
|
||||
|
||||
[style~="--enableAnimation:1;"] & {
|
||||
transition: opacity 400ms ease-in;
|
||||
}
|
||||
}
|
||||
|
||||
.presentationArea {
|
||||
|
@ -162,7 +162,6 @@
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
opacity: .5;
|
||||
transition: calc(var(--enableAnimation) * .3s) ease;
|
||||
font-size: .35rem;
|
||||
color: var(--color-gray-dark);
|
||||
padding: .4rem;
|
||||
@ -172,6 +171,11 @@
|
||||
right: var(--md-padding-y);
|
||||
font-size: 70%;
|
||||
top: var(--lg-padding-y);
|
||||
|
||||
[style~="--enableAnimation:1;"] & {
|
||||
transition: .3s ease;
|
||||
}
|
||||
|
||||
&:before {
|
||||
margin-left: -.2rem;
|
||||
}
|
||||
|
@ -23,6 +23,7 @@
|
||||
text-align: center;
|
||||
text-transform: capitalize;
|
||||
font-size: .85rem;
|
||||
|
||||
[style~="--enableAnimation:1;"] & {
|
||||
transition: .3s ease-in-out;
|
||||
}
|
||||
@ -51,6 +52,7 @@
|
||||
vertical-align: middle;
|
||||
letter-spacing: -.65rem;
|
||||
z-index: 1;
|
||||
|
||||
[style~="--enableAnimation:1;"] & {
|
||||
transition: .3s ease-in-out;
|
||||
}
|
||||
|
@ -44,11 +44,14 @@
|
||||
%list-item {
|
||||
display: flex;
|
||||
flex-flow: row;
|
||||
transition: all calc(var(--enableAnimation) * .3s);
|
||||
border-top-left-radius: 5px;
|
||||
border-bottom-left-radius: 5px;
|
||||
cursor: pointer;
|
||||
|
||||
[style~="--enableAnimation:1;"] & {
|
||||
transition: all .3s;
|
||||
}
|
||||
|
||||
&:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
@ -134,7 +137,10 @@
|
||||
.enterActive,
|
||||
.appearActive {
|
||||
opacity: 1;
|
||||
transition: all calc(var(--enableAnimation) * 600ms);
|
||||
|
||||
[style~="--enableAnimation:1;"] & {
|
||||
transition: all 600ms;
|
||||
}
|
||||
}
|
||||
|
||||
.leave {
|
||||
@ -143,5 +149,8 @@
|
||||
|
||||
.leaveActive {
|
||||
opacity: 0;
|
||||
transition: all calc(var(--enableAnimation) * 600ms);
|
||||
|
||||
[style~="--enableAnimation:1;"] & {
|
||||
transition: all 600ms;
|
||||
}
|
||||
}
|
||||
|
@ -15,8 +15,11 @@
|
||||
.enterActive,
|
||||
.appearActive {
|
||||
opacity: 1;
|
||||
transition: all calc(var(--enableAnimation) * 300ms);
|
||||
max-height: 10rem;
|
||||
|
||||
[style~="--enableAnimation:1;"] & {
|
||||
transition: all 300ms;
|
||||
}
|
||||
}
|
||||
|
||||
.leave {
|
||||
@ -26,8 +29,11 @@
|
||||
|
||||
.leaveActive {
|
||||
opacity: 0;
|
||||
transition: all calc(var(--enableAnimation) * 500ms);
|
||||
max-height: 0rem;
|
||||
|
||||
[style~="--enableAnimation:1;"] & {
|
||||
transition: all 500ms;
|
||||
}
|
||||
}
|
||||
|
||||
// Text under username
|
||||
@ -41,8 +47,11 @@
|
||||
.subUserNameAppearActive {
|
||||
transform: translateY(0%);
|
||||
opacity: 1;
|
||||
transition: all calc(var(--enableAnimation) * 500ms);
|
||||
max-height: 10rem;
|
||||
|
||||
[style~="--enableAnimation:1;"] & {
|
||||
transition: all 500ms;
|
||||
}
|
||||
}
|
||||
|
||||
.subUserNameLeave {
|
||||
@ -52,8 +61,11 @@
|
||||
|
||||
.subUserNameLeaveActive {
|
||||
opacity: 0;
|
||||
transition: all calc(var(--enableAnimation) * 300ms);
|
||||
transform: translateY(-100%);
|
||||
|
||||
[style~="--enableAnimation:1;"] & {
|
||||
transition: all 300ms;
|
||||
}
|
||||
}
|
||||
|
||||
.actionsHeader {
|
||||
|
@ -5,8 +5,11 @@
|
||||
text-align: center;
|
||||
flex-basis: 1rem;
|
||||
justify-content: center;
|
||||
transition: calc(var(--enableAnimation) * .3s) all;
|
||||
margin-left: var(--sm-padding-x) / 2;
|
||||
|
||||
[style~="--enableAnimation:1;"] & {
|
||||
transition: .3s all;
|
||||
}
|
||||
}
|
||||
|
||||
.userIcons {
|
||||
|
@ -15,9 +15,12 @@
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
transition: all calc(var(--enableAnimation) * .3s);
|
||||
font-weight: 400;
|
||||
color: var(--color-gray-dark);
|
||||
|
||||
[style~="--enableAnimation:1;"] & {
|
||||
transition: all .3s;
|
||||
}
|
||||
}
|
||||
|
||||
.userNameSub {
|
||||
|
@ -55,8 +55,11 @@
|
||||
border: 5px solid var(--color-white-with-transparency);
|
||||
border-radius: 5px;
|
||||
opacity: 0;
|
||||
transition: opacity calc(var(--enableAnimation) * .1s);
|
||||
pointer-events: none;
|
||||
|
||||
[style~="--enableAnimation:1;"] & {
|
||||
transition: opacity .1s;
|
||||
}
|
||||
}
|
||||
|
||||
&.talking::after {
|
||||
@ -98,7 +101,10 @@
|
||||
content: "\e949"; /* ascii code for the ellipsis character */
|
||||
font-family: 'bbb-icons' !important;
|
||||
display: inline-block;
|
||||
animation: spin calc(var(--enableAnimation) * 4s) infinite linear;
|
||||
|
||||
[style~="--enableAnimation:1;"] & {
|
||||
animation: spin 4s infinite linear;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -3,7 +3,6 @@ import PropTypes from 'prop-types';
|
||||
import cx from 'classnames';
|
||||
import { HEXToINTColor, INTToHEXColor } from '/imports/utils/hexInt';
|
||||
import { defineMessages, injectIntl, intlShape } from 'react-intl';
|
||||
import RenderInBrowser from 'react-render-in-browser';
|
||||
import browser from 'browser-detect';
|
||||
import { noop } from 'lodash';
|
||||
import injectWbResizeEvent from '/imports/ui/components/presentation/resize-wrapper/component';
|
||||
@ -60,7 +59,8 @@ const intlMessages = defineMessages({
|
||||
},
|
||||
});
|
||||
|
||||
const runExceptInEdge = fn => (browser().name === 'edge' ? noop : fn);
|
||||
const isEdge = browser().name === 'edge';
|
||||
const runExceptInEdge = fn => (isEdge ? noop : fn);
|
||||
|
||||
class WhiteboardToolbar extends Component {
|
||||
constructor(props) {
|
||||
@ -439,48 +439,49 @@ class WhiteboardToolbar extends Component {
|
||||
renderThicknessItemIcon() {
|
||||
return (
|
||||
<svg className={styles.customSvgIcon} shapeRendering="geometricPrecision">
|
||||
<RenderInBrowser only edge>
|
||||
<circle
|
||||
cx="50%"
|
||||
cy="50%"
|
||||
r={this.state.thicknessSelected.value}
|
||||
stroke="black"
|
||||
strokeWidth="1"
|
||||
fill={this.state.colorSelected.value}
|
||||
/>
|
||||
</RenderInBrowser>
|
||||
<RenderInBrowser except edge>
|
||||
<circle
|
||||
shapeRendering="geometricPrecision"
|
||||
cx="50%"
|
||||
cy="50%"
|
||||
stroke="black"
|
||||
strokeWidth="1"
|
||||
>
|
||||
<animate
|
||||
ref={(ref) => { this.thicknessListIconColor = ref; }}
|
||||
attributeName="fill"
|
||||
attributeType="XML"
|
||||
from={this.state.prevColorSelected.value}
|
||||
to={this.state.colorSelected.value}
|
||||
begin="indefinite"
|
||||
dur={TRANSITION_DURATION}
|
||||
repeatCount="0"
|
||||
fill="freeze"
|
||||
{isEdge
|
||||
? (
|
||||
<circle
|
||||
cx="50%"
|
||||
cy="50%"
|
||||
r={this.state.thicknessSelected.value}
|
||||
stroke="black"
|
||||
strokeWidth="1"
|
||||
fill={this.state.colorSelected.value}
|
||||
/>
|
||||
<animate
|
||||
ref={(ref) => { this.thicknessListIconRadius = ref; }}
|
||||
attributeName="r"
|
||||
attributeType="XML"
|
||||
from={this.state.prevThicknessSelected.value}
|
||||
to={this.state.thicknessSelected.value}
|
||||
begin="indefinite"
|
||||
dur={TRANSITION_DURATION}
|
||||
repeatCount="0"
|
||||
fill="freeze"
|
||||
/>
|
||||
</circle>
|
||||
</RenderInBrowser>
|
||||
)
|
||||
: (
|
||||
<circle
|
||||
shapeRendering="geometricPrecision"
|
||||
cx="50%"
|
||||
cy="50%"
|
||||
stroke="black"
|
||||
strokeWidth="1"
|
||||
>
|
||||
<animate
|
||||
ref={(ref) => { this.thicknessListIconColor = ref; }}
|
||||
attributeName="fill"
|
||||
attributeType="XML"
|
||||
from={this.state.prevColorSelected.value}
|
||||
to={this.state.colorSelected.value}
|
||||
begin="indefinite"
|
||||
dur={TRANSITION_DURATION}
|
||||
repeatCount="0"
|
||||
fill="freeze"
|
||||
/>
|
||||
<animate
|
||||
ref={(ref) => { this.thicknessListIconRadius = ref; }}
|
||||
attributeName="r"
|
||||
attributeType="XML"
|
||||
from={this.state.prevThicknessSelected.value}
|
||||
to={this.state.thicknessSelected.value}
|
||||
begin="indefinite"
|
||||
dur={TRANSITION_DURATION}
|
||||
repeatCount="0"
|
||||
fill="freeze"
|
||||
/>
|
||||
</circle>
|
||||
)}
|
||||
</svg>
|
||||
);
|
||||
}
|
||||
@ -521,32 +522,33 @@ class WhiteboardToolbar extends Component {
|
||||
renderColorItemIcon() {
|
||||
return (
|
||||
<svg className={styles.customSvgIcon}>
|
||||
<RenderInBrowser only edge>
|
||||
<rect
|
||||
x="25%"
|
||||
y="25%"
|
||||
width="50%"
|
||||
height="50%"
|
||||
stroke="black"
|
||||
strokeWidth="1"
|
||||
fill={this.state.colorSelected.value}
|
||||
/>
|
||||
</RenderInBrowser>
|
||||
<RenderInBrowser except edge>
|
||||
<rect x="25%" y="25%" width="50%" height="50%" stroke="black" strokeWidth="1">
|
||||
<animate
|
||||
ref={(ref) => { this.colorListIconColor = ref; }}
|
||||
attributeName="fill"
|
||||
attributeType="XML"
|
||||
from={this.state.prevColorSelected.value}
|
||||
to={this.state.colorSelected.value}
|
||||
begin="indefinite"
|
||||
dur={TRANSITION_DURATION}
|
||||
repeatCount="0"
|
||||
fill="freeze"
|
||||
{isEdge
|
||||
? (
|
||||
<rect
|
||||
x="25%"
|
||||
y="25%"
|
||||
width="50%"
|
||||
height="50%"
|
||||
stroke="black"
|
||||
strokeWidth="1"
|
||||
fill={this.state.colorSelected.value}
|
||||
/>
|
||||
</rect>
|
||||
</RenderInBrowser>
|
||||
) : (
|
||||
<rect x="25%" y="25%" width="50%" height="50%" stroke="black" strokeWidth="1">
|
||||
<animate
|
||||
ref={(ref) => { this.colorListIconColor = ref; }}
|
||||
attributeName="fill"
|
||||
attributeType="XML"
|
||||
from={this.state.prevColorSelected.value}
|
||||
to={this.state.colorSelected.value}
|
||||
begin="indefinite"
|
||||
dur={TRANSITION_DURATION}
|
||||
repeatCount="0"
|
||||
fill="freeze"
|
||||
/>
|
||||
</rect>
|
||||
)
|
||||
}
|
||||
</svg>
|
||||
);
|
||||
}
|
||||
|
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Loading…
Reference in New Issue
Block a user