Build system integration using vue-cli.

1 files changed, 0 insertions, 395 deletions

diff --git a/app.scss b/app.scss
deleted file mode 100644
index 51110e1..0000000
--- a/app.scss
+++ /dev/null
@@ -1,395 +0,0 @@
-$primary-color: #3367d6;
-$secondary-color: #4285f4;
-
-
-// /!\ Keep background colors sync with `theme-color` meta info
-$theme-light: (
-  background: #f5f5f5,
-  card-background: #ffffff,
-  text: #363636,
-  text-title: #303030,
-  text-subtitle: #424242,
-  card-shadow: rgba(0, 0, 0, 0.1),
-  a-hover: #363636
-);
-$theme-dark: (
-  background: #131313,
-  card-background: #2b2b2b,
-  text: #eaeaea,
-  text-title: #fafafa,
-  text-subtitle: #f5f5f5,
-  card-shadow: rgba(0, 0, 0, 0.4),
-  a-hover: #ffdd57
-);
-
-/* raleway-regular - latin */
-@font-face {
-  font-family: 'Raleway';
-  font-style: normal;
-  font-weight: 400;
-  font-display: swap;
-  src: local('Raleway'), local('Raleway-Regular'),
-       url('./webfonts/raleway/raleway-v14-latin-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
-       url('./webfonts/raleway/raleway-v14-latin-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
-}
-
-/* lato-regular - latin */
-@font-face {
-  font-family: 'Lato';
-  font-style: normal;
-  font-weight: 400;
-  font-display: swap;
-  src: local('Lato Regular'), local('Lato-Regular'),
-       url('./webfonts/lato/lato-v16-latin-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
-       url('./webfonts/lato/lato-v16-latin-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
-}
-
-@mixin theme($theme) {
-  background-color: map-get($theme, "background");
-  color: map-get($theme, "text");
-  a {
-    &:hover {
-      color: map-get($theme, "a-hover");
-    }
-  }
-  
-  .title {
-    color: map-get($theme, "text-title");
-  }
-  .subtitle {
-    color: map-get($theme, "text-subtitle");
-  }
-
-  .card {
-    background-color: map-get($theme, "card-background");
-    box-shadow: 0 2px 15px 0 map-get($theme, "card-shadow");
-    &:hover {
-      background-color: map-get($theme, "card-background");
-    }
-  }
-
-  .message {
-    background-color: map-get($theme, "card-background");
-    .message-body {
-      color: map-get($theme, "text");
-    }
-  }
-
-  .footer {
-    background-color:  map-get($theme, "card-background");
-    box-shadow: 0 2px 15px 0 map-get($theme, "card-shadow");
-  }
-}
-
-
-@mixin ellipsis() {
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-
-
-html { 
-  height: 100%; 
-}
-
-body {
-  font-family: 'Raleway', sans-serif;
-  height: 100%;
-
-  #app {
-    min-height: 100%;
-    transition: background-color cubic-bezier(0.165, 0.84, 0.44, 1) 300ms;
-
-    // Default theme
-    @include theme($theme-light);
-
-    // System pref theme
-    @media (prefers-color-scheme: light), (prefers-color-scheme: no-preference) {
-      @include theme($theme-light);
-    }
-    @media (prefers-color-scheme: dark) {
-      @include theme($theme-dark);
-    }
-
-    // User override theme
-    &.is-light {
-      @include theme($theme-light);
-    }
-    &.is-dark {
-      @include theme($theme-dark);
-    }
-  }
-
-  h1, h2, h3, h4, h5, h6 {
-    font-family: 'Lato', sans-serif;
-  }
-
-  h1 {
-    font-size: 2rem;
-  }
-
-  h2 {
-    font-size: 1.7rem;
-    margin-top: 2rem;
-    margin-bottom: 1rem;
-
-    .fas, .fab, .far {
-      margin-right: 10px;
-    }
-
-    span {
-      font-weight: bold;
-      color: $secondary-color;
-    }
-  }
-
-  [v-cloak] {
-    display: none
-  }
-
-  #bighead {
-    color: #ffffff;
-
-    .dashboard-title {
-      padding: 6px 0 0 80px;
-    }
-
-    .first-line {
-      height: 100px;
-      vertical-align: center;
-      background-color: $primary-color;
-
-      h1 {
-        margin-top: -12px;
-        font-size: 2rem;
-      }
-
-      .headline {
-        margin-top: 5px;
-        font-size: 0.9rem;
-      }
-
-      .container {
-        height: 80px;
-        padding: 10px 0;
-      }
-
-      .logo {
-        float: left;
-        i {
-          vertical-align: top;
-          padding: 8px 15px;
-          font-size: 50px
-        }
-
-        img {
-          padding: 10px;
-          max-height: 70px;
-          max-width: 70px;
-        }
-      }
-    }
-    .navbar, .navbar-menu {
-      background-color: $secondary-color;
-
-      a {
-        color: #ffffff;
-        &:hover, &:focus {
-          color: #ffffff;
-          background-color: lighten( $secondary-color, 5% );
-        }
-      }
-    }
-    .navbar-end {
-      text-align: right;
-    }
-  }
-
-  #main-section {
-    margin-bottom: 2rem;
-    padding: 0;
-
-    h2 {
-      border-bottom: 1px dashed #ccc;
-      padding-bottom: 10px;
-      @include ellipsis();
-    }
-
-    .title {
-      font-size: 1.1em;
-      @include ellipsis();
-    }
-
-    .subtitle {
-      font-size: .9em;
-      @include ellipsis();
-    }
-
-    .container {
-      padding: 1.2rem .75rem;
-    }
-
-    .message {
-      margin-top: 45px;
-      box-shadow: 0 2px 15px 0 rgba(0, 0, 0, 0.1);
-
-      .message-header {
-        font-weight: bold;
-      }
-
-      .message-body {
-        border: none;
-      }
-    }
-  }
-
-  .media-content {
-    overflow: hidden;
-    text-overflow: inherit;
-  }
-
-  .tag {
-    color: $secondary-color;
-    background-color: $secondary-color;
-    position: absolute;
-    top: 1rem;
-    right: -0.2rem;
-    width: 3px;
-    overflow: hidden;
-    transition: all 0.2s ease-out;
-    padding: 0;
-    
-    .tag-text {
-      display: none;
-    }
-  }
-
-  .card {
-    border-radius: 5px;
-    border: none;
-    box-shadow: 0 2px 15px 0 rgba(0, 0, 0, 0.1);
-    transition: cubic-bezier(0.165, 0.84, 0.44, 1) 300ms;
-
-    a {
-      outline: none;
-    }
-  }
-
-  .card:hover {
-    transform: translate(0, -3px);
-
-    .tag {
-      width: auto;
-      color: #ffffff;
-      padding: 0 0.75em;
-      
-      .tag-text {
-        display: block;
-      }
-    }
-  }
-
-  .card-content {
-    height: 85px;
-    padding: 1.3rem;
-  }
-
-  .layout-vertical {
-    .card {
-      border-radius: 0;
-    }
-
-    .column div:first-of-type .card {
-      border-radius: 5px 5px 0 0;
-    }
-
-    .column div:last-child .card {
-      border-radius: 0 0 5px 5px;
-    }
-  }
-
-  .footer {
-    position: fixed;
-    left: 0;
-    right: 0;
-    bottom: 0;
-    padding: 0.5rem;
-    text-align: left;
-    color: #676767;
-    font-size: 0.85rem;
-    transition: background-color cubic-bezier(0.165, 0.84, 0.44, 1) 300ms;
-  }
-
-  .no-footer {
-    #main-section {
-      margin-bottom: 0;
-    }
-    
-    .footer {
-      display: none;
-    }
-  }
-
-  .search-bar {
-    position: relative;
-    display: inline-block;
-    #search {
-      border: none;
-      background-color: lighten( $secondary-color, 6% );
-      border-radius: 5px;
-      padding: 2px 12px 2px 30px;
-      margin: 0 0 0 12px;
-      transition: all 100ms linear;
-      color: #ffffff;
-      height: 30px;
-      width: 100px;
-
-
-      &:focus {
-        color: #000000;
-        width: 250px;
-        background-color: #ffffff;
-      }
-    }
-
-    .search-label::before {
-      font-family: 'Font Awesome 5 Free';
-      position: absolute;
-      top: 4px;
-      left: 16px;
-      content: "\f002";
-      font-weight: 900;
-      width: 20px;
-      height: 20px;
-      color: #ffffff;
-    }
-
-      &:focus-within .search-label::before {
-          color: #4a4a4a;
-      }
-  }
-
-  .icon-button {
-    display: inline-block;
-    padding: 0 12px;
-  }
-
-  .offline-message {
-      text-align: center;
-      margin: 35px 0;
-
-      i {
-        font-size: 2rem;
-      }
-
-      i.fa-redo-alt {
-        font-size: 1.3rem;
-        line-height: 1rem;
-        vertical-align: middle;
-        cursor: pointer;
-        color: #3273dc;
-      }
-  }
-
-}