cob-cli 2.12.0 → 2.12.1

package/templates/backend/vuepress/others/vuepress/src/.vuepress/theme/components/DropdownTransition.vue

@@ -0,0 +1,33 @@
+<template>
+  <transition
+    name="dropdown"
+    @enter="setHeight"
+    @after-enter="unsetHeight"
+    @before-leave="setHeight"
+  >
+    <slot />
+  </transition>
+</template>
+
+<script>
+export default {
+  name: 'DropdownTransition',
+
+  methods: {
+    setHeight (items) {
+      // explicitly set height so that it can be transitioned
+      items.style.height = items.scrollHeight + 'px'
+    },
+
+    unsetHeight (items) {
+      items.style.height = ''
+    }
+  }
+}
+</script>
+
+<style lang="stylus">
+.dropdown-enter, .dropdown-leave-to
+  height 0 !important
+
+</style>

package/templates/backend/vuepress/others/vuepress/src/.vuepress/theme/components/Home.vue

@@ -0,0 +1,134 @@
+<template>
+  <main class="home">
+    <div>
+      <div :class="['headline',{ normalWidth: normalWidth }]">
+        <img class="headlineImg" src="/docs/Logo-Cult-of-Bits-400x400-1.png">
+        <div class="headlineLeft">
+          <span :style="{fontSize: $frontmatter.verbFontSize}">
+            {{$frontmatter.verb}}
+          </span> 
+          <br>
+          <span>
+            Cult of Bits
+          </span> 
+        </div>
+        <div :class="['line', { normalWidth: normalWidth }]"/>
+        <div :class="['headlineRight',{ normalWidth: normalWidth }]">
+          {{$frontmatter.lines[0]}} 
+          <br>
+          <b>{{$frontmatter.lines[1]}}</b> 
+          <br>
+          <i style="font-size:0.85em">
+            {{$frontmatter.lines[2]}}
+          </i>
+          <br> 
+          {{$frontmatter.lines[3]}}
+        </div>
+      </div> 
+    </div>
+
+    <Content class="theme-default-content custom" />
+
+    <div
+      class="footer"
+      v-if="$frontmatter.footer"
+      v-html="$frontmatter.footer"
+    />
+  </main>
+</template>
+
+<script>
+export default {
+  name: 'Home',
+
+  data() {
+      return {
+          windowWidth: 1000
+      }
+  },
+  mounted() {
+    this.windowWidth = window.innerWidth
+    window.onresize = () => this.windowWidth = window.innerWidth
+  },
+  computed: {
+    normalWidth() {
+      return this.windowWidth > this.$frontmatter.breakMediaMinWidth
+    }
+  }
+}
+</script>
+
+<style lang="stylus">
+.home 
+  max-width: 50em;
+  margin: 3em auto -2em auto;
+  padding: 35px;
+  .headline
+    display: flex;  
+    flex-wrap: wrap; 
+    align-items: center;  
+    gap: 20px;
+    margin-bottom 2.5rem
+    justify-content: center; 
+    .headlineImg
+      width: 100px;
+    .headlineLeft
+      font-size: 4em;
+      text-align: center
+      @media (max-width: 438px)
+        font-size: 3em;
+      margin-top: 10px;
+      font-weight: 700;
+      color: $accentColor;
+      min-width:300px; 
+      line-height: 0.9em;
+    .headlineRight
+      text-align: center;
+      font-size: 1.3em
+      margin-top:20px; 
+      color: #50585D;
+    .line
+      border-left: solid 1px white;
+      @media (max-width: 438px)
+        display: none
+    &.normalWidth
+      justify-content: space-between; 
+      .line
+        height: 130px;
+        margin-top: 24px;
+        border-left: solid 1px gray;
+      .headlineLeft
+        font-size: 4em;
+      .headlineRight
+        text-align:left;
+  .theme-default-content.custom.content__default 
+    p
+      text-align: justify;
+      color: #777;
+
+.footer
+  font-size: 0.8em
+  color lighten($textColor, 25%)
+  padding: 1rem 0;
+  text-align: center;
+  border-top 1px solid $borderColor
+  margin-top: 3em;
+
+// Embrace nav menu 'Solutions' in |
+@media (min-width: $MQMobile)
+  .nav-item >a.nav-link[href*="/solutions/"] 
+    border-left: 2px solid
+    border-right: 2px solid
+    padding-left: 15px 
+    padding-right: 15px 
+    &.cob-router-link-active
+    &:hover
+      border-bottom: unset
+      &:before
+        content: "";
+        position: absolute;
+        height: 12px;
+        bottom: 4px;
+        width: 70%;
+        border-bottom: 2px solid #f90049;    
+</style>

package/templates/backend/vuepress/others/vuepress/src/.vuepress/theme/components/NavLink.vue

@@ -0,0 +1,98 @@
+<template>
+  <RouterLink
+    v-if="isInternal"
+    class="nav-link"
+    :class="{ 'cob-router-link-active': isActive }"
+    :to="link"
+    :exact="exact"
+    @focusout.native="focusoutAction"
+  >
+    {{ item.text }}
+  </RouterLink>
+  <a
+    v-else
+    :href="link"
+    class="nav-link external"
+    :target="target"
+    :rel="rel"
+    @focusout="focusoutAction"
+  >
+    {{ item.text }}
+    <OutboundLink v-if="isBlankTarget" />
+  </a>
+</template>
+
+<script>
+import { isExternal, isMailto, isTel, ensureExt } from '../util'
+
+export default {
+  name: 'NavLink',
+
+  props: {
+    item: {
+      required: true
+    }
+  },
+
+  computed: {
+    link () {
+      return ensureExt(this.item.link)
+    },
+    isActive () {
+      if(this.$frontmatter.target) {
+        return this.link.indexOf("/" + this.$frontmatter.target.toLowerCase() + "s/") >= 0
+      } else {
+        return false
+      }
+    },
+
+    exact () {
+      if (this.$site.locales) {
+        return Object.keys(this.$site.locales).some(rootLink => rootLink === this.link)
+      }
+      return this.link === '/'
+    },
+
+    isNonHttpURI () {
+      return isMailto(this.link) || isTel(this.link)
+    },
+
+    isBlankTarget () {
+      return this.target === '_blank'
+    },
+
+    isInternal () {
+      return !isExternal(this.link) && !this.isBlankTarget
+    },
+
+    target () {
+      if (this.isNonHttpURI) {
+        return null
+      }
+      if (this.item.target) {
+        return this.item.target
+      }
+      return isExternal(this.link) ? '_blank' : ''
+    },
+
+    rel () {
+      if (this.isNonHttpURI) {
+        return null
+      }
+      if (this.item.rel === false) {
+        return null
+      }
+      if (this.item.rel) {
+        return this.item.rel
+      }
+      return this.isBlankTarget ? 'noopener noreferrer' : null
+    }
+  },
+
+  methods: {
+    focusoutAction () {
+      this.$emit('focusout')
+    }
+  }
+}
+</script>

package/templates/backend/vuepress/others/vuepress/src/.vuepress/theme/components/NavLinks.vue

@@ -0,0 +1,165 @@
+<template>
+  <nav
+    v-if="userLinks.length || repoLink"
+    class="nav-links"
+  >
+    <!-- user links -->
+    <div
+      v-for="item in userLinks"
+      :key="item.link"
+      class="nav-item"
+    >
+      <DropdownLink
+        v-if="item.type === 'links'"
+        :item="item"
+      />
+      <NavLink
+        v-else
+        :item="item"
+      />
+    </div>
+
+    <!-- repo link -->
+    <a
+      v-if="repoLink"
+      :href="repoLink"
+      class="repo-link"
+      target="_blank"
+      rel="noopener noreferrer"
+    >
+      {{ repoLabel }}
+      <OutboundLink />
+    </a>
+  </nav>
+</template>
+
+<script>
+import DropdownLink from '@theme/components/DropdownLink.vue'
+import { resolveNavLinkItem } from '../util'
+import NavLink from '@theme/components/NavLink.vue'
+import { umLoggedin } from '@cob/rest-api-wrapper';
+
+export default {
+  name: 'NavLinks',
+
+  components: {
+    NavLink,
+    DropdownLink
+  },
+
+  data: () => ({
+      userInfo   : {},
+      loggedIn   : false
+  }),
+  created() {
+      umLoggedin().then( userInfo => {this.userInfo = userInfo, this.loggedIn=userInfo.username != 'anonymous' }).catch( () => this.loggedIn == false) 
+  },
+  computed: {
+    userNav () {
+      return this.$themeLocaleConfig.nav || this.$site.themeConfig.nav || []
+    },
+
+    nav () {
+      const { locales } = this.$site
+      if (locales && Object.keys(locales).length > 1) {
+        const currentLink = this.$page.path
+        const routes = this.$router.options.routes
+        const themeLocales = this.$site.themeConfig.locales || {}
+        const languageDropdown = {
+          text: this.$themeLocaleConfig.selectText || 'Languages',
+          ariaLabel: this.$themeLocaleConfig.ariaLabel || 'Select language',
+          items: Object.keys(locales).map(path => {
+            const locale = locales[path]
+            const text = themeLocales[path] && themeLocales[path].label || locale.lang
+            let link
+            // Stay on the current page
+            if (locale.lang === this.$lang) {
+              link = currentLink
+            } else {
+              // Try to stay on the same page
+              link = currentLink.replace(this.$localeConfig.path, path)
+              // fallback to homepage
+              if (!routes.some(route => route.path === link)) {
+                link = path
+              }
+            }
+            return { text, link }
+          })
+        }
+        return [...this.userNav, languageDropdown]
+      }
+      return this.userNav
+    },
+
+    userLinks () {
+      let userLinks = (this.nav || []).map(link => {
+        return Object.assign(resolveNavLinkItem(link), {
+          items: (link.items || []).map(resolveNavLinkItem)
+        })
+      })
+      return userLinks.filter(item => item.ifLoggedIn == undefined ? true : item.ifLoggedIn == this.loggedIn )
+    },
+
+    repoLink () {
+      const { repo } = this.$site.themeConfig
+      if (repo) {
+        return /^https?:/.test(repo)
+          ? repo
+          : `https://github.com/${repo}`
+      }
+      return null
+    },
+
+    repoLabel () {
+      if (!this.repoLink) return
+      if (this.$site.themeConfig.repoLabel) {
+        return this.$site.themeConfig.repoLabel
+      }
+
+      const repoHost = this.repoLink.match(/^https?:\/\/[^/]+/)[0]
+      const platforms = ['GitHub', 'GitLab', 'Bitbucket']
+      for (let i = 0; i < platforms.length; i++) {
+        const platform = platforms[i]
+        if (new RegExp(platform, 'i').test(repoHost)) {
+          return platform
+        }
+      }
+
+      return 'Source'
+    }
+  }
+}
+</script>
+
+<style lang="stylus">
+.nav-links
+  display inline-block
+  a
+    line-height 1.4rem
+    color inherit
+    &:hover, &.cob-router-link-active
+      color $accentColor
+  .nav-item
+    position relative
+    display inline-block
+    margin-left 1.5rem
+    line-height 2rem
+    &:first-child
+      margin-left 0
+  .repo-link
+    margin-left 1.5rem
+
+@media (max-width: $MQMobile)
+  .nav-links
+    .nav-item, .repo-link
+      margin-left 0
+
+@media (min-width: $MQMobile)
+  .nav-links a
+    &:hover, &.cob-router-link-active
+      color $textColor
+  .nav-item > a:not(.external)
+    &:hover, &.cob-router-link-active
+      margin-bottom -2px
+      border-bottom 2px solid lighten($accentColor, 8%)
+</style>

package/templates/backend/vuepress/others/vuepress/src/.vuepress/theme/components/Navbar.vue

@@ -0,0 +1,140 @@
+<template>
+  <header class="navbar">
+    <SidebarButton @toggle-sidebar="$emit('toggle-sidebar')" />
+
+    <RouterLink
+      :to="$localePath"
+      class="home-link"
+    >
+      <img
+        v-if="$site.themeConfig.logo"
+        class="logo"
+        :src="$withBase($site.themeConfig.logo)"
+        :alt="$siteTitle"
+      >
+      <span
+        v-if="$siteTitle"
+        ref="siteName"
+        class="site-name"
+        :class="{ 'can-hide': $site.themeConfig.logo }"
+      >{{ $siteTitle }}</span>
+    </RouterLink>
+
+    <div
+      class="links"
+      :style="linksWrapMaxWidth ? {
+        'max-width': linksWrapMaxWidth + 'px'
+      } : {}"
+    >
+      <AlgoliaSearchBox
+        v-if="isAlgoliaSearch"
+        :options="algolia"
+      />
+      <SearchBox v-else-if="$site.themeConfig.search !== false && $page.frontmatter.search !== false" />
+      <NavLinks class="can-hide" />
+    </div>
+  </header>
+</template>
+
+<script>
+import AlgoliaSearchBox from '@AlgoliaSearchBox'
+import SearchBox from '@SearchBox'
+import SidebarButton from '@theme/components/SidebarButton.vue'
+import NavLinks from '@theme/components/NavLinks.vue'
+
+export default {
+  name: 'Navbar',
+
+  components: {
+    SidebarButton,
+    NavLinks,
+    SearchBox,
+    AlgoliaSearchBox
+  },
+
+  data () {
+    return {
+      linksWrapMaxWidth: null
+    }
+  },
+
+  computed: {
+    algolia () {
+      return this.$themeLocaleConfig.algolia || this.$site.themeConfig.algolia || {}
+    },
+
+    isAlgoliaSearch () {
+      return this.algolia && this.algolia.apiKey && this.algolia.indexName
+    }
+  },
+
+  mounted () {
+    const MOBILE_DESKTOP_BREAKPOINT = 719 // refer to config.styl
+    const NAVBAR_VERTICAL_PADDING = parseInt(css(this.$el, 'paddingLeft')) + parseInt(css(this.$el, 'paddingRight'))
+    const handleLinksWrapWidth = () => {
+      if (document.documentElement.clientWidth < MOBILE_DESKTOP_BREAKPOINT) {
+        this.linksWrapMaxWidth = null
+      } else {
+        this.linksWrapMaxWidth = this.$el.offsetWidth - NAVBAR_VERTICAL_PADDING
+          - (this.$refs.siteName && this.$refs.siteName.offsetWidth || 0)
+      }
+    }
+    handleLinksWrapWidth()
+    window.addEventListener('resize', handleLinksWrapWidth, false)
+  }
+}
+
+function css (el, property) {
+  // NOTE: Known bug, will return 'auto' if style value is 'auto'
+  const win = el.ownerDocument.defaultView
+  // null means not to return pseudo styles
+  return win.getComputedStyle(el, null)[property]
+}
+</script>
+
+<style lang="stylus">
+$navbar-vertical-padding = 0.7rem
+$navbar-horizontal-padding = 1.5rem
+
+.navbar
+  padding $navbar-vertical-padding $navbar-horizontal-padding
+  line-height $navbarHeight - 1.4rem
+  a, span, img
+    display inline-block
+  .logo
+    height $navbarHeight - 1.4rem
+    min-width $navbarHeight - 1.4rem
+    margin-right 0.8rem
+    vertical-align top
+  .site-name
+    font-size 1.3rem
+    font-weight 600
+    color $textColor
+    position relative
+  .links
+    padding-left 1.5rem
+    box-sizing border-box
+    background-color white
+    white-space nowrap
+    font-size 0.9rem
+    position absolute
+    right $navbar-horizontal-padding
+    top $navbar-vertical-padding
+    display flex
+    .search-box
+      flex: 0 0 auto
+      vertical-align top
+
+@media (max-width: $MQMobile)
+  .navbar
+    padding-left 4rem
+    .can-hide
+      display none
+    .links
+      padding-left 1.5rem
+    .site-name
+      width calc(100vw - 9.4rem)
+      overflow hidden
+      white-space nowrap
+      text-overflow ellipsis
+</style>

package/templates/backend/vuepress/others/vuepress/src/.vuepress/theme/components/Page.vue

@@ -0,0 +1,31 @@
+<template>
+  <main class="page">
+    <slot name="top" />
+
+    <Content class="theme-default-content" />
+    <PageEdit />
+
+    <PageNav v-bind="{ sidebarItems }" />
+
+    <slot name="bottom" />
+  </main>
+</template>
+
+<script>
+import PageEdit from '@theme/components/PageEdit.vue'
+import PageNav from '@theme/components/PageNav.vue'
+
+export default {
+  components: { PageEdit, PageNav },
+  props: ['sidebarItems']
+}
+</script>
+
+<style lang="stylus">
+@require '../styles/wrapper.styl'
+
+.page
+  // padding-bottom 2rem
+  display block
+
+</style>