client/src/views/About.vue

   1 <template lang="pug">
   2 main
   3   .row
   4     .col-sm-12.col-md-10.col-md-offset-1.col-lg-8.col-lg-offset-2
   5       div(v-html="content")
   6 </template>
   7
   8 <script>
   9 import { store } from "@/store";
  10
  11 export default {
  12   name: 'my-about',
  13   data: function() {
  14     return {
  15       st: store.state,
  16       content: "",
  17     };
  18   },
  19   mounted: function() {
  20     this.content =
  21       require("raw-loader!@/translations/about/" + this.st.lang + ".pug")
  22       // Next two lines fix a weird issue after last update (2019-11)
  23       .replace(/\\[n"]/g, " ")
  24       .replace('module.exports = "', '').replace(/"$/, "");
  25   },
  26 };
  27 </script>
  28
  29 <style lang="sass">
  30 .warn
  31   padding: 3px
  32   color: red
  33   background-color: lightgrey
  34   font-weight: bold
  35
  36 p.boxed
  37   background-color: #FFCC66
  38   padding: 5px
  39
  40 .stageDelimiter
  41   color: purple
  42
  43 .section-title
  44   padding: 0
  45
  46 .section-title > h4
  47   padding: 5px
  48
  49 ol, ul:not(.browser-default)
  50   padding-left: 20px
  51
  52 ul:not(.browser-default)
  53   margin-top: 5px
  54
  55 ul:not(.browser-default) > li
  56   list-style-type: disc
  57 </style>