UNPKG

@world-vision-canada/wvc-design-system

Version:

WVC Vue Design system is a fork of Vue Design System, an open-source tool for building Design Systems with Vue.js

2 lines 11.9 kB
(("undefined"!==typeof self?self:this)["webpackJsonpwvc"]=("undefined"!==typeof self?self:this)["webpackJsonpwvc"]||[]).push([[18],{2350:function(a,t){function d(a,t){var d=a[1]||"",e=a[3];if(!e)return d;if(t&&"function"===typeof btoa){var i=r(e),c=e.sources.map((function(a){return"/*# sourceURL="+e.sourceRoot+a+" */"}));return[d].concat(c).concat([i]).join("\n")}return[d].join("\n")}function r(a){var t=btoa(unescape(encodeURIComponent(JSON.stringify(a)))),d="sourceMappingURL=data:application/json;charset=utf-8;base64,"+t;return"/*# "+d+" */"}a.exports=function(a){var t=[];return t.toString=function(){return this.map((function(t){var r=d(t,a);return t[2]?"@media "+t[2]+"{"+r+"}":r})).join("")},t.i=function(a,d){"string"===typeof a&&(a=[[null,a,""]]);for(var r={},e=0;e<this.length;e++){var i=this[e][0];"number"===typeof i&&(r[i]=!0)}for(e=0;e<a.length;e++){var c=a[e];"number"===typeof c[0]&&r[c[0]]||(d&&!c[2]?c[2]=d:d&&(c[2]="("+c[2]+") and ("+d+")"),t.push(c))}},t}},2877:function(a,t,d){"use strict";function r(a,t,d,r,e,i,c,n){var o,l="function"===typeof a?a.options:a;if(t&&(l.render=t,l.staticRenderFns=d,l._compiled=!0),r&&(l.functional=!0),i&&(l._scopeId="data-v-"+i),c?(o=function(a){a=a||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext,a||"undefined"===typeof __VUE_SSR_CONTEXT__||(a=__VUE_SSR_CONTEXT__),e&&e.call(this,a),a&&a._registeredComponents&&a._registeredComponents.add(c)},l._ssrRegister=o):e&&(o=n?function(){e.call(this,(l.functional?this.parent:this).$root.$options.shadowRoot)}:e),o)if(l.functional){l._injectStyles=o;var p=l.render;l.render=function(a,t){return o.call(t),p(a,t)}}else{var m=l.beforeCreate;l.beforeCreate=m?[].concat(m,o):[o]}return{exports:a,options:l}}d.d(t,"a",(function(){return r}))},"35d6":function(a,t,d){"use strict";function r(a,t){for(var d=[],r={},e=0;e<t.length;e++){var i=t[e],c=i[0],n=i[1],o=i[2],l=i[3],p={id:a+":"+e,css:n,media:o,sourceMap:l};r[c]?r[c].parts.push(p):d.push(r[c]={id:c,parts:[p]})}return d}function e(a,t,d){var e=r(a,t);i(e,d)}function i(a,t){for(var d=t._injectedStyles||(t._injectedStyles={}),r=0;r<a.length;r++){var e=a[r],i=d[e.id];if(!i){for(var c=0;c<e.parts.length;c++)n(e.parts[c],t);d[e.id]=!0}}}function c(a){var t=document.createElement("style");return t.type="text/css",a.appendChild(t),t}function n(a,t){var d=c(t),r=a.css,e=a.media,i=a.sourceMap;if(e&&d.setAttribute("media",e),i&&(r+="\n/*# sourceURL="+i.sources[0]+" */",r+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(i))))+" */"),d.styleSheet)d.styleSheet.cssText=r;else{while(d.firstChild)d.removeChild(d.firstChild);d.appendChild(document.createTextNode(r))}}d.r(t),d.d(t,"default",(function(){return e}))},"554e":function(a,t,d){"use strict";d.r(t);var r=function(){var a=this,t=a.$createElement,d=a._self._c||t;return d("div",{class:["card",a.themeClass,a.classes],style:{backgroundColor:a.backgroundColor}},[a.backgroundImage?d("div",{staticClass:"card-image",style:{backgroundImage:"url("+a.backgroundImage+")"},attrs:{"aria-label":"ASAA",role:"img",alt:a.backgroundAltText}}):a._e(),a.overlay&&a.backgroundImage?d("div",{staticClass:"card-overlay"},[a.iconImage?d("div",{staticClass:"card-icon",style:{backgroundImage:"url("+a.iconImage+")"},attrs:{role:"img",alt:a.iconAltText}}):a._e(),a._t("default")],2):d("div",{staticClass:"card-body"},[a._t("header"),a._t("default")],2)])},e=[],i=d("9523"),c=d.n(i),n={name:"WvcCard",props:{backgroundAltText:{type:String,default:null},backgroundColor:{type:String,default:null},backgroundImage:{type:String,default:null},contained:{type:Boolean,default:!1},dark:{type:Boolean,default:!1},fillWidth:{type:Boolean,default:!1},flexDirection:{type:String,default:"column",validator:function(a){return a.match(/(column|row)/)}},iconAltText:{type:String,default:null},iconImage:{type:String,default:null},overlay:{type:Boolean,default:!1},width:{type:String,default:"single",validator:function(a){return a.match(/(single|wide|full)/)}}},computed:{classes:function(){var a;return a={},c()(a,"card--flex-".concat(this.flexDirection),!0),c()(a,"card--".concat(this.width).concat(this.backgroundImage?"-image":""),!0),c()(a,"card--overlay",this.overlay),c()(a,"card--container-mode",this.contained),c()(a,"card--fill-width",this.fillWidth),a},themeClass:function(){return{"theme-light":!this.dark,"theme-dark":this.dark}}}},o=n,l=d("2877");function p(a){var t=d("bc0d");t.__inject__&&t.__inject__(a)}var m=Object(l["a"])(o,r,e,!1,p,"10144ba1",null,!0);t["default"]=m.exports},"743e":function(a,t,d){t=a.exports=d("2350")(!1),t.push([a.i,"@import url(https://fonts.googleapis.com/css2?family=Karla:wght@700&family=Lato:ital,wght@0,400;0,700;1,400&display=swap);",""]),t.push([a.i,'.card[data-v-10144ba1]{box-sizing:border-box;padding:0;margin:0;display:flex;align-items:center;text-align:center;width:100%;margin:8px}.card[data-v-10144ba1]:before{content:"";display:block;height:0;width:0;margin-top:-.1em}.card.theme-light[data-v-10144ba1]{background-color:#fff;color:#000}.card.theme-dark[data-v-10144ba1]{background-color:#0d4773;color:#fff}.card.card--container-mode[data-v-10144ba1]{margin:8px 0}.card.card--flex-row[data-v-10144ba1]{flex-direction:row}.card.card--flex-column[data-v-10144ba1]{flex-direction:column}.card h2[data-v-10144ba1]{font-size:36px;line-height:48px}.card h2[data-v-10144ba1],.card h3[data-v-10144ba1]{font-family:Lato;font-weight:700}.card h3[data-v-10144ba1]{font-size:32px;line-height:40px;margin:16px 12px}.card h4[data-v-10144ba1]{font-size:24px}.card h4[data-v-10144ba1],.card h5[data-v-10144ba1]{font-family:Lato;font-weight:700;line-height:32px;margin-top:8px}.card h5[data-v-10144ba1]{font-size:20px}.card h6[data-v-10144ba1]{font-family:Lato;font-size:18px;line-height:32px;margin-top:8px}.card p[data-v-10144ba1]{font-family:Lato;font-size:16px;line-height:24px;margin:16px}@media (max-width:767px){.card h2[data-v-10144ba1]{font-size:28px;margin-top:8px;margin-bottom:12px}.card h2[data-v-10144ba1],.card h3[data-v-10144ba1]{font-family:Lato;font-weight:700;line-height:32px}.card h3[data-v-10144ba1]{font-size:26px;margin:8px 0}.card h4[data-v-10144ba1]{font-size:18px;margin-top:8px}.card h4[data-v-10144ba1],.card h5[data-v-10144ba1]{font-family:Lato;font-weight:700;line-height:24px}.card h5[data-v-10144ba1]{font-size:16px}.card h6[data-v-10144ba1]{font-size:14px}.card h6[data-v-10144ba1],.card p[data-v-10144ba1]{font-family:Lato;line-height:24px}.card p[data-v-10144ba1]{font-size:16px;margin:16px}}.card.card--overlay h3[data-v-10144ba1]{margin-top:16px}@media (max-width:767px){.card.card--overlay h3[data-v-10144ba1]{margin-bottom:12px}.card.card--overlay p[data-v-10144ba1]{margin:16px 12px}}.card .card-image[data-v-10144ba1]{width:100%;background-repeat:no-repeat;background-size:cover;object-fit:cover;min-height:184px}@media (max-width:767px){.card .card-image[data-v-10144ba1]{min-height:0;height:160px}}.card .card-overlay[data-v-10144ba1]{background-color:#fff;height:calc(100% - 12px);width:calc(100% - 56px);margin-top:-48px;display:block;padding:16px 12px;margin-bottom:16px;text-align:center}.card .card-overlay p[data-v-10144ba1]{margin:12px 4px}.card .card-icon[data-v-10144ba1]{width:64px;height:64px;border-radius:50%;background-repeat:no-repeat;background-size:cover;margin:-48px auto 0}.card .card-body[data-v-10144ba1]{padding:16px 12px}.card.card--single[data-v-10144ba1],.card.card--single-image[data-v-10144ba1]{max-width:348px}@media (max-width:767px){.card.card--single[data-v-10144ba1],.card.card--single-image[data-v-10144ba1]{max-width:328px}}.card.card--single[data-v-10144ba1]{width:calc(33.33% - 64px);max-width:328px;padding:16px}.card.card--single.card--container-mode[data-v-10144ba1]{width:100%}.card.card--single.card--container-mode.card--fill-width[data-v-10144ba1]{max-width:none}@media (max-width:767px){.card.card--single[data-v-10144ba1]{width:calc(100% - 12px);margin:0;padding:12px}}.card.card--single-image[data-v-10144ba1]{width:calc(33.33% - 16px)}.card.card--single-image.card--container-mode[data-v-10144ba1]{width:100%}.card.card--single-image.card--container-mode.card--fill-width[data-v-10144ba1]{max-width:none}@media (max-width:767px){.card.card--single-image[data-v-10144ba1]{width:100%;margin:12px 0}}.card.card--wide[data-v-10144ba1],.card.card--wide-image[data-v-10144ba1]{max-width:696px}@media (max-width:767px){.card.card--wide[data-v-10144ba1],.card.card--wide-image[data-v-10144ba1]{max-width:360px}}.card.card--wide[data-v-10144ba1]{width:calc(66.33% - 64px);padding:16px}.card.card--wide.card--container-mode[data-v-10144ba1]{width:100%}.card.card--wide.card--container-mode.card--fill-width[data-v-10144ba1]{max-width:none}@media (max-width:767px){.card.card--wide[data-v-10144ba1]{width:calc(100% - 12px);margin:12px}}.card.card--wide-image[data-v-10144ba1]{width:calc(66.33% - 16px)}.card.card--wide-image.card--container-mode[data-v-10144ba1]{width:100%}.card.card--wide-image.card--container-mode.card--fill-width[data-v-10144ba1]{max-width:none}@media (max-width:767px){.card.card--wide-image[data-v-10144ba1]{width:100%;margin:12px 0}}.card.card--full[data-v-10144ba1]{padding:16px}.card.card--full[data-v-10144ba1],.card.card--full-image[data-v-10144ba1]{max-width:1084px}.card.card--full-image.card--container-mode[data-v-10144ba1],.card.card--full.card--container-mode[data-v-10144ba1]{width:100%}.card.card--full-image.card--container-mode.card--fill-width[data-v-10144ba1],.card.card--full.card--container-mode.card--fill-width[data-v-10144ba1]{max-width:none}.card.card--full-image .card-image[data-v-10144ba1],.card.card--full .card-image[data-v-10144ba1]{height:256px}@media (max-width:767px){.card.card--full[data-v-10144ba1],.card.card--full-image[data-v-10144ba1]{max-width:360px}.card.card--full-image .card-image[data-v-10144ba1],.card.card--full .card-image[data-v-10144ba1]{height:160px}}.card.card--full-image.card--overlay .card-overlay[data-v-10144ba1],.card.card--full.card--overlay .card-overlay[data-v-10144ba1]{width:81%;margin-top:-96px;padding:16px 12px;margin-bottom:40px}@media (min-width:1025px){.card.card--full-image.card--overlay .card-overlay h2[data-v-10144ba1],.card.card--full.card--overlay .card-overlay h2[data-v-10144ba1]{margin:20px 56px}.card.card--full-image.card--overlay .card-overlay h6[data-v-10144ba1],.card.card--full.card--overlay .card-overlay h6[data-v-10144ba1]{margin:12px 92px}.card.card--full-image.card--overlay .card-overlay p[data-v-10144ba1],.card.card--full.card--overlay .card-overlay p[data-v-10144ba1]{font-family:Lato;font-size:18px;line-height:32px;margin-left:84px;margin-right:84px}}@media (max-width:767px){.card.card--full-image.card--overlay .card-overlay[data-v-10144ba1],.card.card--full.card--overlay .card-overlay[data-v-10144ba1]{margin-top:-48px;max-width:328px;width:calc(100% - 56px);margin-bottom:12px}.card.card--full-image.card--overlay .card-overlay p[data-v-10144ba1],.card.card--full.card--overlay .card-overlay p[data-v-10144ba1]{margin-top:8px;margin-bottom:0}}@media (max-width:767px){.card.card--overlay h3[data-v-10144ba1]{margin-top:16px}.card.card--overlay p[data-v-10144ba1]{margin:16px 8px}.card.card--overlay .card-overlay[data-v-10144ba1]{margin-top:-32px}.card.card--overlay .card-overlay p[data-v-10144ba1]{margin-bottom:12px}}',""])},9242:function(a,t,d){var r=d("743e");"string"===typeof r&&(r=[[a.i,r,""]]),r.locals&&(a.exports=r.locals);var e=d("35d6").default;a.exports.__inject__=function(a){e("8dfb78ca",r,a)}},9523:function(a,t){function d(a,t,d){return t in a?Object.defineProperty(a,t,{value:d,enumerable:!0,configurable:!0,writable:!0}):a[t]=d,a}a.exports=d},bc0d:function(a,t,d){"use strict";d.r(t);var r=d("9242"),e=d.n(r);for(var i in r)["default"].indexOf(i)<0&&function(a){d.d(t,a,(function(){return r[a]}))}(i);t["default"]=e.a}}]); //# sourceMappingURL=wvc.umd.min.18.js.map