{"version":3,"sources":["webpack:///src/components/src/components/Notifications.vue","webpack:///src/mystyles.css"],"names":[],"mappings":"AAuCA,kBACA,eAAA,AACA,YAAA,AACA,cAAA,AACA,UAAA,CACA,AACA,gCACA,mBAAA,AACA,iBAAA,AACA,kBAAA,AACA,2EAAA,kEAAA,CACA,ACjDA,QACE,gBAAiB,AACjB,UAAY,CACb,AACD,mBACE,wBAAkC,CACnC,AAED,cACE,UAAW,AACX,gBAAiB,AACjB,kBAAoB,CACrB,AAED,aACE,mBAAa,AAAb,oBAAa,AAAb,YAAa,AACb,oBAAe,AAAf,aAAe,CAChB,AAED,qBACE,gBAAkB,CACnB,AAED,eACE,cAAgB,CACjB,AAED,eACE,WAAa,CACd,AAED,mBACE,eAAiB,CAClB,AAED,sBACE,kBAAoB,CACrB,AAED,2BACE,kBAAmB,AACnB,kBAAoB,CACrB,AAED,oBACE,mBAAoB,AACpB,gBAAiB,AACjB,sBAAwB,CACzB,AAED,kBACE,2BAAwC,CACzC,AAED,uBACE,oBAAe,AAAf,cAAe,AACf,gBAAiB,AACjB,WAAY,CACb,AAED,qBACE,YAAa,AACb,UAAY,CACb,AAED,iBACE,gBAAkB,CACnB,AAED,iBACE,kBAAqB,CACtB,AAED,eACE,2EAA6E,AAA7E,kEAA6E,CAC9E,AAED,8BACE,iBAAmB,CACpB,AACD,sCACE,uBAAsC,CACvC,AAED,qBACE,iBAAkB,AAClB,eAAiB,CAClB,AAGD,sCACE,+BAAwB,AAAxB,sBAAwB,CACzB,AACD,2BACE,SAAW,CACZ,AAKD,aACE,gBAAiB,AACjB,gBAAiB,AACjB,oBAAuB,CACxB,AACD,gCACE,yBAAsC,AACtC,2EAA6E,AAA7E,kEAA6E,CAC9E,AACD,gCACE,WAAY,AACZ,YAAa,AACb,yBAAsC,AACtC,oBAAkC,CACnC,AAMD,4EACE,4BAA+B,CAChC,AAGD,eACE,gBAAkB,CACnB,AACD,6BACE,+BAAgC,AAChC,aAAe,CAChB","file":"app.css","sourcesContent":["<template>\n  <section class=\"fd-notifications\">\n    <div class=\"columns is-centered\">\n      <div class=\"column is-half\">\n        <div class=\"notification has-shadow \" v-for=\"notification in notifications\" :key=\"notification.id\" :class=\"['notification', notification.type ? `is-${notification.type}` : '']\">\n          <button class=\"delete\" v-on:click=\"remove(notification)\"></button>\n          {{ notification.text }}\n        </div>\n      </div>\n    </div>\n  </section>\n</template>\n\n<script>\nimport * as types from '@/store/mutation_types'\n\nexport default {\n  name: 'Notifications',\n  components: { },\n\n  data () {\n    return { showNav: false }\n  },\n\n  computed: {\n    notifications () {\n      return this.$store.state.notifications.list\n    }\n  },\n\n  methods: {\n    remove: function (notification) {\n      this.$store.commit(types.DELETE_NOTIFICATION, notification)\n    }\n  }\n}\n</script>\n\n<style>\n.fd-notifications {\n  position: fixed;\n  bottom: 60px;\n  z-index: 20000;\n  width: 100%;\n}\n.fd-notifications .notification {\n  margin-bottom: 10px;\n  margin-left: 24px;\n  margin-right: 24px;\n  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);\n}\n</style>\n","\n.slider {\n  min-width: 250px;\n  width: 100%;\n}\n.range-slider-fill {\n  background-color: hsl(0, 0%, 21%);\n}\n\na.navbar-item {\n  outline: 0;\n  line-height: 1.5;\n  padding: .5rem 1rem;\n}\n\n.fd-expanded {\n  flex-grow: 1;\n  flex-shrink: 1;\n}\n\n.fd-margin-left-auto {\n  margin-left: auto;\n}\n\n.fd-has-action {\n  cursor: pointer;\n}\n\n.fd-is-movable {\n  cursor: move;\n}\n\n.fd-has-margin-top {\n  margin-top: 24px;\n}\n\n.fd-has-margin-bottom {\n  margin-bottom: 24px;\n}\n\n.fd-has-padding-left-right {\n  padding-left: 24px;\n  padding-right: 24px;\n}\n\n.fd-is-text-clipped {\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.fd-is-fullheight {\n  height: calc(100vh - 3.25rem - 3.25rem);\n}\n\n.fd-is-fullheight-body {\n  flex-shrink: 1;\n  overflow: hidden;\n  height: 100%\n}\n\n.fd-image-fullheight {\n  height: 100%;\n  width: auto;\n}\n\n.fd-tabs-section {\n  padding-bottom: 0;\n}\n\n.fd-progress-bar {\n  top: 52px !important;\n}\n\n.fd-has-shadow {\n  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);\n}\n\n.sortable-chosen .media-right {\n  visibility: hidden;\n}\n.sortable-ghost h1, .sortable-ghost h2 {\n  color: hsl(348, 100%, 61%) !important;\n}\n\n.media:first-of-type {\n  padding-top: 17px;\n  margin-top: 16px;\n}\n\n/* Transition effect */\n.fade-enter-active, .fade-leave-active {\n  transition: opacity .4s;\n}\n.fade-enter, .fade-leave-to /* .fade-leave-active below version 2.1.8 */ {\n  opacity: 0;\n}\n\n/* Now playing progress bar */\n.fd-progress-now-playing {\n}\n.seek-slider {\n  min-width: 250px;\n  max-width: 500px;\n  width: 100% !important;\n}\n.seek-slider .range-slider-fill {\n  background-color: hsl(171, 100%, 41%);\n  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);\n}\n.seek-slider .range-slider-knob {\n  width: 10px;\n  height: 10px;\n  background-color: hsl(171, 100%, 41%);\n  border-color: hsl(171, 100%, 41%);\n}\n\n/* Add a little bit of spacing between title and subtitle */\n.title:not(.is-spaced) + .subtitle {\n  margin-top: -1.3rem !important;\n}\n.title:not(.is-spaced) + .subtitle + .subtitle {\n  margin-top: -1.3rem !important;\n}\n\n/* Only scroll content if modal contains a card component */\n.fd-modal-card {\n  overflow: visible;\n}\n.fd-modal-card .card-content {\n  max-height: calc(100vh - 200px);\n  overflow: auto;\n}\n"]}