barbican-reset 3.1.0 → 3.2.0

package/animations/index.js

@@ -1,4 +1,4 @@
-import { animateEmail, animateDone } from './confirm'
+import { animateEmail, animateDone } from "#animations/confirm";
 
 export default {
   methods: {

package/components/AccountTitle.vue

@@ -21,7 +21,7 @@ export default {
 </script>
 
 <style lang="scss" module>
-@use "../scss/helpers/index.scss" as *;
+@use "#styles/helpers/index" as *;
 
 @mixin title {
   margin-bottom: 1.25rem;

package/components/BrAlert.vue

@@ -18,8 +18,8 @@
 </template>
 
 <script>
-import CloseIcon from "../icons/stream/close.vue";
-import BrButton from "./BrButton.vue";
+import CloseIcon from "#icons/stream/close";
+import BrButton from "#components/BrButton";
 
 export default {
   components: {

package/components/BrAnchor.vue

@@ -11,7 +11,7 @@
 </template>
 
 <script>
-import { DotTyping } from "./BrButton/components";
+import DotTyping from "#components/BrButton/dot_typing";
 
 export default {
   data() {

package/components/BrButton.vue

@@ -53,7 +53,8 @@
 </template>
 
 <script>
-import { RemoveTicket, DotTyping } from "./BrButton/components";
+import RemoveTicket from "#components/BrButton/remove_ticket";
+import DotTyping from "#components/BrButton/dot_typing";
 
 export default {
   emits: ["click"],

package/components/BrCard.vue

@@ -15,7 +15,7 @@
 </template>
 
 <script>
-import BrCardBody from "./BrCardBody.vue";
+import BrCardBody from "#components/BrCardBody";
 
 export default {
   components: { BrCardBody },

package/components/BrCollapse/Button.vue

@@ -10,7 +10,7 @@
 </template>
 
 <script>
-import BrButton from "../BrButton.vue";
+import BrButton from "#components/BrButton";
 
 export default {
   components: {

package/components/BrConfirmDone.vue

@@ -9,12 +9,12 @@
 </template>
 
 <script>
-import BrCard from "./BrCard.vue";
-import BrCardTitle from "./BrCardTitle.vue";
-import BrCardText from "./BrCardText.vue";
+import BrCard from "#components/BrCard";
+import BrCardTitle from "#components/BrCardTitle";
+import BrCardText from "#components/BrCardText";
 
-import Animations from "barbican-reset/animations";
-import DoneIcon from "../icons/confirm/done.vue";
+import Animations from "#animations/index";
+import DoneIcon from "#icons/confirm/done";
 
 export default {
   mixins: [Animations],

package/components/BrConfirmEmail.vue

@@ -11,12 +11,12 @@
 </template>
 
 <script>
-import BrCard from "./BrCard.vue";
-import BrCardTitle from "./BrCardTitle.vue";
-import BrCardText from "./BrCardText.vue";
+import BrCard from "#components/BrCard";
+import BrCardTitle from "#components/BrCardTitle";
+import BrCardText from "#components/BrCardText";
 
-import Animations from "barbican-reset/animations";
-import EmailIcon from "../icons/confirm/email.vue";
+import Animations from "#animations/index";
+import EmailIcon from "#icons/confirm/email";
 
 export default {
   mixins: [Animations],

package/components/BrContainer.vue

@@ -64,7 +64,7 @@ export default {
 </script>
 
 <style lang="scss" module>
-@use "../scss/helpers/index.scss" as *;
+@use "#styles/helpers/index" as *;
 
 .outer {
   padding-right: 5%;

package/components/BrFormBlock.vue

@@ -5,7 +5,7 @@
 </template>
 
 <style lang="scss" module>
-@use "../scss/helpers/index.scss" as *;
+@use "#styles/helpers/index" as *;
 
 .container {
   padding: 0.875rem 0.75rem 0.625rem 0.75rem;

package/components/BrFormCheckbox/Component.vue

@@ -18,7 +18,7 @@
 </template>
 
 <script>
-import mixins from "../../mixins/inputs";
+import mixins from "#mixins/inputs";
 
 export default {
   inheritAttrs: false, // Allow us to put attributes on the input.

package/components/BrFormCheckboxGroup/Component.vue

@@ -18,7 +18,7 @@
 </template>
 
 <script>
-import BrFormCheckbox from "../BrFormCheckbox/Component.vue";
+import BrFormCheckbox from "#components/BrFormCheckbox/Component";
 
 export default {
   props: ["modelValue", "options", "name", "id"],

package/components/BrFormGroup/Component.vue

@@ -6,7 +6,7 @@
 </template>
 
 <script>
-import mixins from "../../mixins/inputs";
+import mixins from "#mixins/inputs";
 
 export default {
   props: ["label", "id"],

package/components/BrFormInput/Component.vue

@@ -16,7 +16,7 @@
 </template>
 
 <script>
-import mixins from "../../mixins/inputs";
+import mixins from "#mixins/inputs";
 
 export default {
   inheritAttrs: false, // Allow us to put attributes on the input.

package/components/BrFormPassword.vue

@@ -26,9 +26,9 @@
 </template>
 
 <script>
-import BrButton from "./BrButton.vue";
-import HidePasswordIcon from "../icons/password/hide.vue";
-import ShowPasswordIcon from "../icons/password/show.vue";
+import BrButton from "#components/BrButton";
+import HidePasswordIcon from "#icons/password/hide";
+import ShowPasswordIcon from "#icons/password/show";
 
 export default {
   inheritAttrs: false, // Allow us to put attributes on the input.

package/components/BrFormRow.vue

@@ -15,8 +15,8 @@
 </template>
 
 <script>
-import BrButton from "./BrButton.vue";
-import EditIcon from "../icons/account/edit.vue";
+import BrButton from "#components/BrButton";
+import EditIcon from "#icons/account/edit";
 
 export default {
   components: {

package/components/BrFormUpdate.vue

@@ -8,7 +8,7 @@
 </template>
 
 <script>
-import BrButton from "./BrButton.vue";
+import BrButton from "#components/BrButton";
 
 export default {
   components: {

package/components/BrLoader.vue

@@ -12,7 +12,7 @@
 </template>
 
 <script>
-import BrCard from "./BrCard.vue";
+import BrCard from "#components/BrCard";
 
 export default {
   components: {

package/components/EventSummary.vue

@@ -27,7 +27,7 @@
 </template>
 
 <script>
-import SeeInside from "./SeeInside.vue";
+import SeeInside from "#components/SeeInside";
 
 export default {
   components: { SeeInside },
@@ -61,7 +61,7 @@ export default {
 </script>
 
 <style lang="scss" module>
-@use "../scss/helpers/index.scss" as *;
+@use "#styles/helpers/index" as *;
 
 @mixin title {
   letter-spacing: $headings-letter-spacing;

package/components/FluidIframe.vue

@@ -23,7 +23,7 @@ export default {
 </script>
 
 <style lang="scss" module>
-@import "../scss/helpers";
+@use "#styles/helpers/index" as *;
 
 .component {
   border-radius: $br-border-radius-lg;

package/components/SeeInside.vue

@@ -46,8 +46,8 @@
 </template>
 
 <script>
-import BrButton from "./BrButton.vue";
-import CloseIcon from "../icons/stream/close.vue";
+import BrButton from "#components/BrButton";
+import CloseIcon from "#icons/stream/close";
 
 export default {
   components: {
@@ -74,7 +74,7 @@ export default {
 </script>
 
 <style lang="scss" module>
-@use "../scss/helpers/index.scss" as *;
+@use "#styles/helpers/index" as *;
 
 .SeeInside_content {
   padding: 1rem;

package/components/VideoContent.vue

@@ -32,8 +32,8 @@
 </template>
 
 <script>
-import FluidIframe from "./FluidIframe.vue";
-import BrAlert from "./BrAlert.vue";
+import FluidIframe from "#components/FluidIframe";
+import BrAlert from "#components/BrAlert";
 import { DateTime } from "luxon";
 
 export default {
@@ -64,7 +64,7 @@ export default {
 </script>
 
 <style lang="scss" module>
-@use "../scss/helpers/index.scss" as *;
+@use "#styles/helpers/index" as *;
 
 .brightcove {
   border-radius: $br-border-radius-lg;

package/icons/account/index.js

@@ -1,10 +1,10 @@
-import PersonalIcon from "./personal.vue";
-import MembershipIcon from "./membership.vue";
-import VideoIcon from "./video.vue";
-import PaymentIcon from "./payment.vue";
-import OrdersIcon from "./orders.vue";
-import SupportIcon from "./support.vue";
-import EditIcon from "./edit.vue";
+import PersonalIcon from "#icons/account/personal";
+import MembershipIcon from "#icons/account/membership";
+import VideoIcon from "#icons/account/video";
+import PaymentIcon from "#icons/account/payment";
+import OrdersIcon from "#icons/account/orders";
+import SupportIcon from "#icons/account/support";
+import EditIcon from "#icons/account/edit";
 
 export {
   PersonalIcon,

package/icons/city_of_london_lockup.vue

@@ -13,7 +13,7 @@
 </template>
 
 <script>
-import CityOfLondonLogo from "./city_of_london.vue";
+import CityOfLondonLogo from "#icons/city_of_london";
 
 export default {
   components: {

package/icons/confirm/index.js

@@ -1,7 +1,4 @@
-import EmailIcon from './email.vue'
-import DoneIcon from './done.vue'
+import EmailIcon from "#icons/confirm/email";
+import DoneIcon from "#icons/confirm/done";
 
-export {
-  EmailIcon,
-  DoneIcon
-}
+export { EmailIcon, DoneIcon };

package/icons/index.js

@@ -1,12 +1,12 @@
-import ArrowBack from "./arrow_back.vue";
-import ArrowIcon from "./arrow.vue";
-import ArrowForward from "./arrow_forward.vue";
-import BackArrow from "./back_arrow.vue";
-import BarbicanLogo from "./barbican.vue";
-import CartIcon from "./cart.vue";
-import CityOfLondonLogo from "./city_of_london.vue";
-import CityOfLondonLockup from "./city_of_london_lockup.vue";
-import InformationIcon from "./information.vue";
+import ArrowBack from "#icons/arrow_back";
+import ArrowIcon from "#icons/arrow";
+import ArrowForward from "#icons/arrow_forward";
+import BackArrow from "#icons/back_arrow";
+import BarbicanLogo from "#icons/barbican";
+import CartIcon from "#icons/cart";
+import CityOfLondonLogo from "#icons/city_of_london";
+import CityOfLondonLockup from "#icons/city_of_london_lockup";
+import InformationIcon from "#icons/information";
 
 export {
   ArrowBack,

package/icons/password/index.js

@@ -1,4 +1,4 @@
-import HidePasswordIcon from './hide'
-import ShowPasswordIcon from './show'
+import HidePasswordIcon from "#icons/password/hide";
+import ShowPasswordIcon from "#icons/password/show";
 
-export { HidePasswordIcon, ShowPasswordIcon }
+export { HidePasswordIcon, ShowPasswordIcon };

package/icons/power/index.js

@@ -1,9 +1,5 @@
-import AlleyneIcon from './alleyne'
-import BanffIcon from './banff'
-import CouncilIcon from './council'
+import AlleyneIcon from "#icons/power/alleyne";
+import BanffIcon from "#icons/power/banff";
+import CouncilIcon from "#icons/power/council";
 
-export {
-  AlleyneIcon,
-  BanffIcon,
-  CouncilIcon
-}
+export { AlleyneIcon, BanffIcon, CouncilIcon };

package/icons/snippets/index.js

@@ -1,11 +1,6 @@
-import BarbicanIcon from './barbican'
-import ContributorIcon from './contributor'
-import OtherIcon from './other'
-import PinIcon from './pin'
+import BarbicanIcon from "#icons/snippets/barbican";
+import ContributorIcon from "#icons/snippets/contributor";
+import OtherIcon from "#icons/snippets/other";
+import PinIcon from "#icons/snippets/pin";
 
-export {
-  BarbicanIcon,
-  ContributorIcon,
-  OtherIcon,
-  PinIcon
-}
+export { BarbicanIcon, ContributorIcon, OtherIcon, PinIcon };

package/icons/stream/index.js

@@ -1,10 +1,10 @@
-import AirplayIcon from "./airplay.vue";
-import CastIcon from "./cast.vue";
-import ChatIcon from "./chat.vue";
-import CogIcon from "./cog.vue";
-import VolumeIcon from "./volume.vue";
-import LiveIcon from "./live.vue";
-import CloseIcon from "./close.vue";
+import AirplayIcon from "#icons/stream/airplay";
+import CastIcon from "#icons/stream/cast";
+import ChatIcon from "#icons/stream/chat";
+import CogIcon from "#icons/stream/cog";
+import VolumeIcon from "#icons/stream/volume";
+import LiveIcon from "#icons/stream/live";
+import CloseIcon from "#icons/stream/close";
 
 export {
   AirplayIcon,

package/index.js

@@ -1,45 +1,45 @@
-import BrAlert from "./components/BrAlert.vue";
-import BrAnchor from "./components/BrAnchor.vue";
-import BrButton from "./components/BrButton.vue";
+import BrAlert from "#components/BrAlert";
+import BrAnchor from "#components/BrAnchor";
+import BrButton from "#components/BrButton";
 
-import BrCard from "./components/BrCard.vue";
-import BrCardBody from "./components/BrCardBody.vue";
-import BrCardText from "./components/BrCardText.vue";
-import BrCardTitle from "./components/BrCardTitle.vue";
-import BrCardSubTitle from "./components/BrCardSubTitle.vue";
+import BrCard from "#components/BrCard";
+import BrCardBody from "#components/BrCardBody";
+import BrCardText from "#components/BrCardText";
+import BrCardTitle from "#components/BrCardTitle";
+import BrCardSubTitle from "#components/BrCardSubTitle";
 
-import BrCollapseButton from "./components/BrCollapse/Button.vue";
-import BrCollapseContent from "./components/BrCollapse/Content.vue";
+import BrCollapseButton from "#components/BrCollapse/Button";
+import BrCollapseContent from "#components/BrCollapse/Content";
 
-import BrConfirmDone from "./components/BrConfirmDone.vue";
-import BrConfirmEmail from "./components/BrConfirmEmail.vue";
+import BrConfirmDone from "#components/BrConfirmDone";
+import BrConfirmEmail from "#components/BrConfirmEmail";
 
-import BrContainer from "./components/BrContainer.vue";
+import BrContainer from "#components/BrContainer";
 
-import BrFooterLower from "./components/BrFooterLower.vue";
-import BrFooterUpper from "./components/BrFooterUpper.vue";
+import BrFooterLower from "#components/BrFooterLower";
+import BrFooterUpper from "#components/BrFooterUpper";
 
-import BrFormBlock from "./components/BrFormBlock.vue";
-import BrFormCheckbox from "./components/BrFormCheckbox/Component.vue";
-import BrFormCheckboxGroup from "./components/BrFormCheckboxGroup/Component.vue";
-import BrFormGroup from "./components/BrFormGroup/Component.vue";
-import BrFormInput from "./components/BrFormInput/Component.vue";
-import BrFormPassword from "./components/BrFormPassword.vue";
-import BrFormRadio from "./components/BrFormRadio/Component.vue";
-import BrFormRadioGroup from "./components/BrFormRadioGroup/Component.vue";
-import BrFormRow from "./components/BrFormRow.vue";
-import BrFormTextarea from "./components/BrFormTextarea/Component.vue";
-import BrFormUpdate from "./components/BrFormUpdate.vue";
+import BrFormBlock from "#components/BrFormBlock";
+import BrFormCheckbox from "#components/BrFormCheckbox/Component";
+import BrFormCheckboxGroup from "#components/BrFormCheckboxGroup/Component";
+import BrFormGroup from "#components/BrFormGroup/Component";
+import BrFormInput from "#components/BrFormInput/Component";
+import BrFormPassword from "#components/BrFormPassword";
+import BrFormRadio from "#components/BrFormRadio/Component";
+import BrFormRadioGroup from "#components/BrFormRadioGroup/Component";
+import BrFormRow from "#components/BrFormRow";
+import BrFormTextarea from "#components/BrFormTextarea/Component";
+import BrFormUpdate from "#components/BrFormUpdate";
 
-import BrLoader from "./components/BrLoader.vue";
-import BrSkiplink from "./components/BrSkiplink.vue";
-import BrWrap from "./components/BrWrap.vue";
+import BrLoader from "#components/BrLoader";
+import BrSkiplink from "#components/BrSkiplink";
+import BrWrap from "#components/BrWrap";
 
-import AccountTitle from "./components/AccountTitle.vue";
-import EventSummary from "./components/EventSummary.vue";
-import FluidIframe from "./components/FluidIframe.vue";
-import SeeInside from "./components/SeeInside.vue";
-import VideoContent from "./components/VideoContent.vue";
+import AccountTitle from "#components/AccountTitle";
+import EventSummary from "#components/EventSummary";
+import FluidIframe from "#components/FluidIframe";
+import SeeInside from "#components/SeeInside";
+import VideoContent from "#components/VideoContent";
 
 export {
   BrAlert,

package/package.json

@@ -86,6 +86,23 @@
     "focus-visible.min.js",
     "index.js"
   ],
+  "imports": {
+    "#animations/*": [
+      "./animations/*.js"
+    ],
+    "#components/*": [
+      "./components/*.vue"
+    ],
+    "#icons/*": [
+      "./icons/*.vue"
+    ],
+    "#mixins/*": [
+      "./mixins/*.js"
+    ],
+    "#styles/*": [
+      "./scss/*.scss"
+    ]
+  },
   "exports": {
     ".": "./index.js",
     "./animations": "./animations/index.js",
@@ -98,7 +115,7 @@
     "./scss": "./scss/index.scss",
     "./scss/helpers": "./scss/helpers/index.scss"
   },
-  "main": "./index.js",
+  "main": "index.js",
   "homepage": "https://bitbucket.org/barbicandev/barbican-reset#readme",
   "license": "MIT",
   "name": "barbican-reset",
@@ -112,5 +129,5 @@
     "style:patterns": "cd patterns && gulp build:css",
     "build:patterns": "cd patterns && rm -rf html && pug views --out html"
   },
-  "version": "3.1.0"
+  "version": "3.2.0"
 }

package/patterns/static/styles.css

@@ -1,4 +1,4 @@
-@media only screen and (max-width: 99px) {
+@media only screen and (max-width: 575px) {
   .br-alert {
     font-size: 0.875rem;
   }

package/scss/helpers/mixins/_br-alert.scss

@@ -82,7 +82,7 @@
 }
 
 @mixin br-alert--setup {
-  @include x-small-down {
+  @include small-down {
     font-size: $font-size-sm;
   }
 

package/scss/helpers/mixins/_breakpoints.scss

@@ -1,4 +1,3 @@
-$xsmall: 100;
 $small: 576;
 $medium: 768;
 $large: 992;
@@ -17,18 +16,6 @@ $xxlarge: 1600;
   }
 }
 
-@mixin x-small-up {
-  @include min-width($xsmall) {
-    @content
-  }
-}
-
-@mixin x-small-down {
-  @include max-width($xsmall) {
-    @content
-  }
-}
-
 @mixin small-down {
   @include max-width($small) {
     @content
@@ -41,14 +28,6 @@ $xxlarge: 1600;
   }
 }
 
-@mixin small-only {
-  @include x-small-up {
-    @include small-down {
-      @content;
-    }
-  }
-}
-
 @mixin medium-up {
   @include min-width($medium) {
     @content

package/components/BrButton/components.js

@@ -1,4 +0,0 @@
-import RemoveTicket from "./remove_ticket.vue";
-import DotTyping from "./dot_typing.vue";
-
-export { RemoveTicket, DotTyping };