{"version":3,"sources":["webpack:///./src/views/app/Advances.vue?5365","webpack:///./src/components/units/UnitsFrame.vue","webpack:///src/components/units/UnitsFrame.vue","webpack:///./src/components/units/UnitsFrame.vue?4793","webpack:///./src/components/units/UnitsFrame.vue?f33a","webpack:///./src/views/app/Advances.vue","webpack:///./src/utils/charts.js","webpack:///src/views/app/Advances.vue","webpack:///./src/views/app/Advances.vue?b0a4","webpack:///./src/views/app/Advances.vue?629e","webpack:///./src/assets/img/racha-frame-dark.svg","webpack:///./src/assets/img/racha-frame.svg"],"names":["render","_vm","this","_c","_self","staticClass","attrs","_t","staticRenderFns","name","component","class","$vuetify","breakpoint","smAndDown","_v","mdAndUp","ref","grafica","options","series","_e","_l","informationCard","card","index","key","_s","descripcion","clase","smAndUp","style","staticStyle","graficaPie","chartOptions","require","racha","es","opcionesGraficaEstadisticas","chart","height","width","type","toolbar","show","defaultLocale","locales","dataLabels","enabled","tooltip","y","formatter","undefined","title","seriesName","dataPointIndex","states","hover","filter","colors","fill","opacity","grid","padding","right","xaxis","tickAmount","stroke","plotOptions","heatmap","shadeIntensity","radius","useFillColorAsStroke","colorScale","ranges","from","to","color","opcionesGraficaPie","labels","markers","fillColors","legend","position","useSeriesColors","opts","seriesIndex","w","globals","reduce","a","b","responsive","data","graficaPieData","components","UnitsFrame","computed","mapState","user","dias_racha","methods","assignColor","item","mapActions","assignStats","numberFcs","parseInt","statisticsOfFlashcardsByDay","promedio_flashcards_por_dia","maximo_flashcards_por_dia","minimo_flashcards_por_dia","response","axios","get","getFcByDay","dataByMonth","fcbyday","i","Array","keys","map","dia","includes","push","find","flashcards_por_dia","formattingDataForHeatmap","moment","locale","quantityOfFlashcardsByDay","forEach","element","mes","fecha_respuesta__date","format","toUpperCase","slice","ll","substring","length","months","graficaSeries","month","fetchQuantityOfFlashcardsByDay","fetchStatisticsOfFlashcardsByDay","fetchFlashcardsUnits","fetchPieChartData","flashcards_no_vistas","flashcards_aprendizaje","flashcards_masterizadas","module","exports"],"mappings":"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","file":"js/Advances.890d5028.js","sourcesContent":["export * from \"-!../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--9-oneOf-1-0!../../../node_modules/css-loader/dist/cjs.js??ref--9-oneOf-1-1!../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../node_modules/postcss-loader/src/index.js??ref--9-oneOf-1-2!../../../node_modules/sass-loader/dist/cjs.js??ref--9-oneOf-1-3!../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Advances.vue?vue&type=style&index=0&id=51b686fc&prod&lang=scss&scoped=true\"","var render = function render(){var _vm=this,_c=_vm._self._c;return _c('v-container',{staticClass:\"d-flex justify-center\"},[_c('v-col',{attrs:{\"cols\":\"12\",\"md\":\"11\"}},[_vm._t(\"default\")],2)],1)\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n  <v-container class=\"d-flex justify-center\">\n    <v-col\n      cols=\"12\"\n      md=\"11\"\n    >\n      <slot />\n    </v-col>\n  </v-container>\n</template>\n\n<script>\nexport default {\n  name: 'UnitsAreasSpecialities'\n}\n</script>\n","import mod from \"-!../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../node_modules/thread-loader/dist/cjs.js!../../../node_modules/babel-loader/lib/index.js!../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./UnitsFrame.vue?vue&type=script&lang=js\"; export default mod; export * from \"-!../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../node_modules/thread-loader/dist/cjs.js!../../../node_modules/babel-loader/lib/index.js!../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./UnitsFrame.vue?vue&type=script&lang=js\"","import { render, staticRenderFns } from \"./UnitsFrame.vue?vue&type=template&id=b252694e\"\nimport script from \"./UnitsFrame.vue?vue&type=script&lang=js\"\nexport * from \"./UnitsFrame.vue?vue&type=script&lang=js\"\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","var render = function render(){var _vm=this,_c=_vm._self._c;return _c('UnitsFrame',[_c('div',{staticClass:\"main\",class:_vm.$vuetify.breakpoint.smAndDown ? 'd-flex flex-column': 'px-2'},[_c('p',{staticClass:\"section__text--title mt-5\"},[_vm._v(\"Calendario de avance\")]),(_vm.$vuetify.breakpoint.mdAndUp)?_c('v-card',{staticClass:\"main__card mx-auto\"},[_c('apexchart',{ref:\"grafica\",staticClass:\"mx-15 my-1\",attrs:{\"type\":\"heatmap\",\"options\":_vm.grafica.options,\"series\":_vm.grafica.series}})],1):_vm._e(),_c('div',{staticClass:\"main__statistics mx-auto\",class:_vm.$vuetify.breakpoint.smAndDown ? 'flex-column pa-0': 'mt-5'},_vm._l((_vm.informationCard),function(card,index){return _c('div',{key:index,staticClass:\"main__card-statistics d-flex justify-center flex-column align-center avoid_selection\"},[_c('p',{staticClass:\"general__text--subtitle mx-5 text-center\"},[_vm._v(_vm._s(card.descripcion))]),_c('div',{staticClass:\"main__circle pa-0 ma-0\",class:card.clase})])}),0),(_vm.$vuetify.breakpoint.mdAndUp)?_c('p',{staticClass:\"section__text--title mt-5 pl-3\"},[_vm._v(\"Datos extras\")]):_vm._e(),_c('div',{staticClass:\"d-flex justify-space-between align-center main__footer mx-auto\",class:{'flex-column order-4': _vm.$vuetify.breakpoint.smAndDown}},[(!_vm.$vuetify.breakpoint.mdAndUp)?_c('p',{staticClass:\"section__text--title mt-5 pl-3 w-100\"},[_vm._v(\"Datos extras\")]):_vm._e(),_c('v-card',{staticClass:\"main__extra d-flex align-center justify-center mb-5\",class:_vm.$vuetify.breakpoint.smAndUp ? 'mr-5': 'mr-0',style:(_vm.$vuetify.breakpoint.smAndUp ? 'height: 280px;': ''),attrs:{\"width\":_vm.$vuetify.breakpoint.smAndDown ? '100%': ''}},[_c('apexchart',{staticClass:\"ma-auto\",class:_vm.$vuetify.breakpoint.smAndDown ? 'my-10': '',staticStyle:{\"width\":\"90%\"},attrs:{\"type\":\"pie\",\"height\":\"200\",\"options\":_vm.graficaPie.chartOptions,\"series\":_vm.graficaPie.series}})],1),(_vm.$vuetify.breakpoint.mdAndUp)?_c('v-card',{staticClass:\"main__racha d-flex flex-column justify-center align-center mb-5\"},[_c('v-img',{staticClass:\"d-flex align-center justify-center\",attrs:{\"src\":_vm.$vuetify.breakpoint.mdAndUp ? require('@/assets/img/racha-frame.svg'): require('@/assets/img/racha-frame-dark.svg'),\"max-height\":\"147\",\"width\":\"183\"}},[_c('p',{staticClass:\"text-center main__racha-number avoid_selection my-auto\"},[_vm._v(_vm._s(_vm.racha))])]),_c('p',{staticClass:\"pa-0 ma-0 mx-5 main__racha-description avoid_selection\",class:_vm.$vuetify.breakpoint.mdAndUp ? 'pt-3': 'px-10 pt-5'},[_vm._v(\"Racha de días haciendo flashcards\")])],1):_vm._e()],1),(!_vm.$vuetify.breakpoint.mdAndUp)?_c('v-card',{staticClass:\"main__racha d-flex flex-column justify-center align-center mb-5\"},[_c('v-img',{staticClass:\"d-flex align-center justify-center\",attrs:{\"src\":_vm.$vuetify.breakpoint.mdAndUp ? require('@/assets/img/racha-frame.svg'): require('@/assets/img/racha-frame-dark.svg'),\"max-height\":\"147\",\"width\":\"183\"}},[_c('p',{staticClass:\"text-center main__racha-number avoid_selection my-auto\"},[_vm._v(_vm._s(_vm.racha))])]),_c('p',{staticClass:\"pa-0 ma-0 mx-5 main__racha-description avoid_selection\",class:_vm.$vuetify.breakpoint.mdAndUp ? 'pt-3': 'px-10 pt-5'},[_vm._v(\"Racha de días haciendo flashcards\")])],1):_vm._e()],1)])\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","const es = require('apexcharts/dist/locales/es.json')\n\nexport const opcionesGraficaEstadisticas = {\n  chart: {\n    height: 298,\n    width: 679,\n    type: 'heatmap',\n    toolbar: {\n      show: false\n    },\n    defaultLocale: 'es',\n    locales: [es]\n  },\n  dataLabels: {\n    enabled: false\n  },\n  tooltip: {\n    y: {\n      formatter: undefined,\n      title: {\n        formatter: (seriesName, series) => {\n          return `${series.dataPointIndex + 1} ${seriesName}:`\n        }\n      }\n    }\n  },\n  states: {\n    hover: {\n      filter: {\n        type: 'none'\n      }\n    }\n  },\n  colors: ['#219EFC'],\n  fill: {\n    opacity: 1\n  },\n  // markers: {\n  //   size: 4,\n  //   colors: ['rgba(4, 128, 218, .5)']\n  // },\n  grid: {\n    padding: {\n      right: 4\n    }\n  },\n  xaxis: {\n    tickAmount: 32\n  },\n  stroke: {\n    width: 1\n  },\n  plotOptions: {\n    heatmap: {\n      shadeIntensity: 0.5,\n      radius: 3,\n      useFillColorAsStroke: false,\n      colorScale: {\n        ranges: [\n          {\n            from: 0,\n            to: 20,\n            color: '#C8C8C8',\n            name: '0-20'\n          },\n          {\n            from: 20,\n            to: 50,\n            color: '#A1E7ED',\n            name: '20-50'\n          },\n          {\n            from: 50,\n            to: 100,\n            color: '#5FABDF',\n            name: '50-100'\n          },\n          {\n            from: 100,\n            to: 1000000,\n            color: '#0683DA',\n            name: '+100'\n          }\n        ]\n      }\n    }\n  }\n  // yaxis: {\n  //   show: false\n  // },\n  // plotOptions: {\n  //   heatmap: {\n  //     shadeIntensity: 0.5,\n  //     radius: 0,\n  //     useFillColorAsStroke: true\n  //   }\n  // }\n}\n\nexport const opcionesGraficaPie = {\n  series: [44, 55, 13, 0],\n  chartOptions: {\n    chart: {\n      width: 480,\n      type: 'pie'\n    },\n    labels: ['No vistas', 'En aprendizaje', 'Masterizadas', 'Flashcards Totales'],\n    fill: {\n      colors: ['#45E4D1', '#4598E4', '#2541D3', '#25AAD3']\n    },\n    colors: ['#45E4D1', '#4598E4', '#2541D3', '#25AAD3'],\n    tooltip: {\n      enabled: false\n    },\n    dataLabels: {\n      enabled: false\n    },\n    stroke: {\n      width: 0\n    },\n    markers: {\n      fillColors: ['#45E4D1', '#4598E4', '#2541D3', '#25AAD3']\n    },\n    legend: {\n      show: true,\n      position: 'right',\n      labels: {\n        colors: ['#45E4D1', '#4598E4', '#2541D3'],\n        useSeriesColors: false\n      },\n      formatter: function (seriesName, opts) {\n        if (opts.seriesIndex === 3) {\n          return [seriesName, ' ', opts.w.globals.series.reduce((a, b) => a + b, 0)]\n        }\n        return [seriesName, ' ', opts.w.globals.series[opts.seriesIndex]]\n      }\n    },\n    responsive: [{\n      breakpoint: 480,\n      options: {\n        chart: {\n          width: '100%',\n          height: 300\n        },\n        legend: {\n          position: 'bottom',\n          labels: {\n            colors: ['#4598E4', '#2541D3', '#45E4D1', '#21C2D1', '#25AAD3']\n          }\n        }\n      }\n    }]\n  }\n}\n","<template>\n  <UnitsFrame>\n    <div class=\"main\" :class=\"$vuetify.breakpoint.smAndDown ? 'd-flex flex-column': 'px-2'\">\n      <p class=\"section__text--title mt-5\">Calendario de avance</p>\n      <v-card v-if=\"$vuetify.breakpoint.mdAndUp\" class=\"main__card mx-auto\">\n        <apexchart\n          type=\"heatmap\"\n          :options=\"grafica.options\"\n          :series=\"grafica.series\"\n          ref=\"grafica\"\n          class=\"mx-15 my-1\"\n        ></apexchart>\n      </v-card>\n      <div\n        class=\"main__statistics mx-auto\"\n        :class=\"$vuetify.breakpoint.smAndDown ? 'flex-column pa-0': 'mt-5'\"\n      >\n        <div\n          v-for=\"(card, index) in informationCard\"\n          :key=\"index\"\n          class=\"main__card-statistics d-flex justify-center flex-column align-center avoid_selection\"\n        >\n          <p class=\"general__text--subtitle mx-5 text-center\">{{ card.descripcion }}</p>\n          <div class=\"main__circle pa-0 ma-0\" :class=\"card.clase\"></div>\n        </div>\n      </div>\n      <p class=\"section__text--title mt-5 pl-3\" v-if=\"$vuetify.breakpoint.mdAndUp\">Datos extras</p>\n      <div\n        class=\"d-flex justify-space-between align-center main__footer mx-auto\"\n        :class=\"{'flex-column order-4': $vuetify.breakpoint.smAndDown}\"\n      >\n        <p class=\"section__text--title mt-5 pl-3 w-100\" v-if=\"!$vuetify.breakpoint.mdAndUp\">Datos extras</p>\n        <v-card\n          class=\"main__extra d-flex align-center justify-center mb-5\"\n          :style=\"$vuetify.breakpoint.smAndUp ? 'height: 280px;': ''\"\n          :class=\"$vuetify.breakpoint.smAndUp ? 'mr-5': 'mr-0'\"\n          :width=\"$vuetify.breakpoint.smAndDown ? '100%': ''\"\n        >\n          <apexchart\n            type=\"pie\"\n            class=\"ma-auto\"\n            :class=\"$vuetify.breakpoint.smAndDown ? 'my-10': ''\"\n            height=\"200\"\n            style=\"width: 90%;\"\n            :options=\"graficaPie.chartOptions\"\n            :series=\"graficaPie.series\"\n          />\n        </v-card>\n        <v-card\n          v-if=\"$vuetify.breakpoint.mdAndUp\"\n          class=\"main__racha d-flex flex-column justify-center align-center mb-5\"\n        >\n          <v-img :src=\"$vuetify.breakpoint.mdAndUp ? require('@/assets/img/racha-frame.svg'): require('@/assets/img/racha-frame-dark.svg')\" max-height=\"147\" width=\"183\" class=\"d-flex align-center justify-center\">\n            <p class=\"text-center main__racha-number avoid_selection my-auto\">{{ racha }}</p>\n          </v-img>\n          <p class=\"pa-0 ma-0 mx-5 main__racha-description avoid_selection\" :class=\"$vuetify.breakpoint.mdAndUp ? 'pt-3': 'px-10 pt-5'\">Racha de días haciendo flashcards</p>\n        </v-card>\n      </div>\n      <v-card\n        v-if=\"!$vuetify.breakpoint.mdAndUp\"\n        class=\"main__racha d-flex flex-column justify-center align-center mb-5\"\n      >\n        <v-img :src=\"$vuetify.breakpoint.mdAndUp ? require('@/assets/img/racha-frame.svg'): require('@/assets/img/racha-frame-dark.svg')\" max-height=\"147\" width=\"183\" class=\"d-flex align-center justify-center\">\n          <p class=\"text-center main__racha-number avoid_selection my-auto\">{{ racha }}</p>\n        </v-img>\n        <p class=\"pa-0 ma-0 mx-5 main__racha-description avoid_selection\" :class=\"$vuetify.breakpoint.mdAndUp ? 'pt-3': 'px-10 pt-5'\">Racha de días haciendo flashcards</p>\n      </v-card>\n    </div>\n  </UnitsFrame>\n</template>\n\n<script>\nimport { mapActions, mapState } from 'vuex'\nimport { opcionesGraficaEstadisticas, opcionesGraficaPie } from '@/utils/charts'\nimport UnitsFrame from '@/components/units/UnitsFrame'\nimport moment from 'moment'\nimport axios from 'axios'\n\nexport default {\n  data () {\n    return {\n      informationCard: [\n        {\n          type: 'promedio',\n          descripcion: ''\n        },\n        {\n          type: 'maximo',\n          descripcion: ''\n        },\n        {\n          type: 'minimo',\n          descripcion: ''\n        }\n      ],\n      grafica: {\n        series: [],\n        options: opcionesGraficaEstadisticas\n      },\n      graficaPieData: [],\n      graficaPie: opcionesGraficaPie\n    }\n  },\n  components: {\n    UnitsFrame\n  },\n  computed: {\n    ...mapState('advance', ['quantityOfFlashcardsByDay', 'statisticsOfFlashcardsByDay']),\n    ...mapState('flashcard', ['flashcardUnits']),\n    ...mapState('profile', ['user']),\n    racha () {\n      if (this.user) {\n        return this.user.dias_racha\n      } else {\n        return 0\n      }\n    }\n  },\n  methods: {\n    assignColor (item, type) {\n      if (type === 'maximo') {\n        if (item < 20) {\n          return 'main__circle--bajo'\n        } else if (item > 20 && item < 100) {\n          return 'main__circle--medio'\n        } else {\n          return 'main__circle--alto'\n        }\n      } else {\n        if (item < 20) {\n          return 'main__circle--bajo'\n        } else if (item > 20 && item < 50) {\n          return 'main__circle--medio'\n        } else {\n          return 'main__circle--alto'\n        }\n      }\n    },\n    ...mapActions('flashcard', ['fetchFlashcardsUnits']),\n    ...mapActions('advance', ['fetchQuantityOfFlashcardsByDay', 'fetchStatisticsOfFlashcardsByDay']),\n    assignStats () {\n      for (const item of this.informationCard) {\n        if (item.type === 'promedio') {\n          const numberFcs = parseInt(this.statisticsOfFlashcardsByDay.promedio_flashcards_por_dia)\n          item.descripcion = `Tu promedio de flashcards diarias: ${numberFcs || 0}`\n          item.clase = this.assignColor(numberFcs, 'promedio')\n        } else if (item.type === 'maximo') {\n          const numberFcs = parseInt(this.statisticsOfFlashcardsByDay.maximo_flashcards_por_dia)\n          item.descripcion = `Tu cantidad máxima de flashcards diarias: ${numberFcs || 0}`\n          item.clase = this.assignColor(numberFcs, 'maximo')\n        } else {\n          const numberFcs = parseInt(this.statisticsOfFlashcardsByDay.minimo_flashcards_por_dia)\n          item.descripcion = `Tu cantidad mínima de flashcards semanal: ${numberFcs || 0}`\n          item.clase = this.assignColor(numberFcs, 'minimo')\n        }\n      }\n    },\n    async fetchPieChartData () {\n      const response = await axios.get('api/flashcards/flashcards/estadisticas_por_fase/')\n      this.graficaPieData = response.data\n    },\n    getFcByDay (dataByMonth) {\n      const fcbyday = []\n      for (const i of [...Array(31).keys()]) {\n        if (dataByMonth.map(item => item.dia).includes(i + 1)) {\n          fcbyday.push(dataByMonth.find(item => item.dia === i + 1).flashcards_por_dia)\n        } else {\n          fcbyday.push(0)\n        }\n      }\n      return fcbyday\n      // .map(item => { item.dia, item.flashcards_por_dia })\n    },\n    formattingDataForHeatmap () {\n      moment.locale('es')\n      this.quantityOfFlashcardsByDay.forEach(element => {\n        element.mes = moment(element.fecha_respuesta__date).format('MMMM').toUpperCase().slice(0, 3)\n        const ll = element.fecha_respuesta__date\n        element.dia = parseInt(ll.substring(ll.length - 2, ll.length))\n      })\n      // const months = [...new Set(this.quantityOfFlashcardsByDay.map(item => item.mes))]\n      const months = ['ENE', 'FEB', 'MAR', 'ABR', 'MAY', 'JUN', 'JUL', 'AGO', 'SET', 'OCT', 'NOV', 'DIC']\n      const graficaSeries = []\n      for (const month of months) {\n        graficaSeries.push({\n          name: month,\n          data: this.getFcByDay(this.quantityOfFlashcardsByDay.filter(item => item.mes === month))\n        })\n      }\n      return graficaSeries\n    }\n  },\n  async created () {\n    await this.fetchQuantityOfFlashcardsByDay()\n    await this.fetchStatisticsOfFlashcardsByDay()\n    await this.assignStats()\n    await this.fetchFlashcardsUnits()\n    await this.fetchPieChartData()\n    this.graficaPie.series = [this.graficaPieData.flashcards_no_vistas, this.graficaPieData.flashcards_aprendizaje, this.graficaPieData.flashcards_masterizadas, 0]\n    // this.graficaPie.chartOptions.labels = ['En aprendizaje', 'Masterizadas', 'No vistas', 'Flashcards Respondidas', 'Flashcards Totales']\n    this.graficaPie.chartOptions.colors = ['#45E4D1', '#4598E4', '#2541D3', '#25AAD3']\n    this.grafica.series = this.formattingDataForHeatmap()\n  }\n}\n</script>\n\n<style lang=\"scss\" scoped>\n.main {\n  &__card {\n    width: 100%;\n    // max-height: 369px;\n    overflow: auto;\n    background: #FFFFFF;\n    border: 1px solid #E5E5E5;\n    box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.15) !important;\n    border-radius: 10px;\n    &::-webkit-scrollbar {\n      display: none;\n    }\n  }\n  &__card-statistics {\n    width: 100%;\n    height: 154px;\n    background: #FFFFFF;\n    // border: 1px solid #E5E5E5;\n    box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.15) !important;\n    border-radius: 10px;\n    position: relative;\n    overflow: hidden;\n    padding: 0 !important;\n  }\n  &__statistics {\n    width: 100% !important;\n    order: 1;\n    display: grid;\n    grid-template-columns: repeat(3, 1fr);\n    grid-template-rows: repeat(1, 1fr);\n    column-gap: 20px;\n  }\n  &__footer {\n    width: 100%;\n    order: 0;\n  }\n  &__extra {\n    // width: 584px;\n    width: 67.5%;\n    // height: 280px;\n    background: #FFFFFF;\n    border: 1px solid #E5E5E5;\n    box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.15) !important;\n    border-radius: 10px;\n  }\n  &__racha {\n    // width: 283px;\n    width: 32.5%;\n    height: 280px;\n    background: linear-gradient(90deg, #1FC1D0 0%, #0583DA 100%);\n    border: 1px solid #E5E5E5;\n    box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.15) !important;\n    border-radius: 10px;\n  }\n  &__racha-description {\n    font-weight: 600;\n    font-size: 16px;\n    line-height: 24px;\n    text-align: center;\n    color: #FFFFFF;\n  }\n  &__racha-number {\n    font-weight: 600;\n    font-size: 60px;\n    line-height: 90px;\n    text-align: center;\n    color: #000000;\n  }\n  &__circle {\n    background: lightblue;\n    position: absolute;\n    top: 120.21px;\n    border-radius: 50%;\n    width: 382.68px;\n    height: 382.68px;\n    &--medio {\n      background: linear-gradient(90deg, #FFA51B 21.33%, #FFD18B 76.8%);\n    }\n    &--bajo {\n      background: linear-gradient(90deg, #DB0707 21.33%, #F77272 76.8%);\n    }\n    &--alto {\n      background: linear-gradient(90deg, #21C2D1 21.33%, #9AE7EE 76.8%);\n    }\n  }\n}\n@media (max-width: 960px) {\n  .main {\n    &__card {\n      width: 100%;\n    }\n    &__racha {\n      width: 100%;\n      height: 311px;\n      background: #FFF;\n    }\n    &__racha-description {\n      color: #000;\n    }\n    &__racha-number {\n      color: #FFF;\n    }\n    &__statistics {\n      width: 100%;\n    }\n    &__card-statistics {\n      width: 100%;\n      margin-bottom: 20.6px;\n    }\n    &__footer {\n      width: 100%;\n    }\n  }\n}\n@media (max-width: 600px) {\n  .main {\n    &__statistics {\n      width: 92%;\n      order: 1;\n      display: grid;\n      grid-template-columns: repeat(1, 1fr);\n      grid-template-rows: repeat(3, 1fr);\n      column-gap: 20px;\n    }\n  }\n}\n</style>\n","import mod from \"-!../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../node_modules/thread-loader/dist/cjs.js!../../../node_modules/babel-loader/lib/index.js!../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Advances.vue?vue&type=script&lang=js\"; export default mod; export * from \"-!../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../node_modules/thread-loader/dist/cjs.js!../../../node_modules/babel-loader/lib/index.js!../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Advances.vue?vue&type=script&lang=js\"","import { render, staticRenderFns } from \"./Advances.vue?vue&type=template&id=51b686fc&scoped=true\"\nimport script from \"./Advances.vue?vue&type=script&lang=js\"\nexport * from \"./Advances.vue?vue&type=script&lang=js\"\nimport style0 from \"./Advances.vue?vue&type=style&index=0&id=51b686fc&prod&lang=scss&scoped=true\"\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  \"51b686fc\",\n  null\n  \n)\n\nexport default component.exports","module.exports = __webpack_public_path__ + \"img/racha-frame-dark.41e5aeaf.svg\";","module.exports = __webpack_public_path__ + \"img/racha-frame.9d444a29.svg\";"],"sourceRoot":""}