Docker/portainer
Docker/portainer
1
0
Fork 0
mirror of https://github.com/portainer/portainer.git synced 2025-08-05 05:45:22 +02:00
Code Issues Releases Activity

refactor(ui/modals): replace bootbox with react solution [EE-4541] (#8010)

Browse source
This commit is contained in:
Chaim Lev-Ari 2023-02-14 13:49:41 +05:30 • committed by GitHub
parent 392c7f74b8
commit e66dea44e3
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
111 changed files with 1330 additions and 1562 deletions
Download patch file Download diff file Expand all files Collapse all files

71
app/assets/css/app.css
View file

@ -401,34 +401,6 @@ input[type='checkbox'] {
float: none !important;
}
.bootbox-form .bootbox-input-checkbox {
display: none;
}
.bootbox-form .visible {
position: initial !important;
display: initial !important;
margin-left: 10px !important;
margin-top: -2px !important;
}
.bootbox-form label {
padding-left: 0;
}
.bootbox-checkbox-list {
max-height: 200px;
overflow-y: auto;
background-color: var(--white-color);
border: 1px solid var(--grey-48);
border-radius: 4px;
}
:root[theme='dark'] .bootbox-checkbox-list,
:root[theme='highcontrast'] .bootbox-checkbox-list {
background-color: var(--bg-modal-content-color);
}
.small-select {
display: inline-block;
padding: 0px 6px;
@ -440,10 +412,6 @@ input[type='checkbox'] {
font-size: 14px;
}
.bootbox-form .checkbox i {
margin-left: 21px;
}
.visualizer_container {
display: flex;
flex-direction: row;
@ -584,20 +552,6 @@ input[type='checkbox'] {
padding: 0 !important;
}
.modal::before {
content: '';
display: inline-block;
height: 100%;
vertical-align: middle;
margin-right: -4px;
}
.modal-dialog {
display: inline-block;
text-align: left;
vertical-align: middle;
}
.striked::after {
border-bottom: 0.2em solid var(--grey-26);
content: '';
@ -630,17 +584,6 @@ input[type='checkbox'] {
margin-right: -50%;
}
/*bootbox override */
.modal-open {
padding-right: 0 !important;
}
.image-zoom-modal .modal-dialog {
width: 80%;
}
/*!bootbox override*/
/*toaster override*/
#toast-container > div {
opacity: 0.9;
@ -732,20 +675,6 @@ json-tree .branch-preview {
cursor: not-allowed;
}
/* used for bootbox prompt with inputType radio */
.form-check.radio {
margin-left: 15px;
}
.inline-text {
display: inline;
position: absolute;
font-family: 'Montserrat';
font-size: smaller;
margin-left: 5px;
margin-right: 5px;
}
.web-editor {
background-color: var(--bg-webeditor-color);
border-radius: 8px;

60
app/assets/css/bootstrap-override.css vendored
View file

@ -284,65 +284,7 @@ input:checked + .slider:before {
width: 450px;
}
.modal-content {
padding: 20px;
}
.background-error {
padding-top: 55px;
background-image: url(../images/icon-error.svg);
background-repeat: no-repeat;
background-position: top left;
}
.background-warning {
padding-top: 55px;
background-image: url(../images/icon-warning.svg);
background-repeat: no-repeat;
background-position: top left;
}
.modal-header {
margin-bottom: 10px;
padding: 0px;
border-bottom: none;
}
.modal-header .close {
margin-top: 0px;
}
.modal-header .modal-title {
font-weight: bold;
}
.modal-body {
padding: 10px 0px;
border-bottom: none;
}
.modal-body .bootbox-body {
font-size: 12px;
color: var(--text-bootbox);
}
.modal-footer {
padding: 10px 0px;
border-top: none;
display: flex;
}
.modal-footer .bootbox-cancel {
width: 100%;
}
.modal-footer .bootbox-accept {
width: 100%;
}
.bootbox-checkbox-list {
border: 0px;
}
/* !Modal */
/* Status Indicator Inside Table Section Label Style */
.table .label {

22
app/assets/css/vendor-override.css
View file

@ -17,8 +17,7 @@
background-color: var(--bg-hover-table-color);
}
.switch i,
.bootbox-form .checkbox i {
.switch i {
background: var(--bg-switch-box-color);
}
@ -77,25 +76,6 @@ fieldset[disabled] .form-control {
background-color: var(--bg-modal-content-color);
}
.modal-header {
border-bottom: 1px solid var(--border-modal-header-color);
}
.modal-footer {
border-top: 1px solid var(--border-modal-header-color);
}
.close {
color: var(--button-close-color);
opacity: var(--button-opacity);
}
.close:hover,
.close:focus {
color: var(--button-close-color);
opacity: var(--button-opacity-hover);
}
code {
color: var(--text-code-color);
background-color: var(--bg-code-color);