Fix dialog sizes

This commit is contained in:
Ray Schamp 2015-08-11 12:18:58 -04:00
parent 5ba04659e7
commit 5347ecd089
5 changed files with 19 additions and 50 deletions

View file

@ -741,7 +741,9 @@ picture {
transition: opacity 0.25s ease; transition: opacity 0.25s ease;
border-radius: 5px; border-radius: 5px;
padding: 1.5em; padding: 1.5em;
position: relative; } position: relative;
display: table;
margin: auto; }
.modal .modal-inner a.cta { .modal .modal-inner a.cta {
color: white; color: white;
display: inline-block; display: inline-block;
@ -772,8 +774,7 @@ dialog {
dialog section { dialog section {
background-color: #3f5975; background-color: #3f5975;
color: #fff; color: #fff;
/* Kill margin collapse */ padding: 0.75em; }
padding: 1px; }
dialog section:last-child { dialog section:last-child {
background-color: #fff; background-color: #fff;
padding: 0.75em; padding: 0.75em;
@ -1016,31 +1017,12 @@ body > section {
body #home { body #home {
display: block; } display: block; }
.modal.n-children-1 dialog { .modal dialog {
width: 100%; } width: 25em;
.modal.n-children-1 .modal-inner {
max-width: 25%;
margin-left: auto;
margin-right: auto; }
.modal.n-children-1 .modal-inner::after {
clear: both;
content: "";
display: table; }
.modal.n-children-2 dialog {
float: left; float: left;
display: block; margin-right: 12px; }
margin-right: 2.53165%; .modal dialog:last-child {
width: 48.73418%; }
.modal.n-children-2 dialog:last-child {
margin-right: 0; }
.modal.n-children-2 .modal-inner {
max-width: 50%;
margin-left: auto;
margin-right: auto; } margin-right: auto; }
.modal.n-children-2 .modal-inner::after {
clear: both;
content: "";
display: table; }
.extension-file section:first-child { .extension-file section:first-child {
/* Add a border equal to the number of featured extensions - 1 */ /* Add a border equal to the number of featured extensions - 1 */

File diff suppressed because one or more lines are too long

View file

@ -29,8 +29,7 @@ dialog {
section { section {
background-color: $alt-background-color; background-color: $alt-background-color;
color: $alt-font-color; color: $alt-font-color;
/* Kill margin collapse */ padding: 2 * $vertical-base;
padding: 1px;
} }
section:last-child { section:last-child {

View file

@ -89,6 +89,8 @@
border-radius: $base-border-radius; border-radius: $base-border-radius;
padding: $modal-padding / 2; padding: $modal-padding / 2;
position: relative; position: relative;
display: table;
margin: auto;
a.cta { a.cta {
color: white; color: white;

View file

@ -61,27 +61,13 @@ body {
} }
} }
.modal dialog {
width: 25em;
float: left;
margin-right: $gutter;
.modal { &:last-child {
margin-right: auto;
&.n-children-1 {
dialog {
width: 100%;
}
.modal-inner {
@include outer-container(25%);
}
}
&.n-children-2 {
dialog {
@include span-columns(3 of 6);
}
.modal-inner {
@include outer-container(50%);
}
} }
} }