/* The container
- needed to position the dropdown content */ .dropdown-bar { position: relative; display: inline-block; } .dropdown-bar .fa { font-family: FontAwesome; } .dropdown-bar button .fa-caret-down { margin-right: 0px; margin-left: 5px; } .dropdown-bar .dropdown-bar-content { display: none; position: absolute; background-color: #f9f9f9; min-width: 250px; box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.2); z-index: 1000; max-height: 300px; overflow-y: auto; } .dropdown-bar .dropdown-bar-content.left { right: 0; } .dropdown-bar .dropdown-bar-content:hover { display: block; } .dropdown-bar .dropdown-bar-content a { color: black; padding: 5px 16px; text-decoration: none; display: block; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; float: none; text-align: left; } .dropdown-bar .dropdown-bar-content a:hover { background-color: #f1f1f1; color: black; } .dropdown-bar .dropdown-bar-content a.active { background-color: #e8e8e8; color: black; } .dropdown-bar .dropdown-bar-content hr { margin: 5px 0px; height: 1px; background: #bbb; } .dropdown-bar .dropdown-bar-content p { min-width: 160px; padding: 5px; margin: 0; white-space: normal; text-align: left; } .dropdown-bar .dropdown-bar-content p.cryptpad-dropdown-users { text-align: baseline; } .dropdown-bar .dropdown-bar-content p.cryptpad-dropdown-users .yourself, .dropdown-bar .dropdown-bar-content p.cryptpad-dropdown-users .anonymous, .dropdown-bar .dropdown-bar-content p.cryptpad-dropdown-users .viewer { font-style: italic; } .dropdown-bar .dropdown-bar-content p h2 { font-weight: bold; text-align: center; background-color: #EEEEEE; padding: 5px 0px; margin: 5px 0px; font-size: 16px; white-space: normal; } .unselectable { -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .toolbar-container { font: 12px Arial, Helvetica, Tahoma, Verdana, sans-serif; background: -webkit-linear-gradient(#f5f5f5, #DDDDDD); /* For Safari 5.1 to 6.0 */ background: -o-linear-gradient(#f5f5f5, #DDDDDD); /* For Opera 11.1 to 12.0 */ background: -moz-linear-gradient(#f5f5f5, #DDDDDD); /* For Firefox 3.6 to 15 */ background: linear-gradient(#f5f5f5, #DDDDDD); /* Standard syntax */ } .toolbar-container .cryptpad-toolbar select { box-sizing: border-box; } .cke_reset_all * { color: inherit; } .cryptpad-toolbar { box-sizing: border-box; padding: 0px; background-color: #ddd; color: #000; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; font: normal normal normal 12px Arial, Helvetica, Tahoma, Verdana, Sans-Serif; width: 100%; z-index: 9001; } .cryptpad-toolbar.pad { background-color: #1c4fa0; color: #fff; } .cryptpad-toolbar.pad .cryptpad-toolbar-leftside, .cryptpad-toolbar.pad .cryptpad-toolbar-rightside, .cryptpad-toolbar.pad .drawer-content { background-color: #2260c3; } .cryptpad-toolbar.pad .cryptpad-toolbar-leftside button:hover, .cryptpad-toolbar.pad .cryptpad-toolbar-rightside button:hover, .cryptpad-toolbar.pad .drawer-content button:hover { background-color: #1c4fa0; } .cryptpad-toolbar.pad .hoverable:hover .editable { cursor: text; border: 1px solid #2e71da; background: #143a75; color: #fff; } .cryptpad-toolbar.pad .hoverable:hover .pencilIcon { border: 1px solid #2e71da; background: #143a75; color: #fff; } .cryptpad-toolbar.pad .hoverable:hover .pencilIcon:hover { background: #18448a; } .cryptpad-toolbar.pad .saveIcon { border: 1px solid #2e71da; background: #143a75; color: #fff; } .cryptpad-toolbar.pad .saveIcon:hover { background: #18448a; } .cryptpad-toolbar.pad input { border: 1px solid #2e71da; background: #143a75; color: #fff; } .cryptpad-toolbar.pad .dropdown-bar-content { background: #18448a; border: 1px solid #fff; color: #fff; } .cryptpad-toolbar.pad .dropdown-bar-content a { color: #fff; } .cryptpad-toolbar.pad .dropdown-bar-content a.active { background-color: #143a75; color: #fff; } .cryptpad-toolbar.pad .dropdown-bar-content a:hover { background-color: #1c4fa0; color: #fff; } .cryptpad-toolbar.pad .dropdown-bar-content hr { background-color: #112f5f; } .cryptpad-toolbar.pad .dropdown-bar-content p h2 { background-color: #143a75; } .cryptpad-toolbar.pad .dropdown-bar-content p .accountData { background-color: #1c4fa0; } .cryptpad-toolbar.code { background-color: #ffae00; color: #000; } .cryptpad-toolbar.code .cryptpad-toolbar-leftside, .cryptpad-toolbar.code .cryptpad-toolbar-rightside, .cryptpad-toolbar.code .drawer-content { background-color: #ffbb29; } .cryptpad-toolbar.code .cryptpad-toolbar-leftside button:hover, .cryptpad-toolbar.code .cryptpad-toolbar-rightside button:hover, .cryptpad-toolbar.code .drawer-content button:hover { background-color: #ffae00; } .cryptpad-toolbar.code .hoverable:hover .editable { cursor: text; border: 1px solid #ffc64d; background: #cc8b00; color: #000; } .cryptpad-toolbar.code .hoverable:hover .pencilIcon { border: 1px solid #ffc64d; background: #cc8b00; color: #000; } .cryptpad-toolbar.code .hoverable:hover .pencilIcon:hover { background: #e69d00; } .cryptpad-toolbar.code .saveIcon { border: 1px solid #ffc64d; background: #cc8b00; color: #000; } .cryptpad-toolbar.code .saveIcon:hover { background: #e69d00; } .cryptpad-toolbar.code input { border: 1px solid #ffc64d; background: #cc8b00; color: #000; } .cryptpad-toolbar.code .dropdown-bar-content { background: #e69d00; border: 1px solid #000; color: #000; } .cryptpad-toolbar.code .dropdown-bar-content a { color: #000; } .cryptpad-toolbar.code .dropdown-bar-content a.active { background-color: #cc8b00; color: #000; } .cryptpad-toolbar.code .dropdown-bar-content a:hover { background-color: #ffae00; color: #000; } .cryptpad-toolbar.code .dropdown-bar-content hr { background-color: #b37a00; } .cryptpad-toolbar.code .dropdown-bar-content p h2 { background-color: #cc8b00; } .cryptpad-toolbar.code .dropdown-bar-content p .accountData { background-color: #ffae00; } .cryptpad-toolbar.slide { background-color: #e57614; color: #fff; } .cryptpad-toolbar.slide .cryptpad-toolbar-leftside, .cryptpad-toolbar.slide .cryptpad-toolbar-rightside, .cryptpad-toolbar.slide .drawer-content { background-color: #ed8b34; } .cryptpad-toolbar.slide .cryptpad-toolbar-leftside button:hover, .cryptpad-toolbar.slide .cryptpad-toolbar-rightside button:hover, .cryptpad-toolbar.slide .drawer-content button:hover { background-color: #e57614; } .cryptpad-toolbar.slide .hoverable:hover .editable { cursor: text; border: 1px solid #f09e55; background: #b65e10; color: #fff; } .cryptpad-toolbar.slide .hoverable:hover .pencilIcon { border: 1px solid #f09e55; background: #b65e10; color: #fff; } .cryptpad-toolbar.slide .hoverable:hover .pencilIcon:hover { background: #ce6a12; } .cryptpad-toolbar.slide .saveIcon { border: 1px solid #f09e55; background: #b65e10; color: #fff; } .cryptpad-toolbar.slide .saveIcon:hover { background: #ce6a12; } .cryptpad-toolbar.slide input { border: 1px solid #f09e55; background: #b65e10; color: #fff; } .cryptpad-toolbar.slide .dropdown-bar-content { background: #ce6a12; border: 1px solid #fff; color: #fff; } .cryptpad-toolbar.slide .dropdown-bar-content a { color: #fff; } .cryptpad-toolbar.slide .dropdown-bar-content a.active { background-color: #b65e10; color: #fff; } .cryptpad-toolbar.slide .dropdown-bar-content a:hover { background-color: #e57614; color: #fff; } .cryptpad-toolbar.slide .dropdown-bar-content hr { background-color: #9f520e; } .cryptpad-toolbar.slide .dropdown-bar-content p h2 { background-color: #b65e10; } .cryptpad-toolbar.slide .dropdown-bar-content p .accountData { background-color: #e57614; } .cryptpad-toolbar.poll { background-color: #006304; color: #fff; } .cryptpad-toolbar.poll .cryptpad-toolbar-leftside, .cryptpad-toolbar.poll .cryptpad-toolbar-rightside, .cryptpad-toolbar.poll .drawer-content { background-color: #008c06; } .cryptpad-toolbar.poll .cryptpad-toolbar-leftside button:hover, .cryptpad-toolbar.poll .cryptpad-toolbar-rightside button:hover, .cryptpad-toolbar.poll .drawer-content button:hover { background-color: #006304; } .cryptpad-toolbar.poll .hoverable:hover .editable { cursor: text; border: 1px solid #00b007; background: #003002; color: #fff; } .cryptpad-toolbar.poll .hoverable:hover .pencilIcon { border: 1px solid #00b007; background: #003002; color: #fff; } .cryptpad-toolbar.poll .hoverable:hover .pencilIcon:hover { background: #004a03; } .cryptpad-toolbar.poll .saveIcon { border: 1px solid #00b007; background: #003002; color: #fff; } .cryptpad-toolbar.poll .saveIcon:hover { background: #004a03; } .cryptpad-toolbar.poll input { border: 1px solid #00b007; background: #003002; color: #fff; } .cryptpad-toolbar.poll .dropdown-bar-content { background: #004a03; border: 1px solid #fff; color: #fff; } .cryptpad-toolbar.poll .dropdown-bar-content a { color: #fff; } .cryptpad-toolbar.poll .dropdown-bar-content a.active { background-color: #003002; color: #fff; } .cryptpad-toolbar.poll .dropdown-bar-content a:hover { background-color: #006304; color: #fff; } .cryptpad-toolbar.poll .dropdown-bar-content hr { background-color: #001701; } .cryptpad-toolbar.poll .dropdown-bar-content p h2 { background-color: #003002; } .cryptpad-toolbar.poll .dropdown-bar-content p .accountData { background-color: #006304; } .cryptpad-toolbar.whiteboard { background-color: #800080; color: #fff; } .cryptpad-toolbar.whiteboard .cryptpad-toolbar-leftside, .cryptpad-toolbar.whiteboard .cryptpad-toolbar-rightside, .cryptpad-toolbar.whiteboard .drawer-content { background-color: #a900a9; } .cryptpad-toolbar.whiteboard .cryptpad-toolbar-leftside button:hover, .cryptpad-toolbar.whiteboard .cryptpad-toolbar-rightside button:hover, .cryptpad-toolbar.whiteboard .drawer-content button:hover { background-color: #800080; } .cryptpad-toolbar.whiteboard .hoverable:hover .editable { cursor: text; border: 1px solid #cd00cc; background: #4d004d; color: #fff; } .cryptpad-toolbar.whiteboard .hoverable:hover .pencilIcon { border: 1px solid #cd00cc; background: #4d004d; color: #fff; } .cryptpad-toolbar.whiteboard .hoverable:hover .pencilIcon:hover { background: #670066; } .cryptpad-toolbar.whiteboard .saveIcon { border: 1px solid #cd00cc; background: #4d004d; color: #fff; } .cryptpad-toolbar.whiteboard .saveIcon:hover { background: #670066; } .cryptpad-toolbar.whiteboard input { border: 1px solid #cd00cc; background: #4d004d; color: #fff; } .cryptpad-toolbar.whiteboard .dropdown-bar-content { background: #670066; border: 1px solid #fff; color: #fff; } .cryptpad-toolbar.whiteboard .dropdown-bar-content a { color: #fff; } .cryptpad-toolbar.whiteboard .dropdown-bar-content a.active { background-color: #4d004d; color: #fff; } .cryptpad-toolbar.whiteboard .dropdown-bar-content a:hover { background-color: #800080; color: #fff; } .cryptpad-toolbar.whiteboard .dropdown-bar-content hr { background-color: #340033; } .cryptpad-toolbar.whiteboard .dropdown-bar-content p h2 { background-color: #4d004d; } .cryptpad-toolbar.whiteboard .dropdown-bar-content p .accountData { background-color: #800080; } .cryptpad-toolbar.drive { background-color: #0087ff; color: #fff; } .cryptpad-toolbar.drive .cryptpad-toolbar-leftside, .cryptpad-toolbar.drive .cryptpad-toolbar-rightside, .cryptpad-toolbar.drive .drawer-content { background-color: #299aff; } .cryptpad-toolbar.drive .cryptpad-toolbar-leftside button:hover, .cryptpad-toolbar.drive .cryptpad-toolbar-rightside button:hover, .cryptpad-toolbar.drive .drawer-content button:hover { background-color: #0087ff; } .cryptpad-toolbar.drive .hoverable:hover .editable { cursor: text; border: 1px solid #4dabff; background: #006ccc; color: #fff; } .cryptpad-toolbar.drive .hoverable:hover .pencilIcon { border: 1px solid #4dabff; background: #006ccc; color: #fff; } .cryptpad-toolbar.drive .hoverable:hover .pencilIcon:hover { background: #0079e6; } .cryptpad-toolbar.drive .saveIcon { border: 1px solid #4dabff; background: #006ccc; color: #fff; } .cryptpad-toolbar.drive .saveIcon:hover { background: #0079e6; } .cryptpad-toolbar.drive input { border: 1px solid #4dabff; background: #006ccc; color: #fff; } .cryptpad-toolbar.drive .dropdown-bar-content { background: #0079e6; border: 1px solid #fff; color: #fff; } .cryptpad-toolbar.drive .dropdown-bar-content a { color: #fff; } .cryptpad-toolbar.drive .dropdown-bar-content a.active { background-color: #006ccc; color: #fff; } .cryptpad-toolbar.drive .dropdown-bar-content a:hover { background-color: #0087ff; color: #fff; } .cryptpad-toolbar.drive .dropdown-bar-content hr { background-color: #005eb3; } .cryptpad-toolbar.drive .dropdown-bar-content p h2 { background-color: #006ccc; } .cryptpad-toolbar.drive .dropdown-bar-content p .accountData { background-color: #0087ff; } .cryptpad-toolbar.file { background-color: #cd2532; color: #fff; } .cryptpad-toolbar.file .cryptpad-toolbar-leftside, .cryptpad-toolbar.file .cryptpad-toolbar-rightside, .cryptpad-toolbar.file .drawer-content { background-color: #dc3f4b; } .cryptpad-toolbar.file .cryptpad-toolbar-leftside button:hover, .cryptpad-toolbar.file .cryptpad-toolbar-rightside button:hover, .cryptpad-toolbar.file .drawer-content button:hover { background-color: #cd2532; } .cryptpad-toolbar.file .hoverable:hover .editable { cursor: text; border: 1px solid #e25d67; background: #a21d27; color: #fff; } .cryptpad-toolbar.file .hoverable:hover .pencilIcon { border: 1px solid #e25d67; background: #a21d27; color: #fff; } .cryptpad-toolbar.file .hoverable:hover .pencilIcon:hover { background: #b7212d; } .cryptpad-toolbar.file .saveIcon { border: 1px solid #e25d67; background: #a21d27; color: #fff; } .cryptpad-toolbar.file .saveIcon:hover { background: #b7212d; } .cryptpad-toolbar.file input { border: 1px solid #e25d67; background: #a21d27; color: #fff; } .cryptpad-toolbar.file .dropdown-bar-content { background: #b7212d; border: 1px solid #fff; color: #fff; } .cryptpad-toolbar.file .dropdown-bar-content a { color: #fff; } .cryptpad-toolbar.file .dropdown-bar-content a.active { background-color: #a21d27; color: #fff; } .cryptpad-toolbar.file .dropdown-bar-content a:hover { background-color: #cd2532; color: #fff; } .cryptpad-toolbar.file .dropdown-bar-content hr { background-color: #8c1922; } .cryptpad-toolbar.file .dropdown-bar-content p h2 { background-color: #a21d27; } .cryptpad-toolbar.file .dropdown-bar-content p .accountData { background-color: #cd2532; } .cryptpad-toolbar .fa { font: normal normal normal 14px/1 FontAwesome; font-family: FontAwesome; } .cryptpad-toolbar a { float: right; } .cryptpad-toolbar .dropdown-bar { height: 100%; display: inline-block; } .cryptpad-toolbar .dropdown-bar button { height: 100%; border-radius: 0; margin: 0; background: transparent; } .cryptpad-toolbar .dropdown-bar .dropdown-bar-content { line-height: 14px; } .cryptpad-toolbar .separator { content: ''; display: inline-block; background: #888; margin: 7px 4px; height: 18px; width: 1px; vertical-align: top; } .cryptpad-toolbar .separator:last-child { display: none; } .cryptpad-toolbar button { -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; border: 1px solid transparent; border-radius: .25rem; color: inherit; font: 12px Ubuntu, Arial, sans-serif; } .cryptpad-toolbar button#shareButton, .cryptpad-toolbar button.buttonSuccess { color: #fff; background: #5cb85c; border-color: #5cb85c; } .cryptpad-toolbar button#shareButton:hover, .cryptpad-toolbar button.buttonSuccess:hover { color: #fff; background: #449d44; border: 1px solid #419641; } .cryptpad-toolbar button#shareButton span, .cryptpad-toolbar button.buttonSuccess span { color: #fff; } .cryptpad-toolbar button#shareButton .large, .cryptpad-toolbar button.buttonSuccess .large { margin-left: 5px; } .cryptpad-toolbar button#newdoc, .cryptpad-toolbar button.buttonPrimary { color: #fff; background: #0275d8; border-color: #0275d8; } .cryptpad-toolbar button#newdoc:hover, .cryptpad-toolbar button.buttonPrimary:hover { color: #fff; background: #025aa5; border: 1px solid #01549b; } .cryptpad-toolbar button#newdoc span, .cryptpad-toolbar button.buttonPrimary span { color: #fff; } .cryptpad-toolbar button#newdoc .large, .cryptpad-toolbar button.buttonPrimary .large { margin-left: 5px; } .cryptpad-toolbar button.hidden { display: none; } .cryptpad-toolbar button * { color: inherit; font: 12px Ubuntu, Arial, sans-serif; } .cryptpad-toolbar .cryptpad-toolbar-rightside button, .cryptpad-toolbar .cryptpad-toolbar-leftside button { background: transparent; } .cryptpad-toolbar .cryptpad-toolbar-rightside button:hover, .cryptpad-toolbar .cryptpad-toolbar-leftside button:hover { background-color: rgba(50, 50, 50, 0.3); border-color: #adadad; } .cryptpad-toolbar button.upgrade { font-size: 14px; vertical-align: top; margin-left: 10px; } .cryptpad-toolbar .cryptpad-limit { box-sizing: border-box; height: 26px; width: 26px; display: inline-block; padding: 3px; margin: 0px; margin-right: 3px; vertical-align: middle; } .cryptpad-toolbar .cryptpad-limit span { color: red; cursor: pointer; margin: auto; font-size: 20px; } .cryptpad-toolbar .cryptpad-state { line-height: 64px; } .cryptpad-toolbar .cryptpad-lag { display: inline-block; vertical-align: top; box-sizing: content-box; text-align: center; line-height: 64px; } .cryptpad-toolbar .cryptpad-lag .disconnected { display: none; color: inherit; width: 28px; margin: 8px; font-size: 28px; text-align: center; vertical-align: middle; } .cryptpad-toolbar .cryptpad-lag .bars { margin: 8px; height: 26px; line-height: 26px; display: inline-block; } .cryptpad-toolbar .cryptpad-lag .bars span { display: inline-block; width: 6px; margin: 0; margin-right: 1px; background: white; vertical-align: bottom; box-sizing: border-box; border: 1px solid black; visibility: hidden; transition: background 1s, border 1s; } .cryptpad-toolbar .cryptpad-lag .bars span:last-child { margin-right: 0; } .cryptpad-toolbar .cryptpad-lag .bars span.bar1 { height: 6px; } .cryptpad-toolbar .cryptpad-lag .bars span.bar2 { height: 12px; } .cryptpad-toolbar .cryptpad-lag .bars span.bar3 { height: 18px; } .cryptpad-toolbar .cryptpad-lag .bars span.bar4 { height: 24px; } .cryptpad-toolbar .cryptpad-lag.dc .disconnected { display: inline; } .cryptpad-toolbar .cryptpad-lag.dc .bars { display: none; } .cryptpad-toolbar .cryptpad-lag.lag0 span span { background: transparent; } .cryptpad-toolbar .cryptpad-lag.lag1 .bar2, .cryptpad-toolbar .cryptpad-lag.lag1 .bar3, .cryptpad-toolbar .cryptpad-lag.lag1 .bar4 { background: transparent; } .cryptpad-toolbar .cryptpad-lag.lag1 span span { visibility: visible; } .cryptpad-toolbar .cryptpad-lag.lag2 .bar3, .cryptpad-toolbar .cryptpad-lag.lag2 .bar4 { background: transparent; } .cryptpad-toolbar .cryptpad-lag.lag2 span span { visibility: visible; } .cryptpad-toolbar .cryptpad-lag.lag3 .bar4 { background: transparent; } .cryptpad-toolbar .cryptpad-lag.lag3 span span { visibility: visible; } .cryptpad-toolbar .cryptpad-lag.lag4 span span { visibility: visible; } .cryptpad-toolbar div { white-space: normal; } .cryptpad-toolbar div.cryptpad-back { padding: 0; font-weight: bold; cursor: pointer; color: #000; } .cryptpad-toolbar button, .cryptpad-toolbar select, .cryptpad-toolbar .rightside-element { height: 26px; padding-right: 5px; padding-left: 5px; margin: 3px 2px; box-sizing: border-box; } .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; vertical-align: top; box-sizing: content-box; } .cryptpad-toolbar select option { height: 24px; } @media screen and (max-width: 800px) { .cryptpad-toolbar .big { display: none; } } @media screen and (min-width: 801px) { .cryptpad-toolbar .big { display: inline-block; } } @media screen and (max-width: 800px) { .cryptpad-toolbar .small { display: inline-block; } } @media screen and (min-width: 801px) { .cryptpad-toolbar .small { display: none; } } @media screen and (max-width: 600px) { .cryptpad-toolbar .med-big { display: none; } } @media screen and (min-width: 601px) { .cryptpad-toolbar .med-big { display: inline-block; } } @media screen and (max-width: 600px) { .cryptpad-toolbar .med-small { display: inline-block; } } @media screen and (min-width: 601px) { .cryptpad-toolbar .med-small { display: none; } } @media screen and (max-width: 400px) { .cryptpad-toolbar .large { display: none; } } @media screen and (min-width: 401px) { .cryptpad-toolbar .large { display: inline-block; } } @media screen and (max-width: 400px) { .cryptpad-toolbar .narrow { display: inline-block; } } @media screen and (min-width: 401px) { .cryptpad-toolbar .narrow { display: none; } } .cryptpad-toolbar:not(.notitle) { /*.cryptpad-toolbar-top { @media screen and (max-width: @media-medium-screen) { height: 67px; } .cryptpad-link, .cryptpad-user { @media screen and (max-width: @media-medium-screen) { top: 35px; } @media screen and (min-width: (@media-medium-screen + 1px)) { top: 0px; } } }*/ } .cryptpad-toolbar-top { display: flex; flex-flow: row; height: 64px; position: relative; } .cryptpad-toolbar-top .filler { height: 100%; display: inline-block; order: 4; flex: 1; } .cryptpad-toolbar-top .cryptpad-title { order: 3; height: 100%; display: inline-block; line-height: 64px; margin-left: 20px; } .cryptpad-toolbar-top .cryptpad-title .title, .cryptpad-toolbar-top .cryptpad-title .pencilIcon, .cryptpad-toolbar-top .cryptpad-title .saveIcon { font-size: 25px; vertical-align: middle; line-height: 25px; } .cryptpad-toolbar-top .cryptpad-title .pencilIcon { cursor: pointer; border: 1px solid transparent; border-radius: 0px 2px 2px 0px; padding: 5px; border-collapse: collapse; } .cryptpad-toolbar-top .cryptpad-title .pencilIcon span { font-size: 25px; cursor: pointer; } .cryptpad-toolbar-top .cryptpad-title .saveIcon { cursor: pointer; border-radius: 0px 2px 2px 0px; padding: 5px; border-collapse: collapse; } .cryptpad-toolbar-top .cryptpad-title .saveIcon span { font-size: 25px; cursor: pointer; } .cryptpad-toolbar-top .cryptpad-title .editable { border: 1px solid transparent; border-radius: 2px 0px 0px 2px; padding: 5px; border-collapse: collapse; } .cryptpad-toolbar-top .cryptpad-title input { font-size: 1.5em; vertical-align: middle; box-sizing: border-box; cursor: auto; width: 300px; font-size: 25px; padding: 5px 5px; height: 40px; } .cryptpad-toolbar-top .cryptpad-link, .cryptpad-toolbar-top .cryptpad-new { font-size: 48px; line-height: 64px; width: 64px; height: 64px; padding: 0; box-sizing: border-box; display: inline-block; color: white; transition: all 0.15s; } .cryptpad-toolbar-top .cryptpad-new { background-color: rgba(0, 0, 0, 0.2); order: 2; text-align: center; } .cryptpad-toolbar-top .cryptpad-new:hover { background-color: rgba(0, 0, 0, 0.3); } .cryptpad-toolbar-top .cryptpad-new > button { display: flex; align-items: center; justify-content: center; width: 64px; height: 64px !important; font-size: 1em; color: inherit; height: auto; padding: 0px; margin: 0; } .cryptpad-toolbar-top .cryptpad-new > button::before { padding-top: 4px; } .cryptpad-toolbar-top .cryptpad-new > button:hover { background-color: initial; border-color: transparent; } .cryptpad-toolbar-top .cryptpad-new > button span { vertical-align: top; font-size: 1em; text-decoration: none; color: inherit; } .cryptpad-toolbar-top .cryptpad-new .dropdown-bar-content { font-size: 12px; line-height: 14px; } .cryptpad-toolbar-top .cryptpad-link { display: inline-flex; align-items: center; justify-content: center; cursor: pointer; background-color: rgba(0, 0, 0, 0.4); order: 1; } .cryptpad-toolbar-top .cryptpad-link:hover { background-color: rgba(0, 0, 0, 0.5); } .cryptpad-toolbar-top .cryptpad-link .fa { margin: 0; } .cryptpad-toolbar-top .cryptpad-link a.cryptpad-logo { cursor: pointer; font-size: 1em; height: auto; padding: 0px 5px; text-decoration: none; color: inherit; } .cryptpad-toolbar-top .cryptpad-user { height: 100%; display: inline-block; order: 5; line-height: 64px; } .cryptpad-toolbar-top .cryptpad-user > * { display: inline-block; height: 100%; vertical-align: top; } .cryptpad-toolbar-top .cryptpad-user .cryptpad-upgrade { height: 32px; vertical-align: middle; cursor: pointer; } .cryptpad-toolbar-top .cryptpad-user .cryptpad-user-dropdown { margin-left: 20px; height: 64px; width: 64px; padding: 0px; box-sizing: border-box; text-align: center; background-color: rgba(0, 0, 0, 0.3); } .cryptpad-toolbar-top .cryptpad-user .cryptpad-user-dropdown:hover { background-color: rgba(0, 0, 0, 0.4); } .cryptpad-toolbar-top .cryptpad-user .cryptpad-user-dropdown .dropdown-bar-content { margin: 0; } .cryptpad-toolbar-top .cryptpad-user .cryptpad-user-dropdown button { display: flex; justify-content: center; align-items: center; height: 64px; width: 64px; padding: 0; } .cryptpad-toolbar-top .cryptpad-user .cryptpad-user-dropdown button span { font-size: 32px; } .cryptpad-toolbar-top .cryptpad-user .cryptpad-user-dropdown button span .fa { margin-left: 3px; } .cryptpad-toolbar-leftside { height: 32px; float: left; margin-bottom: -1px; } .cryptpad-toolbar-leftside .cryptpad-dropdown-users pre { /* needed for ckeditor */ white-space: pre; margin: 5px 0px; } .cryptpad-toolbar-leftside button { margin: 2px 4px 2px 0px; } .cryptpad-toolbar-leftside .dropdown-bar-content { margin-top: -1px; } .cryptpad-toolbar-rightside { height: 32px; text-align: right; } .cryptpad-toolbar-rightside > button { height: 100%; margin: 0; border-radius: 0; padding: 0 10px; } .cryptpad-toolbar-rightside .drawer-content:empty ~ .drawer-button { display: none; } .cryptpad-toolbar-rightside .drawer-content { position: absolute; right: 0px; top: 96px; min-width: 50px; background: white; border: 1px solid black; display: flex; flex-flow: column; z-index: 1000; } .cryptpad-toolbar-rightside .drawer-content > span { box-sizing: border-box; width: 150px; height: 26px; border-radius: 0; border: 0; } .cryptpad-toolbar-rightside .drawer-content > span:not(:last-child) { border-bottom: 1px solid rgba(0, 0, 0, 0.2); } .cryptpad-toolbar-rightside .drawer-content > span button { border: 0; } .cryptpad-toolbar-rightside .drawer-content button { width: 100%; } .cryptpad-toolbar-rightside .drawer-content > button { text-align: center; margin: 0; border-radius: 0; border: 1px solid transparent; } .cryptpad-toolbar-rightside .drawer-content > button:hover { border: 1px solid transparent; } .cryptpad-toolbar-rightside .drawer-content > button:not(:last-child) { border-bottom: 1px solid rgba(0, 0, 0, 0.2); } .cryptpad-toolbar-history { display: none; text-align: center; } .cryptpad-toolbar-history .next { display: inline-block; vertical-align: middle; margin: 20px; } .cryptpad-toolbar-history .previous { display: inline-block; vertical-align: middle; margin: 20px; } .cryptpad-toolbar-history .goto { display: inline-block; vertical-align: middle; text-align: center; } .cryptpad-toolbar-history .goto input { width: 75px; } .cryptpad-toolbar-history .gotoInput { vertical-align: middle; } .cke_toolbox .cryptpad-toolbar-history input.gotoInput { background: white; height: 20px; padding: 3px 3px; border-radius: 5px; } .cryptpad-spinner { line-height: 64px; } .cryptpad-spinner > span { height: 16px; width: 16px; margin: 8px; line-height: 16px; font-size: 16px; text-align: center; } .cryptpad-readonly { margin-right: 5px; font-weight: bold; text-transform: uppercase; } .cryptpad-user p.accountData > span { font-weight: bold; } .cryptpad-user p.accountData > span span { font-weight: normal; } .cryptpad-dropdown-share a .fa { margin-right: 5px; } .lag { height: 15px !important; width: 15px !important; border-radius: 50%; border: 1px solid #444; } .lag-green { background-color: #46E981; } .lag-red { background-color: #FA5858; } .lag-orange { background-color: #FE9A2E; }