mirrors/docker-registry-ui
1
0
Fork 0
mirror of https://github.com/Joxit/docker-registry-ui.git synced 2025-04-28 16:09:54 +03:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat(theme): add support for dialogs

Browse source
This commit is contained in:
Joxit 2023-01-06 19:10:13 +01:00
parent 367ca0380c
commit 9b5b935637
No known key found for this signature in database
GPG key ID: F526592B8E012263
10 changed files with 27 additions and 19 deletions
Download patch file Download diff file Expand all files Collapse all files

6
src/components/dialogs/add-registry-url.riot
View file

@ -18,14 +18,14 @@
<material-popup opened="{ props.opened }" onClick="{ props.onClose }">
<div class="material-popup-title">Add your Server ?</div>
<div class="material-popup-content">
<material-input onkeyup="{ onKeyUp }" label="Server URL" label-color="#666" valid="{ registryUrlValidator }"></material-input>
<material-input onkeyup="{ onKeyUp }" label="Server URL" text-color="var(--primary-text)" label-color="var(--neutral-text)" valid="{ registryUrlValidator }"></material-input>
<span>Write your URL without /v2</span>
</div>
<div class="material-popup-action">
<material-button class="dialog-button" waves-color="rgba(158,158,158,.4)" onClick="{ add }" color="#000" inverted>
<material-button class="dialog-button" waves-color="var(--hover-background)" onClick="{ add }" color="inherit" text-color="var(--primary-text)">
Add
</material-button>
<material-button class="dialog-button" waves-color="rgba(158,158,158,.4)" onClick="{ props.onClose }" color="#000" inverted>
<material-button class="dialog-button" waves-color="var(--hover-background)" onClick="{ props.onClose }" color="inherit" text-color="var(--primary-text)">
Cancel
</material-button>
</div>

8
src/components/dialogs/change-registry-url.riot
View file

@ -23,10 +23,10 @@
</select>
</div>
<div class="material-popup-action">
<material-button class="dialog-button" waves-color="rgba(158,158,158,.4)" onClick="{ change }" color="#000" inverted>
<material-button class="dialog-button" waves-color="var(--hover-background)" onClick="{ change }" color="inherit" text-color="var(--primary-text)">
Change
</material-button>
<material-button class="dialog-button" waves-color="rgba(158,158,158,.4)" onClick="{ props.onClose }" color="#000" inverted>
<material-button class="dialog-button" waves-color="var(--hover-background)" onClick="{ props.onClose }" color="inherit" text-color="var(--primary-text)">
Cancel
</material-button>
</div>
@ -70,6 +70,10 @@
-moz-appearance: none;
-webkit-appearance: none;
margin: 1.5em 0;
color: var(--primary-text);
}
:host select option {
background-color: var(--background);
}
</style>
</change-registry-url>

4
src/components/dialogs/confirm-delete-image.riot
View file

@ -23,10 +23,10 @@
</ul>
</div>
<div class="material-popup-action">
<material-button class="dialog-button" waves-color="rgba(158,158,158,.4)" onClick="{ deleteImages }" color="#000" inverted>
<material-button class="dialog-button" waves-color="var(--hover-background)" onClick="{ deleteImages }" color="inherit" text-color="var(--primary-text)">
Delete
</material-button>
<material-button class="dialog-button" waves-color="rgba(158,158,158,.4)" onClick="{ props.onClick }" color="#000" inverted>
<material-button class="dialog-button" waves-color="var(--hover-background)" onClick="{ props.onClick }" color="inherit" text-color="var(--primary-text)">
Cancel
</material-button>
</div>

7
src/components/dialogs/dialogs-menu.riot
View file

@ -105,10 +105,15 @@
</script>
<style>
:host > .material-dropdown-wrapper {
color: #000;
color: var(--primary-text);
list-style-type: disc;
margin-block-start: 0.7em;
}
material-dropdown .material-dropdown-container,
material-dropdown .material-dropdown-container .material-dropdown-item {
background-color: var(--background);
color: var(--primary-text);
}
:host .material-dropdown-wrapper material-dropdown .material-dropdown-container {
right: 0;

11
src/components/dialogs/remove-registry-url.riot
View file

@ -24,9 +24,10 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
<material-button
onClick="{ remove(url) }"
url="{ url }"
waves-color="rgba(158,158,158,.4)"
text-color="var(--neutral-text)"
color="inherit"
waves-color="var(--hover-background)"
waves-center="true"
inverted
icon
>
<i class="material-icons">delete</i>
@ -37,7 +38,7 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
</ul>
</div>
<div class="material-popup-action">
<material-button class="dialog-button" waves-color="rgba(158,158,158,.4)" onClick="{ props.onClose }" color="#000" inverted>
<material-button class="dialog-button" waves-color="rgba(158,158,158,.4)" onClick="{ props.onClose }" color="inherit" text-color="var(--primary-text)">
Close
</material-button>
</div>
@ -59,9 +60,5 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
:host material-popup .popup material-button {
margin-right: 1em;
}
:host material-popup .popup material-button .content i.material-icons {
color: #777;
}
</style>
</remove-registry-url>

2
src/components/tag-list/copy-to-clipboard.riot
View file

@ -19,7 +19,7 @@
<input style="display: none; width: 1px; height: 1px" value="{ getDockerCmd(props) }" />
<material-button
text-color="var(--neutral-text)"
color="var(--background)"
color="inherit"
waves-color="var(--hover-background)"
waves-center="true"
onClick="{ copy }"

2
src/components/tag-list/remove-image.riot
View file

@ -17,7 +17,7 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
<remove-image>
<material-button
text-color="var(--neutral-text)"
color="var(--background)"
color="inherit"
waves-color="var(--hover-background)"
waves-center="true"
title="This will delete the image."

2
src/components/tag-list/tag-history-button.riot
View file

@ -18,7 +18,7 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
<material-button
title="{ buttonTittle() }"
text-color="var(--neutral-text)"
color="var(--background)"
color="inherit"
waves-color="var(--hover-background)"
waves-center="true"
href="{ routeToHistory() }"

2
src/components/tag-list/tag-list.riot
View file

@ -19,7 +19,7 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
<div class="material-card-title-action">
<material-button
text-color="var(--neutral-text)"
color="var(--background)"
color="inherit"
waves-color="var(--hover-background)"
waves-center="true"
href="{ router.home() }"

2
src/style.scss
View file

@ -324,6 +324,8 @@ material-snackbar .toast {
material-popup .popup > .content {
padding: 1em;
max-width: 450px;
background-color: var(--background);
color: var(--primary-text);
}
footer {