.unselectable { -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .cryptpad-toolbar { box-sizing: border-box; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; color: #666; font-weight: bold; display: inline-block; width: 100%; z-index: 9001; } .cryptpad-toolbar a { float: right; } .cryptpad-toolbar div { white-space: normal; } .cryptpad-toolbar div.cryptpad-back { padding: 0; font-weight: bold; cursor: pointer; color: #000; } .cryptpad-toolbar div.cryptpad-lag { float: right; line-height: 26px; margin: 2px 0px 2px 4px; } .cryptpad-toolbar button, .cryptpad-toolbar .rightside-element { height: 26px; padding-right: 5px; padding-left: 5px; margin: 2px; } .cryptpad-toolbar button { background-color: inherit; background-image: linear-gradient(to bottom, #fff, #e4e4e4); border: 1px solid #A6A6A6; border-bottom-color: #979797; border-radius: 3px; } .cryptpad-toolbar button:hover { background-image: linear-gradient(to bottom, #f2f2f2, #ccc); } @media screen and (max-width: 800px) { .cryptpad-toolbar button.userlist { display: none; } } @media screen and (min-width: 801px) { .cryptpad-toolbar button.userlist { display: inline-block; } } @media screen and (max-width: 800px) { .cryptpad-toolbar button.userlist.small { display: inline-block; } } @media screen and (min-width: 801px) { .cryptpad-toolbar button.userlist.small { display: none; } } .cryptpad-toolbar .cryptpad-state { line-height: 30px; /* equivalent to 26px + 2*2px margin used for buttons */ } .cryptpad-toolbar .rightside-button { float: right; cursor: pointer; } .cryptpad-toolbar .leftside-button { cursor: pointer; float: left; } .cryptpad-toolbar .rightside-element { vertical-align: middle; white-space: nowrap; } .cryptpad-toolbar .rightside-element.float { float: right; } .cryptpad-toolbar select { border: 0px; margin-left: 5px; margin-right: 5px; padding-left: 5px; border: 1px solid #A6A6A6; border-bottom-color: #979797; } .cryptpad-toolbar-leftside { float: left; margin-bottom: -1px; } .cryptpad-toolbar-leftside .cryptpad-dropdown-container { position: relative; display: inline-block; padding: 0px; } .cryptpad-toolbar-leftside .cryptpad-dropdown-container .cryptpad-dropdown { z-index: 1000; display: none; position: absolute; background-color: #f9f9f9; min-width: 160px; overflow: auto; box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2); height: auto; padding: 5px; white-space: normal; } .cryptpad-toolbar-leftside .cryptpad-dropdown-container .cryptpad-dropdown p { width: 210px; padding: 0; margin: 0; white-space: normal; } .cryptpad-toolbar-leftside .cryptpad-dropdown-container .cryptpad-dropdown p.cryptpad-dropdown-users { text-align: baseline; } .cryptpad-toolbar-leftside .cryptpad-dropdown-container .cryptpad-dropdown p.cryptpad-dropdown-users .yourself { font-style: italic; } .cryptpad-toolbar-leftside .cryptpad-dropdown-container .cryptpad-dropdown p.cryptpad-dropdown-users .anonymous { font-style: italic; } .cryptpad-toolbar-leftside .cryptpad-dropdown-container .cryptpad-dropdown p h2 { font-weight: bold; text-align: center; background-color: #EEEEEE; padding: 5px 0px; margin: 5px 0px; font-size: 16px; } .cryptpad-toolbar-leftside .cryptpad-dropdown-container .cryptpad-dropdown button { margin: 2px 0px; } .cryptpad-toolbar-leftside button { margin: 2px 4px 2px 0px; } .cryptpad-toolbar-leftside .cryptpad-userbuttons-container { display: none; } .cryptpad-toolbar-rightside { text-align: right; margin-right: 30px; } .cryptpad-spinner { float: left; display: inline-block; height: 26px; margin: 2px; line-height: 26px; font-size: 20px; } .cryptpad-readonly { margin-right: 20px; font-weight: bold; text-transform: uppercase; } .lag { display: inline-block; vertical-align: middle; padding: 0 !important; margin: 0 5px !important; height: 15px !important; width: 15px !important; border-radius: 50%; border: 1px solid #444; } .lag-green { background-color: #46E981; } .lag-red { background-color: #FF0073; } .lag-orange { background-color: #FE9A2E; }