@visitscotland/component-library 4.21.0 → 4.22.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -20,7 +20,7 @@
20
20
  "index.js"
21
21
  ],
22
22
  "styles": [
23
- "styles/9ecd7432e8ccdee2cf4b.css"
23
+ "styles/e848450b81462fe3f042.css"
24
24
  ]
25
25
  }
26
26
  }
@@ -45,7 +45,8 @@ h4.vs-canned-search-sub-heading{color:#535396;margin:0;margin-bottom:.75rem}h4.v
45
45
  label,legend{font-weight:600;margin-bottom:0}legend{font-size:1.125rem}.error{font-size:1rem;color:#940f2c;display:block}.hint-text{font-size:1rem;color:#606060;margin-bottom:0}.vs-number-input{border:#535396 1px solid;display:inline-block;width:4rem;text-align:center;margin-top:.5rem;margin-left:1rem;margin-right:1rem;font-size:1.25rem;padding:.5rem .75rem}.vs-number-input.form-control-md{height:50px}.vs-number-input:focus{border-color:#3369ff;box-shadow:0 0 0 2px #3369ff inset;outline:none}.vs-number-input--error{border-color:#940f2c;box-shadow:0 0 0 2px #940f2c inset}.vs-number-input__clear-button{position:absolute;right:1.25rem;top:50%;transform:translate(0, -50%)}.vs-number-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.vs-number-input__increment{width:1.75rem;height:1.75rem}
46
46
  .vs-carbon-calculator-question{margin-bottom:2rem}.vs-carbon-calculator-question__label{width:100%}
47
47
  .vs-carbon-calculator{display:block}.vs-carbon-calculator .vs-progress-bar{margin-bottom:2rem}.vs-carbon-calculator .vs-carbon-calculator__category-heading{margin-top:0;margin-bottom:1.5rem}.vs-carbon-calculator__wrapper .vs-warning{display:none}.no-js .vs-carbon-calculator{display:none}.no-js .vs-carbon-calculator__wrapper .vs-warning{display:block}
48
- .vs-card{position:relative;display:flex;flex-direction:column;border-radius:.25rem}.vs-card:hover .img-zoom-on-hover{transform:scale(1.05)}.vs-card__header{overflow:hidden}.vs-card__body{display:flex;flex-direction:column}.vs-card__body--centered{justify-content:center}.vs-card--elevated{box-shadow:0px 1px 2px 0px rgba(0,0,0,.3),0px 1px 3px 1px rgba(0,0,0,.15)}.vs-card--outlined{border:1px solid #e9e9e9;transition:all .2s}.vs-card--outlined:hover{border-color:#200f2e}.vs-card--filled{background-color:#fff}.vs-card--horizontal{flex-direction:row}.vs-card--horizontal .vs-card__header{flex:1 1 35%}.vs-card--horizontal .vs-card__body{flex:1 1 75%}@media(min-width: 576px){.vs-card--horizontal .vs-card__header{flex-basis:40%}.vs-card--horizontal .vs-card__body{flex-basis:60%}}
48
+ .vs-card-group.is-grid{display:grid;gap:1.25rem;grid-template-columns:1fr}@media(min-width: 768px){.vs-card-group.is-grid{gap:1.75rem}}@media(min-width: 992px){.vs-card-group.is-grid{grid-template-columns:repeat(var(--cards-in-row), 1fr)}}@media(max-width: 1199.98px){.vs-card-group.is-grid.is-scroll-snap{display:flex;overflow-x:auto;scroll-snap-type:x mandatory}.vs-card-group.is-grid.is-scroll-snap::-webkit-scrollbar{height:6px}.vs-card-group.is-grid.is-scroll-snap::-webkit-scrollbar-track{background:#dedbe6;border-radius:.25rem}.vs-card-group.is-grid.is-scroll-snap::-webkit-scrollbar-thumb{background:#535396;border-radius:.25rem}.vs-card-group.is-grid.is-scroll-snap .vs-card{flex:0 0 266px;scroll-snap-align:start;margin-bottom:1.5rem}}@media(max-width: 1199.98px)and (min-width: 576px){.vs-card-group.is-grid.is-scroll-snap .vs-card{flex:0 0 235px}}@media(max-width: 1199.98px)and (min-width: 768px){.vs-card-group.is-grid.is-scroll-snap .vs-card{flex:0 0 312px}}@media(max-width: 1199.98px)and (min-width: 992px){.vs-card-group.is-grid.is-scroll-snap .vs-card{flex:0 0 420px}}
49
+ .vs-card{position:relative;display:flex;flex-direction:column;border-radius:.25rem}.vs-card:hover .img-zoom-on-hover{transform:scale(1.05)}.vs-card__header{overflow:hidden;border-radius:.25rem}.vs-card__body{display:flex;flex-direction:column}.vs-card__body--centered{justify-content:center}.vs-card--elevated{box-shadow:0px 1px 2px 0px rgba(0,0,0,.3),0px 1px 3px 1px rgba(0,0,0,.15)}.vs-card--outlined{border:1px solid #e9e9e9;transition:all .2s}.vs-card--outlined:hover{border-color:#200f2e}.vs-card--filled{background-color:#fff}.vs-card--horizontal{flex-direction:row}.vs-card--horizontal .vs-card__header{flex:1 1 35%}.vs-card--horizontal .vs-card__body{flex:1 1 75%}@media(min-width: 576px){.vs-card--horizontal .vs-card__header{flex-basis:40%}.vs-card--horizontal .vs-card__body{flex-basis:60%}}
49
50
  .card.vs-stretched-link-card .vs-stretched-link-card__title .stretched-link:focus{outline:2px solid #3369ff}.card.vs-stretched-link-card{border:none;position:relative;line-height:1}.card.vs-stretched-link-card:hover .vs-stretched-link-card__video-button{background-color:#17359c;border-color:#17359c}.card.vs-stretched-link-card:active .vs-stretched-link-card__video-button{background-color:#112876;border-color:#112876}.card.vs-stretched-link-card--video{cursor:pointer}.card.vs-stretched-link-card .vs-stretched-link-card__img-container{width:100%;max-width:100%;position:relative;aspect-ratio:3/2}@supports not (aspect-ratio: 3/2){.card.vs-stretched-link-card .vs-stretched-link-card__img-container{padding-bottom:66.6%}}.card.vs-stretched-link-card .vs-stretched-link-card__img-container .vs-stretched-link-card__img{width:100%;height:100%;object-fit:cover;align-self:flex-start;flex-shrink:0}.card.vs-stretched-link-card .vs-stretched-link-card__img-container .vs-stretched-link-card__img--svg{object-fit:contain}.card.vs-stretched-link-card .card-body{padding:1rem 0 .5rem;width:100%}.card.vs-stretched-link-card .vs-stretched-link-card__title{color:#200f2e;display:flex}.card.vs-stretched-link-card .vs-stretched-link-card__title .stretched-link{color:#200f2e;text-decoration:none;letter-spacing:inherit;display:block}.card.vs-stretched-link-card .vs-stretched-link-card__title .stretched-link:hover{text-decoration:underline}.card.vs-stretched-link-card .vs-stretched-link-card__title .stretched-link--disabled{cursor:default}.card.vs-stretched-link-card .vs-stretched-link-card__title .stretched-link--disabled::after{display:none}.card.vs-stretched-link-card .vs-stretched-link-card__title .stretched-link .vs-icon{color:#a8308c}.card.vs-stretched-link-card .vs-stretched-link-card__category{font-size:.875rem;line-height:1;color:#535396;letter-spacing:normal;margin-bottom:1rem}.card.vs-stretched-link-card .vs-stretched-link-card__content{margin-top:.5rem;line-height:1.3;font-size:1rem;text-align:left}.card.vs-stretched-link-card .vs-stretched-link-card__content p:last-of-type{margin-bottom:0}.card.vs-stretched-link-card .vs-stretched-link-card__panels{position:absolute;top:.25rem;right:.25rem;display:flex;flex-direction:row}@media(min-width: 576px){.card.vs-stretched-link-card .vs-stretched-link-card__panels{top:.5rem;right:.5rem}}.card.vs-stretched-link-card .vs-stretched-link-card__link{margin:1rem 0 0;color:#1f49d6;text-decoration:underline}.card.vs-stretched-link-card .vs-stretched-link-card__video-button{position:absolute;bottom:100%;left:0}.card.vs-stretched-link-card .vs-stretched-link-card__video-btn-text{padding-right:.25rem}.card.vs-stretched-link-card .vs-stretched-link-card__full-warning{position:absolute;height:127px;width:calc(100% - 1rem);z-index:1}.card.vs-stretched-link-card .vs-stretched-link-card__image-warning{position:absolute;width:100%;height:100%;z-index:1;top:0}.card.vs-stretched-link-card .vs-stretched-link-card__full-warning--no-js,.card.vs-stretched-link-card .vs-stretched-link-card__image-warning--no-js{display:none}.card.vs-stretched-link-card .vs-stretched-link-card__badges{margin-top:.5rem}.no-js .card.vs-stretched-link-card .vs-stretched-link-card__image-warning,.no-js .card.vs-stretched-link-card .vs-stretched-link-card__full-warning,.no-js .card.vs-stretched-link-card .vs-stretched-link-card__video-button{display:none}.no-js .card.vs-stretched-link-card .vs-stretched-link-card__full-warning--no-js,.no-js .card.vs-stretched-link-card .vs-stretched-link-card__image-warning--no-js{display:flex}
50
51
  .vs-stretched-link-panels{position:absolute;right:1rem;top:1rem;display:flex;flex-direction:row}.vs-stretched-link-panels__panel{width:55px;height:55px;background:#33225d;margin-left:.5rem;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center}.vs-stretched-link-panels__panel--days{background:#a8308c}.vs-stretched-link-panels__panel p{margin-bottom:0;text-align:center;line-height:1;font-size:.625rem}.vs-stretched-link-panels__days{font-size:1.25rem;font-family:"Source Sans Pro";font-weight:700;display:block;margin-bottom:.25rem}.vs-stretched-link-panels__icon{height:20px;width:auto;margin-bottom:.25rem}
51
52
  .vs-carousel-slide{max-width:100%;flex-shrink:0;display:flex}.vs-carousel-slide .vs-carousel-slide__card{flex-shrink:0;opacity:.5;transition:.5s;padding:.5rem;max-width:100%}.vs-carousel-slide .vs-carousel-slide__card--active{opacity:1}.vs-carousel-slide .vs-carousel-slide__card--disabled *{pointer-events:none}.vs-carousel-slide .card-title{margin-bottom:0}.vs-carousel-slide .card-body{text-align:left}.vs-carousel-slide .card-body .vs-heading__sub-heading{display:none}.no-js .vs-carousel-slide{margin-bottom:.5rem}.no-js .vs-carousel-slide::after{content:"";position:absolute;left:.75rem;bottom:.25rem;height:1px;width:calc(100% - 24px);background:#e9e9e9}@media(min-width: 576px){.no-js .vs-carousel-slide::after{width:calc(100% - 40px);left:1.25rem}}.no-js .vs-carousel-slide .vs-stretched-link-card{opacity:1;display:flex;flex-direction:row;padding:.5rem;border:none;height:100%;cursor:pointer}.no-js .vs-carousel-slide .vs-stretched-link-card:hover .vs-stretched-link-card__title{text-decoration:underline}.no-js .vs-carousel-slide .vs-stretched-link-card .stretched-link{text-decoration:none;letter-spacing:0}.no-js .vs-carousel-slide .vs-stretched-link-card .card-body{background:none;padding:0;align-self:flex-start;width:66%;text-align:left}.no-js .vs-carousel-slide .vs-stretched-link-card__img-container{width:33%;align-self:flex-start;margin-right:1rem}.no-js .vs-carousel-slide .vs-stretched-link-card__title{font-size:.75rem;letter-spacing:1px;line-height:1.6;color:#200f2e;text-decoration:none}.no-js .vs-carousel-slide .vs-stretched-link-card__category{margin-bottom:.5rem}.no-js .vs-carousel-slide .vs-stretched-link-card .card-title{display:flex;margin-bottom:0}.no-js .vs-carousel-slide .vs-stretched-link-card__content{display:none}.no-js .vs-carousel-slide .vs-stretched-link-card__content p{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.no-js .vs-carousel-slide .vs-stretched-link-card .vs-stretched-link-panels{right:auto;left:calc(33% - 4px);top:1rem;transform:translateX(-100%)}.no-js .vs-carousel-slide .vs-stretched-link-card .vs-stretched-link-panels__panel{display:none;width:36px;height:36px}.no-js .vs-carousel-slide .vs-stretched-link-card .vs-stretched-link-panels__panel--days{display:flex}.no-js .vs-carousel-slide .vs-stretched-link-card .vs-stretched-link-panels__days{font-size:1rem;margin-bottom:0}@media(min-width: 576px){.no-js .vs-stretched-link-card__content{display:block}}@media(min-width: 992px){.no-js .vs-carousel-slide .vs-stretched-link-card__title{font-size:.875rem}.no-js .vs-carousel-slide .vs-stretched-link-card__content{margin:.5rem 0 0;line-height:1.3}}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@visitscotland/component-library",
3
- "version": "4.21.0",
3
+ "version": "4.22.0",
4
4
  "description": "VisitScotland Component Library",
5
5
  "author": "VisitScotland",
6
6
  "homepage": "https://github.com/visitscotland/vs-component-library#readme",
@@ -1 +0,0 @@
1
- .vs-card{position:relative;display:flex;flex-direction:column;border-radius:.25rem}.vs-card:hover .img-zoom-on-hover{transform:scale(1.05)}.vs-card__header{overflow:hidden}.vs-card__body{display:flex;flex-direction:column}.vs-card__body--centered{justify-content:center}.vs-card--elevated{box-shadow:0px 1px 2px 0px rgba(0,0,0,.3),0px 1px 3px 1px rgba(0,0,0,.15)}.vs-card--outlined{border:1px solid #e9e9e9;transition:all .2s}.vs-card--outlined:hover{border-color:#200f2e}.vs-card--filled{background-color:#fff}.vs-card--horizontal{flex-direction:row}.vs-card--horizontal .vs-card__header{flex:1 1 35%}.vs-card--horizontal .vs-card__body{flex:1 1 75%}@media(min-width: 576px){.vs-card--horizontal .vs-card__header{flex-basis:40%}.vs-card--horizontal .vs-card__body{flex-basis:60%}}