hopfma
/
om
Watch 4
Star 1
Fork 0
Code Issues 0 Pull Requests 0 Releases 0 Wiki Activity
Browse Source

edited html mockup; added vue.js

pull/1/head
Senta Mandutz 5 years ago
parent
c412547cd0
commit
d233c123cf
9 changed files with 75 additions and 28 deletions
Split View Show Diff Stats
  1. 0
    0
      bookmark.js
  2. BIN
      favicon.ico
  3. 0
    0
      folder.js
  4. 0
    0
      home.js
  5. 75
    28
      index.html
  6. 0
    0
      lib/jquery-3.3.1.min.js
  7. 0
    0
      lib/vue-router.js
  8. 0
    0
      lib/vue.js
  9. 0
    0
      profil.js

+ 0
- 0
bookmark.js View File


BIN
favicon.ico View File


+ 0
- 0
folder.js View File


+ 0
- 0
home.js View File


+ 75
- 28
index.html View File

@@ -4,7 +4,13 @@
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="viewport" content="width=device-width, initial-scale=1">

<!--vue:-->
<script src=lib/vue.js> </script> <script src=lib/vue-router.js> </script> <script src=lib/jquery-3.3.1.min.js> </script> <script src=home.js></script>
<script src=folder.js></script>
<script src=bookmark.js></script>
<script src=profil.js></script>

<!-- Material Design for Bootstrap fonts and icons -->
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Material+Icons">
@@ -30,41 +36,82 @@
</div>-->
</form>
</div>
<div class="om-content-body">
<div class="om-content">
<div class="om-message">
<h5><i class="material-icons">account_circle</i> <b> User1</b></h5><br>
<h6><b>Betreff</b></h6><br>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam.<br>
<a href="#">#efi</a> <a href="#">#me</a> <a href="#">#projekt</a></p>

</div>



</div>
<div class="om-nav">
<ul class="nav nav-tabs">
<li class="nav-item">
<a class="nav-link active" href="#"><i class="material-icons">home</i></a>
</li>
<li class="nav-item">
<a class="nav-link" href="#"><i class="material-icons">folder</i></a>
</li>
<li class="nav-item">
<a class="nav-link" href="#"><i class="material-icons">bookmark</i></a>
</li>
<li class="nav-item">
<a class="nav-link" href="#"><i class="material-icons">person</i></a>
</li>
</ul>
</div>
<!--<v-tabs fixed-tabs>
<v-tab to="/home"><i class="material-icons">home</i></v-tab>
<v-tab to="/folder"><i class="material-icons">folder</i></v-tab>
<v-tab to="/bookmark"><i class="material-icons">bookmark</i></v-tab>
<v-tab to="/person"><i class="material-icons">person</i></v-tab>
</v-tabs>-->
<div class=row>
<div class=col-sm-12 style="height: 60px">
<router-link to="/home" class="col-sm-3 button" v-on:click.native="menu=false"><i class="material-icons">home</i></router-link>
<router-link to="/folder" class="col-sm-3 button" v-on:click.native="menu=false"><i class="material-icons">folder</i></router-link>
<router-link to="/bookmark" class="col-sm-3 button" v-on:click.native="menu=false"><i class="material-icons">bookmark</i></router-link>
<router-link to="/profil" class="col-sm-3 button" v-on:click.native="menu=false"><i class="material-icons">person</i></router-link>
</div>
<router-view></router-view>
</div>




<!-- Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="https://cdn.jsdelivr.net/npm/vue@2.5.17/dist/vue.js"></script>
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://unpkg.com/popper.js@1.12.6/dist/umd/popper.js" integrity="sha384-fA23ZRQ3G/J53mElWqVJEGJzU0sTs+SvzG8fXVWP+kJQ1lwFAOkcUOysnlKJC33U" crossorigin="anonymous"></script>
<script src="https://unpkg.com/bootstrap-material-design@4.1.1/dist/js/bootstrap-material-design.js" integrity="sha384-CauSuKpEqAFajSpkdjv3z9t8E7RlpJ1UP0lKM/+NdtSarroVKu069AlsRPKkFBz9" crossorigin="anonymous"></script>
<script>
$(document).ready(function() {
$('body').bootstrapMaterialDesign();
});

<!-- Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="https://cdn.jsdelivr.net/npm/vue@2.5.17/dist/vue.js"></script>
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://unpkg.com/popper.js@1.12.6/dist/umd/popper.js" integrity="sha384-fA23ZRQ3G/J53mElWqVJEGJzU0sTs+SvzG8fXVWP+kJQ1lwFAOkcUOysnlKJC33U" crossorigin="anonymous"></script>
<script src="https://unpkg.com/bootstrap-material-design@4.1.1/dist/js/bootstrap-material-design.js" integrity="sha384-CauSuKpEqAFajSpkdjv3z9t8E7RlpJ1UP0lKM/+NdtSarroVKu069AlsRPKkFBz9" crossorigin="anonymous"></script>
<script>
$(document).ready(function() {
$('body').bootstrapMaterialDesign();
});
</script>
<script>
const routes = [
{
path: "/home",
component: RouterHome
},
{
path: "/folder",
component: RouterFolder
},
{
path: "/bookmark",
component: RouterBookmark
},
{
path: "/profil",
component: RouterProfil
},
{
path: "/entry/:what/:id",
component: RouterEntry
},
{
path: "/entry/:what",
component: RouterEntry
},
];
const router = new VueRouter({
routes
});

</script>
</script>

</body>


+ 0
- 0
lib/jquery-3.3.1.min.js View File


+ 0
- 0
lib/vue-router.js View File


+ 0
- 0
lib/vue.js View File


+ 0
- 0
profil.js View File


Write Preview
Loading…
Cancel
Save