Commit 8d56fe3b by Kevin Luo

Fix modal css to be hidden immediately

Before the leanModal content css was applied after the js class
was added to the body element. This causes leanModals to
display for a split second before being hidden. This fix removes
the need for the explicit css rule for static pages preview.
parent 302d3e6e
......@@ -666,67 +666,63 @@ hr.divider {
}
}
// +JS Dependent
// ====================
body.js {
// lean/simple modal window
.content-modal {
@include border-bottom-radius(2px);
@include box-sizing(border-box);
box-shadow: 0 2px 4px $shadow-d1;
position: relative;
display: none;
width: 700px;
overflow: hidden;
border: 1px solid $gray-d1;
padding: ($baseline);
background: $white;
.action-modal-close {
@include transition(top $tmg-f3 ease-in-out 0s);
@include border-bottom-radius(3px);
position: absolute;
top: -3px;
right: $baseline;
padding: ($baseline/4) ($baseline/2) 0 ($baseline/2);
background: $gray-l3;
text-align: center;
.label {
@extend %cont-text-sr;
}
.icon {
@extend %t-action1;
color: $white;
}
// lean/simple modal window
.content-modal {
@include border-bottom-radius(2px);
@include box-sizing(border-box);
position: relative;
display: none;
width: 700px;
padding: ($baseline);
border: 1px solid $gray-d1;
background: $white;
box-shadow: 0 2px 4px $shadow-d1;
overflow: hidden;
&:hover {
background: $blue;
top: 0;
}
.action-modal-close {
@include transition(top $tmg-f3 ease-in-out 0s);
@include border-bottom-radius(3px);
position: absolute;
top: -3px;
right: $baseline;
padding: ($baseline/4) ($baseline/2) 0 ($baseline/2);
background: $gray-l3;
text-align: center;
.label {
@extend %cont-text-sr;
}
img {
@include box-sizing(border-box);
width: 100%;
overflow-y: scroll;
padding: ($baseline/10);
border: 1px solid $gray-l4;
.icon {
@extend %t-action1;
color: $white;
}
.title {
@extend %t-title5;
@extend %t-strong;
margin: 0 0 ($baseline/2) 0;
color: $gray-d3;
&:hover {
top: 0;
background: $blue;
}
}
.description {
@extend %t-copy-sub2;
margin-top: ($baseline/2);
color: $gray-l1;
}
img {
@include box-sizing(border-box);
width: 100%;
overflow-y: scroll;
padding: ($baseline/10);
border: 1px solid $gray-l4;
}
.title {
@extend %t-title5;
@extend %t-strong;
margin: 0 0 ($baseline/2) 0;
color: $gray-d3;
}
.description {
@extend %t-copy-sub2;
margin-top: ($baseline/2);
color: $gray-l1;
}
}
......@@ -405,10 +405,3 @@ table {
border-spacing: 0;
}
/**
* Hide staticpage preview on load (Studio).
*/
#preview-lms-staticpages {
display: none;
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment