[riot-mui] Add new riot-mui footer (#17, kysonic/riot-mui#51, kysonic/riot-mui#52)

This commit is contained in:
Joxit
2017-10-11 00:01:45 +02:00
parent 93a8d4a188
commit 215733c6e4
4 changed files with 39 additions and 38 deletions

View File

@@ -28,7 +28,7 @@
"material-design-lite": "^1.1",
"pump": "^1.0.2",
"riot": "^3.7.0",
"riot-mui": "^0.1.0",
"riot-mui": "^0.1.1",
"riotgear-router": "^1.3.1",
"uglify-js": "^3.0.28",
"uglify-js-harmony": "^2.7.7"

View File

@@ -33,23 +33,7 @@
</head>
<body>
<!-- Always shows a header, even in smaller screens. -->
<div class="mdl-layout mdl-js-layout mdl-layout--fixed-header">
<main class="mdl-layout__content">
<div class="page-content">
<app></app>
</div>
</main>
<footer class="mdl-mini-footer">
<div class="mdl-mini-footer__left-section">
<div class="mdl-logo"><a href="https://joxit.github.io/docker-registry-ui/">Docker Registry UI</a></div>
<ul class="mdl-mini-footer__link-list">
<li><a href="https://github.com/Joxit/docker-registry-ui">Contribute on GitHub</a></li>
<li><a href="https://github.com/Joxit/docker-registry-ui/blob/master/LICENSE">Privacy &amp; Terms</a></li>
</ul>
</div>
</footer>
</div>
<app></app>
<!-- build:js scripts/vendor.js -->
<script src="../node_modules/riot/riot+compiler.min.js"></script>
<script src="../node_modules/riotgear-router/dist/rg-router.min.js"></script>

View File

@@ -18,24 +18,19 @@
html > body {
font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif !important;
}
html, body {
margin: 0;
height: 100%;
}
.mdl-mini-footer {
padding-top: 8px;
padding-bottom: 8px;
main {
margin-bottom: 100px;
}
.section-centerd {
margin: auto;
}
.mdl-data-table th {
font-size: 18px;
}
.mdl-data-table td {
font-size: 16px;
}
.full-table {
width: 100%;
border: none;
@@ -46,7 +41,6 @@ html > body {
word-break: break-all;
}
.mdl-logo a,
.material-card-title-action a {
color: inherit;
text-decoration: none;
@@ -58,6 +52,7 @@ material-card {
max-width: 75%;
margin: auto;
margin-top: 20px;
margin-bottom: 20px;
}
material-spinner {
@@ -286,3 +281,9 @@ material-popup material-button:hover material-waves {
material-popup .popup {
max-width: 450px;
}
footer {
width: 100%;
position: fixed;
bottom: 0;
}

View File

@@ -21,12 +21,28 @@
<menu></menu>
</material-navbar>
</header>
<catalog if="{!rg.router.current || rg.router.current.name == 'home'}"></catalog>
<taglist if="{rg.router.current && rg.router.current.name == 'taglist'}"></taglist>
<change></change>
<add></add>
<remove></remove>
<material-snackbar></material-snackbar>
<main>
<catalog if="{!rg.router.current || rg.router.current.name == 'home'}"></catalog>
<taglist if="{rg.router.current && rg.router.current.name == 'taglist'}"></taglist>
<change></change>
<add></add>
<remove></remove>
<material-snackbar></material-snackbar>
</main>
<footer>
<material-footer>
<a class="material-footer-logo" href="https://joxit.github.io/docker-registry-ui/">Docker Registry UI</a>
<ul class="material-footer-link-list">
<li>
<a href="https://github.com/Joxit/docker-registry-ui">Contribute on GitHub</a>
</li>
<li>
<a href="https://github.com/Joxit/docker-registry-ui/blob/master/LICENSE">Privacy &amp; Terms</a>
</li>
</ul>
</material-footer>
</footer>
<script>
this.mixin('rg.router');
@@ -52,9 +68,9 @@
registryUI.snackbar = function (message, isError) {
registryUI.appTag.tags['material-snackbar'].addToast({'message': message, 'isError': isError});
};
registryUI.errorSnackbar = function(message) {
registryUI.errorSnackbar = function (message) {
return registryUI.snackbar(message, true);
}
this.router.start();
</script>
</app>
</app>