{"remainingRequest":"/home/cmiss/Jenkins/workspace/mapintegratedvuer/node_modules/vue-loader/lib/index.js??vue-loader-options!/home/cmiss/Jenkins/workspace/mapintegratedvuer/src/components/DialogToolbarContent.vue?vue&type=script&lang=js&","dependencies":[{"path":"/home/cmiss/Jenkins/workspace/mapintegratedvuer/src/components/DialogToolbarContent.vue","mtime":1684261475133},{"path":"/home/cmiss/Jenkins/workspace/mapintegratedvuer/node_modules/cache-loader/dist/cjs.js","mtime":499162500000},{"path":"/home/cmiss/Jenkins/workspace/mapintegratedvuer/node_modules/babel-loader/lib/index.js","mtime":456789000000},{"path":"/home/cmiss/Jenkins/workspace/mapintegratedvuer/node_modules/cache-loader/dist/cjs.js","mtime":499162500000},{"path":"/home/cmiss/Jenkins/workspace/mapintegratedvuer/node_modules/vue-loader/lib/index.js","mtime":499162500000}],"contextDependencies":[],"result":[{"type":"Buffer","data":"base64:Ci8qIGVzbGludC1kaXNhYmxlIG5vLWFsZXJ0LCBuby1jb25zb2xlICovCmltcG9ydCBWdWUgZnJvbSAidnVlIjsKaW1wb3J0IEV2ZW50QnVzIGZyb20gJy4vRXZlbnRCdXMnOwppbXBvcnQgc3RvcmUgZnJvbSAnLi4vc3RvcmUnOwppbXBvcnQge01hcFN2Z0ljb259IGZyb20gJ0BhYmktc29mdHdhcmUvc3ZnLXNwcml0ZSc7CgppbXBvcnQgewogIEJ1dHRvbiwKICBDb2wsCiAgSWNvbiwKICBJbnB1dCwKICBQb3BvdmVyLAogIFJhZGlvLAogIFJvdywKICBTd2l0Y2gKfSBmcm9tICJlbGVtZW50LXVpIjsKClZ1ZS51c2UoQnV0dG9uKTsKVnVlLnVzZShDb2wpOwpWdWUudXNlKEljb24pOwpWdWUudXNlKElucHV0KTsKVnVlLnVzZShQb3BvdmVyKTsKVnVlLnVzZShSYWRpbyk7ClZ1ZS51c2UoUm93KTsKVnVlLnVzZShTd2l0Y2gpOwovKioKICogQ21wb25lbnQgZm9yIHRoZSBoZWFkZXIgb2YgZGlmZmVybnQgdnVlcnMuCiAqLwpleHBvcnQgZGVmYXVsdCB7CiAgbmFtZTogIkRpYWxvZ1Rvb2xiYXJDb250ZW50IiwKICBjb21wb25lbnRzOiB7CiAgICBNYXBTdmdJY29uLAogIH0sCiAgcHJvcHM6IHsKICAgIC8qKgogICAgICogQXJyYXkgb2YgdGl0bGVzLgogICAgICovCiAgICBudW1iZXJPZkVudHJpZXM6IHsKICAgICAgdHlwZTogTnVtYmVyLAogICAgICBkZWZhdWx0OiAwCiAgICB9LAogICAgLyoqCiAgICAgKiBEaXNwbGF5IGljb25zIGZvciBkb2NraW5nLCB1bmRvY2tpbmcgYW5kIGV0Yy4KICAgICAqLwogICAgc2hvd0ljb25zOiB7CiAgICAgIHR5cGU6IEJvb2xlYW4sCiAgICAgIGRlZmF1bHQ6IHRydWUKCiAgICB9LAogICAgdG9wTGV2ZWxDb250cm9sczogewogICAgICB0eXBlOiBCb29sZWFuLAogICAgICBkZWZhdWx0OiB0cnVlCiAgICB9LAogICAgLyoqCiAgICAgKiBUaGUgY3VycmVudCBhY3RpdmUgdGl0bGUuCiAgICAgKi8KICAgIGFjdGl2ZUlkOiB7CiAgICAgIHR5cGU6IE51bWJlciwKICAgICAgZGVmYXVsdDogLTEKICAgIH0sCiAgICBzaG93SGVscEljb246IHsKICAgICAgdHlwZTogQm9vbGVhbiwKICAgICAgZGVmYXVsdDogdHJ1ZQogICAgfSwKICB9LAogIGNvbXB1dGVkOiB7CiAgICBhY3RpdmVWaWV3KCkgewogICAgICByZXR1cm4gc3RvcmUuc3RhdGUuc3BsaXRGbG93LmFjdGl2ZVZpZXc7CiAgICB9LAogICAgaGVscERlbGF5KCkgewogICAgICByZXR1cm4gc3RvcmUuc3RhdGUuc2V0dGluZ3MuaGVscERlbGF5OwogICAgfSwKICAgIHNoYXJlTGluaygpIHsKICAgICAgcmV0dXJuIHN0b3JlLnN0YXRlLnNldHRpbmdzLnNoYXJlTGluazsKICAgIH0sCiAgICBzeW5jTW9kZSgpIHsKICAgICAgcmV0dXJuIHN0b3JlLnN0YXRlLnNwbGl0Rmxvdy5zeW5jTW9kZTsKICAgIH0sCiAgICB2aWV3SWNvbnMoKSB7CiAgICAgIHJldHVybiBzdG9yZS5zdGF0ZS5zcGxpdEZsb3cudmlld0ljb25zOwogICAgfSwKICAgIGdsb2JhbENhbGxiYWNrKCkgewogICAgICByZXR1cm4gc3RvcmUuc3RhdGUuc3BsaXRGbG93Lmdsb2JhbENhbGxiYWNrOwogICAgfQogIH0sCiAgd2F0Y2g6IHsKICAgIHNoYXJlTGluazogZnVuY3Rpb24oKSB7CiAgICAgIHRoaXMubG9hZGluZ0xpbmsgPSBmYWxzZTsKICAgIH0sCiAgICBpbmRlcGVuZGVudDogZnVuY3Rpb24odmFsdWUpIHsKICAgICAgbGV0IGZsYWcgPSAhKHZhbHVlID09PSB0cnVlKTsKICAgICAgaWYgKHRoaXMuZ2xvYmFsQ2FsbGJhY2sgIT09IGZsYWcpCiAgICAgICAgc3RvcmUuY29tbWl0KCJzcGxpdEZsb3cvdG9nZ2xlR2xvYmFsQ2FsbGJhY2siLCBmbGFnKTsKICAgIH0sCiAgICBnbG9iYWxDYWxsYmFjazogZnVuY3Rpb24odmFsdWUpIHsKICAgICAgbGV0IGZsYWcgPSAhKHZhbHVlID09PSB0cnVlKTsKICAgICAgaWYgKGZsYWcgIT09IHRoaXMuaW5kZXBlbmRlbnQpCiAgICAgICAgdGhpcy5pbmRlcGVuZGVudCA9IGZsYWc7CiAgICB9CiAgfSwKICBkYXRhOiBmdW5jdGlvbigpIHsKICAgIHJldHVybiB7CiAgICAgIGlzRnVsbHNjcmVlbjogZmFsc2UsCiAgICAgIGxvYWRpbmdMaW5rOiB0cnVlLAogICAgICBzaGFyZUxpbmtEaXNwbGF5OiBmYWxzZSwKICAgICAgaW5kZXBlbmRlbnQ6IHRydWUsCiAgICB9CiAgfSwKICBtZXRob2RzOiB7CiAgICB0aXRsZUNsaWNrZWQ6IGZ1bmN0aW9uKGlkKSB7CiAgICAgIHRoaXMuJGVtaXQoInRpdGxlQ2xpY2tlZCIsIGlkKTsKICAgIH0sCiAgICBzdGFydEhlbHA6IGZ1bmN0aW9uKCl7CiAgICAgIEV2ZW50QnVzLiRlbWl0KCJzdGFydEhlbHAiKTsKICAgIH0sCiAgICBvbkZ1bGxzY3JlZW46IGZ1bmN0aW9uKCkgewogICAgICB0aGlzLiRlbWl0KCJvbkZ1bGxzY3JlZW4iKTsKICAgICAgdGhpcy5pc0Z1bGxzY3JlZW4gPSAhdGhpcy5pc0Z1bGxzY3JlZW47CiAgICB9LAogICAgY2xvc2U6IGZ1bmN0aW9uKCkgewogICAgICB0aGlzLiRlbWl0KCJjbG9zZSIpOwogICAgfSwKICAgIGNvcHlTaGFyZUxpbms6IGZ1bmN0aW9uKCkgewogICAgICBpZiAoZG9jdW1lbnQpIHsKICAgICAgICB0aGlzLiRyZWZzLmxpbmtJbnB1dC4kZWwucXVlcnlTZWxlY3RvcigiaW5wdXQiKS5zZWxlY3QoKTsKICAgICAgICBkb2N1bWVudC5leGVjQ29tbWFuZCgnY29weScpOwogICAgICB9CiAgICB9LAogICAgZ2V0U2hhcmVMaW5rOiBmdW5jdGlvbigpIHsKICAgICAgdGhpcy5sb2FkaW5nTGluayA9IHRydWU7CiAgICAgIHRoaXMuc2hhcmVMaW5rRGlzcGxheSA9IHRydWU7CiAgICAgIEV2ZW50QnVzLiRlbWl0KCJ1cGRhdGVTaGFyZUxpbmtSZXF1ZXN0ZWQiKTsKICAgIH0sCiAgICB2aWV3Q2xpY2tlZDogZnVuY3Rpb24odmlldykgewogICAgICBzdG9yZS5jb21taXQoInNwbGl0Rmxvdy91cGRhdGVBY3RpdmVWaWV3Iiwgdmlldyk7CiAgICB9CiAgfSwKfTsK"},{"version":3,"sources":["DialogToolbarContent.vue"],"names":[],"mappings":";AAiIA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","file":"DialogToolbarContent.vue","sourceRoot":"src/components","sourcesContent":["<template>\n  <div :class=\"[{'draggable':  topLevelControls ==  false}, 'header']\">\n    <div class=\"switch-control\">\n      <el-switch\n        v-if=\"syncMode\"\n        class=\"switch\"\n        v-model=\"independent\"\n        active-text=\"Independent\"\n        :width=30\n        inactive-text=\"Linked\">\n      </el-switch>\n      <el-popover v-if=\"syncMode\" class=\"tooltip\"\n        placement=\"bottom-end\" :open-delay=\"helpDelay\"\n        :appendToBody=false trigger=\"hover\" popper-class=\"header-popper\">\n        <div>\n            When in Linked mode the two maps will interact \n            <br>\n            together. Select an organ in one and it will\n            <br>\n            be automatically selected in the other.\n            <br>\n            In Independent mode the maps will work separately.\"\n          </div>\n        <map-svg-icon icon=\"help\"  slot=\"reference\" class=\"sync-help header-icon\"/>\n      </el-popover>\n    </div>\n    <el-row class=\"icon-group\">\n      <el-popover\n        ref=\"viewPopover\"\n        placement=\"bottom\"\n        width=\"133\"\n        :appendToBody=false\n        trigger=\"click\"\n        popper-class=\"view-icon-popover\">\n        <el-row :gutter=\"20\"\n          v-for=\"item in viewIcons\"\n          :key=\"item.name\"\n          :class=\"[{ 'active': item.icon ==  activeView},\n            {'disabled': item.min > numberOfEntries},\n            'view-icon-row']\"\n          @click.native=\"viewClicked(item.icon)\"\n        >\n          <el-col :span=\"4\">\n            <map-svg-icon :icon=\"item.icon\"\n              class=\"view-icon\"/>\n          </el-col>\n          <el-col :offset=\"2\" :span=\"18\" class=\"view-text\">\n            {{item.name}}\n          </el-col>\n        </el-row>\n      </el-popover>\n      <el-popover class=\"tooltip\"  content=\"Split screen\" placement=\"bottom-end\"\n        :open-delay=\"helpDelay\" :appendToBody=false trigger=\"hover\"\n        popper-class=\"header-popper\"\n        v-show=\"topLevelControls\">\n        <map-svg-icon :icon=\"activeView\"\n          v-popover:viewPopover\n          :class=\"[{'disabled': (1 >= numberOfEntries)},\n            'header-icon']\"\n          slot=\"reference\"/>\n      </el-popover>\n      <el-popover class=\"tooltip\" content=\"Help\" placement=\"bottom-end\" :open-delay=\"helpDelay\"\n        :appendToBody=false trigger=\"hover\" popper-class=\"header-popper\" v-show=\"showHelpIcon\" >\n        <map-svg-icon icon=\"tooltips\" slot=\"reference\" class=\"header-icon\" @click.native=\"startHelp()\"/>\n      </el-popover>\n      <el-popover v-show=\"!isFullscreen && topLevelControls\" class=\"tooltip\"\n        content=\"Fullscreen\" placement=\"bottom-end\" :open-delay=\"helpDelay\"\n        :appendToBody=false trigger=\"hover\" popper-class=\"header-popper\">\n          <map-svg-icon icon=\"fullScreen\"  slot=\"reference\" class=\"header-icon\" @click.native=\"onFullscreen\"/>\n      </el-popover>\n      <el-popover v-show=\"isFullscreen && topLevelControls\" class=\"tooltip\"\n        content=\"Exit fullscreen\" placement=\"bottom-end\" :open-delay=\"helpDelay\"\n        :appendToBody=false trigger=\"hover\" popper-class=\"header-popper\">\n          <map-svg-icon icon=\"closeFullScreen\" slot=\"reference\" class=\"header-icon\"\n            @click.native=\"onFullscreen\"/>\n      </el-popover>\n      <el-popover\n        ref=\"linkPopover\"\n        placement=\"bottom-end\"\n        width=\"400\"\n        :appendToBody=false\n        trigger=\"click\"\n        popper-class=\"link-popover\"\n      >\n        <el-row :gutter=\"20\"\n          v-loading=\"loadingLink\"\n          element-loading-text=\"Creating link...\"\n          element-loading-spinner=\"el-icon-loading\">\n          <el-col :span=\"20\">\n            <el-input\n              class=\"link-input\"\n              size=\"mini\"\n              placeholder=\"Permanant Link Here\"\n              :readonly=true\n              v-model=\"shareLink\"\n              ref=\"linkInput\">\n            </el-input>\n          </el-col>\n          <el-col :span=\"4\">\n            <el-popover class=\"tooltip\" content=\"Copy link\" placement=\"bottom-end\"\n              :open-delay=\"helpDelay\" :appendToBody=false trigger=\"hover\"\n              popper-class=\"header-popper\">\n            <el-button slot=\"reference\" class=\"copy-button\"\n              icon=\"el-icon-document-copy\" size=\"mini\"\n              @click=\"copyShareLink\"></el-button>\n            </el-popover>\n          </el-col>\n        </el-row>\n      </el-popover>\n      <el-popover class=\"tooltip\"  content=\"Get permalink\" placement=\"bottom-end\"\n        :open-delay=\"helpDelay\" :appendToBody=false trigger=\"hover\"\n        popper-class=\"header-popper\"\n        v-show=\"topLevelControls && shareLink\">\n        <map-svg-icon icon=\"permalink\"\n          v-popover:linkPopover\n          class=\"header-icon\"\n          @click.native=\"getShareLink\"\n          slot=\"reference\"/>\n      </el-popover>\n      <el-popover class=\"tooltip\" content=\"Close\" placement=\"bottom-end\" :open-delay=\"helpDelay\"\n        :appendToBody=false trigger=\"hover\" popper-class=\"header-popper\" v-show=\"showIcons\">\n        <map-svg-icon icon=\"close\" slot=\"reference\" class=\"header-icon\" @click.native=\"close\"/>\n      </el-popover>\n    </el-row>\n  </div>\n</template>\n\n\n<script>\n/* eslint-disable no-alert, no-console */\nimport Vue from \"vue\";\nimport EventBus from './EventBus';\nimport store from '../store';\nimport {MapSvgIcon} from '@abi-software/svg-sprite';\n\nimport {\n  Button,\n  Col,\n  Icon,\n  Input,\n  Popover,\n  Radio,\n  Row,\n  Switch\n} from \"element-ui\";\n\nVue.use(Button);\nVue.use(Col);\nVue.use(Icon);\nVue.use(Input);\nVue.use(Popover);\nVue.use(Radio);\nVue.use(Row);\nVue.use(Switch);\n/**\n * Cmponent for the header of differnt vuers.\n */\nexport default {\n  name: \"DialogToolbarContent\",\n  components: {\n    MapSvgIcon,\n  },\n  props: {\n    /**\n     * Array of titles.\n     */\n    numberOfEntries: {\n      type: Number,\n      default: 0\n    },\n    /**\n     * Display icons for docking, undocking and etc.\n     */\n    showIcons: {\n      type: Boolean,\n      default: true\n\n    },\n    topLevelControls: {\n      type: Boolean,\n      default: true\n    },\n    /**\n     * The current active title.\n     */\n    activeId: {\n      type: Number,\n      default: -1\n    },\n    showHelpIcon: {\n      type: Boolean,\n      default: true\n    },\n  },\n  computed: {\n    activeView() {\n      return store.state.splitFlow.activeView;\n    },\n    helpDelay() {\n      return store.state.settings.helpDelay;\n    },\n    shareLink() {\n      return store.state.settings.shareLink;\n    },\n    syncMode() {\n      return store.state.splitFlow.syncMode;\n    },\n    viewIcons() {\n      return store.state.splitFlow.viewIcons;\n    },\n    globalCallback() {\n      return store.state.splitFlow.globalCallback;\n    }\n  },\n  watch: {\n    shareLink: function() {\n      this.loadingLink = false;\n    },\n    independent: function(value) {\n      let flag = !(value === true);\n      if (this.globalCallback !== flag)\n        store.commit(\"splitFlow/toggleGlobalCallback\", flag);\n    },\n    globalCallback: function(value) {\n      let flag = !(value === true);\n      if (flag !== this.independent)\n        this.independent = flag;\n    }\n  },\n  data: function() {\n    return {\n      isFullscreen: false,\n      loadingLink: true,\n      shareLinkDisplay: false,\n      independent: true,\n    }\n  },\n  methods: {\n    titleClicked: function(id) {\n      this.$emit(\"titleClicked\", id);\n    },\n    startHelp: function(){\n      EventBus.$emit(\"startHelp\");\n    },\n    onFullscreen: function() {\n      this.$emit(\"onFullscreen\");\n      this.isFullscreen = !this.isFullscreen;\n    },\n    close: function() {\n      this.$emit(\"close\");\n    },\n    copyShareLink: function() {\n      if (document) {\n        this.$refs.linkInput.$el.querySelector(\"input\").select();\n        document.execCommand('copy');\n      }\n    },\n    getShareLink: function() {\n      this.loadingLink = true;\n      this.shareLinkDisplay = true;\n      EventBus.$emit(\"updateShareLinkRequested\");\n    },\n    viewClicked: function(view) {\n      store.commit(\"splitFlow/updateActiveView\", view);\n    }\n  },\n};\n</script>\n\n<!-- Add \"scoped\" attribute to limit CSS to this component only -->\n<style scoped lang=\"scss\">\n@import \"~element-ui/packages/theme-chalk/src/button\";\n@import \"~element-ui/packages/theme-chalk/src/loading\";\n@import \"~element-ui/packages/theme-chalk/src/icon\";\n@import \"~element-ui/packages/theme-chalk/src/input\";\n@import \"~element-ui/packages/theme-chalk/src/popover\";\n@import \"~element-ui/packages/theme-chalk/src/radio\";\n@import \"~element-ui/packages/theme-chalk/src/row\";\n@import \"~element-ui/packages/theme-chalk/src/switch\";\n@import \"../assets/header-icon.scss\";\n\n.content {\n  width:calc(100% - 120px);\n  height:32px;\n}\n\n.radio-control {\n  position:absolute;\n  justify-content: center;\n  top: 4px;\n  right:12px;\n  -moz-user-select: none;\n  -webkit-user-select: none;\n  -ms-user-select: none;\n  user-select: none;\n}\n\n.icon-group {\n  ::v-deep .el-button--text {\n    color:#606266;\n    font-size: 1.5em;\n    &:hover {\n      color: $app-primary-color;\n    }\n  }\n}\n\n.icon-transform {\n  -moz-transform: rotate(90deg);\n  -webkit-transform: rotate(90deg);\n  -o-transform: rotate(90deg);\n  -ms-transform: rotate(90deg);\n  transform: rotate(90deg);\n  padding:10px;\n}\n\n.header {\n  height:32px;\n}\n\n.draggable.header:hover {\n  cursor:grab;\n}\n\n.draggable.header:active {\n  cursor:grabbing;\n}\n\n::v-deep .header-popper {\n  padding: 6px 4px;\n  font-size:12px;\n  color: rgb(48, 49, 51);\n  background-color: #f3ecf6;\n  border: 1px solid $app-primary-color;\n  white-space: nowrap;\n  min-width: unset;\n  &.el-popper[x-placement^=bottom] {\n    .popper__arrow {\n      border-bottom-color: $app-primary-color !important;\n      &:after {\n        border-bottom-color: #f3ecf6 !important;\n      }\n    }\n  }\n}\n\n::v-deep .link-popover {\n  border: 1px solid $app-primary-color;\n}\n\n::v-deep .el-loading-spinner {\n  i, .el-loading-text {\n    color: $app-primary-color;\n  }\n}\n\n.copy-button {\n  color:#FFFFFF;\n  background-color:$app-primary-color;\n  &:hover, &:focus {\n    color:#FFFFFF;\n    background-color:$app-primary-color;\n    box-shadow: -3px 2px 4px #000000; \n  }\n}\n\n.link-input {\n  ::v-deep .el-input__inner {\n    color:#303133;\n    &:focus {\n      border-color:$app-primary-color;\n    }\n  }\n}\n\n.view-icon-row {\n  height: 32px;\n  width: 133px;\n  border-radius: 4px;\n  border: 1px solid rgb(151, 151, 151);\n  font-size: 14px;\n  margin:8px 0px 0px 0px!important;\n  cursor: pointer;\n\n  &.active {\n    border: 1px solid $app-primary-color;\n    background: rgba(131, 0, 191, 0.1);\n  }\n}\n\n.view-icon {\n  font-size: 1.7em;\n  color: $app-primary-color;\n  padding-top:3px;\n}\n\n.view-text {\n  letter-spacing:0px;\n  font-size:11px;\n  line-height:14px;\n  font-family:'Asap', 'Avenir',  Arial, sans-serif;\n  font-weight:550;\n  padding-top:7px;\n}\n\n::v-deep .view-icon-popover {\n  border: 1px solid $app-primary-color;\n  box-shadow: 0px 2px 12px 0px rgba(0, 0, 0, 0.06);\n  padding: 4px 8px 12px 8px;\n  min-width:unset!important;\n  cursor:default;\n  &.el-popper[x-placement^=bottom] {\n    .popper__arrow {\n      border-bottom-color: $app-primary-color !important;\n      &:after {\n        border-bottom-color: #fff !important;\n      }\n    }\n  }\n}\n\n.switch-control {\n  width:250px;\n  top:2px;\n  left: calc(50% - 60px);\n  position: absolute;\n  .sync-help {\n    left:5px;\n  }\n}\n\n.switch {\n  padding-right: 0.5rem;\n  padding-left: 0.5rem;\n  border-radius: 4px;\n  border: 1px solid rgb(220, 223, 230);\n  vertical-align: baseline;\n  ::v-deep .el-switch__label.is-active {\n    color: $purple;\n  }\n  ::v-deep .el-switch__core {\n    background: $app-primary-color;\n    border: 1px solid $lightGrey;\n    height: 14px;\n    &::before {\n      content: \"\";\n      position:absolute;\n      top: -3px;\n      left: -1px;\n      border-radius: 100%;\n      -webkit-transition: all .3s;\n      transition: all .3s;\n      width: 19px;\n      height: 19px;\n      background-color: $app-primary-color;\n    }\n    &::after {\n      top: -2px;\n      left: 0px;\n      width: 17px;\n      height: 17px;\n      background-color: $cochlear;\n    }\n  }\n  ::v-deep &.is-checked {\n    .el-switch__core {\n      border: 1px solid $lightGrey;\n      background: $cochlear;\n      &::before {\n        left: 100%;\n        margin-left:-17px;\n      }    \n      &::after {\n        left: 100%;\n        margin-left: -16px;\n      }\n    }\n  }\n}\n\n.sync-help {\n  margin-left: 5px;\n}\n\n</style>\n"]}]}