mirror of
https://github.com/ckaczor/azuredatastudio.git
synced 2026-01-31 01:25:38 -05:00
Connection error box style fix (#14469)
* Modified modal styles, limiting height of basic modal to 480px. * wip - added new attachCalloutDialogStyler. Moved callout-specific styler code out of modal.ts * Moved attach styler code to workbench/common. Added custom styles to imageCalloutDialog * Moved styler code into calloutDialog. Added callout-specific theme colors to colorRegistry. Removed color styles from modal and callout stylesheets. * Added CalloutDialogModal that extends CalloutDialog so that the callout can be instantiated from core. Revised calloutDialog so the position cn be passed in from where it is instantiated. * Revised refactor of modal and image/link callouts so that callout dialog invoked by core can also use the styler. Removed unused properties from dialog code. * Added conditional to dialogModal to use correct styler for callouts. * Cleaned up styles. Modified custom colors. * Wrapped call to positionCalloutDialog in conditional. * Style, colors, styler and modal updates to align callout with latest OPAC toolkit styles. * Moved calloutDialog stylesheet * Consolidated styler code and added a flexible custom styler to provide values for dialogModal * Added image callout code. * Remove image callout dialog until wired fully * Test fixes Co-authored-by: chlafreniere <hichise@gmail.com>
This commit is contained in:
@@ -8,7 +8,8 @@
|
||||
}
|
||||
.modal.callout-dialog .modal-dialog {
|
||||
border-radius: 2px;
|
||||
box-shadow: 0px 3px 8px rgba(var(--foreground));
|
||||
border-width: 1px;
|
||||
border-style: solid;
|
||||
max-height: 300px;
|
||||
position: absolute;
|
||||
}
|
||||
@@ -28,60 +29,37 @@
|
||||
}
|
||||
|
||||
.callout-arrow:before {
|
||||
border-width: 1px;
|
||||
border-style: solid;
|
||||
border-color:
|
||||
transparent
|
||||
transparent
|
||||
var(--bodybackground)
|
||||
var(--bodybackground);
|
||||
box-shadow: -3px 3px 3px 0 rgba(var(--foreground));
|
||||
border-width: 1px;
|
||||
content: '';
|
||||
display: block;
|
||||
height: 0;
|
||||
height: 10px;
|
||||
position: absolute;
|
||||
width: 0;
|
||||
width: 10px;
|
||||
}
|
||||
.callout-arrow.from-below:before {
|
||||
border-width: 0.5em;
|
||||
left: 2em;
|
||||
top: -0.2em;
|
||||
left: 24px;
|
||||
top: -6px;
|
||||
transform: rotate(135deg);
|
||||
}
|
||||
.callout-arrow.from-above:before {
|
||||
border-width: 0.5em;
|
||||
left: 2em;
|
||||
bottom: -0.2em;
|
||||
bottom: -6px;
|
||||
left: 24px;
|
||||
transform: rotate(-45deg);
|
||||
}
|
||||
.callout-arrow.from-left:before {
|
||||
background-color: var(--bodybackground);
|
||||
height: 26px;
|
||||
right: -13px;
|
||||
right: -14px;
|
||||
top: 26px;
|
||||
transform: rotate(-135deg);
|
||||
width: 26px;
|
||||
}
|
||||
|
||||
.hc-black .callout-arrow:before {
|
||||
background-color: var(--bodybackground);
|
||||
border-color:
|
||||
transparent
|
||||
transparent
|
||||
var(--border)
|
||||
var(--border);
|
||||
border-width: 0.1em;
|
||||
box-shadow: none;
|
||||
height: 0.8em;
|
||||
width: 0.8em;
|
||||
}
|
||||
.hc-black .callout-arrow.from-below:before {
|
||||
top: -0.4em;
|
||||
}
|
||||
.hc-black .callout-arrow.from-left:before {
|
||||
height: 2em;
|
||||
right: -1.2em;
|
||||
width: 2em;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.modal.callout-dialog .modal-header {
|
||||
|
||||
Reference in New Issue
Block a user