mirror of
https://github.com/xevidos/codiad.git
synced 2024-11-14 07:41:14 +01:00
2713 lines
66 KiB
CSS
Executable file
2713 lines
66 KiB
CSS
Executable file
/* This Source Code Form is subject to the terms of the Mozilla Public
|
|
* License, v. 2.0. If a copy of the MPL was not distributed with this file,
|
|
* You can obtain one at http://mozilla.org/MPL/2.0/. */
|
|
/*Fonts*/
|
|
@font-face {
|
|
font-family: openSansRegular;
|
|
src: url('fonts/OpenSans-Regular.ttf');
|
|
}
|
|
@font-face {
|
|
font-family: openSansLight;
|
|
src: url('fonts/OpenSans-Light.ttf');
|
|
}
|
|
@font-face {
|
|
font-family: openSansBold;
|
|
src: url('fonts/OpenSans-Bold.ttf');
|
|
}
|
|
/* .togetherjs reset */
|
|
/* http://yuilibrary.com/yui/docs/cssreset/ */
|
|
.togetherjs {
|
|
/*
|
|
YUI 3.10.3 (build 2fb5187)
|
|
Copyright 2013 Yahoo! Inc. All rights reserved.
|
|
Licensed under the BSD License.
|
|
http://yuilibrary.com/license/
|
|
*/
|
|
|
|
/*
|
|
TODO think about hanlding inheritence differently, maybe letting IE6 fail a bit...
|
|
*/
|
|
|
|
/* to preserve line-height and selector appearance */
|
|
|
|
/*to enable resizing for IE*/
|
|
|
|
/*because legend doesn't inherit in IE */
|
|
|
|
}
|
|
.togetherjs * {
|
|
-webkit-box-sizing: content-box !important;
|
|
-moz-box-sizing: content-box !important;
|
|
box-sizing: content-box !important;
|
|
}
|
|
.togetherjs header {
|
|
width: auto;
|
|
}
|
|
.togetherjs div,
|
|
.togetherjs dl,
|
|
.togetherjs dt,
|
|
.togetherjs dd,
|
|
.togetherjs ul,
|
|
.togetherjs ol,
|
|
.togetherjs li,
|
|
.togetherjs h1,
|
|
.togetherjs h2,
|
|
.togetherjs h3,
|
|
.togetherjs h4,
|
|
.togetherjs h5,
|
|
.togetherjs h6,
|
|
.togetherjs pre,
|
|
.togetherjs code,
|
|
.togetherjs form,
|
|
.togetherjs fieldset,
|
|
.togetherjs legend,
|
|
.togetherjs input,
|
|
.togetherjs textarea,
|
|
.togetherjs p,
|
|
.togetherjs blockquote,
|
|
.togetherjs th,
|
|
.togetherjs td {
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
.togetherjs table {
|
|
border-collapse: collapse;
|
|
border-spacing: 0;
|
|
}
|
|
.togetherjs fieldset,
|
|
.togetherjs img {
|
|
border: 0;
|
|
}
|
|
.togetherjs address,
|
|
.togetherjs caption,
|
|
.togetherjs cite,
|
|
.togetherjs code,
|
|
.togetherjs dfn,
|
|
.togetherjs em,
|
|
.togetherjs strong,
|
|
.togetherjs th,
|
|
.togetherjs var {
|
|
font-style: normal;
|
|
font-weight: normal;
|
|
}
|
|
.togetherjs ol,
|
|
.togetherjs ul {
|
|
list-style: none;
|
|
}
|
|
.togetherjs caption,
|
|
.togetherjs th {
|
|
text-align: left;
|
|
}
|
|
.togetherjs h1,
|
|
.togetherjs h2,
|
|
.togetherjs h3,
|
|
.togetherjs h4,
|
|
.togetherjs h5,
|
|
.togetherjs h6 {
|
|
font-size: 100%;
|
|
font-weight: normal;
|
|
}
|
|
.togetherjs q:before,
|
|
.togetherjs q:after {
|
|
content: '';
|
|
}
|
|
.togetherjs abbr,
|
|
.togetherjs acronym {
|
|
border: 0;
|
|
font-variant: normal;
|
|
}
|
|
.togetherjs sup {
|
|
vertical-align: text-top;
|
|
}
|
|
.togetherjs sub {
|
|
vertical-align: text-bottom;
|
|
}
|
|
.togetherjs input,
|
|
.togetherjs textarea,
|
|
.togetherjs select {
|
|
font-family: inherit;
|
|
font-size: inherit;
|
|
font-weight: inherit;
|
|
}
|
|
.togetherjs input,
|
|
.togetherjs textarea,
|
|
.togetherjs select {
|
|
*font-size: 100%;
|
|
}
|
|
.togetherjs legend {
|
|
color: #000;
|
|
}
|
|
.togetherjs {
|
|
/* General styles */
|
|
|
|
font-family: openSansLight, Helvetica, 'Helvetica Neue', Arial;
|
|
font-size: 14px;
|
|
line-height: 20px;
|
|
color: #333333;
|
|
font-weight: normal;
|
|
}
|
|
.togetherjs a {
|
|
color: #474747;
|
|
text-decoration: none;
|
|
}
|
|
.togetherjs a:hover {
|
|
color: #474747;
|
|
text-decoration: underline;
|
|
}
|
|
.togetherjs p {
|
|
margin: 7px 0 7px 0;
|
|
}
|
|
.togetherjs button,
|
|
.togetherjs img {
|
|
vertical-align: middle;
|
|
}
|
|
.togetherjs input:focus {
|
|
outline: none;
|
|
}
|
|
.togetherjs button::-moz-focus-inner,
|
|
.togetherjs input::-moz-focus-inner {
|
|
padding: 0;
|
|
border: 0;
|
|
}
|
|
.togetherjs .togetherjs-right {
|
|
float: right;
|
|
}
|
|
button:disabled {
|
|
opacity: 0.2;
|
|
}
|
|
button[disabled]:hover {
|
|
background: #0194DB;
|
|
}
|
|
.togetherjs-default {
|
|
display: inline-block;
|
|
border-radius: 4px;
|
|
text-align: center;
|
|
height: 40px;
|
|
/*line-height not consistent across browsers*/
|
|
|
|
line-height: 37px;
|
|
text-decoration: none;
|
|
min-width: 100px;
|
|
border: none;
|
|
font-family: openSansLight, Helvetica, 'Helvetica Neue', Arial, sans-serif;
|
|
/*transition: all 0.25s linear 0s;*/
|
|
|
|
text-shadow: none;
|
|
margin: 3px;
|
|
font-size: 14px;
|
|
background: #9A9A9A;
|
|
color: #fff;
|
|
}
|
|
.togetherjs-default.togetherjs-follow {
|
|
cursor: pointer;
|
|
}
|
|
.togetherjs-default:hover {
|
|
background: #ADADAD;
|
|
}
|
|
.togetherjs-primary {
|
|
display: inline-block;
|
|
border-radius: 4px;
|
|
text-align: center;
|
|
height: 40px;
|
|
/*line-height not consistent across browsers*/
|
|
|
|
line-height: 37px;
|
|
text-decoration: none;
|
|
min-width: 100px;
|
|
border: none;
|
|
font-family: openSansLight, Helvetica, 'Helvetica Neue', Arial, sans-serif;
|
|
/*transition: all 0.25s linear 0s;*/
|
|
|
|
text-shadow: none;
|
|
margin: 3px;
|
|
font-size: 14px;
|
|
background: #0194DB;
|
|
color: #fff;
|
|
}
|
|
.togetherjs-primary.togetherjs-follow {
|
|
cursor: pointer;
|
|
}
|
|
.togetherjs-primary:hover {
|
|
background: #00ACFF;
|
|
}
|
|
a.togetherjs-primary,
|
|
a.togetherjs-default,
|
|
a.togetherjs-secondary,
|
|
a.togetherjs-primary:link,
|
|
a.togetherjs-default:link,
|
|
a.togetherjs-secondary:link,
|
|
a.togetherjs-primary:active,
|
|
a.togetherjs-default:active,
|
|
a.togetherjs-secondary:active,
|
|
a.togetherjs-primary:visited,
|
|
a.togetherjs-default:visited,
|
|
a.togetherjs-secondary:visited,
|
|
a.togetherjs-primary:hover,
|
|
a.togetherjs-default:hover,
|
|
a.togetherjs-secondary:hover {
|
|
color: #fff;
|
|
text-decoration: none;
|
|
vertical-align: middle;
|
|
}
|
|
#togetherjs-avatar-edit .togetherjs-person-avatar-swatch {
|
|
margin-left: 22px;
|
|
}
|
|
#togetherjs-avatar-edit .togetherjs-person {
|
|
float: left;
|
|
height: 36px;
|
|
width: 36px;
|
|
margin: 35px;
|
|
background-repeat: no-repeat;
|
|
background-size: 40px 40px;
|
|
background-position: -2px -1px;
|
|
border: 2px solid;
|
|
border-radius: 2px;
|
|
background-clip: border-box;
|
|
}
|
|
#togetherjs-avatar-edit #togetherjs-avatar-buttons {
|
|
float: right;
|
|
width: 172px;
|
|
padding: 45px 0px;
|
|
}
|
|
input.togetherjs-upload-avatar {
|
|
line-height: 0px;
|
|
width: 174px;
|
|
margin-left: -20px;
|
|
}
|
|
#togetherjs-upload-avatar {
|
|
float: left;
|
|
}
|
|
#togetherjs-camera-avatar {
|
|
clear: both;
|
|
}
|
|
#togetherjs-avatar-edit .togetherjs-buttons {
|
|
clear: both;
|
|
}
|
|
.togetherjs-destructive {
|
|
display: inline-block;
|
|
border-radius: 4px;
|
|
text-align: center;
|
|
height: 40px;
|
|
/*line-height not consistent across browsers*/
|
|
|
|
line-height: 37px;
|
|
text-decoration: none;
|
|
min-width: 100px;
|
|
border: none;
|
|
font-family: openSansLight, Helvetica, 'Helvetica Neue', Arial, sans-serif;
|
|
/*transition: all 0.25s linear 0s;*/
|
|
|
|
text-shadow: none;
|
|
margin: 3px;
|
|
font-size: 14px;
|
|
background: #AC2924;
|
|
color: #ffffff;
|
|
}
|
|
.togetherjs-destructive:hover {
|
|
background: #d40606;
|
|
}
|
|
.togetherjs-secondary {
|
|
display: inline-block;
|
|
border-radius: 4px;
|
|
text-align: center;
|
|
height: 40px;
|
|
/*line-height not consistent across browsers*/
|
|
|
|
line-height: 37px;
|
|
text-decoration: none;
|
|
min-width: 100px;
|
|
border: none;
|
|
font-family: openSansLight, Helvetica, 'Helvetica Neue', Arial, sans-serif;
|
|
/*transition: all 0.25s linear 0s;*/
|
|
|
|
text-shadow: none;
|
|
margin: 3px;
|
|
font-size: 14px;
|
|
background: #999999;
|
|
/* Old browsers */
|
|
|
|
background: -moz-linear-gradient(top, #999999 0%, #888888 100%);
|
|
/* FF3.6+ */
|
|
|
|
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #999999), color-stop(100%, #888888));
|
|
/* Chrome,Safari4+ */
|
|
|
|
background: -webkit-linear-gradient(top, #999999 0%, #888888 100%);
|
|
/* Chrome10+,Safari5.1+ */
|
|
|
|
background: -o-linear-gradient(top, #999999 0%, #888888 100%);
|
|
/* Opera 11.10+ */
|
|
|
|
background: -ms-linear-gradient(top, #999999 0%, #888888 100%);
|
|
/* IE10+ */
|
|
|
|
background: linear-gradient(to bottom, #999999 0%, #888888 100%);
|
|
/* W3C */
|
|
|
|
color: #000;
|
|
}
|
|
.togetherjs-cancel {
|
|
display: inline-block;
|
|
background: inherit;
|
|
border: none;
|
|
padding: 3px 0px;
|
|
margin: 0px 0px 0px;
|
|
min-width: 0;
|
|
font-size: 14px;
|
|
color: #333333;
|
|
font-family: openSansLight, Helvetica;
|
|
vertical-align: -2px !important;
|
|
}
|
|
.togetherjs-cancel:hover {
|
|
cursor: pointer;
|
|
border-bottom: 1px solid #BCBCBC;
|
|
margin: 0px 0px -1px;
|
|
}
|
|
.togetherjs-alt-text {
|
|
vertical-align: -2px;
|
|
}
|
|
/*FIX ME something weird is going on here. the avatar has no paddingTop only on Safari*/
|
|
/*button#togetherjs-profile-button.togetherjs-button {
|
|
padding:10px 0px !important;
|
|
}*/
|
|
/* General dock rules: */
|
|
.togetherjs #togetherjs-buttons .togetherjs-button {
|
|
background-color: inherit;
|
|
border: none;
|
|
padding: 0;
|
|
margin: 0;
|
|
position: relative;
|
|
width: 60px;
|
|
height: 60px;
|
|
background-size: 40px 40px;
|
|
background-repeat: no-repeat;
|
|
background-position: center;
|
|
border-top: 1px solid rgba(0, 0, 0, 0.2);
|
|
}
|
|
.togetherjs #togetherjs-buttons .togetherjs-button:hover {
|
|
background-color: #474747;
|
|
}
|
|
.togetherjs #togetherjs-buttons hr {
|
|
padding: 0;
|
|
margin: 0;
|
|
}
|
|
.togetherjs #togetherjs-dock-participants button.togetherjs-active {
|
|
background-color: #474747 !important;
|
|
}
|
|
.togetherjs #togetherjs-buttons #togetherjs-share-button {
|
|
background-image: url('./images/button-share.png');
|
|
}
|
|
.togetherjs #togetherjs-buttons #togetherjs-share-button:hover {
|
|
background-image: url('./images/button-share-active.png');
|
|
}
|
|
.togetherjs #togetherjs-buttons #togetherjs-share-button.togetherjs-active {
|
|
background-image: url('./images/button-share-active.png') !important;
|
|
background-color: #474747;
|
|
}
|
|
.togetherjs #togetherjs-buttons #togetherjs-audio-button {
|
|
background-image: url('./images/button-mic.png');
|
|
}
|
|
.togetherjs #togetherjs-buttons #togetherjs-audio-button:hover {
|
|
background-image: url('./images/button-mic-active.png');
|
|
/*background-color:#474747;*/
|
|
|
|
/*cursor: default;*/
|
|
|
|
}
|
|
.togetherjs #togetherjs-buttons #togetherjs-audio-button.togetherjs-active {
|
|
background-image: url('./images/button-mic-active.png') !important;
|
|
background-color: #474747;
|
|
}
|
|
.togetherjs #togetherjs-buttons #togetherjs-chat-button {
|
|
background-image: url('./images/button-chat.png');
|
|
}
|
|
.togetherjs #togetherjs-buttons #togetherjs-chat-button:hover {
|
|
background-image: url('./images/button-chat-active.png');
|
|
}
|
|
.togetherjs #togetherjs-buttons #togetherjs-chat-button.togetherjs-active {
|
|
background-image: url('./images/button-chat-active.png') !important;
|
|
background-color: #474747;
|
|
}
|
|
.togetherjs #togetherjs-dock-anchor {
|
|
height: 20px;
|
|
text-align: center;
|
|
/* FIXME: disabling dock movement for now, cursor would be misleading: */
|
|
|
|
-moz-user-select: none;
|
|
-webkit-user-select: none;
|
|
-ms-user-select: none;
|
|
user-select: none;
|
|
width: 100%;
|
|
position: relative;
|
|
left: 0px;
|
|
border-top-left-radius: 4px;
|
|
border-top-right-radius: 4px;
|
|
}
|
|
.togetherjs .togetherjs-subtitle {
|
|
background: #A4A4A4;
|
|
width: 280px;
|
|
height: 17px;
|
|
border-bottom: 1px solid #FFFFFF;
|
|
color: rgba(255, 255, 255, 0.5);
|
|
font-size: 12px;
|
|
padding: 7px 10px;
|
|
left: -14px;
|
|
top: -15px;
|
|
position: relative;
|
|
|
|
}
|
|
.togetherjs .togetherjs-subtitle #togetherjs-chat-participants {
|
|
font-size: 12px;
|
|
color: rgba(255, 255, 255, 0.5);
|
|
}
|
|
.togetherjs .togetherjs-subtitle #togetherjs-chat-no-participants {
|
|
font-size: 12px;
|
|
color: rgba(255, 255, 255, 0.5);
|
|
}
|
|
.togetherjs .togetherjs-subtitle #togetherjs-chat-participant-list {
|
|
font-size: 12px;
|
|
color: rgba(255, 255, 255, 0.5);
|
|
}
|
|
.togetherjs #togetherjs-chat-input {
|
|
width: 264px;
|
|
min-height: 20px;
|
|
height: 20px;
|
|
overflow-x: hidden;
|
|
overflow-y: hidden;
|
|
resize: none;
|
|
font-size: 14px;
|
|
padding: 4px 6px 5px;
|
|
border-radius: 4px;
|
|
border: 1px solid #cccccc;
|
|
/*box-shadow: inset 0 2px 2px rgba(0,0,0,0.1);*/
|
|
|
|
font-family: openSansLight, Helvetica, sans-serif;
|
|
}
|
|
.togetherjs #togetherjs-chat-input:focus {
|
|
border: 1px solid #474747;
|
|
}
|
|
.togetherjs #togetherjs-chat-input-box {
|
|
margin: 0;
|
|
padding: 10px 10px 11px;
|
|
border-top: 1px solid rgba(0, 0, 0, 0.1);
|
|
background: #F2F2F2;
|
|
position: relative;
|
|
/*box-shadow: 0 -1px 2px rgba(0,0,0,0.1);*/
|
|
|
|
height: 31px;
|
|
width: 280px;
|
|
margin-left: -7px;
|
|
border-bottom-right-radius: 4px;
|
|
border-bottom-left-radius: 4px;
|
|
}
|
|
.togetherjs .togetherjs-window #togetherjs-chat-messages {
|
|
width: 300px;
|
|
position: relative;
|
|
left: -14px;
|
|
background: #fff;
|
|
top: -30px;
|
|
margin-bottom: -30px !important;
|
|
}
|
|
.togetherjs .togetherjs-chat-item {
|
|
padding: 0 0 20px 0;
|
|
font-family: openSansLight, Helvetica, 'Helvetica Neue', Arial, sans-serif;
|
|
font-size: 14px;
|
|
padding: 10px 0px;
|
|
margin: 0;
|
|
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
|
|
color: #333333;
|
|
min-height: 60px;
|
|
}
|
|
.togetherjs #togetherjs-chat-messages .togetherjs-chat-item a.togetherjs-person-url {
|
|
width: 105px;
|
|
white-space: nowrap;
|
|
vertical-align: top;
|
|
display: inline-block;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
}
|
|
.togetherjs #togetherjs-chat-messages .togetherjs-person-self {
|
|
float: left;
|
|
margin-bottom: 20px;
|
|
margin-top: 7px;
|
|
}
|
|
.togetherjs #togetherjs-chat-messages .togetherjs-person {
|
|
float: left;
|
|
margin-bottom: 20px;
|
|
}
|
|
.togetherjs .togetherjs-person-name-abbrev {
|
|
color: #333333;
|
|
font-family: openSansRegular, Helvetica, sans-serif;
|
|
padding-top: 7px;
|
|
}
|
|
.togetherjs .togetherjs-timestamp {
|
|
float: right;
|
|
color: rgba(51, 51, 51, 0.5);
|
|
font-size: 9px !important;
|
|
padding: 8px 15px 0px 10px;
|
|
}
|
|
.togetherjs .togetherjs-chat-content {
|
|
white-space: pre-wrap;
|
|
line-height: 20px;
|
|
font-family: openSansLight, Helvetica, 'Helvetica Neue', Arial, sans-serif;
|
|
padding: 0px 14px 7px;
|
|
}
|
|
.togetherjs #togetherjs-window-pointer-right,
|
|
.togetherjs #togetherjs-window-pointer-left {
|
|
position: fixed;
|
|
width: 10px;
|
|
height: 10px;
|
|
margin-right: -5px;
|
|
margin-top: -5px;
|
|
background: #fff;
|
|
border-right: 1px solid rgba(0, 0, 0, 0.2);
|
|
border-bottom: 1px solid rgba(0, 0, 0, 0.2);
|
|
z-index: 10002;
|
|
box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);
|
|
}
|
|
.togetherjs #togetherjs-window-pointer-right {
|
|
-moz-transform: rotate(-45deg);
|
|
-webkit-transform: rotate(-45deg);
|
|
}
|
|
.togetherjs #togetherjs-window-pointer-left {
|
|
-moz-transform: rotate(135deg);
|
|
-webkit-transform: rotate(135deg);
|
|
}
|
|
.togetherjs .togetherjs-window {
|
|
position: fixed;
|
|
background-color: #ffffff;
|
|
color: #000000;
|
|
padding: 0 7px 0 7px;
|
|
z-index: 10001;
|
|
width: 286px;
|
|
border-radius: 4px;
|
|
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
|
|
}
|
|
.togetherjs .togetherjs-window section {
|
|
margin: 15px 7px;
|
|
}
|
|
.togetherjs .togetherjs-window > header {
|
|
font-weight: bold;
|
|
font-variant: normal;
|
|
text-align: center;
|
|
font-family: openSansRegular, Helvetica;
|
|
color: #fff;
|
|
margin: 0 -7px 0 -7px;
|
|
padding: 10px 4px 5px 30px;
|
|
height: 24px;
|
|
background: #474747;
|
|
border-radius: 4px 4px 0 0;
|
|
position: relative;
|
|
border-bottom: 1px solid #FFFFFF;
|
|
}
|
|
.togetherjs .togetherjs-window .togetherjs-share-link {
|
|
width: 256px;
|
|
font-size: 12px;
|
|
padding: 6px 6px 4px;
|
|
border-radius: 4px;
|
|
border: 1px solid #cccccc;
|
|
box-shadow: inset 0 2px 2px rgba(0, 0, 0, 0.1);
|
|
font-family: Monaco, sans-serif;
|
|
margin: 7px 0px;
|
|
}
|
|
.togetherjs .togetherjs-window .togetherjs-share-link:focus {
|
|
border: 1px solid #474747;
|
|
}
|
|
.togetherjs .togetherjs-window header button.togetherjs-close {
|
|
background-color: inherit;
|
|
border: none;
|
|
padding: 0;
|
|
margin: 0;
|
|
border-left: 1px solid #FFFFFF;
|
|
float: right;
|
|
font-weight: bold;
|
|
cursor: pointer;
|
|
background-image: url('./images/icon-close@2x.png');
|
|
background-position: center center;
|
|
background-repeat: no-repeat;
|
|
background-size: 13px 13px;
|
|
width: 39px;
|
|
height: 39px;
|
|
margin-top: -10px;
|
|
margin-right: -4px;
|
|
border-top-right-radius: 4px;
|
|
}
|
|
.togetherjs .togetherjs-window header button.togetherjs-close:hover {
|
|
background-image: url('./images/icon-close-active.png');
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|
}
|
|
.togetherjs .togetherjs-window #togetherjs-chat-messages {
|
|
overflow-y: auto;
|
|
/*FIXME: I'm just pulling numbers out of thin air here:*/
|
|
|
|
height: 260px;
|
|
}
|
|
.togetherjs #togetherjs-feedback-form > header {
|
|
font-weight: bold;
|
|
font-variant: normal;
|
|
text-align: center;
|
|
font-family: openSansRegular, Helvetica, sans-serif;
|
|
color: #fff;
|
|
margin: 0 -1px 0 -1px;
|
|
padding: 10px 4px 5px 30px;
|
|
height: 24px;
|
|
background: #474747;
|
|
border-radius: 4px 4px 0 0;
|
|
position: relative;
|
|
border-bottom: 1px solid #FFFFFF;
|
|
}
|
|
.togetherjs #togetherjs-feedback-form.togetherjs-modal {
|
|
background-color: #fff;
|
|
color: #000000;
|
|
padding: 0 0 5px 0;
|
|
border-radius: 2px;
|
|
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
|
|
border-left: 1px solid #c9c9c9;
|
|
border-right: 1px solid #c9c9c9;
|
|
border-bottom: 1px solid #c9c9c9;
|
|
position: fixed;
|
|
top: 46%;
|
|
left: 47%;
|
|
margin-left: -150px;
|
|
margin-top: -10em;
|
|
height: 24em;
|
|
width: 399px;
|
|
}
|
|
.togetherjs #togetherjs-alpha-intro .togetherjs-small-feedback-txt {
|
|
font-size: 10px;
|
|
}
|
|
.togetherjs #togetherjs-alpha-intro .togetherjs-modal-close:hover {
|
|
background: #61921b;
|
|
}
|
|
.togetherjs #togetherjs-alpha-intro {
|
|
height: 24em;
|
|
}
|
|
.togetherjs #togetherjs-intro .togetherjs-modal-dont-join {
|
|
/* background-repeat: repeat-x;
|
|
border: 0;
|
|
color: rgb(255, 255, 255);
|
|
cursor: pointer;
|
|
display: inline-block;
|
|
text-transform: none;
|
|
vertical-align: middle;
|
|
padding: 10px 0 10px 0;*/
|
|
|
|
}
|
|
.togetherjs .togetherjs-notification {
|
|
position: fixed;
|
|
background-color: #ffffff;
|
|
color: #000000;
|
|
padding: 0 7px 0 7px;
|
|
z-index: 10001;
|
|
width: 300px;
|
|
border-radius: 4px;
|
|
background: rgba(242, 242, 242, 0.9);
|
|
border: 1px solid #BCBCBC;
|
|
-moz-box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.4), inset 0px 3px 1px 0px #ffffff;
|
|
-webkit-box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.4), inset 0px 3px 1px 0px #ffffff;
|
|
box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.4), inset 0px 3px 1px 0px #ffffff;
|
|
}
|
|
.togetherjs .togetherjs-notification section {
|
|
margin: 15px 7px;
|
|
}
|
|
.togetherjs .togetherjs-notification > header {
|
|
font-weight: bold;
|
|
font-variant: normal;
|
|
text-align: center;
|
|
font-family: openSansRegular, Helvetica;
|
|
color: #fff;
|
|
margin: 0 -7px 0 -7px;
|
|
padding: 10px 4px 5px 30px;
|
|
height: 24px;
|
|
background: #474747;
|
|
border-radius: 4px 4px 0 0;
|
|
position: relative;
|
|
border-bottom: 1px solid #FFFFFF;
|
|
}
|
|
.togetherjs .togetherjs-notification .togetherjs-share-link {
|
|
width: 256px;
|
|
font-size: 12px;
|
|
padding: 6px 6px 4px;
|
|
border-radius: 4px;
|
|
border: 1px solid #cccccc;
|
|
box-shadow: inset 0 2px 2px rgba(0, 0, 0, 0.1);
|
|
font-family: Monaco, sans-serif;
|
|
margin: 7px 0px;
|
|
}
|
|
.togetherjs .togetherjs-notification .togetherjs-share-link:focus {
|
|
border: 1px solid #474747;
|
|
}
|
|
.togetherjs .togetherjs-notification header button.togetherjs-close {
|
|
background-color: inherit;
|
|
border: none;
|
|
padding: 0;
|
|
margin: 0;
|
|
border-left: 1px solid #FFFFFF;
|
|
float: right;
|
|
font-weight: bold;
|
|
cursor: pointer;
|
|
background-image: url('./images/icon-close@2x.png');
|
|
background-position: center center;
|
|
background-repeat: no-repeat;
|
|
background-size: 13px 13px;
|
|
width: 39px;
|
|
height: 39px;
|
|
margin-top: -10px;
|
|
margin-right: -4px;
|
|
border-top-right-radius: 4px;
|
|
}
|
|
.togetherjs .togetherjs-notification header button.togetherjs-close:hover {
|
|
background-image: url('./images/icon-close-active.png');
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|
}
|
|
.togetherjs .togetherjs-notification #togetherjs-chat-messages {
|
|
overflow-y: auto;
|
|
/*FIXME: I'm just pulling numbers out of thin air here:*/
|
|
|
|
height: 260px;
|
|
}
|
|
.togetherjs .togetherjs-notification:hover {
|
|
background: #f2f2f2;
|
|
cursor: pointer;
|
|
}
|
|
.togetherjs .togetherjs-notification .togetherjs-chat-item {
|
|
border-bottom: 0px;
|
|
word-wrap: break-word;
|
|
}
|
|
.togetherjs .togetherjs-notification section#togetherjs-chat-notifier-message {
|
|
margin: 0px !important;
|
|
}
|
|
.togetherjs .togetherjs-notification .togetherjs-chat-content {
|
|
font-size: 12px;
|
|
}
|
|
.togetherjs .togetherjs-notification section {
|
|
font-size: 12px;
|
|
}
|
|
.togetherjs .togetherjs-notification .togetherjs-person-name {
|
|
font-family: openSansRegular, Helvetica Bold, 'Helvetica Neue', Arial;
|
|
font-size: 14px;
|
|
}
|
|
.togetherjs .togetherjs-notification button {
|
|
min-width: 47% !important;
|
|
}
|
|
.togetherjs .togetherjs-notification .togetherjs-person {
|
|
display: none;
|
|
}
|
|
.togetherjs .togetherjs-notification .togetherjs-timestamp {
|
|
display: none;
|
|
}
|
|
.togetherjs .togetherjs-notification {
|
|
border-bottom: 0px;
|
|
}
|
|
.togetherjs .togetherjs-notification img.togetherjs-notification-logo {
|
|
float: left;
|
|
margin: 22px 14px 14px 10px;
|
|
width: 34px;
|
|
height: 25px;
|
|
}
|
|
.togetherjs .togetherjs-notification img.togetherjs-notification-closebtn {
|
|
float: right;
|
|
padding: 14px 7px;
|
|
}
|
|
.togetherjs .togetherjs-notification img.togetherjs-notification-closebtn:hover {
|
|
opacity: 0.5;
|
|
}
|
|
.togetherjs .togetherjs-notification section.togetherjs-buttons {
|
|
border-top: 1px solid #E1E1E1;
|
|
}
|
|
.togetherjs .togetherjs-person {
|
|
height: 36px;
|
|
width: 36px;
|
|
margin: 10px;
|
|
background-repeat: no-repeat;
|
|
background-size: 40px 40px;
|
|
background-position: -2px -2px;
|
|
border: 2px solid;
|
|
border-radius: 2px;
|
|
background-clip: border-box;
|
|
}
|
|
.togetherjs .togetherjs-person.togetherjs-person-small {
|
|
display: inline-block;
|
|
height: 20px;
|
|
width: 20px;
|
|
margin: -1px -18px;
|
|
background-size: 22px 22px;
|
|
background-position: -1px -1px;
|
|
}
|
|
.togetherjs .togetherjs-person-small .togetherjs-person-avatar-swatch {
|
|
border-width: 3px;
|
|
margin-left: 14px;
|
|
margin-top: 0px;
|
|
}
|
|
.togetherjs .togetherjs-person-avatar-swatch {
|
|
/* This is the element that lives inside all .togetherjs-person elements
|
|
and is used for the triangle. */
|
|
|
|
width: 0;
|
|
height: 0;
|
|
margin-left: 23px;
|
|
padding: 0;
|
|
border-top: 7px solid transparent;
|
|
border-left: 7px solid transparent;
|
|
border-right: 7px solid transparent;
|
|
border-bottom: 7px solid transparent;
|
|
margin-top: 0px;
|
|
}
|
|
.togetherjs .togetherjs-person-inactive {
|
|
opacity: 0.5;
|
|
}
|
|
.togetherjs .togetherjs-button .togetherjs-person {
|
|
margin: 0 0 0 10px;
|
|
}
|
|
@-moz-document url-prefix() {
|
|
/* firefox only styles */
|
|
.togetherjs-button .togetherjs-person {
|
|
margin: 10px 0 0 10px;
|
|
}
|
|
}
|
|
.togetherjs header .togetherjs-person {
|
|
float: left;
|
|
}
|
|
.togetherjs .togetherjs-dock-person > .togetherjs-dock-person-tooltip {
|
|
display: none;
|
|
}
|
|
.togetherjs .togetherjs-dock-person:hover > .togetherjs-dock-person-tooltip {
|
|
display: block;
|
|
}
|
|
.togetherjs .togetherjs-dock-person.togetherjs-active:hover > .togetherjs-dock-person-tooltip {
|
|
display: none;
|
|
}
|
|
.togetherjs .togetherjs-dock-person-tooltip {
|
|
font-family: openSansLight, Helvetica, 'Helvetica Neue', Arial;
|
|
position: absolute;
|
|
right: 70px;
|
|
top: 0px;
|
|
padding: 8px;
|
|
font-size: 12px;
|
|
text-align: left;
|
|
min-width: 30px;
|
|
}
|
|
.togetherjs .togetherjs-tooltip {
|
|
background-color: rgba(42, 42, 42, 0.9);
|
|
color: #fff;
|
|
border-radius: 4px;
|
|
line-height: 20px !important;
|
|
}
|
|
.togetherjs .togetherjs-dock-person-tooltip .togetherjs-person-name {
|
|
font-size: 12px;
|
|
}
|
|
.togetherjs .togetherjs-person-tooltip-arrow-r {
|
|
position: absolute;
|
|
left: 46px;
|
|
width: 0;
|
|
height: 0;
|
|
border-top: 4px solid transparent;
|
|
border-bottom: 4px solid transparent;
|
|
border-left: 4px solid rgba(0, 0, 0, 0.9);
|
|
line-height: 20px;
|
|
opacity: 0.9;
|
|
top: 20px;
|
|
}
|
|
.togetherjs-triangle-up {
|
|
position: absolute;
|
|
top: -15px;
|
|
width: 13px;
|
|
left: 50px;
|
|
}
|
|
.togetherjs-triangle-up img {
|
|
width: 12px;
|
|
height: 13px;
|
|
}
|
|
.togetherjs-rtc-dialog-btn {
|
|
text-align: right;
|
|
}
|
|
#togetherjs-rtc-info section.togetherjs-buttons {
|
|
text-align: right !important;
|
|
}
|
|
#togetherjs-rtc-info label {
|
|
font-size: 12px !important;
|
|
float: left !important;
|
|
padding-top: 13px;
|
|
padding-left: 30px;
|
|
}
|
|
#togetherjs-rtc-info input {
|
|
margin-top: 0px !important;
|
|
}
|
|
.togetherjs-chat-url-change {
|
|
background: #f2f2f2;
|
|
margin-top: 0px !important;
|
|
}
|
|
.togetherjs-chat-join-item {
|
|
background: #f2f2f2;
|
|
margin-top: 0px !important;
|
|
}
|
|
.togetherjs-chat-left-item {
|
|
background: #f2f2f2;
|
|
margin-top: 0px !important;
|
|
}
|
|
.togetherjs-inline-text {
|
|
margin-top: 10px !important;
|
|
}
|
|
.togetherjs-chat-join-item .togetherjs-person {
|
|
float: left;
|
|
margin-bottom: 0px !important;
|
|
margin-top: 0px;
|
|
}
|
|
.togetherjs-chat-left-item .togetherjs-person {
|
|
float: left;
|
|
margin-bottom: 0px !important;
|
|
margin-top: 0px;
|
|
}
|
|
.togetherjs-chat-url-change .togetherjs-person {
|
|
float: left;
|
|
margin-bottom: 0px !important;
|
|
margin-top: 0px;
|
|
}
|
|
.togetherjs-chat-join-item span.togetherjs-person-name {
|
|
font-family: openSansRegular, Helvetica;
|
|
}
|
|
.togetherjs-chat-left-item span.togetherjs-person-name {
|
|
font-family: openSansRegular, Helvetica;
|
|
}
|
|
.togetherjs-chat-url-change span.togetherjs-person-name {
|
|
font-family: openSansRegular, Helvetica;
|
|
}
|
|
.togetherjs-clear {
|
|
clear: both;
|
|
}
|
|
/* Menu */
|
|
#togetherjs-menu {
|
|
width: 216px;
|
|
position: fixed;
|
|
font-size: 14px;
|
|
background-color: #fff;
|
|
z-index: 10003;
|
|
border: 1px solid #979797;
|
|
border-radius: 4px;
|
|
}
|
|
#togetherjs-menu hr {
|
|
margin: 0px;
|
|
border-top: 0px solid #E1E1E1;
|
|
}
|
|
#togetherjs-menu .togetherjs-menu-hr-avatar {
|
|
margin-top: 20px;
|
|
height: 0px;
|
|
border-bottom: 1px solid #E1E1E1;
|
|
font-size: 1px;
|
|
}
|
|
#togetherjs-menu .togetherjs-hr {
|
|
height: 0px;
|
|
margin: 0px;
|
|
border-bottom: 1px solid #E1E1E1;
|
|
font-size: 1px;
|
|
}
|
|
#togetherjs-menu .togetherjs-menu-item {
|
|
margin: -1px 0px -1px;
|
|
padding: 12px;
|
|
line-height: 9px;
|
|
height: 10px;
|
|
clear: both;
|
|
cursor: pointer;
|
|
}
|
|
#togetherjs-menu .togetherjs-menu-item.togetherjs-menu-disabled {
|
|
cursor: default;
|
|
}
|
|
#togetherjs-menu .togetherjs-menu-item.togetherjs-menu-disabled:hover {
|
|
background-color: inherit;
|
|
border-radius: 4px;
|
|
border-top: 1px solid #979797;
|
|
padding-top: 11px !important;
|
|
}
|
|
#togetherjs-menu .togetherjs-menu-item img {
|
|
float: left;
|
|
height: 20px;
|
|
width: 20px;
|
|
margin-right: 10px;
|
|
margin-top: -5px;
|
|
}
|
|
#togetherjs-menu .togetherjs-menu-item:hover {
|
|
background-color: rgba(216, 216, 216, 0.5);
|
|
}
|
|
#togetherjs-menu .togetherjs-menu-item .togetherjs-avatar {
|
|
height: 20px;
|
|
width: 20px;
|
|
padding: 0;
|
|
margin: 0 10px 0 0;
|
|
}
|
|
#togetherjs-menu .togetherjs-menu-item .togetherjs-person-bgcolor-self {
|
|
display: inline-block;
|
|
width: 12px;
|
|
height: 12px;
|
|
border: 1px solid #999;
|
|
border-radius: 2px;
|
|
margin-right: 12px;
|
|
float: left;
|
|
margin-top: -2px;
|
|
margin-left: 4px;
|
|
}
|
|
#togetherjs-menu #togetherjs-menu-help {
|
|
padding-left: 15px;
|
|
}
|
|
#togetherjs-menu #togetherjs-menu-feedback {
|
|
padding-left: 15px;
|
|
}
|
|
#togetherjs-menu img#togetherjs-menu-avatar {
|
|
float: left;
|
|
padding-top: 8px;
|
|
}
|
|
#togetherjs-menu .togetherjs-person-name-self {
|
|
padding-top: 8px;
|
|
line-height: 32px;
|
|
font-weight: bold;
|
|
}
|
|
#togetherjs-menu .togetherjs-self-name {
|
|
width: 146px !important;
|
|
float: right;
|
|
margin-top: -23px;
|
|
font-size: 12px;
|
|
padding: 7px 7px;
|
|
border-radius: 4px;
|
|
border: 1px solid #cccccc;
|
|
box-shadow: inset 0 2px 2px rgba(0, 0, 0, 0.1);
|
|
margin: -2px 0px;
|
|
}
|
|
#togetherjs-menu .togetherjs-self-name:focus {
|
|
border: 1px solid #474747;
|
|
}
|
|
#togetherjs-menu .togetherjs-self-name:focus {
|
|
border-bottom: 1px solid #474747;
|
|
}
|
|
/*Participant windows*/
|
|
#togetherjs-participantlist.togetherjs-window {
|
|
padding: -1px;
|
|
}
|
|
#togetherjs-participantlist.togetherjs-window section {
|
|
overflow: scroll;
|
|
height: 200px;
|
|
margin: 0px -7px;
|
|
}
|
|
#togetherjs-participantlist section.togetherjs-buttons {
|
|
height: auto;
|
|
background: none;
|
|
text-align: left;
|
|
margin: auto;
|
|
padding-top: 0px;
|
|
}
|
|
#togetherjs-participantlist .togetherjs-person.togetherjs-person-small {
|
|
margin: 0px;
|
|
width: 30px;
|
|
height: 30px;
|
|
}
|
|
#togetherjs-participantlist.togetherjs-window section ul li {
|
|
padding: 10px;
|
|
border-bottom: 1px solid rgba(0, 0, 0, 0.2);
|
|
}
|
|
#togetherjs-participantlist.togetherjs-window .tj-name {
|
|
padding-left: 5px;
|
|
}
|
|
#togetherjs-participantlist.togetherjs-window .tj-status {
|
|
float: right;
|
|
margin-top: 6px;
|
|
margin-right: 10px;
|
|
font-size: 24px;
|
|
color: green;
|
|
}
|
|
#togetherjs-participantlist.togetherjs-window .tj-urllocation {
|
|
font-size: 12px;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
}
|
|
#togetherjs-participantlist .togetherjs-follow-question {
|
|
margin-left: 0px;
|
|
}
|
|
#togetherjs-participantlist.togetherjs-window .tj-follow {
|
|
font-size: 12px;
|
|
}
|
|
#togetherjs-participantlist.togetherjs-window .tj-btn-sm {
|
|
height: 30px;
|
|
line-height: 30px;
|
|
font-size: 12px;
|
|
margin: 0px 3px 0px 0px;
|
|
}
|
|
section.togetherjs-participant-window-main {
|
|
margin: 0px -7px -7px !important;
|
|
}
|
|
.togetherjs-participant-window-row a.togetherjs-person-url {
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
width: 179px;
|
|
display: inline-block;
|
|
}
|
|
.togetherjs p.togetherjs-participant-window-row {
|
|
border-bottom: 1px solid #E1E1E1 !important;
|
|
padding: 7px 14px 14px !important;
|
|
}
|
|
.togetherjs-participant-window-row strong {
|
|
font-weight: 800;
|
|
}
|
|
.togetherjs-follow-question {
|
|
margin-left: 10px;
|
|
}
|
|
.togetherjs-float-left {
|
|
float: left;
|
|
}
|
|
.togetherjs-window input[type="radio"],
|
|
.togetherjs-window input[type="checkbox"] {
|
|
margin: 0 0 0 !important;
|
|
}
|
|
.togetherjs-clear {
|
|
clear: both;
|
|
margin: 10px;
|
|
}
|
|
section.togetherjs-buttons {
|
|
background: #F3F2F2;
|
|
margin: 0px -7px !important;
|
|
padding: 7px;
|
|
border-bottom-right-radius: 4px;
|
|
border-bottom-left-radius: 4px;
|
|
text-align: right;
|
|
}
|
|
section.togetherjs-buttons.togetherjs-buttons-notification-diff-url {
|
|
margin: 7px -7px 0px !important;
|
|
padding: 7px 3px 0px;
|
|
border-bottom-right-radius: 4px;
|
|
border-bottom-left-radius: 4px;
|
|
width: 300px;
|
|
text-align: right;
|
|
}
|
|
.togetherjs-notification-diff-url {
|
|
width: 288px !important;
|
|
margin: 0px 7px !important;
|
|
}
|
|
.togetherjs-different-url button {
|
|
min-width: 47% !important;
|
|
}
|
|
/*.togetherjs-different-url {
|
|
text-align:right;
|
|
}*/
|
|
.togetherjs-same-url {
|
|
padding-left: 7px !important;
|
|
opacity: .5 !important;
|
|
padding-top: 7px !important;
|
|
padding-bottom: 7px !important;
|
|
}
|
|
section.togetherjs-buttons .togetherjs-same-url {
|
|
text-align: left;
|
|
}
|
|
/* Button set */
|
|
#togetherjs-dock {
|
|
position: fixed;
|
|
z-index: 10000;
|
|
background-color: #474747;
|
|
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
|
|
/*border:1px solid #000;*/
|
|
|
|
}
|
|
#togetherjs-dock.togetherjs-dock-right {
|
|
padding: 0;
|
|
bottom: 150px;
|
|
right: 15px;
|
|
top: 35px;
|
|
border-radius: 4px;
|
|
height: 260px;
|
|
width: 60px;
|
|
}
|
|
#togetherjs-dock.togetherjs-dock-right #togetherjs-dock-anchor-vertical {
|
|
display: none;
|
|
}
|
|
#togetherjs-dock.togetherjs-dock-right #togetherjs-dock-anchor-horizontal {
|
|
display: inline;
|
|
}
|
|
#togetherjs-dock.togetherjs-dock-right #togetherjs-dock-anchor-horizontal img {
|
|
width: 31px;
|
|
height: 7px;
|
|
padding: 0px 2px 2px 2px;
|
|
pointer-events: none;
|
|
}
|
|
#togetherjs-dock.togetherjs-dock-left {
|
|
padding: 0;
|
|
bottom: 60px;
|
|
left: 5px;
|
|
border-radius: 0 4px 4px 0;
|
|
height: 214px;
|
|
width: 60px;
|
|
}
|
|
#togetherjs-dock.togetherjs-dock-left #togetherjs-dock-anchor-vertical {
|
|
display: none;
|
|
}
|
|
#togetherjs-dock.togetherjs-dock-left #togetherjs-dock-anchor-horizontal {
|
|
display: inline;
|
|
}
|
|
#togetherjs-dock.togetherjs-dock-left #togetherjs-dock-anchor-horizontal img {
|
|
width: 6px;
|
|
height: 6px;
|
|
padding: 7px 2px 2px 2px;
|
|
}
|
|
#togetherjs-dock.togetherjs-dock-top {
|
|
padding: 0;
|
|
top: 40px;
|
|
left: 50%;
|
|
margin-left: -130px;
|
|
border-radius: 4px 4px 0 0;
|
|
height: 60px;
|
|
width: 260px;
|
|
}
|
|
#togetherjs-dock.togetherjs-dock-top #togetherjs-buttons,
|
|
#togetherjs-dock.togetherjs-dock-top #togetherjs-dock-anchor {
|
|
display: inline;
|
|
}
|
|
#togetherjs-dock.togetherjs-dock-top #togetherjs-dock-anchor-vertical {
|
|
display: inline;
|
|
}
|
|
#togetherjs-dock.togetherjs-dock-top #togetherjs-dock-anchor-horizontal {
|
|
display: none;
|
|
}
|
|
#togetherjs-dock.togetherjs-dock-top #togetherjs-dock-anchor-vertical img {
|
|
width: 6px;
|
|
height: 6px;
|
|
padding: 2px;
|
|
}
|
|
/* Arrows for pointing */
|
|
.togetherjs-arrow {
|
|
position: absolute;
|
|
border: 2px solid #f00;
|
|
z-index: 10010;
|
|
padding: 0;
|
|
margin: 0;
|
|
-moz-transform-origin: top left;
|
|
-webkit-transform-origin: top left;
|
|
-ms-transform-origin: top left;
|
|
-o-transform-origin: top left;
|
|
transform-origin: top left;
|
|
}
|
|
.togetherjs-chat-message.togetherjs-arrow-message {
|
|
border: 2px solid #f00;
|
|
}
|
|
/* Shared cursors */
|
|
.togetherjs-cursor svg {
|
|
-webkit-filter: drop-shadow(1px 3px 2px rgba(0, 0, 0, 0.3));
|
|
-webkit-transform: rotate(-10deg);
|
|
}
|
|
.togetherjs-cursor-img {
|
|
position: relative;
|
|
top: 0;
|
|
}
|
|
.togetherjs-cursor img {
|
|
width: 20px;
|
|
-webkit-filter: drop-shadow(0px 2px 1px rgba(0, 0, 0, 0.2));
|
|
/*FIX ME, moz filter not working...*/
|
|
|
|
-moz-filter: drop-shadow(0px 2px 1px rgba(0, 0, 0, 0.2));
|
|
filter: drop-shadow(0px 2px 1px rgba(0, 0, 0, 0.2));
|
|
}
|
|
.togetherjs-cursor {
|
|
position: absolute;
|
|
z-index: 999999;
|
|
font-size: 28px;
|
|
font-weight: bolder;
|
|
/* This magic CSS rule makes this element basically invisible to clicks/etc:
|
|
(good on all but IE: http://caniuse.com/pointer-events */
|
|
|
|
pointer-events: none;
|
|
/*FIXME: maybe these should use position: fixed so the cursor
|
|
stays stuck to the top of the screen until the appropriate time
|
|
(when .togetherjs-scrolled-above/below is removed)?*/
|
|
|
|
}
|
|
.togetherjs-cursor:hover {
|
|
cursor: pointer;
|
|
}
|
|
.togetherjs-cursor.togetherjs-scrolled-above {
|
|
position: fixed;
|
|
}
|
|
.togetherjs-cursor.togetherjs-scrolled-above svg {
|
|
-webkit-transition-duration: 0.8s;
|
|
-webkit-transition-property: -webkit-transform;
|
|
-webkit-transform: rotate(20deg);
|
|
transition-duration: 0.8s;
|
|
transition-property: transform;
|
|
transform: rotate(20deg);
|
|
}
|
|
.togetherjs-cursor.togetherjs-scrolled-above .togetherjs-cursor-down {
|
|
display: none;
|
|
}
|
|
.togetherjs-cursor.togetherjs-scrolled-below {
|
|
position: fixed;
|
|
}
|
|
.togetherjs-cursor.togetherjs-scrolled-below svg {
|
|
-webkit-transition-duration: 0.8s;
|
|
-webkit-transition-property: -webkit-transform;
|
|
-webkit-transform: rotate(-150deg);
|
|
transition-duration: 0.8s;
|
|
transition-property: transform;
|
|
transform: rotate(-150deg);
|
|
}
|
|
.togetherjs-cursor.togetherjs-scrolled-below .togetherjs-cursor-up {
|
|
display: none;
|
|
}
|
|
.togetherjs-cursor.togetherjs-scrolled-normal svg {
|
|
-webkit-transition-duration: 0.8s;
|
|
-webkit-transition-property: -webkit-transform;
|
|
-webkit-transform: rotate(-10deg);
|
|
transition-duration: 0.8s;
|
|
transition-property: transform;
|
|
transform: rotate(-10deg);
|
|
}
|
|
.togetherjs-cursor.togetherjs-scrolled-normal .togetherjs-cursor-up,
|
|
.togetherjs-cursor.togetherjs-scrolled-normal .togetherjs-cursor-down {
|
|
display: none;
|
|
}
|
|
.togetherjs-cursor .togetherjs-cursor-container {
|
|
opacity: 0.9;
|
|
white-space: nowrap;
|
|
font-family: openSansLight, Helvetica, 'Helvetica Neue', Arial, sans-serif;
|
|
font-size: 40%;
|
|
position: relative;
|
|
top: 5px;
|
|
left: 15px;
|
|
padding: 8px;
|
|
border-radius: 4px;
|
|
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
|
|
border: 1px solid rgba(0, 0, 0, 0.2);
|
|
-moz-box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.5);
|
|
-webkit-box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.5);
|
|
box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.5);
|
|
}
|
|
.togetherjs-click {
|
|
position: absolute;
|
|
z-index: 999998;
|
|
pointer-events: none;
|
|
width: 10px;
|
|
height: 10px;
|
|
margin: -5px 0 0 -5px;
|
|
border-radius: 5px;
|
|
border: 3px solid #ff3a29;
|
|
/* Note, you must call this like:
|
|
.transition(~"value, value, value")*/
|
|
|
|
transition: width 2s, height 2s, margin 2s, border 2s;
|
|
-moz-transition: width 2s, height 2s, margin 2s, border 2s;
|
|
-webkit-transition: width 2s, height 2s, margin 2s, border 2s;
|
|
-o-transition: width 2s, height 2s, margin 2s, border 2s;
|
|
}
|
|
.togetherjs-click.togetherjs-clicking {
|
|
width: 40px;
|
|
height: 40px;
|
|
margin: -20px 0 0 -20px;
|
|
border-radius: 20px;
|
|
border: 3px solid rgba(0, 0, 0, 0);
|
|
}
|
|
#togetherjs-starter .togetherjs-running {
|
|
background-color: #f00;
|
|
color: #fff;
|
|
border-radius: 4px;
|
|
border: 3px outset #d00;
|
|
/*FIXME: add gradient*/
|
|
|
|
}
|
|
/* Modals */
|
|
#togetherjs-modal-background {
|
|
position: fixed;
|
|
background-color: #000;
|
|
opacity: 0.5;
|
|
width: 100%;
|
|
height: 100%;
|
|
top: 0;
|
|
left: 0;
|
|
z-index: 10002;
|
|
}
|
|
.togetherjs .togetherjs-modal {
|
|
background-color: #ffffff;
|
|
color: #000000;
|
|
padding: 0 7px 0 7px;
|
|
z-index: 10001;
|
|
width: 286px;
|
|
border-radius: 4px;
|
|
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
|
|
border-radius: 5px !important;
|
|
position: fixed;
|
|
z-index: 10003;
|
|
top: 50%;
|
|
left: 50%;
|
|
margin-left: -150px;
|
|
width: 300px;
|
|
margin-top: -10em;
|
|
}
|
|
.togetherjs .togetherjs-modal section {
|
|
margin: 15px 7px;
|
|
}
|
|
.togetherjs .togetherjs-modal > header {
|
|
font-weight: bold;
|
|
font-variant: normal;
|
|
text-align: center;
|
|
font-family: openSansRegular, Helvetica;
|
|
color: #fff;
|
|
margin: 0 -7px 0 -7px;
|
|
padding: 10px 4px 5px 30px;
|
|
height: 24px;
|
|
background: #474747;
|
|
border-radius: 4px 4px 0 0;
|
|
position: relative;
|
|
border-bottom: 1px solid #FFFFFF;
|
|
}
|
|
.togetherjs .togetherjs-modal .togetherjs-share-link {
|
|
width: 256px;
|
|
font-size: 12px;
|
|
padding: 6px 6px 4px;
|
|
border-radius: 4px;
|
|
border: 1px solid #cccccc;
|
|
box-shadow: inset 0 2px 2px rgba(0, 0, 0, 0.1);
|
|
font-family: Monaco, sans-serif;
|
|
margin: 7px 0px;
|
|
}
|
|
.togetherjs .togetherjs-modal .togetherjs-share-link:focus {
|
|
border: 1px solid #474747;
|
|
}
|
|
.togetherjs .togetherjs-modal header button.togetherjs-close {
|
|
background-color: inherit;
|
|
border: none;
|
|
padding: 0;
|
|
margin: 0;
|
|
border-left: 1px solid #FFFFFF;
|
|
float: right;
|
|
font-weight: bold;
|
|
cursor: pointer;
|
|
background-image: url('./images/icon-close@2x.png');
|
|
background-position: center center;
|
|
background-repeat: no-repeat;
|
|
background-size: 13px 13px;
|
|
width: 39px;
|
|
height: 39px;
|
|
margin-top: -10px;
|
|
margin-right: -4px;
|
|
border-top-right-radius: 4px;
|
|
}
|
|
.togetherjs .togetherjs-modal header button.togetherjs-close:hover {
|
|
background-image: url('./images/icon-close-active.png');
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|
}
|
|
.togetherjs .togetherjs-modal #togetherjs-chat-messages {
|
|
overflow-y: auto;
|
|
/*FIXME: I'm just pulling numbers out of thin air here:*/
|
|
|
|
height: 260px;
|
|
}
|
|
.togetherjs .togetherjs-modal.togetherjs-modal-wide {
|
|
width: 550px;
|
|
margin-left: -284px;
|
|
height: 530px;
|
|
margin-top: -275px;
|
|
}
|
|
.togetherjs .togetherjs-modal section.togetherjs-buttons {
|
|
/*position: absolute;*/
|
|
|
|
bottom: 0;
|
|
background: #F2F2F2;
|
|
width: 294px;
|
|
padding: 10px;
|
|
text-align: right;
|
|
border-bottom-right-radius: 4px;
|
|
border-bottom-left-radius: 4px;
|
|
margin-left: -7px;
|
|
margin-bottom: 0px;
|
|
border-top: 1px solid #E1E1E1;
|
|
}
|
|
.togetherjs .togetherjs-modal-wide section.togetherjs-buttons {
|
|
width: 544px;
|
|
text-align: center !important;
|
|
position: absolute;
|
|
}
|
|
.togetherjs .togetherjs-walkthrough-slide {
|
|
padding: 0 30px 0 30px;
|
|
text-align: center;
|
|
}
|
|
.togetherjs .togetherjs-walkthrough-slide p {
|
|
margin: 18px auto;
|
|
width: 400px;
|
|
}
|
|
.togetherjs .togetherjs-walkthrough-slide iframe {
|
|
border-radius: 4px;
|
|
}
|
|
.togetherjs section.togetherjs-walkthrough-slide .togetherjs-walkthrough-main-image .togetherjs-walkthrough-avatar-section {
|
|
margin-top: 115px;
|
|
}
|
|
.togetherjs .togetherjs-avatar-preview {
|
|
float: left;
|
|
margin-left: 82px;
|
|
}
|
|
.togetherjs .togetherjs-avatar-upload-input {
|
|
float: right;
|
|
margin-right: 82px;
|
|
margin-top: 19px;
|
|
}
|
|
.togetherjs .togetherjs-save-settings {
|
|
margin-top: 239px;
|
|
}
|
|
.togetherjs section.togetherjs-walkthrough-slide .togetherjs-walkthrough-avatar {
|
|
width: 80px;
|
|
height: 80px;
|
|
position: absolute;
|
|
left: 44%;
|
|
top: 30%;
|
|
border-radius: 4px 4px 4px 4px;
|
|
border: 2px solid #cccccc;
|
|
background: none repeat scroll 0% 0% #000000;
|
|
}
|
|
.togetherjs section.togetherjs-walkthrough-slide .togetherjs-walkthrough-avatar:hover {
|
|
cursor: pointer;
|
|
border: 2px solid #cccccc;
|
|
}
|
|
.togetherjs section.togetherjs-walkthrough-slide input.togetherjs-self-name {
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 29%;
|
|
font-size: 14px;
|
|
padding: 6px 6px 6px;
|
|
border-radius: 4px 4px 4px 4px;
|
|
border: 1px solid #cccccc;
|
|
box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1) inset;
|
|
font-family: openSansRegular, Helvetica, sans-serif;
|
|
margin: -20px 0px;
|
|
}
|
|
.togetherjs section.togetherjs-walkthrough-slide .togetherjs-swatch {
|
|
width: 32px;
|
|
height: 32px;
|
|
background: none repeat scroll 0% 0% #000000;
|
|
position: absolute;
|
|
top: 46.2%;
|
|
right: 29%;
|
|
border-radius: 4px 4px 4px 4px;
|
|
border: 1px solid #cccccc;
|
|
}
|
|
.togetherjs section.togetherjs-walkthrough-slide .togetherjs-swatch:hover {
|
|
cursor: pointer;
|
|
border: 1px solid rgba(204, 204, 204, 0.2);
|
|
}
|
|
.togetherjs section.togetherjs-walkthrough-slide span.togetherjs-walkthrough-sendlink {
|
|
top: 44%;
|
|
position: relative;
|
|
}
|
|
.togetherjs section.togetherjs-walkthrough-slide input.togetherjs-share-link {
|
|
top: 44%;
|
|
position: relative;
|
|
}
|
|
.togetherjs .togetherjs-walkthrough-main-image {
|
|
width: 400px;
|
|
height: 300px;
|
|
background: rgba(216, 216, 216, 0.1);
|
|
border-radius: 4px;
|
|
border: 1px solid rgba(151, 151, 151, 0.1);
|
|
margin: 0 auto;
|
|
}
|
|
.togetherjs .togetherjs-walkthrough-main-image img {
|
|
width: 400px;
|
|
height: 300px;
|
|
}
|
|
.togetherjs #togetherjs-walkthrough input,
|
|
.togetherjs textarea,
|
|
.togetherjs .uneditable-input {
|
|
width: 177px;
|
|
}
|
|
.togetherjs #togetherjs-walkthrough select,
|
|
.togetherjs input[type="file"] {
|
|
height: 30px;
|
|
line-height: 0px;
|
|
}
|
|
.togetherjs #togetherjs-walkthrough-previous {
|
|
cursor: pointer;
|
|
width: 19px;
|
|
height: 36px;
|
|
background-repeat: no-repeat;
|
|
background-size: 60% 60%;
|
|
margin-left: 36px;
|
|
margin-top: 28%;
|
|
background-image: url('./images/icn-walkthrough-arrow-l.png');
|
|
float: left;
|
|
}
|
|
.togetherjs #togetherjs-walkthrough-previous.togetherjs-disabled {
|
|
cursor: default;
|
|
opacity: 0.2;
|
|
}
|
|
.togetherjs #togetherjs-walkthrough-previous:hover {
|
|
background-image: url('./images/icn-walkthrough-arrow-l-hover.png');
|
|
}
|
|
.togetherjs #togetherjs-walkthrough-next {
|
|
cursor: pointer;
|
|
width: 19px;
|
|
height: 36px;
|
|
background-repeat: no-repeat;
|
|
background-size: 60% 60%;
|
|
margin-right: 28px;
|
|
margin-top: 28%;
|
|
background-image: url('./images/icn-walkthrough-arrow-r.png');
|
|
float: right;
|
|
}
|
|
.togetherjs #togetherjs-walkthrough-next.togetherjs-disabled {
|
|
cursor: default;
|
|
opacity: 0.2;
|
|
}
|
|
.togetherjs #togetherjs-walkthrough-next:hover {
|
|
background-image: url('./images/icn-walkthrough-arrow-r-hover.png');
|
|
}
|
|
.togetherjs #togetherjs-walkthrough-progress {
|
|
width: 537px;
|
|
position: absolute;
|
|
bottom: 66px;
|
|
text-align: center;
|
|
}
|
|
.togetherjs .togetherjs-walkthrough-slide-progress {
|
|
cursor: pointer;
|
|
padding: 0 5px 0 5px;
|
|
color: #D8D8D8;
|
|
font-size: 20px;
|
|
}
|
|
.togetherjs .togetherjs-walkthrough-slide-progress.togetherjs-active {
|
|
color: #9C9C9C;
|
|
}
|
|
.togetherjs .togetherjs-walkthrough-slide-progress:hover {
|
|
color: #9C9C9C;
|
|
}
|
|
/* Animations */
|
|
/* Inspired by https://github.com/daneden/animate.css */
|
|
@-webkit-keyframes togetherjs-pulse {
|
|
0% {
|
|
-webkit-transform: scale(1);
|
|
}
|
|
50% {
|
|
-webkit-transform: scale(1.1);
|
|
}
|
|
100% {
|
|
-webkit-transform: scale(1);
|
|
}
|
|
}
|
|
@-moz-keyframes togetherjs-pulse {
|
|
0% {
|
|
-moz-transform: scale(1);
|
|
}
|
|
50% {
|
|
-moz-transform: scale(1.1);
|
|
}
|
|
100% {
|
|
-moz-transform: scale(1);
|
|
}
|
|
}
|
|
@-o-keyframes togetherjs-pulse {
|
|
0% {
|
|
-o-transform: scale(1);
|
|
}
|
|
50% {
|
|
-o-transform: scale(1.1);
|
|
}
|
|
100% {
|
|
-o-transform: scale(1);
|
|
}
|
|
}
|
|
@keyframes togetherjs-pulse {
|
|
0% {
|
|
transform: scale(1);
|
|
}
|
|
50% {
|
|
transform: scale(1.1);
|
|
}
|
|
100% {
|
|
transform: scale(1);
|
|
}
|
|
}
|
|
.togetherjs-pulse {
|
|
-webkit-animation-name: togetherjs-pulse;
|
|
-moz-animation-name: togetherjs-pulse;
|
|
-o-animation-name: togetherjs-pulse;
|
|
animation-name: togetherjs-pulse;
|
|
}
|
|
.togetherjs-animated {
|
|
-webkit-animation-duration: 1s;
|
|
-moz-animation-duration: 1s;
|
|
-o-animation-duration: 1s;
|
|
animation-duration: 1s;
|
|
-webkit-animation-fill-mode: both;
|
|
-moz-animation-fill-mode: both;
|
|
-o-animation-fill-mode: both;
|
|
animation-fill-mode: both;
|
|
}
|
|
@-webkit-keyframes togetherjs-color-pulse {
|
|
0% {
|
|
box-shadow: none;
|
|
}
|
|
50% {
|
|
box-shadow: inset 0 0 2px #474747;
|
|
}
|
|
100% {
|
|
box-shadow: none;
|
|
}
|
|
}
|
|
@-moz-keyframes togetherjs-color-pulse {
|
|
0% {
|
|
box-shadow: none;
|
|
}
|
|
50% {
|
|
box-shadow: inset 0 0 2px #474747;
|
|
}
|
|
100% {
|
|
box-shadow: none;
|
|
}
|
|
}
|
|
@-o-keyframes togetherjs-color-pulse {
|
|
0% {
|
|
box-shadow: none;
|
|
}
|
|
50% {
|
|
box-shadow: inset 0 0 2px #474747;
|
|
}
|
|
100% {
|
|
box-shadow: none;
|
|
}
|
|
}
|
|
@keyframes togetherjs-color-pulse {
|
|
0% {
|
|
box-shadow: none;
|
|
}
|
|
50% {
|
|
box-shadow: inset 0 0 2px #474747;
|
|
}
|
|
100% {
|
|
box-shadow: none;
|
|
}
|
|
}
|
|
.togetherjs-color-pulse {
|
|
-webkit-animation-name: togetherjs-color-pulse;
|
|
-moz-animation-name: togetherjs-color-pulse;
|
|
-o-animation-name: togetherjs-color-pulse;
|
|
animation-name: togetherjs-color-pulse;
|
|
}
|
|
@-webkit-keyframes togetherjs-color-alert {
|
|
0% {
|
|
box-shadow: none;
|
|
}
|
|
50% {
|
|
box-shadow: 0 0 5px #474747;
|
|
}
|
|
100% {
|
|
box-shadow: none;
|
|
}
|
|
}
|
|
@-moz-keyframes togetherjs-color-alert {
|
|
0% {
|
|
box-shadow: none;
|
|
}
|
|
50% {
|
|
box-shadow: 0 0 5px #474747;
|
|
}
|
|
100% {
|
|
box-shadow: none;
|
|
}
|
|
}
|
|
@-o-keyframes togetherjs-color-alert {
|
|
0% {
|
|
box-shadow: none;
|
|
}
|
|
50% {
|
|
box-shadow: 0 0 5px #474747;
|
|
}
|
|
100% {
|
|
box-shadow: none;
|
|
}
|
|
}
|
|
@keyframes togetherjs-color-alert {
|
|
0% {
|
|
box-shadow: none;
|
|
}
|
|
50% {
|
|
box-shadow: 0 0 5px #474747;
|
|
}
|
|
100% {
|
|
box-shadow: none;
|
|
}
|
|
}
|
|
.togetherjs-color-alert {
|
|
-webkit-animation-name: togetherjs-color-alert;
|
|
-moz-animation-name: togetherjs-color-alert;
|
|
-o-animation-name: togetherjs-color-alert;
|
|
animation-name: togetherjs-color-alert;
|
|
animation-iteration-count: infinite;
|
|
-webkit-animation-iteration-count: infinite;
|
|
-moz-animation-iteration-count: infinite;
|
|
-o-animation-iteration-count: infinite;
|
|
}
|
|
#togetherjs-profile-arrow {
|
|
position: absolute;
|
|
width: 12px;
|
|
height: 12px;
|
|
left: 42px;
|
|
top: 46px;
|
|
background: url('./images/icn-gear.png');
|
|
background-size: 12px 12px;
|
|
background-repeat: no-repeat;
|
|
}
|
|
#togetherjs-pick-color {
|
|
width: 100px;
|
|
height: 76px;
|
|
margin-left: -35px;
|
|
position: absolute;
|
|
margin-top: 25px;
|
|
background-color: #fff;
|
|
z-index: 10004;
|
|
border: 1px solid #979797;
|
|
border-radius: 4px;
|
|
padding: 5px;
|
|
}
|
|
#togetherjs-pick-color .togetherjs-swatch {
|
|
cursor: pointer;
|
|
display: inline-block;
|
|
height: 12px;
|
|
width: 12px;
|
|
border: 1px solid;
|
|
border-radius: 1px;
|
|
margin: 4px;
|
|
}
|
|
#togetherjs-pick-color .togetherjs-swatch.togetherjs-swatch-active {
|
|
border: 3px solid;
|
|
border-radius: 3px;
|
|
}
|
|
#togetherjs-pick-color .togetherjs-swatch:hover {
|
|
border: 2px solid rgba(0, 0, 0, 0.5);
|
|
height: 10px;
|
|
width: 10px;
|
|
border-radius: 3px;
|
|
}
|
|
.togetherjs-focus {
|
|
position: absolute;
|
|
pointer-events: none;
|
|
z-index: 9999;
|
|
opacity: 0.4;
|
|
border: 3px solid;
|
|
margin: -3px;
|
|
}
|
|
.togetherjs-only-mobile {
|
|
display: none;
|
|
}
|
|
@media screen and (max-device-width: 480px) {
|
|
{
|
|
/*TogetherJS dock*/
|
|
|
|
/*TogetherJS walkthrough*/
|
|
|
|
}
|
|
#togetherjs-dock.togetherjs-dock-right {
|
|
top: 0px;
|
|
width: auto;
|
|
height: 40px !important;
|
|
right: 0px;
|
|
margin: 10px;
|
|
bottom: 0px;
|
|
}
|
|
#togetherjs-dock #togetherjs-dock-anchor {
|
|
width: 40px;
|
|
height: 40px;
|
|
float: right;
|
|
user-select: all;
|
|
cursor: default;
|
|
display: inline;
|
|
}
|
|
#togetherjs-dock #togetherjs-buttons {
|
|
display: inline;
|
|
}
|
|
#togetherjs-dock .togetherjs-button {
|
|
float: right;
|
|
border-right: 1px solid rgba(0, 0, 0, 0.2);
|
|
border-top: none;
|
|
width: 40px;
|
|
height: 40px;
|
|
background-size: 30px 30px;
|
|
}
|
|
#togetherjs-dock #togetherjs-profile-arrow {
|
|
display: none;
|
|
}
|
|
#togetherjs-dock #togetherjs-dock-anchor-horizontal img {
|
|
width: 24px;
|
|
height: 24px;
|
|
padding: 8px;
|
|
}
|
|
.togetherjs-only-mobile {
|
|
display: block;
|
|
text-align: center;
|
|
/* a.togetherjs-share-link {
|
|
padding: 6px 111px 6px;
|
|
}*/
|
|
|
|
}
|
|
.togetherjs-not-mobile {
|
|
display: none;
|
|
}
|
|
.togetherjs .togetherjs-menu-item {
|
|
cursor: pointer;
|
|
margin: 0px -14px 0px;
|
|
padding: 9px;
|
|
border-bottom: 1px solid rgba(0, 0, 0, 0.2);
|
|
}
|
|
.togetherjs #togetherjs-menu-feedback-button,
|
|
.togetherjs #togetherjs-menu-update-color-button,
|
|
.togetherjs #togetherjs-menu-help-button {
|
|
display: none;
|
|
}
|
|
.togetherjs .togetherjs-menu-item img {
|
|
display: none;
|
|
}
|
|
.togetherjs .togetherjs-menu-item:first-child {
|
|
display: none;
|
|
}
|
|
.togetherjs .togetherjs-button .togetherjs-person {
|
|
margin: 0 0 0 5px;
|
|
}
|
|
.togetherjs .togetherjs-person {
|
|
background-size: 30px 30px;
|
|
height: 26px;
|
|
width: 26px;
|
|
}
|
|
.togetherjs .togetherjs-person-avatar-swatch {
|
|
margin-left: 12px;
|
|
}
|
|
.togetherjs .togetherjs-window {
|
|
width: 100%;
|
|
margin-left: 0;
|
|
height: 82%;
|
|
margin-top: 0%;
|
|
z-index: 10003 !important;
|
|
top: 20%;
|
|
left: -2px;
|
|
}
|
|
.togetherjs .togetherjs-window #togetherjs-chat-messages {
|
|
width: 105%;
|
|
}
|
|
.togetherjs .togetherjs-window .togetherjs-close {
|
|
display: none;
|
|
}
|
|
.togetherjs .togetherjs-window #togetherjs-chat-messages {
|
|
height: 62%;
|
|
top: -37px;
|
|
}
|
|
.togetherjs .togetherjs-subtitle {
|
|
width: 98%;
|
|
margin: 22px 7px;
|
|
}
|
|
.togetherjs #togetherjs-chat-input-box {
|
|
width: 100%;
|
|
bottom: 0px;
|
|
position: fixed;
|
|
}
|
|
.togetherjs #togetherjs-chat-input {
|
|
width: 95%;
|
|
}
|
|
.togetherjs .togetherjs-timestamp {
|
|
padding: 8px 45px 0px 10px;
|
|
}
|
|
.togetherjs #togetherjs-rtc-not-supported section.togetherjs-buttons {
|
|
display: none;
|
|
}
|
|
.togetherjs #togetherjs-menu-window section.togetherjs-buttons {
|
|
display: none;
|
|
}
|
|
.togetherjs .togetherjs-modal {
|
|
width: 94%;
|
|
margin-left: 1%;
|
|
height: 94%;
|
|
margin-top: 1%;
|
|
top: 0;
|
|
left: 0;
|
|
}
|
|
.togetherjs .togetherjs-window > header {
|
|
margin: -7px;
|
|
padding: 10px;
|
|
}
|
|
#togetherjs-dock-participants {
|
|
display: none;
|
|
}
|
|
#togetherjs-confirm-end section.togetherjs-buttons {
|
|
position: fixed;
|
|
bottom: 0;
|
|
width: 92%;
|
|
}
|
|
#togetherjs-edit-name-window section.togetherjs-buttons {
|
|
position: fixed;
|
|
bottom: 0;
|
|
width: 96%;
|
|
}
|
|
input.togetherjs-self-name {
|
|
padding: 10px;
|
|
width: 92%;
|
|
margin-top: 10px;
|
|
}
|
|
#togetherjs-avatar-edit section.togetherjs-buttons {
|
|
position: fixed;
|
|
bottom: 0;
|
|
width: 92%;
|
|
}
|
|
#togetherjs-avatar-edit .togetherjs-person {
|
|
margin: 30px auto;
|
|
float: none;
|
|
}
|
|
#togetherjs-avatar-edit #togetherjs-avatar-buttons {
|
|
float: none;
|
|
margin: 0 auto;
|
|
}
|
|
#togetherjs-window-pointer-right,
|
|
#togetherjs-window-pointer-left {
|
|
position: fixed;
|
|
width: 10px;
|
|
height: 10px;
|
|
margin-right: -5px;
|
|
margin-top: -5px;
|
|
background: #fff;
|
|
border-right: 1px solid rgba(0, 0, 0, 0.2);
|
|
border-bottom: 1px solid rgba(0, 0, 0, 0.2);
|
|
z-index: 10002;
|
|
box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);
|
|
}
|
|
#togetherjs-window-pointer-right {
|
|
-moz-transform: rotate(-45deg);
|
|
-webkit-transform: rotate(-45deg);
|
|
}
|
|
#togetherjs-window-pointer-left {
|
|
-moz-transform: rotate(135deg);
|
|
-webkit-transform: rotate(135deg);
|
|
}
|
|
.togetherjs .togetherjs-modal section {
|
|
margin: 0px 7px;
|
|
}
|
|
#togetherjs-walkthrough-progress {
|
|
width: 93%;
|
|
text-align: center;
|
|
position: static;
|
|
}
|
|
.togetherjs-modal-wide section.togetherjs-buttons {
|
|
width: 93.9%;
|
|
text-align: center !important;
|
|
position: absolute;
|
|
bottom: -17px;
|
|
}
|
|
.togetherjs-walkthrough-slide p {
|
|
margin: 13px auto;
|
|
width: 100%;
|
|
font-size: 11px;
|
|
}
|
|
.togetherjs .togetherjs-walkthrough-main-image {
|
|
width: auto;
|
|
height: auto;
|
|
background: rgba(216, 216, 216, 0.1);
|
|
border-radius: 4px;
|
|
border: 1px solid rgba(151, 151, 151, 0.1);
|
|
padding: 10px;
|
|
}
|
|
.togetherjs .togetherjs-walkthrough-main-image img {
|
|
width: 50%;
|
|
height: auto;
|
|
}
|
|
.togetherjs #togetherjs-walkthrough-next {
|
|
cursor: pointer;
|
|
width: 19px;
|
|
height: 36px;
|
|
background-repeat: no-repeat;
|
|
background-size: 60% 60%;
|
|
margin-right: 0px;
|
|
margin-top: 28%;
|
|
background-image: url('./images/icn-walkthrough-arrow-r.png');
|
|
float: right;
|
|
}
|
|
.togetherjs #togetherjs-walkthrough-previous {
|
|
cursor: pointer;
|
|
width: 19px;
|
|
height: 36px;
|
|
background-repeat: no-repeat;
|
|
background-size: 60% 60%;
|
|
margin-top: 28%;
|
|
background-image: url('./images/icn-walkthrough-arrow-l.png');
|
|
float: left;
|
|
margin-left: 0px;
|
|
}
|
|
.togetherjs .togetherjs-modal .togetherjs-share-link {
|
|
width: 80%;
|
|
font-size: 14px;
|
|
padding: 14px;
|
|
border-radius: 4px;
|
|
border: 1px solid
|
|
#cccccc;
|
|
box-shadow: inset 0 2px 2px rgba(0, 0, 0, 0.1);
|
|
font-family: Monaco;
|
|
margin: 7px 0px;
|
|
}
|
|
.togetherjs-walkthrough-sendlink {
|
|
top: 44%;
|
|
position: relative;
|
|
padding: 15px;
|
|
}
|
|
.togetherjs section.togetherjs-walkthrough-slide input.togetherjs-self-name {
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 29%;
|
|
font-size: 14px;
|
|
padding: 6px 6px 6px;
|
|
border-radius: 4px 4px 4px 4px;
|
|
border: 1px solid
|
|
#cccccc;
|
|
box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1) inset;
|
|
font-family: openSansRegular;
|
|
margin: -20px 11px;
|
|
width: 60%;
|
|
}
|
|
.togetherjs section.togetherjs-walkthrough-slide .togetherjs-walkthrough-main-image .togetherjs-walkthrough-avatar-section {
|
|
margin-top: 15px;
|
|
}
|
|
.togetherjs .togetherjs-avatar-preview {
|
|
margin: 0 auto;
|
|
float: none;
|
|
}
|
|
.togetherjs .togetherjs-avatar-upload-input {
|
|
margin: 10px auto;
|
|
float: none;
|
|
}
|
|
.togetherjs .togetherjs-avatar-upload-input input {
|
|
width: 60%;
|
|
}
|
|
input.togetherjs-upload-avatar {
|
|
line-height: 0px;
|
|
width: 174px;
|
|
margin-left: 0px;
|
|
}
|
|
.togetherjs section.togetherjs-walkthrough-slide input.togetherjs-self-name {
|
|
float: left;
|
|
font-size: 14px;
|
|
padding: 6px 6px 6px;
|
|
border-radius: 4px 4px 4px 4px;
|
|
border: 1px solid
|
|
#cccccc;
|
|
box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1) inset;
|
|
font-family: openSansRegular;
|
|
width: 66%;
|
|
position: static;
|
|
margin: 10px 10px;
|
|
}
|
|
.togetherjs section.togetherjs-walkthrough-slide .togetherjs-swatch {
|
|
width: 32px;
|
|
height: 32px;
|
|
background: none repeat scroll 0% 0%
|
|
#000000;
|
|
position: relative;
|
|
float: right;
|
|
right: 10px;
|
|
border-radius: 4px 4px 4px 4px;
|
|
border: 1px solid #cccccc;
|
|
top: 10px;
|
|
}
|
|
.togetherjs .togetherjs-save-settings {
|
|
margin-top: 20px;
|
|
margin-bottom: 0px;
|
|
}
|
|
}
|
|
@media screen and (max-device-width: 480px) and (min-width: 480px) {
|
|
{
|
|
/* #togetherjs-dock.togetherjs-dock-right {
|
|
width: 27% !important;
|
|
}*/
|
|
|
|
}
|
|
.togetherjs-mobile-browser input.togetherjs-self-name {
|
|
width: 95%;
|
|
margin-top: 10px;
|
|
}
|
|
.togetherjs .togetherjs-window {
|
|
width: 100%;
|
|
left: -2px !important;
|
|
top: 50%;
|
|
}
|
|
.togetherjs-mobile-browser #togetherjs-edit-name-window section.togetherjs-buttons {
|
|
width: 99%;
|
|
}
|
|
#togetherjs-confirm-end section.togetherjs-buttons {
|
|
width: 96.6%;
|
|
position: absolute;
|
|
bottom: 0;
|
|
}
|
|
#togetherjs-edit-name-window section.togetherjs-buttons {
|
|
width: 99%;
|
|
}
|
|
input.togetherjs-self-name {
|
|
width: 94%;
|
|
margin-top: 10px;
|
|
}
|
|
#togetherjs-avatar-edit section.togetherjs-buttons {
|
|
width: 95.3%;
|
|
bottom: 0;
|
|
background: #F2F2F2;
|
|
padding: 10px;
|
|
text-align: right;
|
|
border-bottom-right-radius: 4px;
|
|
border-bottom-left-radius: 4px;
|
|
border-top: 1px solid #E1E1E1;
|
|
position: absolute;
|
|
}
|
|
.togetherjs-modal {
|
|
width: 74% !important;
|
|
height: 50% !important;
|
|
margin: 20% 12% !important;
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs .togetherjs-modal {
|
|
width: 76% !important;
|
|
margin-left: 1%;
|
|
height: 94%;
|
|
margin-top: 1%;
|
|
top: 0;
|
|
left: 0;
|
|
height: 41%;
|
|
margin: 20% 11%;
|
|
}
|
|
.togetherjs-modal-wide section.togetherjs-buttons {
|
|
width: 97.4% !important;
|
|
}
|
|
}
|
|
@media screen and (max-device-width: 480px) and (max-width: 480px) {
|
|
.togetherjs .togetherjs-window {
|
|
width: 96%;
|
|
margin-left: 0;
|
|
height: 82%;
|
|
margin-top: 0%;
|
|
z-index: 10003 !important;
|
|
top: 20%;
|
|
left: -2px;
|
|
}
|
|
.togetherjs .togetherjs-window #togetherjs-chat-messages {
|
|
width: 105%;
|
|
}
|
|
.togetherjs .togetherjs-window .togetherjs-close {
|
|
display: none;
|
|
}
|
|
.togetherjs .togetherjs-window #togetherjs-chat-messages {
|
|
height: 62%;
|
|
top: -37px;
|
|
}
|
|
#togetherjs-chat-input-box {
|
|
width: 94% !important;
|
|
bottom: 0px;
|
|
position: fixed;
|
|
}
|
|
.togetherjs-timestamp {
|
|
padding: 8px 15px 0px 10px !important;
|
|
}
|
|
input[type='text'],
|
|
input[type='number'],
|
|
textarea {
|
|
font-size: 16px !important;
|
|
}
|
|
}
|
|
/* We set this class on the <body> element when that last media query won't work
|
|
but we detect in Javascript that the client should be treated as mobile */
|
|
.togetherjs-mobile-browser {
|
|
/*TogetherJS dock*/
|
|
|
|
/*TogetherJS walkthrough*/
|
|
|
|
}
|
|
.togetherjs-mobile-browser #togetherjs-dock.togetherjs-dock-right {
|
|
top: 0px;
|
|
width: auto;
|
|
height: 40px !important;
|
|
right: 0px;
|
|
margin: 10px;
|
|
bottom: 0px;
|
|
}
|
|
.togetherjs-mobile-browser #togetherjs-dock #togetherjs-dock-anchor {
|
|
width: 40px;
|
|
height: 40px;
|
|
float: right;
|
|
user-select: all;
|
|
cursor: default;
|
|
display: inline;
|
|
}
|
|
.togetherjs-mobile-browser #togetherjs-dock #togetherjs-buttons {
|
|
display: inline;
|
|
}
|
|
.togetherjs-mobile-browser #togetherjs-dock .togetherjs-button {
|
|
float: right;
|
|
border-right: 1px solid rgba(0, 0, 0, 0.2);
|
|
border-top: none;
|
|
width: 40px;
|
|
height: 40px;
|
|
background-size: 30px 30px;
|
|
}
|
|
.togetherjs-mobile-browser #togetherjs-dock #togetherjs-profile-arrow {
|
|
display: none;
|
|
}
|
|
.togetherjs-mobile-browser #togetherjs-dock #togetherjs-dock-anchor-horizontal img {
|
|
width: 24px;
|
|
height: 24px;
|
|
padding: 8px;
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs-only-mobile {
|
|
display: block;
|
|
text-align: center;
|
|
/* a.togetherjs-share-link {
|
|
padding: 6px 111px 6px;
|
|
}*/
|
|
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs-not-mobile {
|
|
display: none;
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs .togetherjs-menu-item {
|
|
cursor: pointer;
|
|
margin: 0px -14px 0px;
|
|
padding: 9px;
|
|
border-bottom: 1px solid rgba(0, 0, 0, 0.2);
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs #togetherjs-menu-feedback-button,
|
|
.togetherjs-mobile-browser .togetherjs #togetherjs-menu-update-color-button,
|
|
.togetherjs-mobile-browser .togetherjs #togetherjs-menu-help-button {
|
|
display: none;
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs .togetherjs-menu-item img {
|
|
display: none;
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs .togetherjs-menu-item:first-child {
|
|
display: none;
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs .togetherjs-button .togetherjs-person {
|
|
margin: 0 0 0 5px;
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs .togetherjs-person {
|
|
background-size: 30px 30px;
|
|
height: 26px;
|
|
width: 26px;
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs .togetherjs-person-avatar-swatch {
|
|
margin-left: 12px;
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs .togetherjs-window {
|
|
width: 100%;
|
|
margin-left: 0;
|
|
height: 82%;
|
|
margin-top: 0%;
|
|
z-index: 10003 !important;
|
|
top: 20%;
|
|
left: -2px;
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs .togetherjs-window #togetherjs-chat-messages {
|
|
width: 105%;
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs .togetherjs-window .togetherjs-close {
|
|
display: none;
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs .togetherjs-window #togetherjs-chat-messages {
|
|
height: 62%;
|
|
top: -37px;
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs .togetherjs-subtitle {
|
|
width: 98%;
|
|
margin: 22px 7px;
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs #togetherjs-chat-input-box {
|
|
width: 100%;
|
|
bottom: 0px;
|
|
position: fixed;
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs #togetherjs-chat-input {
|
|
width: 95%;
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs .togetherjs-timestamp {
|
|
padding: 8px 45px 0px 10px;
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs #togetherjs-rtc-not-supported section.togetherjs-buttons {
|
|
display: none;
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs #togetherjs-menu-window section.togetherjs-buttons {
|
|
display: none;
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs .togetherjs-modal {
|
|
width: 94%;
|
|
margin-left: 1%;
|
|
height: 94%;
|
|
margin-top: 1%;
|
|
top: 0;
|
|
left: 0;
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs .togetherjs-window > header {
|
|
margin: -7px;
|
|
padding: 10px;
|
|
}
|
|
.togetherjs-mobile-browser #togetherjs-dock-participants {
|
|
display: none;
|
|
}
|
|
.togetherjs-mobile-browser #togetherjs-confirm-end section.togetherjs-buttons {
|
|
position: fixed;
|
|
bottom: 0;
|
|
width: 92%;
|
|
}
|
|
.togetherjs-mobile-browser #togetherjs-edit-name-window section.togetherjs-buttons {
|
|
position: fixed;
|
|
bottom: 0;
|
|
width: 96%;
|
|
}
|
|
.togetherjs-mobile-browser input.togetherjs-self-name {
|
|
padding: 10px;
|
|
width: 92%;
|
|
margin-top: 10px;
|
|
}
|
|
.togetherjs-mobile-browser #togetherjs-avatar-edit section.togetherjs-buttons {
|
|
position: fixed;
|
|
bottom: 0;
|
|
width: 92%;
|
|
}
|
|
.togetherjs-mobile-browser #togetherjs-avatar-edit .togetherjs-person {
|
|
margin: 30px auto;
|
|
float: none;
|
|
}
|
|
.togetherjs-mobile-browser #togetherjs-avatar-edit #togetherjs-avatar-buttons {
|
|
float: none;
|
|
margin: 0 auto;
|
|
}
|
|
.togetherjs-mobile-browser #togetherjs-window-pointer-right,
|
|
.togetherjs-mobile-browser #togetherjs-window-pointer-left {
|
|
position: fixed;
|
|
width: 10px;
|
|
height: 10px;
|
|
margin-right: -5px;
|
|
margin-top: -5px;
|
|
background: #fff;
|
|
border-right: 1px solid rgba(0, 0, 0, 0.2);
|
|
border-bottom: 1px solid rgba(0, 0, 0, 0.2);
|
|
z-index: 10002;
|
|
box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);
|
|
}
|
|
.togetherjs-mobile-browser #togetherjs-window-pointer-right {
|
|
-moz-transform: rotate(-45deg);
|
|
-webkit-transform: rotate(-45deg);
|
|
}
|
|
.togetherjs-mobile-browser #togetherjs-window-pointer-left {
|
|
-moz-transform: rotate(135deg);
|
|
-webkit-transform: rotate(135deg);
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs .togetherjs-modal section {
|
|
margin: 0px 7px;
|
|
}
|
|
.togetherjs-mobile-browser #togetherjs-walkthrough-progress {
|
|
width: 93%;
|
|
text-align: center;
|
|
position: static;
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs-modal-wide section.togetherjs-buttons {
|
|
width: 93.9%;
|
|
text-align: center !important;
|
|
position: absolute;
|
|
bottom: -17px;
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs-walkthrough-slide p {
|
|
margin: 13px auto;
|
|
width: 100%;
|
|
font-size: 11px;
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs .togetherjs-walkthrough-main-image {
|
|
width: auto;
|
|
height: auto;
|
|
background: rgba(216, 216, 216, 0.1);
|
|
border-radius: 4px;
|
|
border: 1px solid rgba(151, 151, 151, 0.1);
|
|
padding: 10px;
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs .togetherjs-walkthrough-main-image img {
|
|
width: 50%;
|
|
height: auto;
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs #togetherjs-walkthrough-next {
|
|
cursor: pointer;
|
|
width: 19px;
|
|
height: 36px;
|
|
background-repeat: no-repeat;
|
|
background-size: 60% 60%;
|
|
margin-right: 0px;
|
|
margin-top: 28%;
|
|
background-image: url('./images/icn-walkthrough-arrow-r.png');
|
|
float: right;
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs #togetherjs-walkthrough-previous {
|
|
cursor: pointer;
|
|
width: 19px;
|
|
height: 36px;
|
|
background-repeat: no-repeat;
|
|
background-size: 60% 60%;
|
|
margin-top: 28%;
|
|
background-image: url('./images/icn-walkthrough-arrow-l.png');
|
|
float: left;
|
|
margin-left: 0px;
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs .togetherjs-modal .togetherjs-share-link {
|
|
width: 80%;
|
|
font-size: 14px;
|
|
padding: 14px;
|
|
border-radius: 4px;
|
|
border: 1px solid
|
|
#cccccc;
|
|
box-shadow: inset 0 2px 2px rgba(0, 0, 0, 0.1);
|
|
font-family: Monaco;
|
|
margin: 7px 0px;
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs-walkthrough-sendlink {
|
|
top: 44%;
|
|
position: relative;
|
|
padding: 15px;
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs section.togetherjs-walkthrough-slide input.togetherjs-self-name {
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 29%;
|
|
font-size: 14px;
|
|
padding: 6px 6px 6px;
|
|
border-radius: 4px 4px 4px 4px;
|
|
border: 1px solid
|
|
#cccccc;
|
|
box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1) inset;
|
|
font-family: openSansRegular;
|
|
margin: -20px 11px;
|
|
width: 60%;
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs section.togetherjs-walkthrough-slide .togetherjs-walkthrough-main-image .togetherjs-walkthrough-avatar-section {
|
|
margin-top: 15px;
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs .togetherjs-avatar-preview {
|
|
margin: 0 auto;
|
|
float: none;
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs .togetherjs-avatar-upload-input {
|
|
margin: 10px auto;
|
|
float: none;
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs .togetherjs-avatar-upload-input input {
|
|
width: 60%;
|
|
}
|
|
.togetherjs-mobile-browser input.togetherjs-upload-avatar {
|
|
line-height: 0px;
|
|
width: 174px;
|
|
margin-left: 0px;
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs section.togetherjs-walkthrough-slide input.togetherjs-self-name {
|
|
float: left;
|
|
font-size: 14px;
|
|
padding: 6px 6px 6px;
|
|
border-radius: 4px 4px 4px 4px;
|
|
border: 1px solid
|
|
#cccccc;
|
|
box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1) inset;
|
|
font-family: openSansRegular;
|
|
width: 66%;
|
|
position: static;
|
|
margin: 10px 10px;
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs section.togetherjs-walkthrough-slide .togetherjs-swatch {
|
|
width: 32px;
|
|
height: 32px;
|
|
background: none repeat scroll 0% 0%
|
|
#000000;
|
|
position: relative;
|
|
float: right;
|
|
right: 10px;
|
|
border-radius: 4px 4px 4px 4px;
|
|
border: 1px solid #cccccc;
|
|
top: 10px;
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs .togetherjs-save-settings {
|
|
margin-top: 20px;
|
|
margin-bottom: 0px;
|
|
}
|
|
@media (min-width: 480px) {
|
|
.togetherjs-mobile-browser {
|
|
/* #togetherjs-dock.togetherjs-dock-right {
|
|
width: 27% !important;
|
|
}*/
|
|
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs-mobile-browser input.togetherjs-self-name {
|
|
width: 95%;
|
|
margin-top: 10px;
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs .togetherjs-window {
|
|
width: 100%;
|
|
left: -2px !important;
|
|
top: 50%;
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs-mobile-browser #togetherjs-edit-name-window section.togetherjs-buttons {
|
|
width: 99%;
|
|
}
|
|
.togetherjs-mobile-browser #togetherjs-confirm-end section.togetherjs-buttons {
|
|
width: 96.6%;
|
|
position: absolute;
|
|
bottom: 0;
|
|
}
|
|
.togetherjs-mobile-browser #togetherjs-edit-name-window section.togetherjs-buttons {
|
|
width: 99%;
|
|
}
|
|
.togetherjs-mobile-browser input.togetherjs-self-name {
|
|
width: 94%;
|
|
margin-top: 10px;
|
|
}
|
|
.togetherjs-mobile-browser #togetherjs-avatar-edit section.togetherjs-buttons {
|
|
width: 95.3%;
|
|
bottom: 0;
|
|
background: #F2F2F2;
|
|
padding: 10px;
|
|
text-align: right;
|
|
border-bottom-right-radius: 4px;
|
|
border-bottom-left-radius: 4px;
|
|
border-top: 1px solid #E1E1E1;
|
|
position: absolute;
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs-modal {
|
|
width: 74% !important;
|
|
height: 50% !important;
|
|
margin: 20% 12% !important;
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs-mobile-browser .togetherjs .togetherjs-modal {
|
|
width: 76% !important;
|
|
margin-left: 1%;
|
|
height: 94%;
|
|
margin-top: 1%;
|
|
top: 0;
|
|
left: 0;
|
|
height: 41%;
|
|
margin: 20% 11%;
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs-modal-wide section.togetherjs-buttons {
|
|
width: 97.4% !important;
|
|
}
|
|
}
|
|
@media (max-width: 480px) {
|
|
.togetherjs-mobile-browser .togetherjs .togetherjs-window {
|
|
width: 96%;
|
|
margin-left: 0;
|
|
height: 82%;
|
|
margin-top: 0%;
|
|
z-index: 10003 !important;
|
|
top: 20%;
|
|
left: -2px;
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs .togetherjs-window #togetherjs-chat-messages {
|
|
width: 105%;
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs .togetherjs-window .togetherjs-close {
|
|
display: none;
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs .togetherjs-window #togetherjs-chat-messages {
|
|
height: 62%;
|
|
top: -37px;
|
|
}
|
|
.togetherjs-mobile-browser #togetherjs-chat-input-box {
|
|
width: 94% !important;
|
|
bottom: 0px;
|
|
position: fixed;
|
|
}
|
|
.togetherjs-mobile-browser .togetherjs-timestamp {
|
|
padding: 8px 15px 0px 10px !important;
|
|
}
|
|
.togetherjs-mobile-browser input[type='text'],
|
|
.togetherjs-mobile-browser input[type='number'],
|
|
.togetherjs-mobile-browser textarea {
|
|
font-size: 16px !important;
|
|
}
|
|
}
|