{"version":3,"sources":["webpack:///./src/components/classComps/catchup/catchupbooking/TutorPlanCard.vue?df81","webpack:///src/components/classComps/catchup/catchupbooking/TutorPlanCard.vue","webpack:///./src/components/classComps/catchup/catchupbooking/TutorPlanCard.vue?f07a","webpack:///./src/components/classComps/catchup/catchupbooking/TutorPlanCard.vue","webpack:///./src/components/classComps/catchup/catchupbooking/TutorPlanCard.vue?547f"],"names":["render","_vm","this","_h","$createElement","_c","_self","staticClass","class","plan_active","_v","_s","plan_title","formatWithComma","plan_meta","_m","_e","plan_info","staticRenderFns","name","props","plan_price","type","computed","component"],"mappings":"yHAAA,IAAIA,EAAS,WAAa,IAAIC,EAAIC,KAASC,EAAGF,EAAIG,eAAmBC,EAAGJ,EAAIK,MAAMD,IAAIF,EAAG,OAAOE,EAAG,MAAM,CAACA,EAAG,MAAM,CAACE,YAAY,6CAA6CC,MAAMP,EAAIQ,YAAc,oBAAsB,IAAI,CAACJ,EAAG,MAAM,CAACE,YAAY,0BAA0B,CAACF,EAAG,MAAM,CAACE,YAAY,mCAAmC,CAACN,EAAIS,GAAGT,EAAIU,GAAGV,EAAIW,eAAeP,EAAG,MAAM,CAACE,YAAY,mDAAmD,CAACN,EAAIS,GAAG,IAAIT,EAAIU,GAAGV,EAAIY,oBAAoBR,EAAG,MAAM,CAACE,YAAY,wBAAwB,CAACN,EAAIS,GAAGT,EAAIU,GAAGV,EAAIa,cAAeb,EAAe,YAAEI,EAAG,MAAM,CAACE,YAAY,mCAAmC,CAACN,EAAIc,GAAG,KAAKd,EAAIe,OAAOX,EAAG,MAAM,CAACE,YAAY,oBAAoB,CAACN,EAAIS,GAAGT,EAAIU,GAAGV,EAAIgB,mBAC3sBC,EAAkB,CAAC,WAAa,IAAIjB,EAAIC,KAASC,EAAGF,EAAIG,eAAmBC,EAAGJ,EAAIK,MAAMD,IAAIF,EAAG,OAAOE,EAAG,MAAM,CAACE,YAAY,0BAA0B,CAACF,EAAG,OAAO,CAACE,YAAY,oDC2BnK,G,UAAA,CACfY,qBAEAC,OACAR,kBACAS,kBACAP,iBACAG,iBACAR,aACAa,aACA,aAIAC,UACAV,gBADA,WAEA,4CC5CoY,I,wBCQhYW,EAAY,eACd,EACAxB,EACAkB,GACA,EACA,KACA,KACA,MAIa,aAAAM,E,2CCnBf,Y","file":"js/TutorPlanCard.4a77987d.js","sourcesContent":["var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',[_c('div',{staticClass:\"tutor-plan-card white w-100 h-auto pointer\",class:_vm.plan_active ? 'tutor-plan-active' : ''},[_c('div',{staticClass:\"left position-relative\"},[_c('div',{staticClass:\"title color_text text-uppercase\"},[_vm._v(_vm._s(_vm.plan_title))]),_c('div',{staticClass:\"price text-uppercase font-weight-900 brand_navy\"},[_vm._v(\"₦\"+_vm._s(_vm.formatWithComma))]),_c('div',{staticClass:\"meta color_grey_dark\"},[_vm._v(_vm._s(_vm.plan_meta))]),(_vm.plan_active)?_c('div',{staticClass:\"card-selected position-absolute\"},[_vm._m(0)]):_vm._e()]),_c('div',{staticClass:\"right color_text\"},[_vm._v(_vm._s(_vm.plan_info))])])])}\nvar staticRenderFns = [function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"avatar brand_accent_bg\"},[_c('span',{staticClass:\"icon-accept flex-center font-20 brand_white\"})])}]\n\nexport { render, staticRenderFns }","<template>\r\n  <div>\r\n    <div\r\n      class=\"tutor-plan-card white w-100 h-auto pointer\"\r\n      :class=\"plan_active ? 'tutor-plan-active' : ''\"\r\n    >\r\n      <!-- LEFT -->\r\n      <div class=\"left position-relative\">\r\n        <div class=\"title color_text text-uppercase\">{{ plan_title }}</div>\r\n        <div class=\"price text-uppercase font-weight-900 brand_navy\">&#8358;{{ formatWithComma }}</div>\r\n        <div class=\"meta color_grey_dark\">{{ plan_meta }}</div>\r\n\r\n        <!-- SELECTED ICON -->\r\n        <div class=\"card-selected position-absolute\" v-if=\"plan_active\">\r\n          <div class=\"avatar brand_accent_bg\">\r\n            <span class=\"icon-accept flex-center font-20 brand_white\"></span>\r\n          </div>\r\n        </div>\r\n        <!-- SELECTED ICON -->\r\n      </div>\r\n\r\n      <!-- RIGHT -->\r\n      <div class=\"right color_text\">{{ plan_info }}</div>\r\n    </div>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nexport default {\r\n  name: \"TutorPlanCard\",\r\n\r\n  props: {\r\n    plan_title: String,\r\n    plan_price: Number,\r\n    plan_meta: String,\r\n    plan_info: String,\r\n    plan_active: {\r\n      type: Boolean,\r\n      default: false\r\n    }\r\n  },\r\n\r\n  computed: {\r\n    formatWithComma() {\r\n      return this.plan_price.toLocaleString();\r\n    }\r\n  }\r\n};\r\n</script>\r\n\r\n<style lang=\"scss\">\r\n.tutor-plan-card {\r\n  border: 1px solid $border_grey;\r\n  box-sizing: border-box;\r\n  margin-bottom: 15px;\r\n  @include flex_row_start_nowrap;\r\n  transition: all 0.4s ease-in-out;\r\n\r\n  .left {\r\n    @include flex_column_center;\r\n    padding: 15px;\r\n    min-width: 163px;\r\n    width: 163px;\r\n    min-height: 100%;\r\n    background: $color_white;\r\n    border-top: 1px solid $border_grey;\r\n    border-left: 1px solid $border_grey;\r\n    border-bottom: 1px solid $border_grey;\r\n    transition: all 0.4s ease-in-out;\r\n\r\n    @include breakpoint_max(xs) {\r\n      min-width: 120px;\r\n      width: 120px;\r\n    }\r\n\r\n    .card-selected {\r\n      transition: all 0.5s ease-in-out;\r\n      top: 50%;\r\n      left: -15px;\r\n      transform: translateY(-50%);\r\n\r\n      .avatar {\r\n        @include equal_min_edge(32);\r\n\r\n        @include breakpoint_max(xs) {\r\n          @include equal_min_edge(28);\r\n        }\r\n      }\r\n    }\r\n\r\n    .title {\r\n      font-size: 15.5px;\r\n      line-height: 22px;\r\n      letter-spacing: 0.05em;\r\n      margin-bottom: 12px;\r\n\r\n      @include breakpoint_max(xl) {\r\n        margin-bottom: 8px;\r\n        font-size: 14px;\r\n      }\r\n\r\n      @include breakpoint_max(xs) {\r\n        margin-bottom: 5px;\r\n        font-size: 10px;\r\n      }\r\n    }\r\n\r\n    .price {\r\n      font-size: 19px;\r\n      line-height: 29px;\r\n      letter-spacing: 0.05em;\r\n      margin-bottom: 2px;\r\n\r\n      @include breakpoint_max(xl) {\r\n        font-size: 17px;\r\n      }\r\n\r\n      @include breakpoint_max(xs) {\r\n        font-size: 15.5px;\r\n      }\r\n    }\r\n\r\n    .meta {\r\n      font-size: 11.5px;\r\n      line-height: 16px;\r\n\r\n      @include breakpoint_max(xl) {\r\n        font-size: 11px;\r\n      }\r\n\r\n      @include breakpoint_max(xs) {\r\n        font-size: 10px;\r\n      }\r\n    }\r\n  }\r\n\r\n  .right {\r\n    padding: 30px;\r\n    font-size: 14px;\r\n    line-height: 19px;\r\n\r\n    @include breakpoint_max(xl) {\r\n      font-size: 13.5px;\r\n    }\r\n\r\n    @include breakpoint_max(lg) {\r\n      padding: 15px;\r\n      font-size: 13px;\r\n    }\r\n\r\n    @include breakpoint_max(xs) {\r\n      padding: 12px;\r\n      font-size: 12px;\r\n    }\r\n  }\r\n\r\n  &:hover {\r\n    transform: scale(0.98);\r\n    border: 1px solid $brand_accent;\r\n\r\n    .left {\r\n      border-top: 1px solid $brand_accent;\r\n      border-left: 1px solid $brand_accent;\r\n      border-bottom: 1px solid $brand_accent;\r\n    }\r\n  }\r\n}\r\n\r\n.tutor-plan-active {\r\n  border: 1px solid $brand_accent;\r\n\r\n  .left {\r\n    border-top: 1px solid $brand_accent;\r\n    border-left: 1px solid $brand_accent;\r\n    border-bottom: 1px solid $brand_accent;\r\n  }\r\n}\r\n</style>\r\n","import mod from \"-!../../../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../../../node_modules/thread-loader/dist/cjs.js!../../../../../node_modules/babel-loader/lib/index.js!../../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./TutorPlanCard.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../../../node_modules/thread-loader/dist/cjs.js!../../../../../node_modules/babel-loader/lib/index.js!../../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./TutorPlanCard.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./TutorPlanCard.vue?vue&type=template&id=8913d564&\"\nimport script from \"./TutorPlanCard.vue?vue&type=script&lang=js&\"\nexport * from \"./TutorPlanCard.vue?vue&type=script&lang=js&\"\nimport style0 from \"./TutorPlanCard.vue?vue&type=style&index=0&lang=scss&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\nexport default component.exports","export * from \"-!../../../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../../../../node_modules/css-loader/dist/cjs.js??ref--8-oneOf-1-1!../../../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../../../node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-2!../../../../../node_modules/sass-loader/dist/cjs.js??ref--8-oneOf-1-3!../../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./TutorPlanCard.vue?vue&type=style&index=0&lang=scss&\""],"sourceRoot":""}