@paraboly/pwc-simple-card
Version:
Plug & Play Simple Card View for Web by Paraboly via StencilJS
19 lines (18 loc) • 3.1 kB
JavaScript
import { r as registerInstance, h } from './core-6ce9582a.js';
var img = 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIj8+CjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iMCAwIDUxMiA1MTIiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDUxMiA1MTI7IiB4bWw6c3BhY2U9InByZXNlcnZlIiB3aWR0aD0iNTEycHgiIGhlaWdodD0iNTEycHgiIGNsYXNzPSIiPjxnPjxnPgoJPGc+CgkJPHBhdGggZD0iTTM5Ni44LDE0MS4zMzNjLTMwLjcyLDAtNTkuNzMzLDExLjk0Ny04MC41MzMsMzIuNzQ3TDI1NiwyMjcuNDEzbC0wLjEwNy0wLjEwN2wtMzIuMzIsMjguNDhsMC4yMTMsMC4yMTNsLTU3LjQ5Myw1MC45ODcgICAgQzE1Mi42NCwzMjAuNTMzLDEzNC41MDcsMzI4LDExNS4yLDMyOGMtMzkuODkzLDAtNzIuMzItMzIuMzItNzIuMzItNzJzMzIuNDI3LTcyLDcyLjMyLTcyYzE5LjMwNywwLDM3LjQ0LDcuNDY3LDUyLjA1MywyMS45NzMgICAgbDI0LjIxMywyMS40NGwzMi4yMTMtMjguNDhsLTI2Ljk4Ny0yMy44OTNjLTIxLjc2LTIxLjY1My01MC42NjctMzMuNi04MS40OTMtMzMuNkM1MS42MjcsMTQxLjMzMywwLDE5Mi43NDcsMCwyNTYgICAgczUxLjYyNywxMTQuNjY3LDExNS4yLDExNC42NjdjMzAuNzIsMCw1OS42MjctMTEuOTQ3LDgwLjUzMy0zMi42NEwyNTYsMjg0LjU4N2wwLjEwNywwLjEwN2wzMi4yMTMtMjguNTg3TDI4OC4yMTMsMjU2ICAgIGw1Ny40OTMtNTAuODhDMzU5LjM2LDE5MS40NjcsMzc3LjQ5MywxODQsMzk2LjgsMTg0YzM5Ljg5MywwLDcyLjMyLDMyLjMyLDcyLjMyLDcycy0zMi40MjcsNzItNzIuMzIsNzIgICAgYy0xOS4zMDcsMC0zNy40NC03LjQ2Ny01Mi4wNTMtMjEuODY3bC0yNC4yMTMtMjEuNDRMMjg4LjMyLDMxMy4yOGwyNi45ODcsMjMuODkzYzIxLjc2LDIxLjY1Myw1MC42NjcsMzMuNDkzLDgxLjM4NywzMy40OTMgICAgQzQ2MC4zNzMsMzcwLjY2Nyw1MTIsMzE5LjI1Myw1MTIsMjU2UzQ2MC4zNzMsMTQxLjMzMywzOTYuOCwxNDEuMzMzeiIgZGF0YS1vcmlnaW5hbD0iIzAwMDAwMCIgY2xhc3M9ImFjdGl2ZS1wYXRoIiBkYXRhLW9sZF9jb2xvcj0iIzAwMDAwMCIgZmlsbD0iIzJFNTM4MCIvPgoJPC9nPgo8L2c+PC9nPiA8L3N2Zz4K';
var PwcSimpleCard = /** @class */ (function () {
function PwcSimpleCard(hostRef) {
registerInstance(this, hostRef);
this.source = img;
}
PwcSimpleCard.prototype.render = function () {
return (h("div", { class: "card-container" }, h("div", { class: "img-container" }, h("img", { class: "img-style", src: this.source })), h("div", { class: "text-container" }, h("div", { class: "title-style" }, this.cardTitle), h("div", { class: "details-style" }, this.cardDetails))));
};
Object.defineProperty(PwcSimpleCard, "style", {
get: function () { return ".card-container{background-color:#fdfdfd;-webkit-box-shadow:2px 4px 28px -8px rgba(0,0,0,.15);box-shadow:2px 4px 28px -8px rgba(0,0,0,.15);width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;max-width:250px;padding:12px}.card-container,.img-container{border-radius:12px;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}.img-container{-ms-flex-pack:center;justify-content:center;background-color:#f1f8ff}.img-style{width:35px;padding:8px}.text-container{padding-left:12px}.title-style{font-size:15px;font-weight:600;color:#5b6575;text-align:center;font-family:sans-serif;margin-bottom:5px}.details-style{font-size:13px;text-align:center;color:#8a8d94}"; },
enumerable: true,
configurable: true
});
return PwcSimpleCard;
}());
export { PwcSimpleCard as pwc_simple_card };