mirror of
https://github.com/compiler-explorer/compiler-explorer.git
synced 2025-12-27 10:33:59 -05:00
c29ad46f3a
Add Claude Explain feature for AI-powered code explanations This PR introduces Claude Explain, a new feature that provides AI-powered explanations of compiler output directly within Compiler Explorer. Key features: Claude Explain functionality: - New explain view pane - Explains compiler output with full context of source code and compilation output - Configurable audience level and explanation type - Response caching to improve performance and reduce API calls - Usage statistics display showing requests used and token counts User experience: - Consent flow on first use explaining data handling and privacy - AI disclaimer banner warning about potential LLM inaccuracies - Respects "no-ai" directive in source code for users who don't want AI processing Privacy and security: - Data sent to Anthropic's Claude API as documented in privacy policy - No data used for model training - Clear consent required before first use - Support for opting out via "no-ai" directive The feature is marked as beta and can be enabled via configuration. Co-authored-by: Claude <noreply@anthropic.com>
1728 lines
34 KiB
SCSS
1728 lines
34 KiB
SCSS
@use 'themes/default-theme';
|
|
@use 'themes/dark-theme';
|
|
@use 'themes/pink-theme';
|
|
@use 'themes/one-dark-theme';
|
|
@use 'markdown.scss';
|
|
|
|
@import '~@fortawesome/fontawesome-free/css/all.min.css';
|
|
|
|
// SCSS function to generate TomSelect dropdown arrow SVG with custom color
|
|
// Based on the SVG from tom-select.bootstrap5.css line 575 in selector:
|
|
// .ts-wrapper:not(.form-control, .form-select).single .ts-control
|
|
@function dropdown-arrow-svg($color) {
|
|
@return url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='none' stroke='#{$color}' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/></svg>");
|
|
}
|
|
|
|
/*
|
|
* https://github.com/Microsoft/monaco-editor/issues/417
|
|
* Safari 10.1, fails inherit correct visibility from parent when we change the visibility of parent element from hidden to inherit, in this particular case.
|
|
*/
|
|
.monaco-editor-hover .monaco-scrollable-element {
|
|
visibility: visible;
|
|
}
|
|
|
|
.monaco-editor .asm-label-link {
|
|
text-decoration: underline;
|
|
cursor: pointer;
|
|
}
|
|
|
|
// The :root and .monaco-editor .codelens-decoration are used to set the codelens font
|
|
// Official support using the IEditorOptions.codeLensFontFamily property has landed in vscode
|
|
// These blocks should be removed once a downstream release of monaco is cut
|
|
:root {
|
|
// updated at runtime
|
|
--user-selected-font-stack: Consolas, 'Liberation Mono', Courier, monospace;
|
|
}
|
|
.monaco-editor .codelens-decoration {
|
|
font-family: var(--user-selected-font-stack);
|
|
}
|
|
|
|
body {
|
|
overflow: hidden;
|
|
}
|
|
|
|
// Styles for Claude Explain component
|
|
.explain-container {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
}
|
|
|
|
.explain-box {
|
|
padding: 15px;
|
|
background-color: #f8f9fa;
|
|
border: 1px solid #ddd;
|
|
border-radius: 4px;
|
|
margin: 15px;
|
|
margin-right: auto;
|
|
margin-left: auto;
|
|
max-width: 50em;
|
|
}
|
|
|
|
|
|
|
|
.explain-bottom-bar {
|
|
min-height: 2.5rem;
|
|
}
|
|
|
|
.ai-disclaimer {
|
|
display: flex;
|
|
align-items: center;
|
|
user-select: none;
|
|
}
|
|
|
|
.navbar-godbolt {
|
|
padding: 0;
|
|
}
|
|
|
|
.navbar-brand {
|
|
padding: 0;
|
|
}
|
|
|
|
// Fix for Bootstrap 5 navbar
|
|
.navbar .container-fluid {
|
|
padding-left: 0;
|
|
}
|
|
|
|
.navbar-brand img.logo-overlay {
|
|
position: absolute;
|
|
top: 0;
|
|
display: block;
|
|
}
|
|
|
|
.btn-light:focus {
|
|
box-shadow: none !important;
|
|
}
|
|
|
|
.top-bar .btn-light:disabled,
|
|
.bottom-bar .btn-light:disabled {
|
|
cursor: not-allowed;
|
|
}
|
|
|
|
.float-link {
|
|
z-index: 100;
|
|
position: absolute;
|
|
bottom: 0.5em;
|
|
right: 2.5em;
|
|
display: inline-block;
|
|
padding: 0.25em;
|
|
font-size: x-small;
|
|
font-weight: bold;
|
|
text-align: center;
|
|
border-radius: 5px;
|
|
}
|
|
|
|
.popover.libs-popover {
|
|
max-width: 800px !important;
|
|
max-height: 615px !important;
|
|
}
|
|
|
|
.template {
|
|
display: none;
|
|
}
|
|
|
|
.compiler-picker {
|
|
min-width: 14em;
|
|
flex-grow: 0.2 !important; // Ensures the compiler picker doesn't flex-grow too much and take up more space
|
|
}
|
|
|
|
// Prevent TomSelect items from spilling onto multiple lines
|
|
.ts-wrapper .item {
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.compiler-picker .ts-input {
|
|
text-align: center;
|
|
border-left: none !important; /* Fallback for older browsers */
|
|
border-inline-start: none !important; /* Logical property for RTL support */
|
|
border-top-left-radius: 0; /* Fallback for older browsers */
|
|
border-bottom-left-radius: 0; /* Fallback for older browsers */
|
|
border-start-start-radius: 0; /* Logical property for RTL support */
|
|
border-end-start-radius: 0; /* Logical property for RTL support */
|
|
}
|
|
|
|
.function-picker {
|
|
min-width: 14em;
|
|
width: 99%;
|
|
}
|
|
|
|
.gccdump-pass-picker {
|
|
min-width: 14em;
|
|
width: 99%;
|
|
}
|
|
|
|
.change-device {
|
|
min-width: 20em;
|
|
width: 99%;
|
|
}
|
|
|
|
li.tweet {
|
|
padding: 3px 20px;
|
|
}
|
|
|
|
.diff-picker {
|
|
max-width: 20em;
|
|
min-width: 14em;
|
|
}
|
|
|
|
.difftype-picker {
|
|
max-width: 10em;
|
|
min-width: 10em;
|
|
}
|
|
|
|
.diff-picker .options {
|
|
padding-left: 0.5em;
|
|
font-size: small;
|
|
}
|
|
|
|
.diff-picker .meta {
|
|
font-style: italic;
|
|
text-align: right;
|
|
list-style: none;
|
|
margin: 0;
|
|
padding: 0;
|
|
font-size: x-small;
|
|
}
|
|
|
|
.diff-picker .meta li {
|
|
padding: 0;
|
|
display: inline;
|
|
margin: 0 10px 0 0;
|
|
}
|
|
|
|
.opt-group-picker {
|
|
min-width: 10em;
|
|
}
|
|
|
|
#root {
|
|
width: 100%;
|
|
margin: 0;
|
|
padding: 0;
|
|
overflow: hidden;
|
|
}
|
|
|
|
#printview {
|
|
display: none;
|
|
code {
|
|
font-family: Consolas, 'Liberation Mono', Courier, monospace, Consolas, 'Courier New', monospace;
|
|
}
|
|
.pagebreak {
|
|
page-break-before: always;
|
|
}
|
|
h1 {
|
|
font-size: 1.5em;
|
|
}
|
|
code {
|
|
color: black;
|
|
}
|
|
}
|
|
|
|
@media print {
|
|
#root {
|
|
display: none;
|
|
}
|
|
#printview {
|
|
display: block;
|
|
}
|
|
}
|
|
|
|
.lm_splitter.lm_vertical .lm_drag_handle {
|
|
height: 10px;
|
|
top: -2.5px;
|
|
}
|
|
|
|
.lm_splitter.lm_horizontal .lm_drag_handle {
|
|
width: 10px;
|
|
left: -2.5px;
|
|
}
|
|
|
|
pre.content {
|
|
width: 100%;
|
|
padding-top: 3px;
|
|
padding-bottom: 0;
|
|
margin-bottom: 0;
|
|
overflow: auto;
|
|
}
|
|
|
|
pre.content.output-content {
|
|
padding-left: 1rem;
|
|
padding-right: 1rem;
|
|
}
|
|
|
|
pre.content p {
|
|
margin: 0;
|
|
}
|
|
|
|
pre.content.wrap {
|
|
word-break: keep-all;
|
|
overflow-x: hidden;
|
|
white-space: pre-wrap;
|
|
}
|
|
|
|
pre.content.wrap * {
|
|
word-wrap: break-word;
|
|
white-space: pre-wrap; /* Preserve sequences of white space */
|
|
}
|
|
|
|
.compile-info {
|
|
font-size: x-small;
|
|
font-style: italic;
|
|
}
|
|
|
|
.compile-time {
|
|
font-size: x-small;
|
|
font-style: italic;
|
|
}
|
|
|
|
.url-parse-info {
|
|
font-size: small;
|
|
margin-top: 1em;
|
|
font-style: italic;
|
|
}
|
|
|
|
.libs-container ul {
|
|
float: left;
|
|
clear: none;
|
|
}
|
|
|
|
.lib-list {
|
|
margin: 3px;
|
|
padding: 3px;
|
|
text-align: left;
|
|
}
|
|
|
|
.lib-header {
|
|
padding-left: 1px;
|
|
}
|
|
|
|
.lib-item {
|
|
list-style: none;
|
|
}
|
|
|
|
.lib-checkbox {
|
|
display: inline;
|
|
}
|
|
|
|
.lib-label {
|
|
display: inline;
|
|
padding: 5px 0 5px 5px;
|
|
}
|
|
|
|
.lib-separator {
|
|
margin: 3px 0 3px 0;
|
|
padding: 0 2px 0 2px;
|
|
}
|
|
|
|
.small-v-scrollable {
|
|
max-height: 8em;
|
|
overflow-y: auto;
|
|
}
|
|
|
|
.linked-code-decoration-margin {
|
|
width: 5px !important;
|
|
left: 3px;
|
|
}
|
|
|
|
.linked-code-decoration-column {
|
|
font-weight: 600;
|
|
color: red !important;
|
|
}
|
|
|
|
.modal {
|
|
/* maximum for all modal dialogs */
|
|
width: 100%;
|
|
height: 100%;
|
|
padding: 1.75rem;
|
|
}
|
|
|
|
.modal-dialog {
|
|
max-width: max-content; /* override bootstrap width */
|
|
margin: 0 auto;
|
|
}
|
|
|
|
.modal-content {
|
|
max-width: max-content; /* modal boxes are at most as wide as their content - smaller width is handled by the browser and flexbox */
|
|
max-height: calc(100vh - 4rem); /* modal box height scales with the viewport height and leaves space for borders */
|
|
}
|
|
|
|
#history {
|
|
.modal-content {
|
|
min-width: calc(80vw); /* force min-width on html element containing history editor */
|
|
}
|
|
}
|
|
|
|
#site-template-loader {
|
|
.modal-dialog {
|
|
min-width: 800px; /* ensure template modal has adequate width */
|
|
}
|
|
}
|
|
|
|
.modal-body {
|
|
min-height: 200px;
|
|
overflow-y: auto; /* make body scrollable -> keep Header & Footer onscreen, if possible */
|
|
}
|
|
|
|
#enter-something .modal-body {
|
|
min-height: 90px;
|
|
}
|
|
|
|
#enter-something .modal-body .question {
|
|
margin-bottom: 5px;
|
|
}
|
|
|
|
#enter-something .modal-body .question-answer {
|
|
width: 300px;
|
|
}
|
|
|
|
.modal-content .well {
|
|
border: 1px solid;
|
|
border-radius: 3px;
|
|
}
|
|
|
|
.navbar-nav.navbar-center {
|
|
float: left; /* by default */
|
|
}
|
|
|
|
@media (min-width: 1300px) {
|
|
.navbar-nav.navbar-center {
|
|
float: none;
|
|
position: absolute;
|
|
left: 50%;
|
|
transform: translatex(-50%);
|
|
}
|
|
}
|
|
|
|
.community-advert {
|
|
display: flex;
|
|
max-width: 500px;
|
|
height: 44px;
|
|
margin-top: 3px;
|
|
margin-bottom: 3px;
|
|
justify-content: center;
|
|
align-items: center;
|
|
text-align: center;
|
|
border: 2px solid;
|
|
border-radius: 8px;
|
|
padding-left: 4px;
|
|
padding-right: 4px;
|
|
}
|
|
|
|
@media (max-width: 1400px) {
|
|
.community-advert {
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
.community-hide {
|
|
padding-left: 5px;
|
|
}
|
|
|
|
.community-hide button {
|
|
font-size: small;
|
|
opacity: 1;
|
|
color: #67c52a;
|
|
}
|
|
|
|
#notifications {
|
|
padding: 5px;
|
|
border-radius: 0.5rem;
|
|
position: fixed;
|
|
bottom: 3px;
|
|
right: 5px;
|
|
max-width: 40%;
|
|
}
|
|
|
|
#notifications {
|
|
z-index: 6;
|
|
}
|
|
|
|
.toast {
|
|
max-width: 100% !important;
|
|
}
|
|
|
|
.toast-header .btn-close {
|
|
float: left;
|
|
margin-right: 5px;
|
|
}
|
|
|
|
.toast a {
|
|
text-decoration: underline !important;
|
|
}
|
|
|
|
.font-size-list {
|
|
min-width: 60px !important;
|
|
max-height: 70vh !important;
|
|
overflow-y: auto;
|
|
width: auto;
|
|
// For my fellow Firefox users
|
|
scrollbar-width: thin;
|
|
padding: 0.25rem 0;
|
|
}
|
|
|
|
.font-size-list button {
|
|
margin-left: 0 !important;
|
|
border-radius: 0;
|
|
width: 100%;
|
|
text-align: center;
|
|
padding: 0.25rem 0.5rem;
|
|
}
|
|
|
|
.font-size-list button:hover {
|
|
background-color: rgba(0, 0, 0, 0.075);
|
|
}
|
|
|
|
.font-option {
|
|
text-align: center;
|
|
}
|
|
|
|
.compiler-list {
|
|
display: block;
|
|
overflow-y: auto;
|
|
overflow-x: hidden;
|
|
height: 100%;
|
|
}
|
|
|
|
.graph-container {
|
|
position: relative;
|
|
width: 100%;
|
|
height: 100%;
|
|
overflow: hidden;
|
|
.cfg-info {
|
|
position: absolute;
|
|
bottom: 5px;
|
|
left: 5px;
|
|
font-size: x-small;
|
|
font-style: italic;
|
|
z-index: 1;
|
|
}
|
|
.graph {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
transform-origin: top left;
|
|
svg {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
}
|
|
.block-container {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
.block {
|
|
position: absolute;
|
|
padding: 5px;
|
|
display: inline-block;
|
|
// TODO(jeremy-rifkin) settings.editorsFont
|
|
font-family: Consolas, 'Liberation Mono', Courier, monospace;
|
|
white-space: nowrap;
|
|
line-height: 100%;
|
|
.fold {
|
|
display: inline-block;
|
|
color: grey;
|
|
margin: 0.1em 0.1em 0 0.2em;
|
|
line-height: 1em;
|
|
cursor: pointer;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.cfg-fold-popover {
|
|
font-family: Consolas, 'Liberation Mono', Courier, monospace;
|
|
max-width: calc(min(95vw, 1000px));
|
|
}
|
|
|
|
.cfg-toolbar {
|
|
.estimated-export-size {
|
|
font-size: x-small;
|
|
font-style: italic;
|
|
}
|
|
|
|
.options button {
|
|
height: 100%;
|
|
}
|
|
}
|
|
|
|
.change-language {
|
|
line-height: 14px;
|
|
min-width: 200px !important;
|
|
}
|
|
|
|
.change-language .ts-input {
|
|
border-bottom: none;
|
|
border-right: none;
|
|
border-radius: 0;
|
|
}
|
|
|
|
.short-compiler-name {
|
|
font-size: 12px;
|
|
padding-left: 3px;
|
|
}
|
|
|
|
.header-fontscale {
|
|
padding-right: 1em;
|
|
}
|
|
|
|
label#vim-label {
|
|
top: 3px;
|
|
}
|
|
|
|
#settings input,
|
|
#embedsettings input {
|
|
margin-right: 3px;
|
|
}
|
|
|
|
.checkbox label {
|
|
user-select: none;
|
|
}
|
|
|
|
#settings select,
|
|
#settings input:not([type='checkbox']):not([type='range']) {
|
|
display: block;
|
|
}
|
|
|
|
input.vim-check {
|
|
margin-bottom: 4px;
|
|
}
|
|
|
|
.opens-new-window {
|
|
width: 16px;
|
|
height: 16px;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.lib-described {
|
|
text-decoration: underline;
|
|
text-decoration-style: dashed;
|
|
cursor: help;
|
|
}
|
|
|
|
.program-exec-output {
|
|
font-family: 'Courier New', Courier, monospace;
|
|
padding-left: 2%;
|
|
}
|
|
|
|
.execution-stdoutstderr {
|
|
overflow: unset;
|
|
}
|
|
|
|
.lib-arrow {
|
|
display: inline-table;
|
|
width: 0;
|
|
height: 0;
|
|
border: 7px solid transparent;
|
|
margin-right: 2px;
|
|
}
|
|
|
|
.share-disabled {
|
|
cursor: not-allowed;
|
|
}
|
|
|
|
.share-item {
|
|
display: block;
|
|
overflow: auto;
|
|
padding: 3px;
|
|
}
|
|
|
|
.share-item:last-child {
|
|
border-radius: 0 0 3px 3px;
|
|
}
|
|
|
|
.share-item-logo {
|
|
margin-left: 5px;
|
|
margin-right: 5px;
|
|
width: 20px;
|
|
height: 20px;
|
|
}
|
|
|
|
.compiler-picker-dropdown .ts-dropdown-content {
|
|
// Default max-height, the compiler picker will override this to prevent overflowing the window
|
|
max-height: 600px;
|
|
}
|
|
|
|
.compiler-picker-dropdown .ts-dropdown-content .option {
|
|
padding: 0 10px;
|
|
}
|
|
|
|
.compiler-options-popover {
|
|
font-family: monospace;
|
|
max-width: 460px;
|
|
}
|
|
|
|
.navbar-nav a.nav-link {
|
|
font-size: 14px;
|
|
border-radius: 5px;
|
|
margin-left: 1px;
|
|
margin-right: 1px;
|
|
}
|
|
|
|
.navbar-nav a.nav-link:hover {
|
|
border-radius: 5px;
|
|
}
|
|
|
|
kbd {
|
|
display: inline-block;
|
|
border: 1px solid;
|
|
border-radius: 4px;
|
|
padding: 0.1em 0.5em;
|
|
margin: 0 0.2em;
|
|
box-shadow:
|
|
0 1px 0px rgba(0, 0, 0, 0.2),
|
|
0 0 0 2px #fff inset;
|
|
}
|
|
|
|
#simplecook {
|
|
align-items: center;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
}
|
|
|
|
#simplecook .message {
|
|
display: block;
|
|
flex: 1 1 auto;
|
|
max-width: 100%;
|
|
}
|
|
|
|
.new-cookie-msg {
|
|
display: inline;
|
|
margin: 0 2px 0 2px;
|
|
}
|
|
|
|
.dropdown-icon {
|
|
width: 25px;
|
|
text-align: center;
|
|
margin-right: 6px;
|
|
}
|
|
|
|
.linked-compiler-output-line {
|
|
cursor: pointer;
|
|
color: var(--terminal-bright-blue) !important;
|
|
}
|
|
|
|
.lm_content {
|
|
overflow: visible;
|
|
}
|
|
|
|
.lm_header {
|
|
/* Needed to prevent the tab selection dropdown getting stuck behind other elements */
|
|
z-index: 3 !important;
|
|
height: 20px !important;
|
|
}
|
|
|
|
li.lm_tab.lm_active {
|
|
overflow: hidden;
|
|
}
|
|
|
|
@media (max-width: 768px) {
|
|
.lm_header {
|
|
height: 50px !important;
|
|
}
|
|
|
|
.lm_header .lm_tabs {
|
|
height: 100%;
|
|
}
|
|
|
|
.lm_header .lm_tabs .lm_tab {
|
|
height: 31px;
|
|
padding-top: 15px;
|
|
}
|
|
|
|
.lm_controls li {
|
|
padding-top: 20px;
|
|
transform: scale(1.8);
|
|
padding-right: 15px;
|
|
}
|
|
|
|
.lm_controls .lm_tabdropdown {
|
|
padding-top: 8px;
|
|
}
|
|
|
|
.lm_header .lm_tabdropdown_list .lm_tab {
|
|
height: 50px;
|
|
display: flex;
|
|
flex-direction: row;
|
|
align-items: center;
|
|
}
|
|
}
|
|
|
|
.open-in-cppinsights *,
|
|
.open-in-quickbench * {
|
|
vertical-align: middle;
|
|
}
|
|
|
|
/* Fix the width to allow bootstrap's right-justify to work, else it truncates. See https://github.com/compiler-explorer/compiler-explorer/issues/1863 */
|
|
div.populararguments div.dropdown-menu {
|
|
width: 300px;
|
|
}
|
|
|
|
#overrides-selection .modal-body {
|
|
overflow-y: scroll;
|
|
}
|
|
|
|
#overrides-selection .overrides-how-to-use {
|
|
font-size: smaller;
|
|
}
|
|
|
|
#overrides-selection .overrides-selected-col {
|
|
padding: 0 15px 0 0;
|
|
min-width: 250px;
|
|
max-width: 250px;
|
|
}
|
|
|
|
#overrides-selection .overrides-results-col {
|
|
padding: 0 0 0 0;
|
|
min-width: 450px;
|
|
max-width: 650px;
|
|
}
|
|
|
|
#overrides-selection .override-results-items .card {
|
|
margin-bottom: 3px;
|
|
}
|
|
|
|
#overrides-selection.mobile .overrides-results-col {
|
|
min-width: 250px;
|
|
max-width: 450px;
|
|
}
|
|
|
|
#overrides-selection .overrides-results-col span.override {
|
|
float: right;
|
|
}
|
|
|
|
#overrides-selection .overrides-results-col span.override-fav {
|
|
float: right;
|
|
}
|
|
|
|
#overrides-selection .overrides-favorites-col {
|
|
padding: 0 0 0 15px;
|
|
min-width: 325px;
|
|
max-width: 350px;
|
|
}
|
|
|
|
#overrides-selection .overrides-favorites-col button {
|
|
width: 300px;
|
|
}
|
|
|
|
#overrides-selection.mobile .overrides-favorites-col {
|
|
display: none;
|
|
}
|
|
|
|
#runtimetools-selection .modal-body {
|
|
overflow-y: scroll;
|
|
}
|
|
|
|
#runtimetools-selection .runtimetools-how-to-use {
|
|
font-size: smaller;
|
|
}
|
|
|
|
#runtimetools-selection .runtimetools-selected-col {
|
|
padding: 0 15px 0 0;
|
|
min-width: 250px;
|
|
max-width: 250px;
|
|
}
|
|
|
|
#runtimetools-selection .runtimetools-results-col {
|
|
padding: 0 0 0 0;
|
|
min-width: 450px;
|
|
max-width: 650px;
|
|
}
|
|
|
|
#runtimetools-selection .runtimetool-results-items .card {
|
|
margin-bottom: 3px;
|
|
}
|
|
|
|
#runtimetools-selection.mobile .runtimetools-results-col {
|
|
min-width: 250px;
|
|
max-width: 450px;
|
|
}
|
|
|
|
#runtimetools-selection .runtimetools-results-col span.override {
|
|
float: right;
|
|
}
|
|
|
|
#runtimetools-selection .runtimetools-results-col span.override-fav {
|
|
float: right;
|
|
}
|
|
|
|
#runtimetools-selection .runtimetools-favorites-col {
|
|
padding: 0 0 0 15px;
|
|
min-width: 325px;
|
|
max-width: 350px;
|
|
}
|
|
|
|
#runtimetools-selection .runtimetools-favorites-col button {
|
|
width: 300px;
|
|
}
|
|
|
|
#runtimetools-selection.mobile .runtimetools-favorites-col {
|
|
display: none;
|
|
}
|
|
|
|
#runtimetools-selection .runtime-tool-option {
|
|
line-height: 35px;
|
|
}
|
|
#runtimetools-selection .tool-option-name {
|
|
display: inline-block;
|
|
min-width: 150px;
|
|
}
|
|
#runtimetools-selection .tool-option-select {
|
|
min-width: 100px;
|
|
}
|
|
|
|
#runtimetools-selection .tool-fav {
|
|
float: right;
|
|
}
|
|
|
|
.ces-content-root {
|
|
min-height: 100px;
|
|
max-height: calc(
|
|
100vh - 306px
|
|
); /* works on my machine :) - 306px = the height of the footer + borders/margins/paddings - guessed/tried out */
|
|
overflow: auto; /* move scrollbar into sponsor part - keep quickaccess buttons on screen */
|
|
}
|
|
|
|
#ces {
|
|
min-width: 260px;
|
|
}
|
|
|
|
#ces-banner-text {
|
|
margin-right: 0.1em;
|
|
font-size: small;
|
|
}
|
|
|
|
@media (max-width: 1000px) {
|
|
#ces {
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
@media (max-width: 1200px) {
|
|
#ces-banner-text {
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
.ces-item-block:not(:first-child) {
|
|
margin-top: 6em;
|
|
}
|
|
|
|
.ces-top {
|
|
margin-top: 1em;
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
justify-content: space-around;
|
|
align-items: center;
|
|
font-size: 60%;
|
|
}
|
|
|
|
@media (min-height: 700px) {
|
|
/* Scales on the top-level object to try and fit enough in shorter screens */
|
|
.ces-top {
|
|
font-size: 75%;
|
|
}
|
|
}
|
|
|
|
@media (min-height: 1000px) {
|
|
/* Scales on the top-level object to try and fit enough in shorter screens */
|
|
.ces-top {
|
|
font-size: 90%;
|
|
}
|
|
}
|
|
|
|
.ces-item-title {
|
|
font-size: 200%;
|
|
font-weight: bold;
|
|
flex-grow: 1;
|
|
}
|
|
|
|
.ces-item-title img {
|
|
margin: auto 0.5em auto 0.5em;
|
|
}
|
|
.ces-level-selectors {
|
|
padding-bottom: 5px;
|
|
}
|
|
|
|
.ces {
|
|
flex-grow: 1;
|
|
margin: 2px;
|
|
font-size: 70%;
|
|
}
|
|
|
|
.ces button {
|
|
padding: 4px;
|
|
height: 100%;
|
|
}
|
|
|
|
.corporate .ces {
|
|
.btn {
|
|
--bs-btn-font-size: 24px;
|
|
}
|
|
height: 20em;
|
|
}
|
|
|
|
.legendary .ces {
|
|
.btn {
|
|
--bs-btn-font-size: 24px;
|
|
padding: 1em;
|
|
}
|
|
height: 20em;
|
|
}
|
|
|
|
.ces-logo {
|
|
max-height: 1.5em;
|
|
}
|
|
|
|
.ces-logo-large {
|
|
max-height: 3em;
|
|
}
|
|
|
|
.ces-icons {
|
|
float: right;
|
|
height: 1.5em;
|
|
}
|
|
|
|
.ces-icon {
|
|
padding: 0 0.2em 0 0.2em;
|
|
height: 1.5em;
|
|
}
|
|
|
|
.ces-item-description {
|
|
flex-grow: 1;
|
|
margin: auto 0.5em auto 0.5em;
|
|
}
|
|
|
|
#library-selection .modal-body {
|
|
overflow-y: scroll;
|
|
}
|
|
|
|
#library-selection .lib-search-button {
|
|
margin-left: 10px;
|
|
}
|
|
|
|
#library-selection .libs-how-to-use {
|
|
font-size: smaller;
|
|
}
|
|
|
|
#library-selection .libs-selected-col {
|
|
padding: 0 15px 0 0;
|
|
min-width: 250px;
|
|
max-width: 250px;
|
|
}
|
|
|
|
#library-selection .libs-results-col {
|
|
padding: 0 0 0 0;
|
|
min-width: 450px;
|
|
max-width: 450px;
|
|
}
|
|
|
|
#library-selection .lib-results-items .card {
|
|
margin-bottom: 3px;
|
|
}
|
|
|
|
#library-selection.mobile .lib-results-items .card-body {
|
|
display: none;
|
|
}
|
|
|
|
#library-selection.mobile .libs-results-col {
|
|
min-width: 250px;
|
|
max-width: 450px;
|
|
}
|
|
|
|
#library-selection .libs-results-col span.lib-version {
|
|
float: right;
|
|
}
|
|
|
|
#library-selection .libs-results-col span.lib-website {
|
|
float: left;
|
|
}
|
|
|
|
#library-selection .libs-results-col span.lib-fav {
|
|
float: right;
|
|
}
|
|
|
|
#library-selection .libs-favorites-col {
|
|
padding: 0 0 0 15px;
|
|
min-width: 200px;
|
|
max-width: 200px;
|
|
}
|
|
|
|
#library-selection.mobile .libs-favorites-col {
|
|
display: none;
|
|
}
|
|
|
|
#compiler-picker-modal {
|
|
.modal-body {
|
|
overflow-y: scroll;
|
|
}
|
|
|
|
input.compiler-search {
|
|
margin-left: 10px;
|
|
//outline: 0 !important;
|
|
padding: 5px 10px;
|
|
}
|
|
|
|
.filters {
|
|
margin-top: 10px;
|
|
word-break: break-all;
|
|
}
|
|
|
|
.label {
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.architecture,
|
|
.compiler-type {
|
|
padding: 2px 5px;
|
|
border-radius: 3px;
|
|
margin: 0 0 0 3px;
|
|
cursor: pointer;
|
|
user-select: none;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.card-body > .container {
|
|
max-width: 650px + 15px + 15px + 350px !important;
|
|
}
|
|
|
|
.compilers-col {
|
|
margin-top: 5px;
|
|
h6 {
|
|
margin-top: 15px;
|
|
font-size: 16px;
|
|
}
|
|
.compilers {
|
|
width: 650px;
|
|
columns: 2 300px;
|
|
column-gap: 40px;
|
|
&.one-col {
|
|
width: 300px;
|
|
columns: 1 300px;
|
|
}
|
|
}
|
|
.favorites {
|
|
margin-left: 10px;
|
|
}
|
|
.compilers,
|
|
.favorites {
|
|
.group-wrapper {
|
|
display: inline-block;
|
|
.group {
|
|
width: 300px;
|
|
margin-bottom: 25px;
|
|
.label {
|
|
cursor: pointer;
|
|
}
|
|
.compiler {
|
|
cursor: pointer;
|
|
.highlight {
|
|
background: rgba(255, 237, 40, 0.4);
|
|
border-radius: 1px;
|
|
}
|
|
.toggle-fav {
|
|
cursor: pointer;
|
|
}
|
|
}
|
|
.folded {
|
|
display: none;
|
|
text-align: center;
|
|
}
|
|
&.collapsed {
|
|
.compiler {
|
|
display: none !important;
|
|
}
|
|
.folded {
|
|
display: block !important;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
@media (max-width: 1200px) {
|
|
#compiler-picker-modal {
|
|
.card-body > .container {
|
|
max-width: 330px + 15px + 15px + 330px !important;
|
|
}
|
|
.compilers-col {
|
|
.compilers {
|
|
width: 300px !important;
|
|
columns: 1 300px !important;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
@media (max-width: 830px) {
|
|
#compiler-picker-modal {
|
|
.card-body > .container {
|
|
max-width: 330px !important;
|
|
}
|
|
.compilers-row {
|
|
flex-direction: column-reverse;
|
|
}
|
|
.compilers-col .favorites {
|
|
margin-left: 0px !important;
|
|
}
|
|
}
|
|
}
|
|
|
|
#timing-info .modal-content {
|
|
min-width: 500px;
|
|
min-height: 400px;
|
|
}
|
|
|
|
.icon-link > span {
|
|
margin-right: 2pt;
|
|
}
|
|
|
|
span.badge.rounded-pill {
|
|
margin-left: 2pt;
|
|
}
|
|
|
|
.theme-light-only,
|
|
.theme-dark-only {
|
|
display: none;
|
|
}
|
|
|
|
html[data-theme='default'] {
|
|
@import '~golden-layout/src/css/goldenlayout-light-theme';
|
|
.theme-light-only {
|
|
display: inline;
|
|
}
|
|
}
|
|
|
|
html[data-theme='dark'] {
|
|
@import '~golden-layout/src/css/goldenlayout-dark-theme';
|
|
background-color: #333 !important;
|
|
.theme-dark-only {
|
|
display: inline;
|
|
}
|
|
}
|
|
|
|
html[data-theme='pink'] {
|
|
background-color: var(--lighter) !important;
|
|
.theme-light-only {
|
|
display: inline;
|
|
}
|
|
}
|
|
|
|
html[data-theme='one-dark'] {
|
|
background-color: var(--light) !important;
|
|
.theme-dark-only {
|
|
display: inline;
|
|
}
|
|
}
|
|
|
|
.socialsharing {
|
|
max-width: 250px;
|
|
}
|
|
|
|
.ts-input {
|
|
height: 100%;
|
|
}
|
|
|
|
.ts-input,
|
|
.ts-dropdown .option {
|
|
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
|
|
font-size: 14px;
|
|
line-height: 20px;
|
|
}
|
|
|
|
.ts-dropdown .optgroup-header {
|
|
font-size: 11px;
|
|
font-weight: 700;
|
|
text-transform: uppercase;
|
|
}
|
|
|
|
.ts-wrapper.single .ts-control {
|
|
/* This is a workaround for a bug where the arrow overlaps the text in the tomselect item. This issue only effects
|
|
* staging (and presumably prod), it does not occur locally. Tomselect already styles this as `padding-right: 2rem;`
|
|
* but for some reason on staging/prod it's `--ts-pr-caret: 2rem;`. Changing it to `padding-right: 2rem;` in dev
|
|
* tools doesn't work, the property is greyed out as though something else is taking precedent but it's not.
|
|
*/
|
|
padding-right: 2rem !important;
|
|
}
|
|
|
|
|
|
// Fix Bootstrap 5's input-group border overlap issues with TomSelect
|
|
// Bootstrap applies a -1px margin to elements matching `:not(:first-child)` in input groups
|
|
// TomSelect creates a wrapper (.ts-wrapper) around the select element, which becomes a
|
|
// child of the input-group. This wrapper gets the negative margin, causing it to shift
|
|
// left by 1px and visually overflow its container boundary.
|
|
.input-group > .ts-wrapper:not(:first-child) {
|
|
margin-left: 0 !important; // Reset Bootstrap's negative margin for TomSelect wrappers
|
|
}
|
|
|
|
.copy-link-btn {
|
|
padding-top: 0;
|
|
}
|
|
|
|
.conformance-wrapper .compiler-list .row {
|
|
padding-top: 3px;
|
|
}
|
|
|
|
.status-icon {
|
|
border: none;
|
|
background-color: transparent;
|
|
}
|
|
|
|
.tree-editor-file {
|
|
cursor: pointer;
|
|
line-height: 14px;
|
|
padding: 0 0 0 5px;
|
|
}
|
|
.tree-editor-file span {
|
|
font-family: inherit;
|
|
float: left;
|
|
margin-top: 6px;
|
|
}
|
|
.tree-editor-file button {
|
|
float: right;
|
|
padding: 4px 10px 4px 0;
|
|
}
|
|
.tree .drophere {
|
|
margin: 5px;
|
|
border: dashed rgba(127, 127, 127, 0.2);
|
|
border-radius: 16px;
|
|
height: 150px;
|
|
}
|
|
|
|
.mainbar .cmake-project {
|
|
margin-top: 2px;
|
|
}
|
|
|
|
.v-scroll {
|
|
overflow-y: scroll;
|
|
}
|
|
|
|
.prepend-options,
|
|
.picker-popout-button {
|
|
border-top-right-radius: 0; /* Fallback for older browsers */
|
|
border-bottom-right-radius: 0; /* Fallback for older browsers */
|
|
border-start-end-radius: 0; /* Logical property for RTL support */
|
|
border-end-end-radius: 0; /* Logical property for RTL support */
|
|
}
|
|
|
|
.picker-popout-button {
|
|
font-size: 14px;
|
|
line-height: 14px;
|
|
position: relative;
|
|
i {
|
|
vertical-align: middle;
|
|
}
|
|
}
|
|
|
|
.compiler-picker-dropdown-popout-wrapper {
|
|
text-align: center;
|
|
cursor: pointer;
|
|
font-size: 15px;
|
|
position: absolute;
|
|
top: 100%;
|
|
background: inherit;
|
|
box-shadow: rgba(0, 0, 0, 0.176) 0px 6px 12px 0px; // same as the tomselect dropdown
|
|
left: 0;
|
|
.compiler-picker-dropdown-popout {
|
|
padding: 10px;
|
|
}
|
|
}
|
|
|
|
.popular-arguments-btn {
|
|
border-top-right-radius: 0; /* Fallback for older browsers */
|
|
border-start-end-radius: 0; /* Logical property for RTL support */
|
|
height: 100%;
|
|
}
|
|
|
|
.panel-compilation {
|
|
border-top: none !important;
|
|
border-bottom: none !important;
|
|
}
|
|
|
|
.compiler-out {
|
|
cursor: help;
|
|
}
|
|
|
|
.load-project-from-file {
|
|
width: 400px;
|
|
}
|
|
|
|
.delay {
|
|
display: inline;
|
|
margin-left: 3px;
|
|
margin-right: 3px;
|
|
}
|
|
|
|
.hideable {
|
|
margin-left: 4px;
|
|
}
|
|
|
|
.checkbox label {
|
|
cursor: pointer;
|
|
}
|
|
|
|
.ctrlSNothing {
|
|
font-size: small;
|
|
border: none;
|
|
user-select: text;
|
|
}
|
|
|
|
.currentCursorPosition {
|
|
position: absolute;
|
|
bottom: 0;
|
|
right: 14px; // width of monaco scrollbar
|
|
font-size: small;
|
|
border-radius: 0.5rem;
|
|
z-index: 1;
|
|
padding: 5px;
|
|
}
|
|
|
|
#site-template-modal-row {
|
|
display: flex;
|
|
flex-wrap: nowrap;
|
|
justify-content: space-between;
|
|
gap: 25px;
|
|
> div {
|
|
padding: 0;
|
|
flex-shrink: 0;
|
|
&.site-templates-list-col {
|
|
min-width: 150px;
|
|
width: 20%;
|
|
}
|
|
&.site-template-preview-col {
|
|
flex-grow: 1;
|
|
flex-shrink: 1;
|
|
min-width: 400px;
|
|
img {
|
|
width: 1000px;
|
|
aspect-ratio: 1000 / 800;
|
|
max-width: 100%;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
#site-templates-list,
|
|
#site-user-templates-list {
|
|
list-style-type: none;
|
|
margin: 0;
|
|
padding: 0;
|
|
li {
|
|
margin: 0;
|
|
padding: 0;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
margin-bottom: 4px;
|
|
gap: 3px;
|
|
.title {
|
|
flex: 1 1 auto;
|
|
}
|
|
.title,
|
|
.delete {
|
|
background: rgba(0, 0, 0, 0.2);
|
|
padding: 3px 5px;
|
|
&:hover {
|
|
background: rgba(0, 0, 0, 0.4);
|
|
}
|
|
}
|
|
cursor: pointer;
|
|
}
|
|
}
|
|
|
|
#add-user-template {
|
|
margin: 0;
|
|
padding: 0;
|
|
background: rgb(0, 123, 255);
|
|
color: white;
|
|
padding: 3px 5px;
|
|
margin-bottom: 6px;
|
|
cursor: pointer;
|
|
border: 2px solid rgb(0, 123, 255);
|
|
border-radius: 2px;
|
|
&:hover {
|
|
background: rgb(0, 123, 255);
|
|
}
|
|
}
|
|
|
|
.opt-pipeline-body {
|
|
display: flex;
|
|
overflow: hidden;
|
|
align-items: stretch;
|
|
height: 100%;
|
|
.passes-column {
|
|
color: white;
|
|
overflow-y: scroll;
|
|
overflow-x: hidden;
|
|
height: 100%;
|
|
position: relative;
|
|
.passes-list div {
|
|
background: rgba(255, 255, 255, 0.1);
|
|
padding: 2px 3px;
|
|
border: 1px solid black;
|
|
cursor: pointer;
|
|
word-wrap: anywhere;
|
|
&.firstMachinePass {
|
|
margin-top: 5px;
|
|
position: relative;
|
|
&:before {
|
|
position: absolute;
|
|
top: -5px;
|
|
left: 0;
|
|
content: '';
|
|
height: 4px;
|
|
width: 100%;
|
|
background: white;
|
|
}
|
|
}
|
|
&:hover,
|
|
&.active {
|
|
background: rgba(255, 255, 255, 0.2);
|
|
}
|
|
&.changed {
|
|
color: #36ac46;
|
|
}
|
|
}
|
|
}
|
|
.passes-column-resizer {
|
|
position: relative;
|
|
width: 5px;
|
|
height: 100%;
|
|
background-color: #000000;
|
|
transition: background-color 200ms ease;
|
|
z-index: 1;
|
|
&:hover {
|
|
background-color: #444444;
|
|
cursor: ew-resize;
|
|
}
|
|
.passes-column-resizer-handle {
|
|
position: absolute;
|
|
top: 0;
|
|
left: -5px;
|
|
width: 15px;
|
|
height: 100%;
|
|
}
|
|
}
|
|
}
|
|
|
|
#alert {
|
|
&.error-alert {
|
|
.modal-content {
|
|
border: 4px solid #f43636; // #ff4e4e
|
|
.modal-header,
|
|
.modal-footer {
|
|
border-radius: 0;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.popover-body {
|
|
max-height: calc(100vh - 50px);
|
|
overflow: auto;
|
|
}
|
|
|
|
// This is part of a fix for #4714
|
|
.lm_tabs {
|
|
overflow: hidden;
|
|
max-height: 100%;
|
|
}
|
|
|
|
// shamelessly stolen from https://css-tricks.com/snippets/css/shake-css-keyframe-animation/
|
|
@keyframes shake {
|
|
10%,
|
|
90% {
|
|
transform: translate3d(calc(var(--shake-amount) * -25%), 0, 0);
|
|
}
|
|
|
|
20%,
|
|
80% {
|
|
transform: translate3d(calc(var(--shake-amount) * 50%), 0, 0);
|
|
}
|
|
|
|
30%,
|
|
50%,
|
|
70% {
|
|
transform: translate3d(calc(var(--shake-amount) * -1), 0, 0);
|
|
}
|
|
|
|
40%,
|
|
60% {
|
|
transform: translate3d(var(--shake-amount), 0, 0);
|
|
}
|
|
}
|
|
|
|
.shake {
|
|
animation: shake 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;
|
|
transform: translate3d(0, 0, 0);
|
|
}
|
|
|
|
.compiler-arg-warning-icon {
|
|
--shake-amount: 2px;
|
|
}
|
|
|
|
.compiler-arg-warning {
|
|
$sidebar-width: 20px;
|
|
$border-width: 2px;
|
|
margin-left: $sidebar-width;
|
|
position: relative;
|
|
border: $border-width solid;
|
|
padding: 0 5px;
|
|
margin-bottom: 5px;
|
|
&:before {
|
|
position: absolute;
|
|
top: -$border-width;
|
|
left: -$sidebar-width;
|
|
width: $sidebar-width;
|
|
height: calc(100% + 2 * $border-width);
|
|
border: $border-width solid;
|
|
content: '\f071';
|
|
color: #292726;
|
|
font-family: 'Font Awesome 6 Free';
|
|
font-weight: 900;
|
|
text-align: center;
|
|
}
|
|
&:first-child {
|
|
margin-top: 5px;
|
|
}
|
|
}
|
|
|
|
#real-dark {
|
|
display: none; // turned on conditionally by a script
|
|
background: rgb(2, 0, 36);
|
|
background: radial-gradient(
|
|
circle,
|
|
rgba(2, 0, 36, 0) 0%,
|
|
rgba(0, 0, 0, 0) 4%,
|
|
rgba(0, 0, 0, 1) 28%,
|
|
rgba(0, 0, 0, 1) 100%
|
|
);
|
|
width: 200vw;
|
|
height: 200vh;
|
|
top: -50vh;
|
|
left: -50vw;
|
|
position: fixed;
|
|
z-index: 100000000000000;
|
|
// square with a little hole in the middle
|
|
clip-path: polygon(0% 0%, 0% 100%, 49% 100%, 49% 49%, 51% 49%, 51% 51%, 49% 51%, 49% 100%, 100% 100%, 100% 0%);
|
|
}
|
|
|
|
@keyframes rotate {
|
|
100% {
|
|
transform: rotate(1turn);
|
|
}
|
|
}
|
|
|
|
#true-dark {
|
|
.content {
|
|
display: none; // turned on conditionally by a script
|
|
font-weight: bold;
|
|
font-size: 18px;
|
|
padding: 10px 30px;
|
|
background: #1a1a1a;
|
|
color: white;
|
|
position: absolute;
|
|
top: 5px;
|
|
left: 50%;
|
|
transform: translateX(-50%);
|
|
z-index: 1000; // below a modal
|
|
border-radius: 5px;
|
|
cursor: pointer;
|
|
box-shadow:
|
|
0 3px 6px rgba(0, 0, 0, 0.16),
|
|
0 3px 6px rgba(0, 0, 0, 0.23);
|
|
|
|
background-image: linear-gradient(
|
|
122deg,
|
|
rgba(255, 255, 255, 0) 0%,
|
|
rgba(255, 255, 255, 0) 40%,
|
|
rgba(255, 255, 255, 0.5) 50%,
|
|
rgba(255, 255, 255, 0) 60%,
|
|
rgba(255, 255, 255, 0) 100%
|
|
);
|
|
animation: glide 10s linear infinite;
|
|
|
|
background-size: 200px 50px;
|
|
|
|
@keyframes glide {
|
|
0%,
|
|
90% {
|
|
background-position: 0vw;
|
|
}
|
|
90%,
|
|
100% {
|
|
background-position: 20vw;
|
|
}
|
|
}
|
|
|
|
.dark-close {
|
|
position: absolute;
|
|
bottom: 0;
|
|
right: -12px;
|
|
padding: 0;
|
|
background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, #1a1a1a 48%, #1a1a1a 100%);
|
|
width: 24px;
|
|
height: 24px;
|
|
border-radius: 100%;
|
|
opacity: 1 !important;
|
|
text-shadow: none !important;
|
|
float: none !important;
|
|
font-size: 16px;
|
|
line-height: 24px;
|
|
vertical-align: middle;
|
|
text-align: center;
|
|
cursor: pointer;
|
|
color: white;
|
|
&:hover {
|
|
background: #313131;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
:root {
|
|
// Default terminal 3 and 4 bit color codes, colors come from the original ansi-to-html script
|
|
// A theme should override these to make them look nicer, this can be done at the `body` level
|
|
--terminal-black: #000;
|
|
--terminal-red: #a00;
|
|
--terminal-green: #0a0;
|
|
--terminal-yellow: #a50;
|
|
--terminal-blue: #00a;
|
|
--terminal-magenta: #a0a;
|
|
--terminal-cyan: #0aa;
|
|
--terminal-white: #aaa;
|
|
--terminal-bright-black: #555;
|
|
--terminal-bright-red: #f55;
|
|
--terminal-bright-green: #5f5;
|
|
--terminal-bright-yellow: #ff5;
|
|
--terminal-bright-blue: #55f;
|
|
--terminal-bright-magenta: #f5f;
|
|
--terminal-bright-cyan: #5ff;
|
|
--terminal-bright-white: #fff;
|
|
}
|
|
|
|
span.lib-info {
|
|
cursor: pointer;
|
|
margin-left: 10px;
|
|
}
|
|
.library-info-popover {
|
|
max-width: 600px;
|
|
}
|
|
|
|
button.new-pane-button:disabled:after {
|
|
content: ' [already open]';
|
|
}
|
|
|
|
// Ensure goldenlayout tabs are on top of the minimap
|
|
.lm_header .lm_tabdropdown_list {
|
|
z-index: 6; // 5 by default, same as the minimap
|
|
}
|
|
|
|
.link-primary {
|
|
cursor: pointer;
|
|
}
|