.yasqe { position: relative; /* BASICS */ /* PADDING */ /* GUTTER */ /* CURSOR */ /* Shown when moving in bi-directional text */ /* Can style cursor different in overwrite (non-insert) mode */ /* DEFAULT THEME */ /* Default styles for common addons */ /* STOP */ /* The rest of this file contains styles related to the mechanics of the editor. You probably shouldn't touch them. */ /* The fake, visible scrollbars. Used to force redraw during scrolling before actuall scrolling happens, thus preventing shaking and flickering artifacts. */ /* IE7 hack to prevent it from returning funny offsetTops on the spans */ /* Used to force a border model for a node */ /* See issue #2901 */ /* Help users use markselection to safely style text background */ } .yasqe .CodeMirror { /* Set height, width, borders, and global font properties here */ font-family: monospace; height: 300px; } .yasqe .CodeMirror-lines { padding: 4px 0; /* Vertical padding around content */ } .yasqe .CodeMirror pre { padding: 0 4px; /* Horizontal padding of content */ } .yasqe .CodeMirror-scrollbar-filler, .yasqe .CodeMirror-gutter-filler { background-color: white; /* The little square between H and V scrollbars */ } .yasqe .CodeMirror-gutters { border-right: 1px solid #ddd; background-color: #f7f7f7; white-space: nowrap; } .yasqe .CodeMirror-linenumber { padding: 0 3px 0 5px; min-width: 20px; text-align: right; color: #999; box-sizing: content-box; } .yasqe .CodeMirror-guttermarker { color: black; } .yasqe .CodeMirror-guttermarker-subtle { color: #999; } .yasqe .CodeMirror div.CodeMirror-cursor { border-left: 1px solid black; } .yasqe .CodeMirror div.CodeMirror-secondarycursor { border-left: 1px solid silver; } .yasqe .CodeMirror.cm-fat-cursor div.CodeMirror-cursor { width: auto; border: 0; background: #7e7; } .yasqe .CodeMirror.cm-fat-cursor div.CodeMirror-cursors { z-index: 1; } .yasqe .cm-animate-fat-cursor { width: auto; border: 0; -webkit-animation: blink 1.06s steps(1) infinite; animation: blink 1.06s steps(1) infinite; } @-webkit-keyframes blink { 0% { background: #7e7; } 50% { background: none; } 100% { background: #7e7; } } @keyframes blink { 0% { background: #7e7; } 50% { background: none; } 100% { background: #7e7; } } .yasqe .cm-tab { display: inline-block; text-decoration: inherit; } .yasqe .CodeMirror-ruler { border-left: 1px solid #ccc; position: absolute; } .yasqe .cm-s-default .cm-keyword { color: #708; } .yasqe .cm-s-default .cm-atom { color: #219; } .yasqe .cm-s-default .cm-number { color: #164; } .yasqe .cm-s-default .cm-def { color: #00f; } .yasqe .cm-s-default .cm-variable-2 { color: #05a; } .yasqe .cm-s-default .cm-variable-3 { color: #085; } .yasqe .cm-s-default .cm-comment { color: #a50; } .yasqe .cm-s-default .cm-string { color: #a11; } .yasqe .cm-s-default .cm-string-2 { color: #f50; } .yasqe .cm-s-default .cm-meta { color: #555; } .yasqe .cm-s-default .cm-qualifier { color: #555; } .yasqe .cm-s-default .cm-builtin { color: #30a; } .yasqe .cm-s-default .cm-bracket { color: #997; } .yasqe .cm-s-default .cm-tag { color: #170; } .yasqe .cm-s-default .cm-attribute { color: #00c; } .yasqe .cm-s-default .cm-header { color: blue; } .yasqe .cm-s-default .cm-quote { color: #090; } .yasqe .cm-s-default .cm-hr { color: #999; } .yasqe .cm-s-default .cm-link { color: #00c; } .yasqe .cm-negative { color: #d44; } .yasqe .cm-positive { color: #292; } .yasqe .cm-header, .yasqe .cm-strong { font-weight: bold; } .yasqe .cm-em { font-style: italic; } .yasqe .cm-link { text-decoration: underline; } .yasqe .cm-strikethrough { text-decoration: line-through; } .yasqe .cm-s-default .cm-error { color: #f00; } .yasqe .cm-invalidchar { color: #f00; } .yasqe div.CodeMirror span.CodeMirror-matchingbracket { color: #0f0; } .yasqe div.CodeMirror span.CodeMirror-nonmatchingbracket { color: #f22; } .yasqe .CodeMirror-matchingtag { background: rgba(255, 150, 0, 0.3); } .yasqe .CodeMirror-activeline-background { background: #e8f2ff; } .yasqe .CodeMirror { line-height: 1; position: relative; overflow: hidden; background: white; color: black; } .yasqe .CodeMirror-scroll { overflow: scroll !important; /* Things will break if this is overridden */ /* 30px is the magic margin used to hide the element's real scrollbars */ /* See overflow: hidden in .CodeMirror */ margin-bottom: -30px; margin-right: -30px; padding-bottom: 30px; height: 100%; outline: none; /* Prevent dragging from highlighting the element */ position: relative; box-sizing: content-box; } .yasqe .CodeMirror-sizer { position: relative; border-right: 30px solid transparent; box-sizing: content-box; } .yasqe .CodeMirror-vscrollbar, .yasqe .CodeMirror-hscrollbar, .yasqe .CodeMirror-scrollbar-filler, .yasqe .CodeMirror-gutter-filler { position: absolute; z-index: 6; display: none; } .yasqe .CodeMirror-vscrollbar { right: 0; top: 0; overflow-x: hidden; overflow-y: scroll; } .yasqe .CodeMirror-hscrollbar { bottom: 0; left: 0; overflow-y: hidden; overflow-x: scroll; } .yasqe .CodeMirror-scrollbar-filler { right: 0; bottom: 0; } .yasqe .CodeMirror-gutter-filler { left: 0; bottom: 0; } .yasqe .CodeMirror-gutters { position: absolute; left: 0; top: 0; z-index: 3; } .yasqe .CodeMirror-gutter { white-space: normal; height: 100%; box-sizing: content-box; display: inline-block; margin-bottom: -30px; /* Hack to make IE7 behave */ *zoom: 1; *display: inline; } .yasqe .CodeMirror-gutter-wrapper { position: absolute; z-index: 4; height: 100%; } .yasqe .CodeMirror-gutter-elt { position: absolute; cursor: default; z-index: 4; } .yasqe .CodeMirror-lines { cursor: text; min-height: 1px; /* prevents collapsing before first draw */ } .yasqe .CodeMirror pre { /* Reset some styles that the rest of the page might have set */ border-radius: 0; border-width: 0; background: transparent; font-family: inherit; font-size: inherit; margin: 0; white-space: pre; word-wrap: normal; line-height: inherit; color: inherit; z-index: 2; position: relative; overflow: visible; } .yasqe .CodeMirror-wrap pre { word-wrap: break-word; white-space: pre-wrap; word-break: normal; } .yasqe .CodeMirror-linebackground { position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: 0; } .yasqe .CodeMirror-linewidget { position: relative; z-index: 2; overflow: auto; } .yasqe .CodeMirror-measure { position: absolute; width: 100%; height: 0; overflow: hidden; visibility: hidden; } .yasqe .CodeMirror-measure pre { position: static; } .yasqe .CodeMirror div.CodeMirror-cursor { position: absolute; border-right: none; width: 0; } .yasqe div.CodeMirror-cursors { visibility: hidden; position: relative; z-index: 3; } .yasqe .CodeMirror-focused div.CodeMirror-cursors { visibility: visible; } .yasqe .CodeMirror-selected { background: #d9d9d9; } .yasqe .CodeMirror-focused .CodeMirror-selected { background: #d7d4f0; } .yasqe .CodeMirror-crosshair { cursor: crosshair; } .yasqe .cm-searching { background: #ffa; background: rgba(255, 255, 0, 0.4); } .yasqe .CodeMirror span { *vertical-align: text-bottom; } .yasqe .cm-force-border { padding-right: .1px; } @media print { .yasqe { /* Hide the cursor when printing */ } .yasqe .CodeMirror div.CodeMirror-cursors { visibility: hidden; } } .yasqe .cm-tab-wrap-hack:after { content: ''; } .yasqe span.CodeMirror-selectedtext { background: none; } .yasqe .CodeMirror-fullscreen { position: fixed; top: 0; left: 0; right: 0; bottom: 0; height: auto; z-index: 9; } .yasqe .CodeMirror-foldmarker { color: blue; text-shadow: #b9f 1px 1px 2px, #b9f -1px -1px 2px, #b9f 1px -1px 2px, #b9f -1px 1px 2px; font-family: arial; line-height: .3; cursor: pointer; } .yasqe .CodeMirror-foldgutter { width: .7em; } .yasqe .CodeMirror-foldgutter-open, .yasqe .CodeMirror-foldgutter-folded { cursor: pointer; } .yasqe .CodeMirror-foldgutter-open:after { content: "\25BE"; } .yasqe .CodeMirror-foldgutter-folded:after { content: "\25B8"; } @-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } } .yasqe .yasqe_btn { color: #333; border: 1px solid transparent; background-color: #fff; border-color: #ccc; border-width: 1px; display: inline-block; text-align: center; vertical-align: middle; cursor: pointer; white-space: nowrap; padding: 6px 12px; border-radius: 4px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-appearance: button; /* margin: 0; */ overflow: visible; box-sizing: border-box; } .yasqe .yasqe_btn.btn_icon { padding: 4px 8px; } .yasqe .yasqe_btn[disabled], .yasqe .yasqe_btn.disabled { cursor: default; opacity: .50; filter: alpha(opacity=50); box-shadow: none; } .yasqe .yasqe_btn:hover { outline: 0; background-color: #ebebeb; border-color: #adadad; } .yasqe .yasqe_btn:focus, .yasqe .yasqe_btn.selected { color: #fff; outline: 0; background-color: #337ab7; border-color: #337ab7; } .yasqe .yasqe_btn.btn_icon:focus { color: #333; border: 1px solid transparent; background-color: #fff; border-color: #ccc; } .yasqe .yasqe_btn.yasqe_btn-sm { padding: 1px 5px; font-size: 12px; line-height: 1.5; border-radius: 3px; } .yasqe .backdrop { background-color: #000; opacity: 0.5; position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px; z-index: 5; display: none; } .yasqe .svgImg { display: inline-block; } .yasqe .CodeMirror { line-height: 1.5em; border: 1px solid #d1d1d1; } .yasqe pre { font-size: 13px; } .yasqe span.cm-error { border-bottom: 2px dotted red; } .yasqe .gutterErrorBar { width: 4px; } .yasqe .yasqe_buttons { position: absolute; top: 5px; right: 5px; z-index: 5; } .yasqe .yasqe_buttons .yasqe_share { cursor: pointer; height: 20px; width: 20px; margin-top: 3px; } .yasqe .yasqe_buttons div { vertical-align: top; margin-left: 5px; } .yasqe .yasqe_buttons div.yasqe_sharePopup { position: absolute; padding: 4px; margin-left: 0px; border: 1px solid #e3e3e3; border-radius: 4px; box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05); width: 600px; height: auto; display: -webkit-box; display: flex; } .yasqe .yasqe_buttons div.yasqe_sharePopup .inputWrapper { -webkit-box-flex: 100; flex-grow: 100; } .yasqe .yasqe_buttons div.yasqe_sharePopup input { float: left; width: 100%; border: 0px; -ms-box-sizing: border-box; /* ie8 */ -khtml-box-sizing: border-box; /* konqueror */ /* Safari/Chrome, other WebKit */ /* Firefox, other Gecko */ box-sizing: border-box; /* Opera/IE 8+ */ box-sizing: border-box; /* css3 rec */ } .yasqe .yasqe_buttons div.yasqe_sharePopup button { float: right; margin-left: 5px; } .yasqe .yasqe_buttons div.yasqe_sharePopup textarea { width: 100%; } .yasqe .yasqe_buttons .yasqe_queryButton { display: inline-block; cursor: pointer; width: 40px; height: 40px; margin-left: 10px; } .yasqe .yasqe_buttons .yasqe_queryButton div { margin-left: 0px; } .yasqe .yasqe_buttons .yasqe_queryButton .svgImg { display: block; } .yasqe .yasqe_buttons .yasqe_queryButton .loader { width: 36px; height: 36px; border-radius: 50%; box-sizing: border-box; border: solid 4px rgba(0, 0, 0, 0.2); border-top-color: #000; -webkit-animation: spin 1s infinite linear; animation: spin 1s infinite linear; } .yasqe span.shortlinkErr { font-size: small; color: red; font-weight: bold; float: left; } .yasqe .completionNotification { color: #999; background-color: #f7f7f7; position: absolute; padding: 0px 5px; right: 0px; bottom: 0px; font-size: 90%; } .yasqe .CodeMirror-fullscreen .fullscreenToggleBtns .yasqe_smallscreenBtn { display: inline-block; } .yasqe .CodeMirror-fullscreen .fullscreenToggleBtns .yasqe_fullscreenBtn { display: none; } .yasqe .fullscreenToggleBtns { display: inline-block; margin-top: 3px; } .yasqe .fullscreenToggleBtns div { cursor: pointer; width: 20px; height: 20px; } .yasqe .fullscreenToggleBtns .yasqe_smallscreenBtn { display: none; } .yasqe .parseErrorIcon { width: 15px; height: 15px; } .yasqe .yasqe_tooltip { display: inline; position: absolute; background: #333; background: rgba(0, 0, 0, 0.8); border-radius: 5px; bottom: 26px; color: #fff; left: 20%; padding: 5px 15px; position: absolute; width: 220px; white-space: -moz-pre-wrap !important; /* Mozilla, since 1999 */ white-space: -pre-wrap; /* Opera 4-6 */ white-space: -o-pre-wrap; /* Opera 7 */ white-space: pre-wrap; /* css-3 */ white-space: normal; } .yasqe .notificationLoader { width: 18px; height: 18px; vertical-align: middle; } .yasqe .CodeMirror-foldmarker { color: #6E2500; text-shadow: #FF935E 1px 1px 2px, #FF935E -1px -1px 2px, #FF935E 1px -1px 2px, #FF935E -1px 1px 2px; font-size: 19px; } .yasqe .matchingVar { background-color: #DBDEED; border-radius: 6px; -webkit-transition: background 0.5s linear; transition: background 0.5s linear; } .CodeMirror-hints { position: absolute; z-index: 10; overflow: hidden; list-style: none; margin: 0; padding: 2px; box-shadow: 2px 3px 5px rgba(0, 0, 0, 0.2); border-radius: 3px; border: 1px solid silver; background: white; font-size: 90%; font-family: monospace; max-height: 20em; overflow-y: auto; } .CodeMirror-hint { margin: 0; padding: 0 4px; border-radius: 2px; max-width: 19em; overflow: hidden; white-space: pre; color: black; cursor: pointer; } li.CodeMirror-hint-active { background: #08f; color: white; } .CodeMirror-hint { max-width: 30em; }