133 lines
2.5 KiB
CSS
133 lines
2.5 KiB
CSS
@keyframes open-window {
|
|
from {
|
|
transform: scale(0.9);
|
|
}
|
|
|
|
to {
|
|
transform: none;
|
|
}
|
|
}
|
|
|
|
.floating-window {
|
|
animation: open-window 200ms ease;
|
|
min-width: 200px;
|
|
min-height: 300px;
|
|
box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.2);
|
|
display: flex;
|
|
flex-direction: column;
|
|
-webkit-app-region: no-drag;
|
|
position: fixed;
|
|
z-index: 1001;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.floating-window.modal-open {
|
|
z-index: 999;
|
|
}
|
|
|
|
.floating-window.resizable {
|
|
overflow: auto;
|
|
resize: both;
|
|
padding-bottom: 10px;
|
|
background: var(--background-tertiary);
|
|
}
|
|
|
|
.floating-window-titlebar {
|
|
width: 100%;
|
|
height: 28px;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
color: #fff;
|
|
background: var(--background-tertiary); /* #2F3129background-color: #202225; */
|
|
}
|
|
|
|
.floating-window-content {
|
|
display: flex;
|
|
flex-direction: column;
|
|
background: var(--background-secondary);
|
|
color: #fff;
|
|
flex: 1;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.floating-window-titlebar .title {
|
|
/* font-weight: bold; */
|
|
font-size: 0.85em;
|
|
font-weight: 600;
|
|
color: var(--header-secondary);
|
|
flex: 1;
|
|
padding: 0 8px;
|
|
}
|
|
|
|
.floating-window-buttons {
|
|
display: flex;
|
|
}
|
|
|
|
.floating-window-buttons .button {
|
|
cursor: pointer;
|
|
height: 28px;
|
|
width: 30px;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
color: var(--interactive-normal);
|
|
}
|
|
|
|
.floating-window-buttons .button svg,
|
|
.floating-window-buttons .button .fill {
|
|
fill: currentColor;
|
|
}
|
|
|
|
.floating-window-buttons .maximize-button:hover {
|
|
background: var(--background-modifier-hover);
|
|
}
|
|
|
|
.floating-window-buttons .maximize-button:active {
|
|
background: var(--background-modifier-active);
|
|
}
|
|
|
|
.floating-window-buttons .close-button:hover {
|
|
background: #f04747;
|
|
color: #fff;
|
|
}
|
|
|
|
.floating-window-content #bd-editor-panel {
|
|
display: flex;
|
|
flex-direction: column;
|
|
flex: 1;
|
|
height: 100%;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.floating-window .editor-wrapper {
|
|
flex: 1;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.floating-window .editor {
|
|
height: auto;
|
|
flex: 1;
|
|
}
|
|
|
|
.floating-window #bd-editor-controls {
|
|
z-index: 10;
|
|
height: auto;
|
|
background: var(--background-secondary-alt);
|
|
border: none;
|
|
box-shadow: var(--elevation-low);
|
|
}
|
|
|
|
#floating-editor-window {
|
|
min-width: 340px;
|
|
min-height: 280px;
|
|
max-height: 900px;
|
|
max-width: 750px;
|
|
}
|
|
|
|
.floating-addon-window {
|
|
min-width: 535px;
|
|
min-height: 605px;
|
|
max-height: 90%;
|
|
max-width: 90%;
|
|
} |