mirror of
https://github.com/atom/atom.git
synced 2026-02-09 22:24:59 -05:00
126 lines
2.4 KiB
Plaintext
126 lines
2.4 KiB
Plaintext
|
|
@modal-padding: @ui-padding/2 @ui-padding/1.5;
|
|
@modal-width: @ui-size * 50;
|
|
|
|
atom-panel-container.modal {
|
|
position: absolute;
|
|
top: 0; left: 0; right: 0;
|
|
}
|
|
|
|
atom-panel.modal {
|
|
position: relative;
|
|
width: 100%;
|
|
max-width: @modal-width;
|
|
margin: 0 auto;
|
|
left: initial;
|
|
color: @text-color;
|
|
background-color: transparent;
|
|
padding: @ui-padding/2;
|
|
|
|
&.from-top {
|
|
top: @component-padding * 5;
|
|
}
|
|
|
|
atom-text-editor[mini] {
|
|
margin-bottom: @ui-padding/2;
|
|
}
|
|
|
|
.select-list ol.list-group,
|
|
&.select-list ol.list-group {
|
|
border: 1px solid @overlay-border-color;
|
|
background-color: lighten(@overlay-background-color, 2%);
|
|
|
|
&:empty {
|
|
border: none;
|
|
margin-top: 0;
|
|
}
|
|
|
|
li {
|
|
padding: @modal-padding;
|
|
line-height: @ui-line-height;
|
|
border-bottom: 1px solid @overlay-border-color;
|
|
|
|
&:last-of-type {
|
|
border-bottom: none;
|
|
}
|
|
|
|
.icon::before {
|
|
margin-left: 1px;
|
|
}
|
|
|
|
.icon.status {
|
|
float: right;
|
|
margin-left: @ui-padding-icon;
|
|
&:before {
|
|
margin-left: 0;
|
|
margin-right: 0;
|
|
}
|
|
}
|
|
|
|
&.selected {
|
|
.status.icon {
|
|
color: @text-color-selected;
|
|
}
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
.select-list .key-binding {
|
|
margin-top: -1px;
|
|
margin-left: @ui-padding/2;
|
|
margin-right: calc( -@ui-padding/3 ~"+" 1px);
|
|
}
|
|
|
|
.select-list .primary-line {
|
|
display: block;
|
|
}
|
|
|
|
& > * {
|
|
position: relative; // fixes stacking order
|
|
}
|
|
|
|
.command-palette {
|
|
padding: 1px; // prevents the box-shadow of the input from being cut off
|
|
background-color: @overlay-background-color;
|
|
}
|
|
|
|
|
|
// Container
|
|
&:before {
|
|
content: "";
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
z-index: 0;
|
|
background-color: @overlay-background-color;
|
|
border-radius: @component-border-radius*2;
|
|
box-shadow: 0 6px 12px -2px hsla(0,0%,0%,.4);
|
|
}
|
|
|
|
// Backdrop
|
|
// TODO: Add extra wrapper to translate individually or easier positioning
|
|
|
|
&:after {
|
|
content: "";
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
z-index: -1;
|
|
background: @overlay-backdrop-color;
|
|
opacity: @overlay-backdrop-opacity;
|
|
backface-visibility: hidden; // fixes scrollbar on retina screens
|
|
-webkit-animation: overlay-fade .24s cubic-bezier(0.215, 0.61, 0.355, 1);
|
|
}
|
|
|
|
@-webkit-keyframes overlay-fade {
|
|
0% { opacity: 0; }
|
|
100% { opacity: @overlay-backdrop-opacity; }
|
|
}
|
|
|
|
}
|