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

feat(pagination): Small UI improvements

Browse source
This commit is contained in:
Joxit 2019-05-27 22:23:24 +02:00
parent 7356591292
commit 660a938d6e
No known key found for this signature in database
GPG key ID: F526592B8E012263
4 changed files with 19 additions and 13 deletions
Download patch file Download diff file Expand all files Collapse all files

4
src/style.css
View file

@ -56,6 +56,10 @@ material-card {
margin-bottom: 20px; margin-bottom: 20px;
} }
material-card.header {
min-height: auto;
}
@media screen and (max-width: 950px){ @media screen and (max-width: 950px){
material-card { material-card {
width: 95%; width: 95%;

4
src/tags/catalog.tag
View file

@ -16,17 +16,17 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
--> -->
<catalog> <catalog>
<!-- Begin of tag --> <!-- Begin of tag -->
<material-card ref="catalog-tag" class="catalog"> <material-card ref="catalog-tag" class="catalog header">
<div class="material-card-title-action"> <div class="material-card-title-action">
<h2> <h2>
Repositories of { registryUI.name() } Repositories of { registryUI.name() }
<div class="item-count">{ registryUI.catalog.length } images</div> <div class="item-count">{ registryUI.catalog.length } images</div>
</h2> </h2>
</div> </div>
</material-card>
<div hide="{ registryUI.catalog.loadend }" class="spinner-wrapper"> <div hide="{ registryUI.catalog.loadend }" class="spinner-wrapper">
<material-spinner></material-spinner> <material-spinner></material-spinner>
</div> </div>
</material-card>
<catalog-element each="{ item in registryUI.catalog.repositories }" /> <catalog-element each="{ item in registryUI.catalog.repositories }" />
<script> <script>
registryUI.catalog.instance = this; registryUI.catalog.instance = this;

2
src/tags/tag-history.tag
View file

@ -15,7 +15,7 @@ You should have received a copy of the GNU Affero General Public License
along with this program. If not, see <http://www.gnu.org/licenses/>. along with this program. If not, see <http://www.gnu.org/licenses/>.
--> -->
<tag-history> <tag-history>
<material-card ref="tag-history-tag" class="tag-history"> <material-card ref="tag-history-tag" class="tag-history header">
<div class="material-card-title-action"> <div class="material-card-title-action">
<material-button waves-center="true" rounded="true" waves-color="#ddd"> <material-button waves-center="true" rounded="true" waves-color="#ddd">
<i class="material-icons">arrow_back</i> <i class="material-icons">arrow_back</i>

12
src/tags/taglist.tag
View file

@ -16,8 +16,8 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
--> -->
<taglist> <taglist>
<!-- Begin of tag --> <!-- Begin of tag -->
<material-card ref="taglist-tag" class="taglist" multi-delete={ this.multiDelete } tags={ registryUI.getPage(registryUI.taglist.tags, this.page) }> <material-card class="header">
<div class="material-card-title-action"> <div class="material-card-title-action ">
<material-button waves-center="true" rounded="true" waves-color="#ddd" onclick="registryUI.home();"> <material-button waves-center="true" rounded="true" waves-color="#ddd" onclick="registryUI.home();">
<i class="material-icons">arrow_back</i> <i class="material-icons">arrow_back</i>
</material-button> </material-button>
@ -26,9 +26,11 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
<div class="item-count">{ registryUI.taglist.tags.length } tags</div> <div class="item-count">{ registryUI.taglist.tags.length } tags</div>
</h2> </h2>
</div> </div>
</material-card>
<div hide="{ registryUI.taglist.loadend }" class="spinner-wrapper"> <div hide="{ registryUI.taglist.loadend }" class="spinner-wrapper">
<material-spinner></material-spinner> <material-spinner></material-spinner>
</div> </div>
<material-card ref="taglist-tag" class="taglist" multi-delete={ this.multiDelete } tags={ registryUI.getPage(registryUI.taglist.tags, this.page) } show="{ registryUI.taglist.loadend }" >
<table show="{ registryUI.taglist.loadend }" style="border: none;"> <table show="{ registryUI.taglist.loadend }" style="border: none;">
<thead> <thead>
<tr> <tr>
@ -125,8 +127,8 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
}; };
this.on('mount', function() { this.on('mount', function() {
var toggle = this.tags['material-card'].refs['remove-tag-checkbox'].toggle; var toggle = this.refs['taglist-tag'].refs['remove-tag-checkbox'].toggle;
this.tags['material-card'].refs['remove-tag-checkbox'].toggle = function(e) { this.refs['taglist-tag'].refs['remove-tag-checkbox'].toggle = function(e) {
if (e.altKey) { if (e.altKey) {
self._getRemoveImageTags() self._getRemoveImageTags()
.filter(function(img) { return !img.tags['material-checkbox'].checked; }) .filter(function(img) { return !img.tags['material-checkbox'].checked; })
@ -136,7 +138,7 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
} }
}; };
this.tags['material-card'].refs['remove-tag-checkbox'].on('toggle', function() { this.refs['taglist-tag'].refs['remove-tag-checkbox'].on('toggle', function() {
registryUI.taglist.instance.multiDelete = this.checked; registryUI.taglist.instance.multiDelete = this.checked;
registryUI.taglist.instance.update(); registryUI.taglist.instance.update();
}); });