@iamproperty/components 3.1.0 → 3.2.0

package/assets/sass/elements/tooltips.scss

@@ -1,85 +1,85 @@
-@use "../_func.scss" as *;
-
-:is(abbr[title], .tooltip) {
-
-  text-decoration: underline;
-  text-underline-offset: 0.2em;
-  text-decoration-thickness: 2px;
-  text-decoration-style: dashed;
-  text-decoration-color: var(--colour-underline);
-  position: relative;
-  cursor: help;
-
-  &:is(:hover, :focus, :active){
-
-    text-decoration: none;
-  }
-}
-
-@mixin tooltip(){
-
-  display: block;
-  z-index: var(--index-above);
-  position: absolute;
-  top: calc(100% + 0.25rem);
-  left: 50%;
-  min-width: max(120%, #{rem(100)});
-  transform: translate(-50%,0);
-  background: var(--body-bg);
-  color: inherit;
-  padding: 0.5em;
-  border-radius: 3px;
-  box-shadow: 1px 1px 3px 1px rgba(0,0,0,0.3);
-}
-
-.tooltip {
-
-
-  &:after{
-
-    content: "";
-    display: inline-block;
-    margin-left: 0.1em;
-    margin-bottom: 0.1em;
-    width: 0.8em;
-    height: 0.9em;
-    vertical-align: text-bottom;
-    background: currentColor;
-    mask-image: var(--icon-question);
-    mask-size: 100%;
-    mask-repeat: no-repeat;
-    mask-position: 50% 50%;
-    -webkit-mask-image: var(--icon-question);
-    -webkit-mask-size: 100%;
-    -webkit-mask-repeat: no-repeat;
-    -webkit-mask-position: 50% 50%;
-  }
-
-  .tooltip__content {
-
-    opacity: 0;
-    position: absolute;
-    
-  }
-
-  &:is(:hover, :focus, :active){
-
-    .tooltip__content {
-
-      opacity: 1;
-      @include tooltip();
-    }
-  }
-}
-
-@media (hover: none) {
-  
-  :is(abbr[title], .tooltip[title]) {
-
-    &:is(:hover, :focus, :active):before{
-      
-      content: attr(title);
-      @include tooltip();
-    }
-  }
+@use "../_func.scss" as *;
+
+:is(abbr[title], .tooltip) {
+
+  text-decoration: underline;
+  text-underline-offset: 0.2em;
+  text-decoration-thickness: 2px;
+  text-decoration-style: dashed;
+  text-decoration-color: var(--colour-underline);
+  position: relative;
+  cursor: help;
+
+  &:is(:hover, :focus, :active){
+
+    text-decoration: none;
+  }
+}
+
+@mixin tooltip(){
+
+  display: block;
+  z-index: var(--index-above);
+  position: absolute;
+  top: calc(100% + 0.25rem);
+  left: 50%;
+  min-width: max(120%, #{rem(100)});
+  transform: translate(-50%,0);
+  background: var(--body-bg);
+  color: inherit;
+  padding: 0.5em;
+  border-radius: 3px;
+  box-shadow: 1px 1px 3px 1px rgba(0,0,0,0.3);
+}
+
+.tooltip {
+
+
+  &:after{
+
+    content: "";
+    display: inline-block;
+    margin-left: 0.1em;
+    margin-bottom: 0.1em;
+    width: 0.8em;
+    height: 0.9em;
+    vertical-align: text-bottom;
+    background: currentColor;
+    mask-image: var(--icon-question);
+    mask-size: 100%;
+    mask-repeat: no-repeat;
+    mask-position: 50% 50%;
+    -webkit-mask-image: var(--icon-question);
+    -webkit-mask-size: 100%;
+    -webkit-mask-repeat: no-repeat;
+    -webkit-mask-position: 50% 50%;
+  }
+
+  .tooltip__content {
+
+    opacity: 0;
+    position: absolute;
+    
+  }
+
+  &:is(:hover, :focus, :active){
+
+    .tooltip__content {
+
+      opacity: 1;
+      @include tooltip();
+    }
+  }
+}
+
+@media (hover: none) {
+  
+  :is(abbr[title], .tooltip[title]) {
+
+    &:is(:hover, :focus, :active):before{
+      
+      content: attr(title);
+      @include tooltip();
+    }
+  }
 }

package/assets/sass/elements/type.scss

@@ -1,137 +1,137 @@
-@use "../_func.scss" as *;
-
-/* Duplicated from bootstrap reboot so that the type file will compile */
-mark {
-  padding: $mark-padding;
-  background-color: $mark-bg;
-}
-
-small {
-  @include font-size($small-font-size);
-}
-
-
-@import "../../../node_modules/bootstrap/scss/_type.scss";
-
-// #region headings
-%heading {
-  clear: both;
-  @include var(font-weight,--heading-weight);
-  @include var(font-family, --font-heading);
-  @include var(color,--colour-heading);
-  color: var(--colour-heading,var(--colour-primary));
-  display: block;
-  text-indent: -0.04em;
-  letter-spacing: -0.01em;
-
-  margin-top: 0; // 1
-  margin-bottom: $headings-margin-bottom;
-  font-style: $headings-font-style;
-  line-height: $headings-line-height;
-}
-
-.h1 {
-  @include font-size($h1-font-size);
-}
-
-.h2 {
-  @include font-size($h2-font-size);
-}
-
-.h3 {
-  @include font-size($h3-font-size);
-}
-
-.h4 {
-  @include font-size($h4-font-size);
-}
-
-.h5 {
-  @include font-size($h5-font-size);
-}
-
-.h6 {
-  @include font-size($h6-font-size);
-}
-
-@include is('h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6,.display-1,.display-2, .display-3, .display-4'){
-  
-  @extend %heading;
-}
-
-@include is('.display-1,.display-2, .display-3, .display-4') {
-
-  font-size: var(--fs-display);
-}
-
-// #endregion
-
-p {
-  max-width: var(--content-max-width);
-}
-
-p + p {
-  margin-top: rem(-16);
-}
-
-.strapline {
-  @include var(font-size,--fs-strapline);
-  @include var(font-family, --font-heading);
-  @include var(color,--colour-secondary);
-  line-height: 1.2;
-  font-weight: 700;
-  margin-bottom: clamp(1rem,0.5em,0.5em);
-  //text-shadow: ;
-
-  h1 + &,
-  .h1 + & {
-    margin-top: -0.5rem;
-    margin-bottom: 2rem;
-  }
-}
-
-.lead {
-  @include var(font-size,--fs-strapline);
-  @include var(font-family, --font-heading);
-  font-weight: 700;
-  line-height: 1.2;
-  margin-bottom: 3rem;
-  @include var(color,--colour-heading);
-}
-
-blockquote {
-
-  quotes: "“" "”" "‘" "’";
-  margin-bottom: 1rem;
-
-  p {
-    @include var(font-size,--fs-4);
-    @include var(color,--colour-heading);
-    margin-top: 0;
-    margin-bottom: 1rem;
-  }
-
-  & p:first-child:before {
-    content: open-quote;
-  }
-  & p:last-of-type:after {
-    content: close-quote;
-  }
-
-  cite {
-    @include var(font-size,--fs-5);
-    @include var(color,--colour-heading);
-    font-style: normal;
-    font-weight: bold;
-  }
-}
-
-.stat {
-  font-size: rem(48);
-  @extend %heading;
-  text-decoration: underline;
-  text-underline-offset: 1rem;
-  text-decoration-color: var(--colour-secondary);
-  text-decoration-thickness: 0.4rem;
-  margin-bottom: 2rem;
+@use "../_func.scss" as *;
+
+/* Duplicated from bootstrap reboot so that the type file will compile */
+mark {
+  padding: $mark-padding;
+  background-color: $mark-bg;
+}
+
+small {
+  @include font-size($small-font-size);
+}
+
+
+@import "../../../node_modules/bootstrap/scss/_type.scss";
+
+// #region headings
+%heading {
+  clear: both;
+  @include var(font-weight,--heading-weight);
+  @include var(font-family, --font-heading);
+  @include var(color,--colour-heading);
+  color: var(--colour-heading,var(--colour-primary));
+  display: block;
+  text-indent: -0.04em;
+  letter-spacing: -0.01em;
+
+  margin-top: 0; // 1
+  margin-bottom: $headings-margin-bottom;
+  font-style: $headings-font-style;
+  line-height: $headings-line-height;
+}
+
+.h1 {
+  @include font-size($h1-font-size);
+}
+
+.h2 {
+  @include font-size($h2-font-size);
+}
+
+.h3 {
+  @include font-size($h3-font-size);
+}
+
+.h4 {
+  @include font-size($h4-font-size);
+}
+
+.h5 {
+  @include font-size($h5-font-size);
+}
+
+.h6 {
+  @include font-size($h6-font-size);
+}
+
+@include is('h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6,.display-1,.display-2, .display-3, .display-4'){
+  
+  @extend %heading;
+}
+
+@include is('.display-1,.display-2, .display-3, .display-4') {
+
+  font-size: var(--fs-display);
+}
+
+// #endregion
+
+p {
+  max-width: var(--content-max-width);
+}
+
+p + p {
+  margin-top: rem(-16);
+}
+
+.strapline {
+  @include var(font-size,--fs-strapline);
+  @include var(font-family, --font-heading);
+  @include var(color,--colour-secondary);
+  line-height: 1.2;
+  font-weight: 700;
+  margin-bottom: clamp(1rem,0.5em,0.5em);
+  //text-shadow: ;
+
+  h1 + &,
+  .h1 + & {
+    margin-top: -0.5rem;
+    margin-bottom: 2rem;
+  }
+}
+
+.lead {
+  @include var(font-size,--fs-strapline);
+  @include var(font-family, --font-heading);
+  font-weight: 700;
+  line-height: 1.2;
+  margin-bottom: 3rem;
+  @include var(color,--colour-heading);
+}
+
+blockquote {
+
+  quotes: "“" "”" "‘" "’";
+  margin-bottom: 1rem;
+
+  p {
+    @include var(font-size,--fs-4);
+    @include var(color,--colour-heading);
+    margin-top: 0;
+    margin-bottom: 1rem;
+  }
+
+  & p:first-child:before {
+    content: open-quote;
+  }
+  & p:last-of-type:after {
+    content: close-quote;
+  }
+
+  cite {
+    @include var(font-size,--fs-5);
+    @include var(color,--colour-heading);
+    font-style: normal;
+    font-weight: bold;
+  }
+}
+
+.stat {
+  font-size: rem(48);
+  @extend %heading;
+  text-decoration: underline;
+  text-underline-offset: 1rem;
+  text-decoration-color: var(--colour-secondary);
+  text-decoration-thickness: 0.4rem;
+  margin-bottom: 2rem;
 }

package/assets/sass/email.scss

@@ -1,66 +1,66 @@
-@charset "UTF-8";
-
-// Set mobile only variable so that the media query mixin doesn't print out non mobile rules
-
-@use "_func" as *;
-
-$mobileOnly: "true";
-$compatible: "true";
-
-// Update the breakpoints to just one to remove some utility classes
-$grid-breakpoints: (
-  xs: 0
-);
-
-// Simplify the grid
-$grid-columns: 4;
-
-$device-xs-width: 600;
-$device-md-width: 600;
-$container-padding-x: 32;
-$default-curve-width: 600;
-
-@import "_corefiles";
-
-:root {
-
-  --container-padding-x: #{rem(66)};
-}
-
-html {
-
-  @media (min-width: #{em(600)}) {
-    font-size: 100%;
-  }
-}
-
-.content-wrapper > * {
-  max-width: 600px;
-  margin-inline: auto;
-}
-
-.container:not(.container-fluid) {
-  max-width: 600px;
-  padding-left: #{rem(48)};
-  padding-right: #{rem(48)};
-}
-
-.table--email,
-.table--email tr,
-.table--email td {
-  border: none;
-  margin: 0;
-  padding: 0;
-}
-.table--email td + td {
-  padding-left: 1rem;
-}
-
-/* card */
-.card {
-  min-height: auto;
-}
-/* utilities */
-.text-white {
-  color: white;;
+@charset "UTF-8";
+
+// Set mobile only variable so that the media query mixin doesn't print out non mobile rules
+
+@use "_func" as *;
+
+$mobileOnly: "true";
+$compatible: "true";
+
+// Update the breakpoints to just one to remove some utility classes
+$grid-breakpoints: (
+  xs: 0
+);
+
+// Simplify the grid
+$grid-columns: 4;
+
+$device-xs-width: 600;
+$device-md-width: 600;
+$container-padding-x: 32;
+$default-curve-width: 600;
+
+@import "_corefiles";
+
+:root {
+
+  --container-padding-x: #{rem(66)};
+}
+
+html {
+
+  @media (min-width: #{em(600)}) {
+    font-size: 100%;
+  }
+}
+
+.content-wrapper > * {
+  max-width: 600px;
+  margin-inline: auto;
+}
+
+.container:not(.container-fluid) {
+  max-width: 600px;
+  padding-left: #{rem(48)};
+  padding-right: #{rem(48)};
+}
+
+.table--email,
+.table--email tr,
+.table--email td {
+  border: none;
+  margin: 0;
+  padding: 0;
+}
+.table--email td + td {
+  padding-left: 1rem;
+}
+
+/* card */
+.card {
+  min-height: auto;
+}
+/* utilities */
+.text-white {
+  color: white;;
 }

package/assets/sass/error.scss

@@ -1,5 +1,5 @@
-@charset "UTF-8";
-
-// Set mobile only variable so that the media query mixin doesn't print out non mobile rules
-@use "_func" as *;
+@charset "UTF-8";
+
+// Set mobile only variable so that the media query mixin doesn't print out non mobile rules
+@use "_func" as *;
 @import "_corefiles";