Skip to content

Commit f795d25

Browse files
author
Fez Vrasta
committed
Merge pull request mdbootstrap#118 from npvn/dialog
Improve styling for dialogs
2 parents 2a610b1 + a45d1a9 commit f795d25

10 files changed

Lines changed: 191 additions & 75 deletions

File tree

‎dist/css/material-wfont.css‎

Lines changed: 37 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -3523,20 +3523,6 @@ select.form-control.focus {
35233523
legend {
35243524
border-bottom: 0;
35253525
}
3526-
.modal-content {
3527-
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
3528-
border-radius: 0;
3529-
border: 0;
3530-
}
3531-
.modal-content .modal-header {
3532-
border-bottom: 0;
3533-
}
3534-
.modal-content .modal-footer {
3535-
border-top: 0;
3536-
}
3537-
.modal-content .modal-footer .btn + .btn {
3538-
margin-bottom: 10px;
3539-
}
35403526
.list-group {
35413527
border-radius: 0;
35423528
}
@@ -4215,6 +4201,43 @@ fieldset[disabled] .navbar .btn-link:focus {
42154201
.icon-material-lightgrey {
42164202
color: #ececec;
42174203
}
4204+
.modal-content {
4205+
box-shadow: 0 19px 38px rgba(0, 0, 0, 0.3), 0 15px 12px rgba(0, 0, 0, 0.22);
4206+
margin-top: 10em;
4207+
border-radius: 2px;
4208+
border: none;
4209+
}
4210+
.modal-content .modal-header {
4211+
border-bottom: none;
4212+
padding: 24px;
4213+
padding-bottom: 0;
4214+
}
4215+
.modal-content .modal-body {
4216+
padding: 24px;
4217+
padding-bottom: 0;
4218+
}
4219+
.modal-content .modal-footer {
4220+
border-top: none;
4221+
padding: 24px;
4222+
}
4223+
.modal-content .modal-footer button {
4224+
margin: 0;
4225+
padding-left: 16px;
4226+
padding-right: 16px;
4227+
width: auto;
4228+
}
4229+
.modal-content .modal-footer button.pull-left {
4230+
padding-left: 5px;
4231+
padding-right: 5px;
4232+
position: relative;
4233+
left: -5px;
4234+
}
4235+
.modal-content .modal-footer button + button {
4236+
margin-bottom: 16px;
4237+
}
4238+
.modal-backdrop {
4239+
display: none;
4240+
}
42184241
.snackbar {
42194242
background-color: #323232;
42204243
color: rgba(255, 255, 255, 0.84);

‎dist/css/material-wfont.min.css‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎dist/css/material.css‎

Lines changed: 37 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -3522,20 +3522,6 @@ select.form-control.focus {
35223522
legend {
35233523
border-bottom: 0;
35243524
}
3525-
.modal-content {
3526-
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
3527-
border-radius: 0;
3528-
border: 0;
3529-
}
3530-
.modal-content .modal-header {
3531-
border-bottom: 0;
3532-
}
3533-
.modal-content .modal-footer {
3534-
border-top: 0;
3535-
}
3536-
.modal-content .modal-footer .btn + .btn {
3537-
margin-bottom: 10px;
3538-
}
35393525
.list-group {
35403526
border-radius: 0;
35413527
}
@@ -4214,6 +4200,43 @@ fieldset[disabled] .navbar .btn-link:focus {
42144200
.icon-material-lightgrey {
42154201
color: #ececec;
42164202
}
4203+
.modal-content {
4204+
box-shadow: 0 19px 38px rgba(0, 0, 0, 0.3), 0 15px 12px rgba(0, 0, 0, 0.22);
4205+
margin-top: 10em;
4206+
border-radius: 2px;
4207+
border: none;
4208+
}
4209+
.modal-content .modal-header {
4210+
border-bottom: none;
4211+
padding: 24px;
4212+
padding-bottom: 0;
4213+
}
4214+
.modal-content .modal-body {
4215+
padding: 24px;
4216+
padding-bottom: 0;
4217+
}
4218+
.modal-content .modal-footer {
4219+
border-top: none;
4220+
padding: 24px;
4221+
}
4222+
.modal-content .modal-footer button {
4223+
margin: 0;
4224+
padding-left: 16px;
4225+
padding-right: 16px;
4226+
width: auto;
4227+
}
4228+
.modal-content .modal-footer button.pull-left {
4229+
padding-left: 5px;
4230+
padding-right: 5px;
4231+
position: relative;
4232+
left: -5px;
4233+
}
4234+
.modal-content .modal-footer button + button {
4235+
margin-bottom: 16px;
4236+
}
4237+
.modal-backdrop {
4238+
display: none;
4239+
}
42174240
.snackbar {
42184241
background-color: #323232;
42194242
color: rgba(255, 255, 255, 0.84);

‎dist/css/material.min.css‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎less/_dialogs.import.less‎

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
.modal-content {
2+
.shadow-z-5();
3+
margin-top: 10em; //XXX TODO Need a better way to vertically position the dialog
4+
border-radius: 2px;
5+
border: none;
6+
.modal-header {
7+
border-bottom: none;
8+
padding: 24px;
9+
padding-bottom: 0;
10+
}
11+
.modal-body {
12+
padding: 24px;
13+
padding-bottom: 0;
14+
}
15+
.modal-footer {
16+
border-top: none;
17+
padding: 24px;
18+
button {
19+
margin: 0;
20+
padding-left: 16px;
21+
padding-right: 16px;
22+
width: auto;
23+
&.pull-left {
24+
padding-left: 5px;
25+
padding-right: 5px;
26+
position: relative;
27+
left: -5px;
28+
}
29+
}
30+
button+button {
31+
margin-bottom: 16px;
32+
}
33+
}
34+
}
35+
36+
.modal-backdrop {
37+
display: none;
38+
}

‎less/material.less‎

Lines changed: 1 addition & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -47,21 +47,6 @@ legend {
4747
border-bottom: 0;
4848
}
4949

50-
.modal-content {
51-
.shadow-z-2();
52-
border-radius: 0;
53-
border: 0;
54-
.modal-header {
55-
border-bottom: 0;
56-
}
57-
.modal-footer {
58-
border-top: 0;
59-
.btn+.btn {
60-
margin-bottom: 10px;
61-
}
62-
}
63-
}
64-
6550
// Lists
6651
@import "_lists.import.less";
6752

@@ -112,6 +97,7 @@ legend {
11297

11398
@import "_icons.import.less";
11499

100+
@import "_dialogs.import.less";
115101

116102
// External plugins
117103
@import "_plugin-snackbarjs.import.less";

‎template/material/css/material-wfont.css‎

Lines changed: 37 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -3523,20 +3523,6 @@ select.form-control.focus {
35233523
legend {
35243524
border-bottom: 0;
35253525
}
3526-
.modal-content {
3527-
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
3528-
border-radius: 0;
3529-
border: 0;
3530-
}
3531-
.modal-content .modal-header {
3532-
border-bottom: 0;
3533-
}
3534-
.modal-content .modal-footer {
3535-
border-top: 0;
3536-
}
3537-
.modal-content .modal-footer .btn + .btn {
3538-
margin-bottom: 10px;
3539-
}
35403526
.list-group {
35413527
border-radius: 0;
35423528
}
@@ -4215,6 +4201,43 @@ fieldset[disabled] .navbar .btn-link:focus {
42154201
.icon-material-lightgrey {
42164202
color: #ececec;
42174203
}
4204+
.modal-content {
4205+
box-shadow: 0 19px 38px rgba(0, 0, 0, 0.3), 0 15px 12px rgba(0, 0, 0, 0.22);
4206+
margin-top: 10em;
4207+
border-radius: 2px;
4208+
border: none;
4209+
}
4210+
.modal-content .modal-header {
4211+
border-bottom: none;
4212+
padding: 24px;
4213+
padding-bottom: 0;
4214+
}
4215+
.modal-content .modal-body {
4216+
padding: 24px;
4217+
padding-bottom: 0;
4218+
}
4219+
.modal-content .modal-footer {
4220+
border-top: none;
4221+
padding: 24px;
4222+
}
4223+
.modal-content .modal-footer button {
4224+
margin: 0;
4225+
padding-left: 16px;
4226+
padding-right: 16px;
4227+
width: auto;
4228+
}
4229+
.modal-content .modal-footer button.pull-left {
4230+
padding-left: 5px;
4231+
padding-right: 5px;
4232+
position: relative;
4233+
left: -5px;
4234+
}
4235+
.modal-content .modal-footer button + button {
4236+
margin-bottom: 16px;
4237+
}
4238+
.modal-backdrop {
4239+
display: none;
4240+
}
42184241
.snackbar {
42194242
background-color: #323232;
42204243
color: rgba(255, 255, 255, 0.84);

‎template/material/css/material-wfont.min.css‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎template/material/css/material.css‎

Lines changed: 37 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -3522,20 +3522,6 @@ select.form-control.focus {
35223522
legend {
35233523
border-bottom: 0;
35243524
}
3525-
.modal-content {
3526-
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
3527-
border-radius: 0;
3528-
border: 0;
3529-
}
3530-
.modal-content .modal-header {
3531-
border-bottom: 0;
3532-
}
3533-
.modal-content .modal-footer {
3534-
border-top: 0;
3535-
}
3536-
.modal-content .modal-footer .btn + .btn {
3537-
margin-bottom: 10px;
3538-
}
35393525
.list-group {
35403526
border-radius: 0;
35413527
}
@@ -4214,6 +4200,43 @@ fieldset[disabled] .navbar .btn-link:focus {
42144200
.icon-material-lightgrey {
42154201
color: #ececec;
42164202
}
4203+
.modal-content {
4204+
box-shadow: 0 19px 38px rgba(0, 0, 0, 0.3), 0 15px 12px rgba(0, 0, 0, 0.22);
4205+
margin-top: 10em;
4206+
border-radius: 2px;
4207+
border: none;
4208+
}
4209+
.modal-content .modal-header {
4210+
border-bottom: none;
4211+
padding: 24px;
4212+
padding-bottom: 0;
4213+
}
4214+
.modal-content .modal-body {
4215+
padding: 24px;
4216+
padding-bottom: 0;
4217+
}
4218+
.modal-content .modal-footer {
4219+
border-top: none;
4220+
padding: 24px;
4221+
}
4222+
.modal-content .modal-footer button {
4223+
margin: 0;
4224+
padding-left: 16px;
4225+
padding-right: 16px;
4226+
width: auto;
4227+
}
4228+
.modal-content .modal-footer button.pull-left {
4229+
padding-left: 5px;
4230+
padding-right: 5px;
4231+
position: relative;
4232+
left: -5px;
4233+
}
4234+
.modal-content .modal-footer button + button {
4235+
margin-bottom: 16px;
4236+
}
4237+
.modal-backdrop {
4238+
display: none;
4239+
}
42174240
.snackbar {
42184241
background-color: #323232;
42194242
color: rgba(255, 255, 255, 0.84);

‎template/material/css/material.min.css‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)