fleet/frontend/components/Modal/_styles.scss
Martavis Parker bcfac603f0
Added components to Storybook library (#2768)
* added storybook

* added avatar component

* added button story

* added dropdown button story

* removed unused ellipsis component

* cleaned up modal path

* reorganized enroll secrets table file

* added flash story; removed unused persistent flash

* added fleet ace story

* added checkbox story

* added dropdown story

* added input story

* fixed storybook build

* fixed avatar

* added input with icon story

* added radio button story

* added select targets dropdown story

* added slider story

* added tooltip story

* added info banner story

* removed unused loaders; added spinner story

* added modal story

* removed unused NumberPill

* added pagination story

* lint fixes

* added documentation to run

* modified documentation

* fixed corelayout test

* fixed format for date-fns

* fixed date format that breaks tests

* wait for page
2021-11-06 23:41:09 -07:00

60 lines
1.2 KiB
SCSS

.modal {
&__background {
@include position(fixed, 0 0 0 0);
background-color: rgba($core-fleet-black, 0.4);
z-index: 101;
overflow: scroll;
display: flex;
justify-content: center;
}
&__content {
margin-top: $pad-large;
font-size: $x-small;
.input-field {
width: 100%;
}
}
&__ex {
text-decoration: none;
padding-left: $pad-xsmall;
.button::after {
content: url("../assets/images/icon-close-fleet-blue-16x16@2x.png");
transform: scale(0.5);
border-radius: 0px;
}
.button:hover::after {
content: url("../assets/images/icon-close-vibrant-blue-16x16@2x.png");
transform: scale(0.5);
border-radius: 0px;
}
}
&__header {
font-size: $large;
font-weight: $regular;
text-align: left;
padding-bottom: $pad-xsmall;
border-bottom: 1px solid $ui-fleet-blue-15;
display: flex;
justify-content: space-between;
span {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
}
&__modal_container {
@include position(absolute, 22px null null null);
background-color: $core-white;
width: 658px;
padding: $pad-xxlarge;
border-radius: 8px;
}
}