SHARE
TWEET

Untitled

a guest Dec 15th, 2018 107 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <template lang="pug">
  2.   .label-container(:style='labelColor')
  3.     slot
  4. </template>
  5.  
  6. <script>
  7. export default {
  8.   computed: {
  9.     labelColor() {
  10.       return {
  11.         '--label-color': this.color,
  12.         '--back-color': this.backColor
  13.       }
  14.     }
  15.   },
  16.   props: {
  17.     color: {
  18.       type: String,
  19.       required: false,
  20.       default: '#737985'
  21.     },
  22.     backColor: {
  23.       type: String,
  24.       required: false,
  25.       default: '#F1F2F6'
  26.     }
  27.   }
  28. }
  29. </script>
  30.  
  31. <style lang="scss" scoped>
  32. .label-container {
  33.   align-items: center;
  34.   background-color: var(--back-color);
  35.   border-radius: 12px;
  36.   color: var(--label-color);
  37.   display: flex;
  38.   font-size: 12px;
  39.   height: 23px;
  40.   justify-content: center;
  41.   line-height: 15px;
  42.   padding: 5px 10px;
  43. }
  44. </style>
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top