- footer on evry view component

src/App.vue

@@ -42,7 +42,7 @@
                 </li> -->
                 <li class="navbar-item">
                     <!-- <a class="navbar-link is-arrowless" href="#">OAI</a> -->
-                    <router-link class="navbar-link is-arrowless" to="/oai">OAI</router-link>
+                    <router-link target="_blank" class="navbar-link is-arrowless" to="/oai">OAI</router-link>
                 </li>
                 <!-- 
                 <a href="#" class="custom-btn"><i class="fas fa-sign-in-alt"></i>SIGN IN</a> -->
@@ -66,6 +66,75 @@
     <!-- <home-view-component></home-view-component> -->
     <router-view></router-view>
 
+    <footer class="container-fluid">
+        <div class="columns">
+            <div class="column col-sm">
+                <div class="card mx-auto" style="width: 18rem">
+                    <div class="card-body">
+                        <h5 class="card-title">About TETHYS</h5>
+                        <ul class="list-group list-group-flush">
+                            <!-- <li class="list-group-item"><a href="#">OAI</a></li> -->
+                            <li class="list-group-item"><router-link to="/oai">OAI</router-link></li>
+                            <li class="list-group-item"><a href="https://www.geologie.ac.at/" target="_blank">About GBA</a></li>
+                            <li class="list-group-item"><a href="https://www.geologie.ac.at/news/news" target="_blank">News</a></li>
+                        </ul>
+                    </div>
+                </div>
+            </div>
+            <div class="column col-sm">
+                <div class="card mx-auto" style="width: 18rem">
+                    <div class="card-body">
+                        <h5 class="card-title">Tools and Support</h5>
+                        <ul class="list-group list-group-flush">
+                            <li class="list-group-item">
+                                <!-- <a href="#"><i class="far fa-id-card"></i> Contact</a> -->
+                                <router-link to="/contact"><i class="far fa-id-card"></i> Contact</router-link>
+                            </li>
+                            <li class="list-group-item">
+                                <!-- <a href="#"><i class="fas fa-stamp"></i> Impressum</a> -->
+                                <router-link to="/imprint"><i class="fas fa-stamp"></i> Imprint</router-link>
+                            </li>
+                            <li class="list-group-item">
+                                <!-- <a href="#"><i class="fas fa-link"></i> Sitelinks</a> -->
+                                <router-link to="/sitelinks"><i class="fas fa-link"></i> Sitelinks</router-link>
+                            </li>
+                            <li class="list-group-item">
+                                <!-- <a href="#"><i class="far fa-file-alt"></i> Terms &amp; Conditions</a> -->
+                                <router-link to="/terms-and-conditions"><i class="far fa-file-alt"></i> Terms &amp; Conditions</router-link>
+                            </li>
+                            <li class="list-group-item">
+                                <a target="_blank" href="https://github.com/geolba/tethys"><i class="fab fa-github"></i> rdr bei GitHub</a>
+                            </li>
+                        </ul>
+                    </div>
+                </div>
+            </div>
+            <div class="column col-sm">
+                <div class="card mx-auto" style="width: 18rem">
+                    <div class="card-body">
+                        <h5 class="card-title">Connect with us</h5>
+                        <ul class="list-group list-group-flush">
+                            <li class="list-group-item">
+                                <a target="_blank" href="https://www.geologie.ac.at/"><i class="fas fa-home pr-2"></i>GBA</a>
+                            </li>
+                            <li class="list-group-item">
+                                <a href="#"><i class="fas fa-phone-alt pr-2"></i> +43-1-7125674</a>
+                            </li>
+                            <li class="list-group-item">
+                                <a href="mailto:repository@geologie.ac.at"><i class="fas fa-envelope pr-2"></i> repository(at)geologie.ac.at </a>
+                            </li>
+                        </ul>
+                        <img class="img-fluid pt-4" src="@/assets/site/img/geologische-bundesanstalt-logo.jpg" alt="Geologische Bundesanstalt logo" />
+                    </div>
+                </div>
+            </div>
+        </div>
+    </footer>
+
+    <div class="container-fluid">
+        <div class="copyright-notice">Copyright 2021 TETHYS RDR</div>
+    </div>
+
     <!-- <vs-input
         @search="onSearch"
         title="searching solr datasets"
@@ -84,7 +153,7 @@ import App from "./app";
 export default App;
 </script>
 
-<style lang="scss" scoped>
+<style lang="scss">
 // #app {
 //   font-family: Avenir, Helvetica, Arial, sans-serif;
 //   -webkit-font-smoothing: antialiased;
@@ -111,4 +180,78 @@ export default App;
         margin-top: 1.5rem;
     }
 }
+
+// footer:
+footer {
+    background-image: url(./assets/site/img/footer-bg.jpg);
+
+    background-size: cover;
+    background-position: center center;
+    background-repeat: no-repeat;
+    padding-top: 26em;
+    padding-bottom: 3.8em;
+}
+
+footer .card {
+    background: transparent;
+    border: none;
+    position: relative;
+    margin-top: 2em;
+    box-shadow: none;
+}
+
+footer .card-title {
+    font-family: Verdana;
+    color: #fff;
+    text-transform: uppercase;
+    font-weight: bold;
+}
+
+.list-group-flush {
+    border-radius: 0;
+}
+.list-group {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-orient: vertical;
+    -webkit-box-direction: normal;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    padding-left: 0;
+    margin-bottom: 0;
+    border-radius: 0.25rem;
+}
+.list-group {
+    display: -ms-flexbox;
+    display: flex;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    padding-left: 0;
+    margin-bottom: 0;
+}
+.list-group-flush > .list-group-item {
+    border-width: 0 0 1px;
+}
+
+.list-group-item:first-child {
+    border-top-left-radius: inherit;
+    border-top-right-radius: inherit;
+}
+.list-group-flush .list-group-item {
+    border-right: 0;
+    border-left: 0;
+    border-radius: 0;
+}
+footer .list-group-item a {
+    color: #fff;
+    text-decoration: none;
+}
+
+.copyright-notice {
+    text-align: center;
+    color: #fff;
+    background-color: #384d6e;
+    padding: 0.3em 0;
+}
 </style>

src/views/home-view/home-view-component.scss

@@ -33,75 +33,3 @@ h6 {
     padding: 3em 0;
 }
 
-// footer:
-footer {
-    background-image: url(./../../assets/site/img/footer-bg.jpg);
-    background-size: cover;
-    background-position: center center;
-    background-repeat: no-repeat;
-    padding-top: 26em;
-    padding-bottom: 3.8em;
-}
-
-footer .card {
-    background: transparent;
-    border: none;
-    position: relative;
-    margin-top: 2em;
-    box-shadow: none;
-}
-
-footer .card-title {
-    font-family: Verdana;
-    color: #fff;
-    text-transform: uppercase;
-    font-weight: bold;
-}
-
-.list-group-flush {
-    border-radius: 0;
-}
-.list-group {
-    display: -webkit-box;
-    display: -ms-flexbox;
-    display: flex;
-    -webkit-box-orient: vertical;
-    -webkit-box-direction: normal;
-    -ms-flex-direction: column;
-    flex-direction: column;
-    padding-left: 0;
-    margin-bottom: 0;
-    border-radius: 0.25rem;
-}
-.list-group {
-    display: -ms-flexbox;
-    display: flex;
-    -ms-flex-direction: column;
-    flex-direction: column;
-    padding-left: 0;
-    margin-bottom: 0;
-}
-.list-group-flush > .list-group-item {
-    border-width: 0 0 1px;
-}
-
-.list-group-item:first-child {
-    border-top-left-radius: inherit;
-    border-top-right-radius: inherit;
-}
-.list-group-flush .list-group-item {
-    border-right: 0;
-    border-left: 0;
-    border-radius: 0;
-}
-footer .list-group-item a {
-    color: #fff;
-    text-decoration: none;
-}
-
-.copyright-notice {
-    text-align: center;
-    color: #fff;
-    background-color: #384d6e;
-    padding: 0.3em 0;
-}

src/views/home-view/home-view-component.vue

@@ -180,75 +180,6 @@
                 </div>
             </div>
         </div>
-
-        <footer class="container-fluid">
-            <div class="columns">
-                <div class="column col-sm">
-                    <div class="card mx-auto" style="width: 18rem">
-                        <div class="card-body">
-                            <h5 class="card-title">About TETHYS</h5>
-                            <ul class="list-group list-group-flush">
-                                <!-- <li class="list-group-item"><a href="#">OAI</a></li> -->
-                                <li class="list-group-item"><router-link to="/oai">OAI</router-link></li>
-                                <li class="list-group-item"><a href="https://www.geologie.ac.at/" target="_blank">About GBA</a></li>
-                                <li class="list-group-item"><a href="https://www.geologie.ac.at/news/news" target="_blank">News</a></li>
-                            </ul>
-                        </div>
-                    </div>
-                </div>
-                <div class="column col-sm">
-                    <div class="card mx-auto" style="width: 18rem">
-                        <div class="card-body">
-                            <h5 class="card-title">Tools and Support</h5>
-                            <ul class="list-group list-group-flush">
-                                <li class="list-group-item">
-                                    <!-- <a href="#"><i class="far fa-id-card"></i> Contact</a> -->
-                                    <router-link to="/contact"><i class="far fa-id-card"></i> Contact</router-link>
-                                </li>
-                                <li class="list-group-item">
-                                    <!-- <a href="#"><i class="fas fa-stamp"></i> Impressum</a> -->
-                                    <router-link to="/imprint"><i class="fas fa-stamp"></i> Imprint</router-link>
-                                </li>
-                                <li class="list-group-item">
-                                    <!-- <a href="#"><i class="fas fa-link"></i> Sitelinks</a> -->
-                                    <router-link to="/sitelinks"><i class="fas fa-link"></i> Sitelinks</router-link>
-                                </li>
-                                <li class="list-group-item">
-                                    <!-- <a href="#"><i class="far fa-file-alt"></i> Terms &amp; Conditions</a> -->
-                                    <router-link to="/terms-and-conditions"><i class="far fa-file-alt"></i> Terms &amp; Conditions</router-link>
-                                </li>
-                                <li class="list-group-item">
-                                    <a target="_blank" href="https://github.com/geolba/tethys"><i class="fab fa-github"></i> rdr bei GitHub</a>
-                                </li>
-                            </ul>
-                        </div>
-                    </div>
-                </div>
-                <div class="column col-sm">
-                    <div class="card mx-auto" style="width: 18rem">
-                        <div class="card-body">
-                            <h5 class="card-title">Connect with us</h5>
-                            <ul class="list-group list-group-flush">
-                                <li class="list-group-item">
-                                    <a target="_blank" href="https://www.geologie.ac.at/"><i class="fas fa-home pr-2"></i>GBA</a>
-                                </li>
-                                <li class="list-group-item">
-                                    <a href="#"><i class="fas fa-phone-alt pr-2"></i> +43-1-7125674</a>
-                                </li>
-                                <li class="list-group-item">
-                                    <a href="mailto:repository@geologie.ac.at"><i class="fas fa-envelope pr-2"></i> repository(at)geologie.ac.at </a>
-                                </li>
-                            </ul>
-                            <img class="img-fluid pt-4" src="@/assets/site/img/geologische-bundesanstalt-logo.jpg" alt="Geologische Bundesanstalt logo" />
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </footer>
-
-        <div class="container-fluid">
-            <div class="copyright-notice">Copyright 2021 TETHYS RDR</div>
-        </div>
     </div>
 </template>
 

src/views/oai-view/oai-view-component.vue

@@ -24,10 +24,10 @@
                 ohne Vergabe einer im Schema verpflichtenden DOI).
             </p>
             <ul class="quicklinks">
-                <li><a href="?verb=Identify">Identify</a> |</li>
+                <li><a href="?verb=Identify">Identify</a> |&nbsp;</li>
-                <li><a href="?verb=ListRecords&amp;metadataPrefix=oai_dc">ListRecords</a> |</li>
+                <li><a href="?verb=ListRecords&amp;metadataPrefix=oai_dc">ListRecords</a> |&nbsp;</li>
-                <li><a href="?verb=ListSets">ListSets</a> |</li>
+                <li><a href="?verb=ListSets">ListSets</a> |&nbsp;</li>
-                <li><a href="?verb=ListMetadataFormats">ListMetadataFormats</a> |</li>
+                <li><a href="?verb=ListMetadataFormats">ListMetadataFormats</a> |&nbsp;</li>
                 <li><a href="?verb=ListIdentifiers&amp;metadataPrefix=oai_dc">ListIdentifiers</a></li>
             </ul>
         </div>
@@ -44,8 +44,8 @@ ul.quicklinks {
     margin-top: 2px;
     padding: 4px;
     text-align: center;
-    border-bottom: 2px solid #ccc;
+    /* border-bottom: 2px solid #ccc;
-    border-top: 2px solid #ccc;
+    border-top: 2px solid #ccc; */
     clear: left;
 }
 pre,
@@ -60,10 +60,9 @@ form {
     margin-bottom: 2.5rem;
 }
 ul.quicklinks li {
-    /* font-size: 90%; */
     display: inline;
     list-style: none;
-    font-family: sans-serif;
+    /* font-family: sans-serif; */
 }
 li {
     margin-bottom: 1rem;