Skip to content

Commit 2a8dea5

Browse files
ScIT-RaphaelScIT-Raphael
authored
Revert "Replace jQuery UI dialogs with <dialog> (hestiacp#3401)" (hestiacp#3402)
This reverts commit 9c2004f.
1 parent 9c2004f commit 2a8dea5

33 files changed

+348
-218
lines changed

‎web/css/src/dependencies/jquery-ui.css‎

Lines changed: 101 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,98 @@
11
/*
2-
* "Tabs" CSS from jQuery UI v1.13.2
2+
* Some parts of jQuery UI v1.13.2
33
*/
44

5+
/* Dialog */
6+
.ui-dialog {
7+
position: absolute;
8+
top: 0;
9+
left: 0;
10+
padding: 0.2em;
11+
outline: 0;
12+
}
13+
.ui-dialog .ui-dialog-titlebar {
14+
padding: 0.4em 1em;
15+
position: relative;
16+
}
17+
.ui-dialog .ui-dialog-title {
18+
float: left;
19+
margin: 0.1em 0;
20+
white-space: nowrap;
21+
width: 90%;
22+
overflow: hidden;
23+
text-overflow: ellipsis;
24+
}
25+
.ui-dialog .ui-dialog-titlebar-close {
26+
position: absolute;
27+
right: 0.3em;
28+
top: 50%;
29+
width: 20px;
30+
margin: -10px 0 0 0;
31+
padding: 1px;
32+
height: 20px;
33+
}
34+
.ui-dialog .ui-dialog-content {
35+
position: relative;
36+
border: 0;
37+
padding: 0.5em 1em;
38+
background: none;
39+
overflow: auto;
40+
}
41+
.ui-dialog .ui-dialog-buttonpane {
42+
text-align: left;
43+
border-width: 1px 0 0 0;
44+
background-image: none;
45+
margin-top: 0.5em;
46+
padding: 0.3em 1em 0.5em 0.4em;
47+
}
48+
.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
49+
float: right;
50+
}
51+
.ui-dialog .ui-dialog-buttonpane button {
52+
margin: 0.5em 0.4em 0.5em 0;
53+
cursor: pointer;
54+
}
55+
.ui-dialog .ui-resizable-n {
56+
height: 2px;
57+
top: 0;
58+
}
59+
.ui-dialog .ui-resizable-e {
60+
width: 2px;
61+
right: 0;
62+
}
63+
.ui-dialog .ui-resizable-s {
64+
height: 2px;
65+
bottom: 0;
66+
}
67+
.ui-dialog .ui-resizable-w {
68+
width: 2px;
69+
left: 0;
70+
}
71+
.ui-dialog .ui-resizable-se,
72+
.ui-dialog .ui-resizable-sw,
73+
.ui-dialog .ui-resizable-ne,
74+
.ui-dialog .ui-resizable-nw {
75+
width: 7px;
76+
height: 7px;
77+
}
78+
.ui-dialog .ui-resizable-se {
79+
right: 0;
80+
bottom: 0;
81+
}
82+
.ui-dialog .ui-resizable-sw {
83+
left: 0;
84+
bottom: 0;
85+
}
86+
.ui-dialog .ui-resizable-ne {
87+
right: 0;
88+
top: 0;
89+
}
90+
.ui-dialog .ui-resizable-nw {
91+
left: 0;
92+
top: 0;
93+
}
94+
95+
/* Tabs */
596
.ui-tabs {
697
position: relative; /* position: relative prevents IE scroll bug (element with position: relative inside container with overflow: auto appear as "fixed") */
798
padding: 0.2em;
@@ -54,3 +145,12 @@
54145
.ui-helper-clearfix:after {
55146
clear: both;
56147
}
148+
149+
/* Overlays */
150+
.ui-widget-overlay {
151+
position: fixed;
152+
top: 0;
153+
left: 0;
154+
width: 100%;
155+
height: 100%;
156+
}

‎web/css/src/themes/dark.css‎

Lines changed: 19 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -566,7 +566,7 @@ strong {
566566
text-shadow: 0 1px 1px rgb(0 0 0 / 35%);
567567
font-weight: 400;
568568
border-color: #707070;
569-
background: #303030;
569+
background: rgb(48 48 48);
570570
background: linear-gradient(
571571
0deg,
572572
rgb(48 48 48 / 100%) 0%,
@@ -591,22 +591,8 @@ strong {
591591
inset 0 0 3px rgb(0 0 0 / 65%);
592592
}
593593

594+
&:active,
594595
&:focus {
595-
color: #eee;
596-
text-shadow: 0 1px 1px rgb(0 0 0 / 35%);
597-
border-color: #0090ff;
598-
background: #303030;
599-
background: linear-gradient(
600-
0deg,
601-
rgb(48 48 48 / 100%) 0%,
602-
rgb(53 53 53 / 100%) 35%,
603-
rgb(69 69 69 / 100%) 100%
604-
);
605-
box-shadow: 0 1px 4px rgb(0 0 0 / 20%), inset 0 0 1px rgb(20 20 20 / 100%),
606-
inset 0 0 3px rgb(0 0 0 / 50%);
607-
}
608-
609-
&:active {
610596
color: #d4d4d4;
611597
text-shadow: 0 -1px 1px rgb(0 0 0 / 55%);
612598
border-color: #0066b4;
@@ -774,22 +760,31 @@ strong {
774760
/* Modals
775761
========================================================================== */
776762

777-
.modal {
763+
.ui-dialog .ui-dialog-buttonpane {
764+
border-top: 1px solid #404040;
765+
}
766+
767+
.ui-dialog .ui-dialog-buttonpane button {
768+
box-shadow: 0 1px 4px rgb(0 0 0 / 10%), inset 0 0 1px #000, inset 0 0 3px rgb(0 0 0 / 50%);
769+
}
770+
771+
.ui-dialog {
778772
background-color: rgb(45 45 45 / 95%);
779-
border-color: rgb(80 80 80 / 97%);
773+
border: 1px solid rgb(80 80 80 / 97%);
780774
box-shadow: inset 0 1px 3px rgb(0 0 0 / 25%), 0 8px 25px rgb(0 0 0 / 90%);
775+
}
781776

782-
& p {
783-
color: #dadada;
784-
}
777+
.ui-dialog .ui-dialog-content {
778+
color: #dadada;
785779
}
786780

787-
.modal-title {
781+
.ui-dialog .ui-dialog-title {
788782
color: #f12569;
783+
font-weight: 600;
789784
}
790785

791-
.modal-options {
792-
border-top: 1px solid #404040;
786+
.ui-widget-header a {
787+
color: #cacaca;
793788
}
794789

795790
/* Shortcuts panel

‎web/css/src/themes/default.css‎

Lines changed: 42 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1719,38 +1719,60 @@
17191719
/* Modals
17201720
========================================================================== */
17211721

1722-
.modal {
1723-
text-transform: none;
1724-
border-radius: var(--border-radius-base);
1725-
box-shadow: inset 0 1px 3px rgb(0 0 0 / 25%), 0 8px 40px 0 rgb(0 0 0 / 35%);
1722+
.dialog {
1723+
display: none;
1724+
}
1725+
1726+
/* Hide the default close button in dialog header */
1727+
.ui-dialog-titlebar-close {
1728+
display: none;
1729+
}
1730+
1731+
/* Set dialog z-index */
1732+
.ui-front {
1733+
z-index: 2;
1734+
}
1735+
1736+
.ui-dialog {
1737+
font-family: Exo, system-ui;
1738+
font-weight: 500;
17261739
background-color: rgb(255 255 255 / 90%);
1740+
box-shadow: inset 0 1px 3px rgb(0 0 0 / 25%), 0 8px 40px 0 rgb(0 0 0 / 35%);
1741+
border-radius: 6px;
17271742
border: 1px solid rgb(255 255 255 / 98%);
1728-
min-width: 360px;
1729-
max-width: 550px;
1743+
text-align: center;
1744+
}
17301745

1731-
& p {
1732-
color: #535353;
1733-
text-align: center;
1734-
padding: 10px 20px 30px;
1735-
}
1746+
.ui-dialog .ui-dialog-content {
1747+
color: #535353;
1748+
padding: 20px 26px 30px;
17361749
}
17371750

1738-
.modal-title {
1751+
.ui-dialog .ui-dialog-title {
1752+
margin: 0;
17391753
color: #305ba9;
17401754
font-size: 1rem;
1755+
text-transform: none;
1756+
letter-spacing: -0.01em;
17411757
text-align: center;
1742-
padding: 15px;
1758+
float: none;
1759+
font-weight: 500;
1760+
}
1761+
1762+
.ui-widget-overlay {
1763+
background-color: rgb(0 0 0 / 60%);
17431764
}
17441765

1745-
.modal-options {
1766+
.ui-dialog .ui-dialog-buttonpane {
1767+
border-color: #fff;
17461768
box-shadow: inset 0 0 2px rgb(0 0 0 / 25%);
1747-
display: flex;
1748-
justify-content: flex-end;
1749-
padding: 10px;
1769+
margin-top: 0;
1770+
padding: 0;
1771+
}
17501772

1751-
& button {
1752-
margin-left: 6px;
1753-
}
1773+
.ui-dialog .ui-dialog-buttonpane button {
1774+
margin: 0.5em 0.5em 0.5em 0;
1775+
box-shadow: 0 1px 4px rgb(0 0 0 / 20%), inset 0 0 1px #fff, inset 0 0 3px rgb(255 255 255 / 50%);
17541776
}
17551777

17561778
/* Shortcuts panel

‎web/css/src/themes/flat.css‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -156,8 +156,12 @@ strong {
156156
/* Modals
157157
========================================================================== */
158158

159-
.modal {
159+
.ui-dialog {
160160
box-shadow: 0 2px 11px 0 rgb(0 0 0 / 50%);
161+
162+
& .ui-dialog-buttonpane button:nth-of-type(2) {
163+
box-shadow: none;
164+
}
161165
}
162166

163167
/* Login

‎web/css/src/themes/vestia.css‎

Lines changed: 14 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -316,18 +316,28 @@ strong {
316316
/* Modals
317317
========================================================================== */
318318

319-
.modal {
319+
.ui-dialog {
320320
box-shadow: 0 2px 11px 0 rgb(0 0 0 / 50%);
321321

322-
& p {
323-
color: #333;
322+
& .ui-dialog-buttonpane button {
323+
box-shadow: none;
324324
}
325325
}
326326

327-
.modal-title {
327+
.ui-widget,
328+
.ui-dialog,
329+
.ui-dialog .ui-dialog-title {
330+
font-family: var(--font-family);
331+
}
332+
333+
.ui-dialog .ui-dialog-title {
328334
color: #111;
329335
}
330336

337+
.ui-dialog .ui-dialog-content {
338+
color: #333;
339+
}
340+
331341
/* Forms
332342
========================================================================== */
333343

‎web/css/themes/dark.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.

‎web/css/themes/default.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.

‎web/css/themes/flat.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.

‎web/css/themes/vestia.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)