self-sovereign-id/src/App.vue

<template>
<div id="app">
  <Navbar />
  <router-view />
</div>
</template>

<script>
import Navbar from '@/components/Navbar.vue'

export default {
    name: 'app',
    components: {
        Navbar
    }
}
</script>

<style>
body {
    margin: 0 auto;
    padding: 0 1rem;
    width: 80%;
    max-width: 1024px;
    line-height: 1.6;
    font-family: sans-serif;
    font-size: large;
    color: #424242;
}
h1, h2, h3, h4, h5, h6 {
    font-size: large;
    font-weight: bold;
}
button {
    padding: 6px 12px;
    border: 1px solid grey;
    border-radius: 4px;
    font-weight: 700;
    text-transform: uppercase;
}
button.danger {
    color: #f0ffff;
    background-color: #d9533f;
    border-color: #d43f2a;
}
button.danger:hover
, button.danger:active
, button.danger:focus {
    color: #f0ffff;
    background-color: #c9301c;
    border-color: #ac2915;
}
button.large {
    width: 100%;
}
pre {
    max-width: 1024px;
    padding: 2px 4px;
    background: #000000;
    color: #00ff00;
    text-align: left;
    white-space: pre-wrap;
}
pre.blob {
    width: 100%;
    height: 100px;
    overflow: scroll;
}
div.crypto pre {
    overflow-wrap: break-word;
    word-break: break-all;
}
</style>