A Pen by Greg J Bales

Thumbnail
This awesome code was written by -Infamous, you can see more from this user in the personal repository.
You can find the original code on Codepen.io
Copyright -Infamous ©
  • HTML
  • CSS
  • JavaScript
    <div class="wrap" id="app">
  <span>{{ formattedSkillString }}</span>
</div>

/*Downloaded from https://www.codeseek.co/-Infamous/a-pen-by-greg-j-bales-pKJBwv */
    body {
  margin: 0;
  padding: 0;
}

.wrap {
  width: 100vw;
  height: 100vh;
  background-color: lightblue;
}




/*Downloaded from https://www.codeseek.co/-Infamous/a-pen-by-greg-j-bales-pKJBwv */
    new Vue({
  el: '#app',
  data: {
    skillString: 'kids - babysitting - asdklsadklassanfklasnflksanfsanfans',
    formattedSkillString: 'hello'
  },
  methods: {
      trimSkillString() {
        if(this.skillString.length > 25) {
            const trimmedSkill = this.skillString.substr(0, 25) + '...';
            this.formattedSkillString = trimmedSkill;
        } else {
          this.formattedSkillString = this.skillString;
        }
    }
  },
  created() {
    this.trimSkillString();
  }
})

Comments