<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>ZingGrid Demo</title>
<script nonce="undefined" src="https://cdn.zinggrid.com/zinggrid.min.js"></script>
<style>
@import url('https://fonts.googleapis.com/css?family=Ruthie');
body {
background: #e6e6e6;
}
svg {
height: 2.25rem;
margin-right: 1rem;
width: auto;
}
zg-caption img {
height: 5rem;
position: absolute;
left: -4rem;
width: auto;
top: -0.5rem;
}
zg-caption svg {
height: 2.5rem;
position: relative;
top: 0.5rem;
transform: rotate(25deg);
}
zg-cell[data-field-index="sign"] {
font-size: 1.75rem;
}
zg-row {
border: 1px solid #225878;
}
zing-grid {
overflow: hidden;
--zing-grid-color: #fff;
--zing-grid-font-family: cursive;
--zing-grid-font-size: 1rem;
--zg-body-background: url(https://app.zinggrid.com/api/file/QC1FM725/demo-astrology-bg.jpg);
--zg-caption-background: url(https://app.zinggrid.com/api/file/QC1FM725/demo-astrology-bg.jpg);
--zg-caption-color: #FED953;
--zg-caption-font-family: "Ruthie";
--zg-caption-font-size: 3rem;
--zg-caption-icon-color: #fff;
--zg-caption-padding: 0.5rem 1rem;
--zg-row-card-background: url(https://app.zinggrid.com/api/file/QC1FM725/demo-astrology-bg.jpg);
--zg-footer-background: #000;
--zg-head-cell-background: #000;
--zg-icon-height: 2rem;
--zg-icon-width: 2rem;
--zg-input-background: #a391ad;
--zg-input-color: #000;
--zg-menu-background: #000;
--zg-menu-border: 1px solid #225878;
--zg-menu-item-background_hover: #093454;
--zg-option-list-background: #a391ad;
--zg-option-list-item-background_hover: #c9b6d3;
--zg-pager-background: #000;
--zg-pager-border: 1px solid #225878;
--zg-select-background: #a391ad;
--zg-select-color: #000;
--zg-row-border: 1px solid #225878;
--zg-watermark-background: #000;
--zg-watermark-border: 1px solid #225878;
}
zing-grid[loading] {
height: 451px;
}
</style>
</head>
<body>
<zing-grid pager page-size="5" data='[
{
"sign": "Aquarius",
"date": "January 20 - February 18",
"element": "Air"
}, {
"sign": "Pisces",
"date": "February 19 - March 20",
"element": "Water"
}, {
"sign": "Aries",
"date": "March 19 - May 20",
"element": "Fire"
}, {
"sign": "Taurus",
"date": "April 20 - May 18",
"element": "Earth"
}, {
"sign": "Gemini",
"date": "May 21 - June 20",
"element": "Air"
}, {
"sign": "Cancer",
"date": "June 21 - Jully 22",
"element": "Water"
}, {
"sign": "Leo",
"date": "July 23 - Auguest 22",
"element": "Fire"
}, {
"sign": "Virgo",
"date": "Auguest 23 - September 22",
"element": "Earch"
}, {
"sign": "Libra",
"date": "September 23 - October 22",
"element": "Air"
}, {
"sign": "Scorpio",
"date": "October 23 - November 21",
"element": "Water"
}, {
"sign": "Sagittarius",
"date": "November 22 - December 21",
"element": "Fire"
}, {
"sign": "Capricorm",
"date": "January 22 - January 19",
"element": "Earth"
}
]'>
<zg-caption>
<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 95.168 95.168">
<path d="M94.344 64.042a2.812 2.812 0 0 0-3.23-.534 44.647 44.647 0 0 1-19.654 4.571c-11.854 0-22.995-4.615-31.375-12.995A44.376 44.376 0 0 1 31.66 4.053a2.808 2.808 0 0 0-.534-3.229 2.813 2.813 0 0 0-3.23-.534A49.937 49.937 0 0 0 14.65 9.781C5.203 19.228 0 31.789 0 45.149c0 13.36 5.203 25.92 14.65 35.368 9.447 9.447 22.008 14.65 35.368 14.65 13.361 0 25.922-5.203 35.369-14.65a49.937 49.937 0 0 0 9.491-13.246 2.81 2.81 0 0 0-.534-3.229z" fill="#FFDA44" />
</svg>
Astrology Signs
<img src="https://app.zinggrid.com/api/file/T6VPUMI6/Clouds.png">
</zg-caption>
<zg-colgroup>
<zg-column index="sign" renderer="renderSign"></zg-column>
<zg-column index="date"></zg-column>
<zg-column index="element"></zg-column>
</zg-colgroup>
</zing-grid>
Icons by <a href="https://www.flaticon.com/authors/freepik">Freepik</a> from <a href="https://www.flaticon.com/">FlatIcon</a>
<script>
ZingGrid.setLicense(['26ccbfec16b8be9ee98c7d57bee6e498']);
function renderSign(sign) {
if (sign === 'Aquarius') return `<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 32 32"><path d="M32 7.692l-.377-1.326-.404-1.555c-2.684-2.578-9.699-1.438-14.482-.257-.288-.629-.978-.981-1.646-.776-.638.195-1 .82-.938 1.471-.578.168-1.063.316-1.43.434-.601-.36-1.313-.487-1.98-.284-1.351.414-2.08 1.963-1.625 3.452.098.32.247.611.431.872-.562.248-1.066.663-.843 1.488.067.251.118.459.164.65-3.561 1.342-5.835 8.505-6.049 12.667-.088 1.447-.82 1.533-2.821 4.092.48 0 22.77.035 23.648.125-.186-.901-1.685-1.172-3.146-1.213-.195-.006-.994-.584-.479-1.2-1.168.104-.5 1.203-.688 1.209-.384.015-1.097-.832-.515-1.861-1.424.094-1.271 2.004-1.271 2.006 0 0-.774-.755.035-2.246-1.753-.615-2.721 1.353-2.721 1.353s-2.158-1.892-3.539-2.043c-1.383-.153-1.17.803-2.5 1.229-2.805.527-2.939-1.382-2.874-1.601.298.361 3.672.822 4.083-1.477-2.196 1.578-3.809-.207-3.809-.207s2.951 1.063 3.363-1.373c-1.541 1.57-3.02-.616-3.02-.616s2.882.96 2.677-.618c-.687.618-2.35-.731-2.35-.731s1.055-4.225 2.467-5.686l.046.116c.201.482.708.515 1.216.417a2.65 2.65 0 0 0 .105.793c.333 1.087 1.349 1.847 2.471 1.847.251 0 .501-.038.743-.112a2.524 2.524 0 0 0 1.515-1.263c.018-.035.026-.071.043-.106a61.73 61.73 0 0 0 1.347-.229c.307.586.965.911 1.609.712.562-.172.925-.679.961-1.243 4.706-1.076 11.562-3.244 12.583-6.91zM11.066 6.448c.12-.036.244-.055.37-.055.159 0 .315.034.464.088-.103.844-.406 2.408-1.25 2.844a1.905 1.905 0 0 1-.482-.795c-.278-.911.124-1.844.898-2.082zm2.558 9.233c-.765.231-1.607-.238-1.842-1.006a1.49 1.49 0 0 1 .007-.819c1.018-.289 2.099.542 2.693 1.11a1.449 1.449 0 0 1-.858.715z" fill="#FFF"/></svg>${sign}`;
if (sign === 'Pisces') return `<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 31.999 31.999"><g fill="#FFF"><path d="M15.151 14.714s.156.314.301.349c1.052.248 5.739 1.314 7.087.471.72-.479-1.918-2.733-1.918-2.733s3.114 1.438 3.645.912c1.928-3.104-3.041-8.21-4.304-9.415-.317-.357-.551-.089-.551-.089l-5.896 4.085 1.636 6.42zm5.446-5.797a.935.935 0 1 1 0 1.87.935.935 0 0 1 0-1.87z"/><path d="M13.639 14.441c.646.036.46-.681.46-.681l-1.485-5.896 6.305-4.127s.42-.278.021-.529c-1.004-.856-3.944-3.286-4.934-3.206-1.199.096-.911 3.26-1.774 3.068C3.218 3.5.019 19.051.438 19.56c.419.51.761.869 1.533.289.787 1.709-1.033 5.582-1.64 7.166-.158.479.244.353.521.116C2.244 25.74 3.23 25.246 3.788 25.3c.557.055 1.844.543 2.591.96.357.263.771.19.393-.349-5.826-12.264 4.129-11.752 6.867-11.47z"/><path d="M16.848 17.283s-.154-.313-.301-.35c-1.05-.248-5.737-1.313-7.086-.472-.719.479 1.917 2.732 1.917 2.732s-3.115-1.436-3.643-.909c-1.93 3.104 3.04 8.21 4.303 9.415.317.356.551.089.551.089l5.896-4.086-1.637-6.419zm-5.446 5.797a.936.936 0 1 1 .001-1.871.936.936 0 0 1-.001 1.871z"/><path d="M31.149 4.866c-1.392 1.391-2.379 1.885-2.937 1.831-.559-.054-1.844-.543-2.59-.96-.358-.263-.771-.19-.395.349 5.824 12.265-4.131 11.753-6.869 11.47-.646-.035-.459.683-.459.683l1.484 5.896-6.304 4.127s-.42.278-.021.529c1.004.854 3.945 3.286 4.935 3.207 1.196-.099.909-3.263 1.772-3.068 9.014-.432 12.213-15.98 11.793-16.491-.42-.509-.762-.868-1.533-.288-.787-1.709 1.033-5.583 1.643-7.166.158-.481-.243-.353-.519-.119z"/></g></svg>${sign}`;
if (sign === 'Aries') return `<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 27.155 27.155"><path d="M24.186 4.42c-.479.786-1.054 1.894-1.034 2.695-.836-.498-.104-2.043.479-3.026-.021-.01-.036-.022-.055-.033a8.029 8.029 0 0 0-1.644-.634c-.239.897-.495 2.203-.229 2.996-.971-.238-.685-2.013-.403-3.121a4.207 4.207 0 0 0-2.082.229c.171.912.501 2.188 1.077 2.786-.939.193-1.441-1.39-1.677-2.508a6.853 6.853 0 0 0-1.36.995c.394.829 1.003 1.903 1.678 2.322-.813.396-1.645-.842-2.159-1.845-.741.775-1.504 1.771-2.323 3a5.7 5.7 0 0 0-.866-.029c-.269-.007-.643-.008-.882.029-.821-1.229-1.583-2.225-2.325-3-.516 1.002-1.344 2.24-2.16 1.844.675-.418 1.284-1.493 1.678-2.322a6.95 6.95 0 0 0-1.362-.995c-.236 1.12-.738 2.702-1.679 2.509.577-.599.907-1.876 1.078-2.787a4.216 4.216 0 0 0-2.082-.229c.28 1.108.565 2.883-.403 3.121.265-.793.009-2.099-.23-2.996-.52.135-1.062.34-1.642.635-.019.01-.036.024-.055.033.585.983 1.316 2.528.479 3.026.021-.802-.553-1.909-1.033-2.695C-.185 6.558-.756 11.541.923 13.822c.531.693 2.531 2.922 4.531 1.232 2-1.688.141-3.904-.72-4.093-.357.994.657 1.97-.312 1.877-2.375-.344-2.406-2.719.313-4.719 2.438-1.688 4.406 1.875 4.406 1.875s-3-1.813-4.094-1.219c-1.094.594.062.875.5 1.655.437.781 2.562 1.72 2.344 2.407-.375 3.218 2.125 5.313 2.5 6.188s.625 4.841 2.998 4.875h.377c2.373-.034 2.623-4 2.998-4.875s2.875-2.971 2.5-6.188c-.219-.688 1.906-1.625 2.344-2.406.438-.78 1.596-1.062.5-1.655-1.094-.594-4.094 1.219-4.094 1.219s1.969-3.563 4.406-1.875c2.719 2 2.688 4.375.312 4.719-.968.094.046-.883-.312-1.875-.859.188-2.719 2.406-.719 4.093 2 1.688 4-.537 4.529-1.232 1.681-2.283 1.11-7.268-2.044-9.405zM8.154 11.711c-.345-.073-1.997-1.24-2.221-1.612-.223-.37-.546-.785-.52-.861.164-.464 3.3.781 3.3 1.441 0 .461-.069 1.135-.559 1.032zm1.862 5.939c-.271.129-1.197-1.438-1.426-2.021s.214-1.205.638-1.217c.264.203 1.382 2.957.788 3.238zm3.069 5.714c-.365.077-1.048-.423-1.036-.733.012-.31.541-.235.67-.169.129.068.731.825.366.902zm.984 0c-.363-.077.237-.834.366-.902.129-.066.658-.142.67.169.013.311-.67.81-1.036.733zm7.673-14.127c.024.076-.299.491-.521.861-.223.372-1.876 1.539-2.221 1.611-.49.104-.561-.57-.561-1.031.002-.659 3.139-1.905 3.303-1.441zm-3.178 6.392c-.229.584-1.152 2.15-1.426 2.021-.594-.281.524-3.035.788-3.238.425.011.868.633.638 1.217z" fill="#FFF"/></svg>${sign}`;
if (sign === 'Taurus') return `<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 31.998 31.998"><path d="M25.055 0c1.297 7.964-1.514 7.64-1.514 7.64l-7.481-.283v-.005l-.06.002-.062-.002v.005l-7.482.283S5.645 7.964 6.942 0c-9.188 13.009 2.955 11.026 3.136 11.495.181.469-1.839 3.208-1.693 4.829.145 1.621 2.973 2.486 3.352 3.566 1.243 3.676-2.703 7.242.97 8.166.147.036.302.071.457.104a3.175 3.175 0 0 0 3.101 3.838 3.175 3.175 0 0 0 3.171-3.171c0-.271-.036-.532-.102-.783 3.602-.938-.309-4.492.931-8.153.379-1.08 3.207-1.945 3.353-3.566s-1.874-4.36-1.693-4.829c.175-.47 12.319 1.513 3.13-11.496zm-8.793 31.135a2.31 2.31 0 0 1-2.308-2.306c0-.177.024-.349.063-.513.85.129 1.631.192 1.92.216v.008l.062-.004.061.004v-.008a24.018 24.018 0 0 0 2.422-.3c.051.189.088.389.088.597a2.31 2.31 0 0 1-2.308 2.306z" fill="#FFF"/></svg>${sign}`;
if (sign === 'Gemini') return `<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 32 32"><g fill="#FFF"><path d="M31.124 11.592c-.482-2.366-.23-7.19-7.634-8.831a17.427 17.427 0 0 0-2.667-.411l-.039-.003a18.442 18.442 0 0 0-1.419-.059c-.028 0-.057-.003-.083-.003l-.039.001c-.4.001-.794.018-1.187.045-.07.005-.142.009-.211.015a16.6 16.6 0 0 0-1.121.132c-.068.012-.137.022-.205.035-.373.063-.739.136-1.099.225l-.117.032c-.352.09-.694.193-1.029.309l-.102.034a11.621 11.621 0 0 0-1.16.483c-.307.147-.604.307-.892.479-.056.033-.109.067-.164.102-.288.179-.566.369-.831.573-.034.027-.066.056-.101.083a9 9 0 0 0-.744.659l-.057.053a8.613 8.613 0 0 0-.667.76l-.107.135a8.577 8.577 0 0 0-.547.819c-.032.054-.062.109-.093.163a8.647 8.647 0 0 0-.448.917c-.018.043-.033.089-.05.133-.131.329-.246.67-.341 1.025-.004.013-.009.025-.012.04a9.583 9.583 0 0 0-.216 1.121c-.01.06-.02.119-.027.18-.046.374-.07.762-.078 1.159l-.001.226c0 .404.018.819.06 1.248.006.063.016.129.021.193.051.454.118.918.216 1.399 0 1.739-3.44 4.438-2.612 5.351.829.914 2.236.948 2.236.948s-.915 1.739-.504 2.219c.054.062.12.111.195.152.027.017.061.024.091.039.05.021.099.043.152.059.04.011.081.019.122.023a.895.895 0 0 0 .145.024c.048.006.093.008.14.013.042.002.084.006.124.006l.04.002c.048 0 .089-.004.132-.004.016-.002.03-.002.046-.002.064-.004.122-.01.174-.016l.014-.001c.109-.012.182-.022.182-.022s-1.063.768-1.063 1.359c0 .593 1.795 1.388 1.795 1.388s-.291 2.975 2.005 3.063c.033.003.064.008.102.008.083 0 .17-.002.262-.011 2.694-.229 3.147-.987 3.147-.987l.25 1.041.549 2.285h10.432l-.364-7.229c-.002 0 6.404-6.959 5.399-13.179z"/><path d="M6.775 25.215c0-.261.083-.513.21-.747a1.53 1.53 0 0 1-.519-.386c-.438-.516-.317-1.339-.021-2.133-.545-.161-1.19-.459-1.696-1.018-.858-.945.061-2.164 1.033-3.457.563-.746 1.324-1.758 1.377-2.35-.744-3.744-.092-7.003 1.889-9.431 2.168-2.657 5.898-4.181 10.234-4.181 1.038 0 2.106.087 3.177.257.086.014.159.034.244.048-1.174-.683-2.719-1.239-4.789-1.57C9.311-1.125 1.561 3.241 3.51 12.778c0 1.74-3.441 4.438-2.612 5.351.828.913 2.237.949 2.237.949s-.916 1.736-.506 2.218c.414.479 1.557.274 1.557.274s-1.063.767-1.063 1.359c0 .596 1.795 1.387 1.795 1.387s-.329 3.289 2.367 3.062c.51-.043.918-.107 1.28-.183-.001-.034-.008-.077-.009-.11-1.183-.595-1.781-1.224-1.781-1.87z"/></g></svg>${sign}`;
if (sign === 'Cancer') return `<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 38.439 38.439"><g fill="#FFF"><path d="M28.154 17.883c.188-2.563-7.063-4.938-7.063-4.938s-.151-1.979.875-2.688c-.688-1.25-1.938 3.25-1.938 3.25s-.688-.938-1.688 0c-.375 0-.5-3.625-1.5-3.563.438 1.5.25 3.625.25 3.625s-5.5 1.688-6.375 3.75 1.75 9.75 8.375 10.063c6.625.314 8.877-6.936 9.064-9.499zM27.051 14.846c.471.188 1.229 1.381 1.572 1.381.343 0 4.688-3.406 5-4.344s.002-1.141-.404-1.828c-1.063.625-6.637 4.603-6.168 4.791zM28.158 8.289c.809.625 2.59 2.844 2.59 2.844h.125c.668-.388 1.812-1.375 2.312-1.344.5.031-4.72-9.063-10.375-7.875 4.562 1.688 5.03 4.031 3.75 4.781-1.281.75-3.625-.813-4.812-2.375-.437 3.875 5.602 3.344 6.41 3.969zM31.869 20.963c-.729.356-1.424.642-1.963.756-.547.114-.857.037-1.08-.058-.115-.054-.145-.067-.266-.138l-.143-.077-.852 1.81.148.059a3.472 3.472 0 0 0 1.549.27 4.212 4.212 0 0 0 1.129-.254c.738-.279 1.439-.711 2.15-1.191.357-.24.715-.496 1.072-.758a9.558 9.558 0 0 0 1.076-.893c.354-.334.656-.674.938-1.031.291-.35.545-.713.779-1.068a17.92 17.92 0 0 0 1.15-2.01c.596-1.211.881-2.059.881-2.059s-.4.802-1.146 1.904c-.375.548-.836 1.17-1.379 1.785-.271.307-.561.616-.873.902a9.14 9.14 0 0 1-.973.81 8.194 8.194 0 0 1-1.076.665c-.375.203-.754.4-1.121.576z"/><path d="M37.398 22.4c-.162.162-.4.281-.643.431-.229.158-.529.259-.818.396-.295.133-.631.226-.961.345-.684.194-1.418.366-2.166.479-1.492.236-3.014.307-4.104.254-.267-.024-.521-.035-.722-.065-.17-.031-.448-.068-.389-.076-.005 0-.011.008-.019.021-.004.02-.091-.049-.117-.062-.076-.047-.117-.07-.117-.07l-1.006 1.729s.045.02.129.053c.058.021.063.031.188.068.121.037.264.074.426.105.391.077.523.034.822.045.27-.002.545-.037.859-.062 1.221-.14 2.775-.472 4.283-.97.754-.241 1.49-.547 2.16-.862.328-.183.652-.33.939-.519.282-.194.564-.346.787-.553.227-.195.443-.354.592-.555.146-.191.312-.322.379-.49l.248-.473-.318.422c-.076.148-.266.254-.432.409zM30.029 32.116c-.109-.311-.188-.656-.35-.968a7.075 7.075 0 0 0-.49-.942c-.725-1.235-1.719-2.254-2.418-2.996-.17-.183-.326-.346-.465-.491-.125-.138-.26-.286-.26-.306a.259.259 0 0 0-.047-.051c-.025-.051-.051-.093-.066-.125l-.061-.107-1.689 1.07.078.094c.023.031.057.07.096.115l.225.231c.197.2.334.286.512.426.172.125.361.265.57.416.811.589 1.877 1.343 2.715 2.31.221.235.414.488.588.75.199.25.314.531.471.793.121.271.225.545.312.81.057.271.125.526.158.771.014.248.023.475.035.675.006.202-.037.376-.047.522-.035.293-.057.461-.057.461s.053-.162.141-.443c.037-.146.111-.314.146-.521.026-.209.06-.442.095-.7.014-.262-.011-.543-.017-.85a8.701 8.701 0 0 0-.175-.944zM23.781 28.88l-.139-.555c-.016-.074-.027-.146-.041-.209-.018-.072-.025-.129-.016-.117.006-.004-.01-.01 0-.11l.004-.103-1.998.065s.008.035.02.103c.004.033.035.219.104.455.037.131.072.205.105.275.033.077.072.161.111.249l.268.537c.389.762.883 1.74 1.227 2.785.18.52.305 1.053.393 1.562.076.513.102.996.092 1.416-.025.416-.057.771-.117 1.013l-.076.386.158-.36c.113-.229.225-.567.348-.989.104-.427.189-.935.229-1.488.025-.553.021-1.149-.045-1.74-.117-1.185-.414-2.347-.627-3.175zM9.82 16.226c.344 0 1.104-1.193 1.572-1.381.468-.188-5.105-4.165-6.167-4.79-.407.687-.718.89-.405 1.828.312.938 4.657 4.343 5 4.343zM7.57 11.133h.125s1.781-2.219 2.59-2.844 6.848-.094 6.41-3.969c-1.188 1.563-3.531 3.125-4.813 2.375-1.281-.75-.812-3.094 3.75-4.781C9.977.726 4.758 9.82 5.258 9.789c.5-.031 1.646.956 2.312 1.344zM2.029 18.389c.236.355.49.719.779 1.068.282.357.586.695.94 1.032.373.358.67.594 1.074.891.359.263.715.519 1.072.759.713.479 1.414.912 2.153 1.19.373.136.757.229 1.127.254a3.457 3.457 0 0 0 1.55-.269c.098-.038.147-.059.147-.059l-.852-1.809s-.049.025-.142.076c-.121.068-.149.084-.264.137-.225.096-.535.174-1.082.059-.539-.114-1.232-.397-1.963-.756a39.207 39.207 0 0 1-1.126-.575 8.39 8.39 0 0 1-1.074-.665 8.649 8.649 0 0 1-.973-.81 11.545 11.545 0 0 1-.873-.902 18.447 18.447 0 0 1-1.381-1.785C.4 15.122 0 14.32 0 14.32s.283.848.879 2.059c.299.603.68 1.297 1.15 2.01z"/><path d="M10.541 26.051c.297-.011.433.032.82-.045.162-.031.305-.068.426-.105.125-.037.131-.05.188-.068.086-.033.131-.053.131-.053L11.1 24.05l-.119.07c-.027.013-.111.078-.117.062-.008-.013-.012-.021-.018-.021.062.008-.218.045-.388.076-.201.03-.455.041-.721.065-1.094.053-2.611-.018-4.104-.254a17.66 17.66 0 0 1-2.168-.479c-.329-.119-.666-.212-.959-.345-.291-.139-.59-.237-.821-.396-.238-.147-.479-.269-.642-.431-.164-.155-.354-.262-.438-.405-.201-.271-.318-.424-.318-.424s.092.172.25.475c.064.166.232.298.379.49.146.197.365.356.592.554.222.208.505.356.785.553.287.188.611.336.939.52.672.314 1.406.619 2.16.861 1.508.498 3.063.83 4.285.971.317.022.594.057.864.059zM14.182 27.292l.077-.094-1.69-1.07-.057.106a1.721 1.721 0 0 0-.07.125.268.268 0 0 0-.047.052c.002.02-.133.168-.256.306-.14.146-.296.312-.466.491-.698.742-1.694 1.761-2.42 2.996a6.903 6.903 0 0 0-.489.942c-.16.312-.238.657-.351.968a10.42 10.42 0 0 0-.176.94c-.006.305-.027.588-.016.849.034.258.065.492.096.701.031.206.106.377.145.521.088.283.14.443.14.443l-.056-.462c-.01-.146-.053-.319-.045-.521.011-.2.021-.428.033-.674.033-.244.105-.502.158-.771a10.8 10.8 0 0 1 .313-.809c.156-.262.271-.545.472-.795.172-.263.367-.514.586-.748.838-.967 1.906-1.721 2.715-2.311.209-.15.402-.291.572-.416.178-.14.312-.226.512-.426.084-.088.158-.166.225-.232a1.36 1.36 0 0 0 .095-.111zM14.857 27.889c.01.104-.008.106 0 .11.01-.012.002.045-.015.117-.014.063-.026.135-.043.209-.041.166-.086.353-.137.555-.215.828-.512 1.988-.627 3.173-.063.591-.07 1.188-.043 1.739a9.06 9.06 0 0 0 .23 1.488c.12.424.229.764.346.99l.156.36-.074-.387c-.063-.238-.092-.596-.119-1.011a8.824 8.824 0 0 1 .092-1.416c.09-.511.213-1.044.394-1.562.342-1.046.836-2.023 1.227-2.785l.269-.537.11-.249c.031-.069.066-.146.104-.276.069-.235.102-.42.106-.453l.019-.104-1.998-.064c0 .001 0 .037.003.103z"/></g></svg>${sign}`;
if (sign === 'Leo') return `<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 24.438 24.438"><path d="M23.504 15.49c1.125-1.375 2.688-11-5.125-14.25-7.812-3.25-11.562 1.625-11.5 3.625-2.625.937-3.188 3.875-3.188 3.875S-.122 10.615.003 12.865s2.875 2.375 2.875 2.375l.834 1.146.166-1.146s4.109-1.896 4.297-.238c.188 1.656-3.608 2.238-3.608 2.238l-.771-.562.235 1.049s-.839.264-.464 1.075c.75 1.25 3.25-.438 3.25-.438s-1.936 7.307 3.624 5.688c-3.438-1.75-.313-4.438-.313-4.438s.688 7 7.5 2.75c-5.375.563-4.143-2.146-3.562-2.75l3.562-3.705s1.563 2.33-2.25 5.187c5 1.333 5.25-7.792 5.25-7.792s1.188 4.375-1.938 7.312c7.125-1.562 3.562-10.5 3.562-10.5s1.314.436 1.252 5.374zm-18.817-7c-.12-.453.224-.813.583-.875s1.667.324 2.046.527c.379.203-2.509.801-2.629.348z" fill="#FFF"/></svg>${sign}`;
if (sign === 'Virgo') return `<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 32.001 32.001"><g fill="#FFF"><path d="M26.595 9.335C25.511 5.386 23.974-.138 15.813.002c-1.554.512 4.386 1.066 3.897 3.006C16.982 1.435 15.376.386 13.452.561c-1.923.175-2.749 1.876-2.681 3.106 1.555.818 3.562 7.265 4.208 8.628.646 1.363 1.77 3.445 2.923 4.075 1.151.629-1.597 4.631-3.934 4.733-2.337.105-8.229 2.651-8.94 5.978 1.436-1.685 7.085-4.644 9.519-4.556 2.435.091 4.767-2.702 5.156-3.498.106 3.598-3.468 5.002-5.985 5.063-3.621.062-9.057 3.511-8.411 5.622.678-1.816 5.222-3.947 8.228-4.088 3.007-.14 5.8-1.688 7.231-2.956-.694 2.823-3.303 3.837-6.309 4.372-3.006.537-9.045 2.195-8.953 4.96 1.167-1.718 6.522-3.355 12.301-3.729 5.782-.374 10.573-12.049 8.79-18.936zm-6.748-7.677s4.74 2.647 2.396 6.895c.52-4.161-2.396-6.895-2.396-6.895zm3.313 2.957s5.163 7.113-.92 10.608c3.763-4.754.92-10.608.92-10.608z"/><path d="M8.332 13.845c.047.419-.228.961-.297 1.258-.069.297-.472.191-.419.611.052.419.559.579.559.579s-.384.228-.367.542c.088.542 1.083.088 1.153.298.07.209.054.042-.008.476s-.848.572-.376 1.673c.62 1.446 7.166.612 8.739-2.288-5.628-5.071-5.75-12.516-6.87-12.375-1.119.137-2.098 4.821-2.132 5.905-.035 1.083-1.171 1.765-1.312 2.604-.139.839 1.049.49 1.33.717zm.314-3.867c.071-.197 1.66.303 1.66.529 0 .228-1.171.262-1.45.228-.098-.013-.441-.135-.21-.757z"/></g></svg>${sign}`;
if (sign === 'Libra') return `<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 30.773 30.773"><g fill="#FFF"><path d="M18.46 11.25a2.904 2.904 0 1 0-3.384 2.862l-3.523 11.441h6.231L15.53 14.155l.025.001a2.905 2.905 0 0 0 2.905-2.906zM10.343 19.926l-4.383-5.26a.368.368 0 0 0-.301-.133.367.367 0 0 0-.291.156l-3.554 4.963c-.051-.021-.477 4.356 3.881 4.356s4.756-3.933 4.722-3.923a.391.391 0 0 0-.074-.159zm-4.241.851c-.9 0-2.557-.521-3.553-.863l3.146-4.395 3.945 4.735c-.996.208-2.641.523-3.538.523z"/><path d="M24.279 11.794c-1.354-.858-3.838-4.394-6.895-6.004-.474-.332-1.147-.57-1.897-.57-.039 0-.077.004-.116.005-.04-.001-.079-.005-.119-.005-.75 0-1.423.238-1.897.57-3.057 1.611-5.833 5.542-7.021 6.23S.397 12.145.053 9.59c-.469 2.492 2.127 5.422 7.281 4.157 4.847-1.189 4.75-6.165 8.292-6.165s2.932 4.976 7.776 6.165c5.154 1.265 7.467-2.272 7.367-4.111-1.559 2.156-5.133 3.017-6.49 2.158zM25.374 14.689a.371.371 0 0 0-.291-.156.364.364 0 0 0-.301.134l-4.385 5.26a.347.347 0 0 0-.072.159c-.034-.009.362 3.923 4.721 3.923 4.355 0 3.932-4.377 3.881-4.355l-3.553-4.965zm-.734 6.088c-.896 0-2.542-.313-3.539-.521l3.945-4.735 3.146 4.394c-.996.34-2.651.862-3.552.862z"/></g></svg>${sign}`;
if (sign === 'Scorpio') return `<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 31.998 31.998"><g fill="#FFF"><path d="M24.232 22.875a208.08 208.08 0 0 0-2.367-.604c-.364-.096-.793-2.078-.793-2.078l-.217-1.068s1.604.81 2.123 1.068c.516.26 1.271-1.235 1.471-1.43.199-.193.852.312.953 0 .101-.313-.605-1.171-1.125-.996-.521.174-1.039 1.039-1.604.996-.562-.043-1.646-.996-1.646-.996l-.435-1.861s.996.953 1.646 1.039c.65.087 1.561-1.212 1.775-1.991.217-.779.389-2.284-.347-2.251.173 1.082-.75 3.03-1.212 2.9-.463-.13-3.555-2.378-4.117-2.294 1.689-.949 1-2.729 1-2.729s2.178.823 2.9 1.039c.723.217 1.281-.921 1.281-.921s.521.017 1.187-.638C28.817 4.345 22.194-.028 21.11.362c4.07 3.767 2.469 6.191 2.469 6.191s-.909-.217-.865-.736c.043-.52-.341.141-1.861.996s1.299 3.767 1.299 3.767-1.256-.276-1.965-.735c-.569-.261-.5-.25-1.369-.52 0 0-.282-2.536-1.215-2.407.195.65.448 2.216-.396 2.281-1.45.021-.958-1.75-.417-2.313-1.076-.39-1.56 1.672-1.435 2.188-.344.205-.879.351-1.428.669-.548.317-1.75.491-1.75.491s2.82-2.911 1.299-3.767c-1.522-.856-1.905-1.515-1.862-.996s-.866.736-.866.736-1.602-2.424 2.468-6.19c-1.082-.391-8.144 5.952-3.593 9.697.579.304.638.375.839.462.407.043.308 1.185 1.464 1.229 1.157.043 3.065-1.171 3.065-1.171s-.779 2.121.909 3.07c-.563-.083-3.563 1.821-4.026 1.951s-1.386-1.818-1.212-2.9c-.735-.033-.563 1.472-.347 2.251s1.126 2.08 1.775 1.994c.649-.088 1.645-1.04 1.645-1.04l-.433 1.86s-1.082.953-1.646.996c-.563.043-1.082-.823-1.602-.996-.52-.173-1.154.589-1.124.996.03.407.753-.191.953 0 .199.192.955 1.688 1.472 1.43.516-.261 2.121-1.068 2.121-1.068l-.216 1.068s-.429 1.983-.793 2.077c-.365.095-1.719.435-2.368.605-.649.174-1.05.595-.907.861.143.268.432-.168 1.384.221.952.39 2.338-.346 2.685-.908.346-.562.452-1.08.452-1.08s.754 2.353 1.844 3.435c.251.344 1.077 4.719-1.131 4.805-.779 0-2.663-1.529-2.836-2.741-.174-1.212-3.248-3.681-3.248-3.681l-.908.691s2.795 2.495 3.03 3.59c.235 1.092.478 3.295 3.962 4.203 3.484.909 4.642-6.852 4.642-6.852h-.002c.933-1.165 1.555-3.104 1.555-3.104s.105.519.453 1.081c.347.563 1.729 1.301 2.685.909.952-.391 1.46.488 1.646.26.182-.228-.525-1.169-1.173-1.343z"/><path d="M22.316 5.499s-1.549-2.236-1.463-4.401c-1.817.909-.396 5.57-.396 5.57l1.859-1.169zM13.948 6.293s1.342-4.286-.477-5.195c.087 2.165-1.386 4.026-1.386 4.026l1.863 1.169zM8.11 23.287c.331-.281.274-1.039 0-1.275-.275-.239-1.026-.912-2.15-1.537.325.758.043 1.797.238 2.487.194.691.888.996 1.234.802.346-.195.346-.195.678-.477z"/></g></svg>${sign}`;
if (sign === 'Sagittarius') return `<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 31.719 31.719"><path d="M31.719 15.485l-2.341-1.193v.907h-.91C28.41 3.423 15.143 2.491 15.143 2.491L13.549.137l-1.092.537 2.092 3.015-3.232 5.229c-.148-.015-.293-.039-.446-.039-2.252 0-4.078 1.63-4.078 3.641 0 1.14.599 2.145 1.517 2.812C7.332 15.709 0 18.68 0 18.68v2.062l4.638.683s1.524 4.044 1.047 6.002-4.302 2.731-4.302 2.731l.002 1.424h9.458c1.146 0 2.209-2.59 1.146-5.016.321-.609.638-1.293.952-1.984l1.788 3.143-1.833 2.521.765 1.146 1.672-2.483s12.753-.812 13.136-13.134h.908v.906l2.342-1.196zM15.503 3.781c2.647.252 10.083 1.823 10.833 11.418l-12.777.038c.846-.667 1.39-1.632 1.39-2.719 0-1.587-1.145-2.923-2.731-3.421l3.285-5.316zm.092 23.211l-2.083-3.694c.757-1.613.813-3.265.813-3.265l10.944-1.351s.271.308.906.382c-1.433 7.781-9.464 8.278-10.58 7.928zm8.337-9.311l-11.505-.739-.168-1.014c.049-.018.103-.024.151-.042l13.964-.114c.017.348.024.688.021 1.016-.927.231-2.463.893-2.463.893z" fill="#FFF"/></svg>${sign}`;
if (sign === 'Capricorm') return `<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 32 32"><g fill="#FFF"><path d="M28.411 8.186l-.015.002c-1.229.085-2.45.226-3.67.404-1.22.187-2.437.412-3.64.764 1.246.145 2.482.162 3.715.141a55.372 55.372 0 0 0 2.162-.1c-.373.356-.76.699-1.116 1.074-.72.746-1.421 1.514-2.056 2.354.916-.522 1.767-1.121 2.598-1.739a41.514 41.514 0 0 0 2.414-1.944.543.543 0 0 0-.392-.956z"/><path d="M20.693 9.044S22.476 3.076 29.6.346c-2.705-.919-5.205.111-7.25 1.708.385.312.861.774.645 1.014-.289-.313-.847-.442-1.271-.498-.265.23-.517.467-.761.708.395.301 1.021.848.775 1.116-.311-.335-.932-.462-1.363-.511-.205.22-.398.441-.588.661.334.24 1.221.923.938 1.235-.354-.381-1.103-.492-1.521-.525-.207.263-.397.518-.578.765.232.162 1.328.951 1.018 1.293-.362-.391-1.141-.498-1.555-.528-.658.976-1.024 1.658-1.024 1.658h-2.128s-.382-.711-1.065-1.717c-.426.086-1.063.27-1.351.646-.326-.297.577-1.115.853-1.353-.176-.24-.363-.49-.564-.746-.406.068-1.187.248-1.515.676-.363-.33.798-1.308.915-1.404-.16-.188-.324-.375-.496-.563-.391.061-1.22.239-1.559.683-.339-.308.657-1.186.886-1.38-.18-.178-.364-.353-.554-.524-.265.031-1.314.189-1.707.703-.344-.316.699-1.222.896-1.388C7.626.467 5.117-.578 2.399.346c7.124 2.73 8.907 8.698 8.907 8.698s-.147.149-.354.404c-1.186-.344-2.385-.568-3.586-.752a48.712 48.712 0 0 0-3.67-.404l-.016-.001a.545.545 0 0 0-.39.955 40.809 40.809 0 0 0 2.415 1.945c.831.618 1.681 1.216 2.596 1.739-.635-.842-1.335-1.608-2.054-2.355-.359-.375-.745-.718-1.119-1.074a51.82 51.82 0 0 0 2.161.1c1.21.022 2.424.003 3.648-.135-.461.572-1.233 1.704-1.565 3.243-1.11 4.129 2.603 5.646 3.296 7.715.694 2.069.969 6.103 1.572 6.431.603.33.926 3.256.77 4.437.503-.417.312-4.615.503-4.372.192.241.469 5.08.469 5.08l.018-.337c.01.206.018.337.018.337s.277-4.84.468-5.083c.189-.243 0 3.955.503 4.372-.155-1.18.276-4.243.878-4.591.604-.349.771-4.205 1.465-6.274.692-2.069 4.404-3.586 3.295-7.715-.485-2.255-1.934-3.665-1.934-3.665zm-8.686 9.709s-2.04-2.107-2.047-2.545c-.087-.226 1.855-.1 2.167.524.313.625-.12 2.021-.12 2.021zm7.985 0s-.522-1.341-.212-1.965c.312-.625 2.348-.806 2.26-.58-.009.438-2.048 2.545-2.048 2.545z"/></g></svg>${sign}`;
}
ZingGrid.registerMethod(renderSign, 'renderSign');
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>ZingGrid Demo</title>
<script src="https://cdn.zinggrid.com/zinggrid.min.js"></script>
</head>
<body>
<zing-grid pager page-size="5" data='[
{
"sign": "Aquarius",
"date": "January 20 - February 18",
"element": "Air"
}, {
"sign": "Pisces",
"date": "February 19 - March 20",
"element": "Water"
}, {
"sign": "Aries",
"date": "March 19 - May 20",
"element": "Fire"
}, {
"sign": "Taurus",
"date": "April 20 - May 18",
"element": "Earth"
}, {
"sign": "Gemini",
"date": "May 21 - June 20",
"element": "Air"
}, {
"sign": "Cancer",
"date": "June 21 - Jully 22",
"element": "Water"
}, {
"sign": "Leo",
"date": "July 23 - Auguest 22",
"element": "Fire"
}, {
"sign": "Virgo",
"date": "Auguest 23 - September 22",
"element": "Earch"
}, {
"sign": "Libra",
"date": "September 23 - October 22",
"element": "Air"
}, {
"sign": "Scorpio",
"date": "October 23 - November 21",
"element": "Water"
}, {
"sign": "Sagittarius",
"date": "November 22 - December 21",
"element": "Fire"
}, {
"sign": "Capricorm",
"date": "January 22 - January 19",
"element": "Earth"
}
]'>
<zg-caption>
<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 95.168 95.168">
<path d="M94.344 64.042a2.812 2.812 0 0 0-3.23-.534 44.647 44.647 0 0 1-19.654 4.571c-11.854 0-22.995-4.615-31.375-12.995A44.376 44.376 0 0 1 31.66 4.053a2.808 2.808 0 0 0-.534-3.229 2.813 2.813 0 0 0-3.23-.534A49.937 49.937 0 0 0 14.65 9.781C5.203 19.228 0 31.789 0 45.149c0 13.36 5.203 25.92 14.65 35.368 9.447 9.447 22.008 14.65 35.368 14.65 13.361 0 25.922-5.203 35.369-14.65a49.937 49.937 0 0 0 9.491-13.246 2.81 2.81 0 0 0-.534-3.229z" fill="#FFDA44" />
</svg>
Astrology Signs
<img src="https://app.zinggrid.com/api/file/T6VPUMI6/Clouds.png">
</zg-caption>
<zg-colgroup>
<zg-column index="sign" renderer="renderSign"></zg-column>
<zg-column index="date"></zg-column>
<zg-column index="element"></zg-column>
</zg-colgroup>
</zing-grid>
Icons by <a href="https://www.flaticon.com/authors/freepik">Freepik</a> from <a href="https://www.flaticon.com/">FlatIcon</a>
</body>
</html>
@import url('https://fonts.googleapis.com/css?family=Ruthie');
body {
background: #e6e6e6;
}
svg {
height: 2.25rem;
margin-right: 1rem;
width: auto;
}
zg-caption img {
height: 5rem;
position: absolute;
left: -4rem;
width: auto;
top: -0.5rem;
}
zg-caption svg {
height: 2.5rem;
position: relative;
top: 0.5rem;
transform: rotate(25deg);
}
zg-cell[data-field-index="sign"] {
font-size: 1.75rem;
}
zg-row {
border: 1px solid #225878;
}
zing-grid {
overflow: hidden;
--zing-grid-color: #fff;
--zing-grid-font-family: cursive;
--zing-grid-font-size: 1rem;
--zg-body-background: url(https://app.zinggrid.com/api/file/QC1FM725/demo-astrology-bg.jpg);
--zg-caption-background: url(https://app.zinggrid.com/api/file/QC1FM725/demo-astrology-bg.jpg);
--zg-caption-color: #FED953;
--zg-caption-font-family: "Ruthie";
--zg-caption-font-size: 3rem;
--zg-caption-icon-color: #fff;
--zg-caption-padding: 0.5rem 1rem;
--zg-row-card-background: url(https://app.zinggrid.com/api/file/QC1FM725/demo-astrology-bg.jpg);
--zg-footer-background: #000;
--zg-head-cell-background: #000;
--zg-icon-height: 2rem;
--zg-icon-width: 2rem;
--zg-input-background: #a391ad;
--zg-input-color: #000;
--zg-menu-background: #000;
--zg-menu-border: 1px solid #225878;
--zg-menu-item-background_hover: #093454;
--zg-option-list-background: #a391ad;
--zg-option-list-item-background_hover: #c9b6d3;
--zg-pager-background: #000;
--zg-pager-border: 1px solid #225878;
--zg-select-background: #a391ad;
--zg-select-color: #000;
--zg-row-border: 1px solid #225878;
--zg-watermark-background: #000;
--zg-watermark-border: 1px solid #225878;
}
function renderSign(sign) {
if (sign === 'Aquarius') return `<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 32 32"><path d="M32 7.692l-.377-1.326-.404-1.555c-2.684-2.578-9.699-1.438-14.482-.257-.288-.629-.978-.981-1.646-.776-.638.195-1 .82-.938 1.471-.578.168-1.063.316-1.43.434-.601-.36-1.313-.487-1.98-.284-1.351.414-2.08 1.963-1.625 3.452.098.32.247.611.431.872-.562.248-1.066.663-.843 1.488.067.251.118.459.164.65-3.561 1.342-5.835 8.505-6.049 12.667-.088 1.447-.82 1.533-2.821 4.092.48 0 22.77.035 23.648.125-.186-.901-1.685-1.172-3.146-1.213-.195-.006-.994-.584-.479-1.2-1.168.104-.5 1.203-.688 1.209-.384.015-1.097-.832-.515-1.861-1.424.094-1.271 2.004-1.271 2.006 0 0-.774-.755.035-2.246-1.753-.615-2.721 1.353-2.721 1.353s-2.158-1.892-3.539-2.043c-1.383-.153-1.17.803-2.5 1.229-2.805.527-2.939-1.382-2.874-1.601.298.361 3.672.822 4.083-1.477-2.196 1.578-3.809-.207-3.809-.207s2.951 1.063 3.363-1.373c-1.541 1.57-3.02-.616-3.02-.616s2.882.96 2.677-.618c-.687.618-2.35-.731-2.35-.731s1.055-4.225 2.467-5.686l.046.116c.201.482.708.515 1.216.417a2.65 2.65 0 0 0 .105.793c.333 1.087 1.349 1.847 2.471 1.847.251 0 .501-.038.743-.112a2.524 2.524 0 0 0 1.515-1.263c.018-.035.026-.071.043-.106a61.73 61.73 0 0 0 1.347-.229c.307.586.965.911 1.609.712.562-.172.925-.679.961-1.243 4.706-1.076 11.562-3.244 12.583-6.91zM11.066 6.448c.12-.036.244-.055.37-.055.159 0 .315.034.464.088-.103.844-.406 2.408-1.25 2.844a1.905 1.905 0 0 1-.482-.795c-.278-.911.124-1.844.898-2.082zm2.558 9.233c-.765.231-1.607-.238-1.842-1.006a1.49 1.49 0 0 1 .007-.819c1.018-.289 2.099.542 2.693 1.11a1.449 1.449 0 0 1-.858.715z" fill="#FFF"/></svg>${sign}`;
if (sign === 'Pisces') return `<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 31.999 31.999"><g fill="#FFF"><path d="M15.151 14.714s.156.314.301.349c1.052.248 5.739 1.314 7.087.471.72-.479-1.918-2.733-1.918-2.733s3.114 1.438 3.645.912c1.928-3.104-3.041-8.21-4.304-9.415-.317-.357-.551-.089-.551-.089l-5.896 4.085 1.636 6.42zm5.446-5.797a.935.935 0 1 1 0 1.87.935.935 0 0 1 0-1.87z"/><path d="M13.639 14.441c.646.036.46-.681.46-.681l-1.485-5.896 6.305-4.127s.42-.278.021-.529c-1.004-.856-3.944-3.286-4.934-3.206-1.199.096-.911 3.26-1.774 3.068C3.218 3.5.019 19.051.438 19.56c.419.51.761.869 1.533.289.787 1.709-1.033 5.582-1.64 7.166-.158.479.244.353.521.116C2.244 25.74 3.23 25.246 3.788 25.3c.557.055 1.844.543 2.591.96.357.263.771.19.393-.349-5.826-12.264 4.129-11.752 6.867-11.47z"/><path d="M16.848 17.283s-.154-.313-.301-.35c-1.05-.248-5.737-1.313-7.086-.472-.719.479 1.917 2.732 1.917 2.732s-3.115-1.436-3.643-.909c-1.93 3.104 3.04 8.21 4.303 9.415.317.356.551.089.551.089l5.896-4.086-1.637-6.419zm-5.446 5.797a.936.936 0 1 1 .001-1.871.936.936 0 0 1-.001 1.871z"/><path d="M31.149 4.866c-1.392 1.391-2.379 1.885-2.937 1.831-.559-.054-1.844-.543-2.59-.96-.358-.263-.771-.19-.395.349 5.824 12.265-4.131 11.753-6.869 11.47-.646-.035-.459.683-.459.683l1.484 5.896-6.304 4.127s-.42.278-.021.529c1.004.854 3.945 3.286 4.935 3.207 1.196-.099.909-3.263 1.772-3.068 9.014-.432 12.213-15.98 11.793-16.491-.42-.509-.762-.868-1.533-.288-.787-1.709 1.033-5.583 1.643-7.166.158-.481-.243-.353-.519-.119z"/></g></svg>${sign}`;
if (sign === 'Aries') return `<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 27.155 27.155"><path d="M24.186 4.42c-.479.786-1.054 1.894-1.034 2.695-.836-.498-.104-2.043.479-3.026-.021-.01-.036-.022-.055-.033a8.029 8.029 0 0 0-1.644-.634c-.239.897-.495 2.203-.229 2.996-.971-.238-.685-2.013-.403-3.121a4.207 4.207 0 0 0-2.082.229c.171.912.501 2.188 1.077 2.786-.939.193-1.441-1.39-1.677-2.508a6.853 6.853 0 0 0-1.36.995c.394.829 1.003 1.903 1.678 2.322-.813.396-1.645-.842-2.159-1.845-.741.775-1.504 1.771-2.323 3a5.7 5.7 0 0 0-.866-.029c-.269-.007-.643-.008-.882.029-.821-1.229-1.583-2.225-2.325-3-.516 1.002-1.344 2.24-2.16 1.844.675-.418 1.284-1.493 1.678-2.322a6.95 6.95 0 0 0-1.362-.995c-.236 1.12-.738 2.702-1.679 2.509.577-.599.907-1.876 1.078-2.787a4.216 4.216 0 0 0-2.082-.229c.28 1.108.565 2.883-.403 3.121.265-.793.009-2.099-.23-2.996-.52.135-1.062.34-1.642.635-.019.01-.036.024-.055.033.585.983 1.316 2.528.479 3.026.021-.802-.553-1.909-1.033-2.695C-.185 6.558-.756 11.541.923 13.822c.531.693 2.531 2.922 4.531 1.232 2-1.688.141-3.904-.72-4.093-.357.994.657 1.97-.312 1.877-2.375-.344-2.406-2.719.313-4.719 2.438-1.688 4.406 1.875 4.406 1.875s-3-1.813-4.094-1.219c-1.094.594.062.875.5 1.655.437.781 2.562 1.72 2.344 2.407-.375 3.218 2.125 5.313 2.5 6.188s.625 4.841 2.998 4.875h.377c2.373-.034 2.623-4 2.998-4.875s2.875-2.971 2.5-6.188c-.219-.688 1.906-1.625 2.344-2.406.438-.78 1.596-1.062.5-1.655-1.094-.594-4.094 1.219-4.094 1.219s1.969-3.563 4.406-1.875c2.719 2 2.688 4.375.312 4.719-.968.094.046-.883-.312-1.875-.859.188-2.719 2.406-.719 4.093 2 1.688 4-.537 4.529-1.232 1.681-2.283 1.11-7.268-2.044-9.405zM8.154 11.711c-.345-.073-1.997-1.24-2.221-1.612-.223-.37-.546-.785-.52-.861.164-.464 3.3.781 3.3 1.441 0 .461-.069 1.135-.559 1.032zm1.862 5.939c-.271.129-1.197-1.438-1.426-2.021s.214-1.205.638-1.217c.264.203 1.382 2.957.788 3.238zm3.069 5.714c-.365.077-1.048-.423-1.036-.733.012-.31.541-.235.67-.169.129.068.731.825.366.902zm.984 0c-.363-.077.237-.834.366-.902.129-.066.658-.142.67.169.013.311-.67.81-1.036.733zm7.673-14.127c.024.076-.299.491-.521.861-.223.372-1.876 1.539-2.221 1.611-.49.104-.561-.57-.561-1.031.002-.659 3.139-1.905 3.303-1.441zm-3.178 6.392c-.229.584-1.152 2.15-1.426 2.021-.594-.281.524-3.035.788-3.238.425.011.868.633.638 1.217z" fill="#FFF"/></svg>${sign}`;
if (sign === 'Taurus') return `<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 31.998 31.998"><path d="M25.055 0c1.297 7.964-1.514 7.64-1.514 7.64l-7.481-.283v-.005l-.06.002-.062-.002v.005l-7.482.283S5.645 7.964 6.942 0c-9.188 13.009 2.955 11.026 3.136 11.495.181.469-1.839 3.208-1.693 4.829.145 1.621 2.973 2.486 3.352 3.566 1.243 3.676-2.703 7.242.97 8.166.147.036.302.071.457.104a3.175 3.175 0 0 0 3.101 3.838 3.175 3.175 0 0 0 3.171-3.171c0-.271-.036-.532-.102-.783 3.602-.938-.309-4.492.931-8.153.379-1.08 3.207-1.945 3.353-3.566s-1.874-4.36-1.693-4.829c.175-.47 12.319 1.513 3.13-11.496zm-8.793 31.135a2.31 2.31 0 0 1-2.308-2.306c0-.177.024-.349.063-.513.85.129 1.631.192 1.92.216v.008l.062-.004.061.004v-.008a24.018 24.018 0 0 0 2.422-.3c.051.189.088.389.088.597a2.31 2.31 0 0 1-2.308 2.306z" fill="#FFF"/></svg>${sign}`;
if (sign === 'Gemini') return `<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 32 32"><g fill="#FFF"><path d="M31.124 11.592c-.482-2.366-.23-7.19-7.634-8.831a17.427 17.427 0 0 0-2.667-.411l-.039-.003a18.442 18.442 0 0 0-1.419-.059c-.028 0-.057-.003-.083-.003l-.039.001c-.4.001-.794.018-1.187.045-.07.005-.142.009-.211.015a16.6 16.6 0 0 0-1.121.132c-.068.012-.137.022-.205.035-.373.063-.739.136-1.099.225l-.117.032c-.352.09-.694.193-1.029.309l-.102.034a11.621 11.621 0 0 0-1.16.483c-.307.147-.604.307-.892.479-.056.033-.109.067-.164.102-.288.179-.566.369-.831.573-.034.027-.066.056-.101.083a9 9 0 0 0-.744.659l-.057.053a8.613 8.613 0 0 0-.667.76l-.107.135a8.577 8.577 0 0 0-.547.819c-.032.054-.062.109-.093.163a8.647 8.647 0 0 0-.448.917c-.018.043-.033.089-.05.133-.131.329-.246.67-.341 1.025-.004.013-.009.025-.012.04a9.583 9.583 0 0 0-.216 1.121c-.01.06-.02.119-.027.18-.046.374-.07.762-.078 1.159l-.001.226c0 .404.018.819.06 1.248.006.063.016.129.021.193.051.454.118.918.216 1.399 0 1.739-3.44 4.438-2.612 5.351.829.914 2.236.948 2.236.948s-.915 1.739-.504 2.219c.054.062.12.111.195.152.027.017.061.024.091.039.05.021.099.043.152.059.04.011.081.019.122.023a.895.895 0 0 0 .145.024c.048.006.093.008.14.013.042.002.084.006.124.006l.04.002c.048 0 .089-.004.132-.004.016-.002.03-.002.046-.002.064-.004.122-.01.174-.016l.014-.001c.109-.012.182-.022.182-.022s-1.063.768-1.063 1.359c0 .593 1.795 1.388 1.795 1.388s-.291 2.975 2.005 3.063c.033.003.064.008.102.008.083 0 .17-.002.262-.011 2.694-.229 3.147-.987 3.147-.987l.25 1.041.549 2.285h10.432l-.364-7.229c-.002 0 6.404-6.959 5.399-13.179z"/><path d="M6.775 25.215c0-.261.083-.513.21-.747a1.53 1.53 0 0 1-.519-.386c-.438-.516-.317-1.339-.021-2.133-.545-.161-1.19-.459-1.696-1.018-.858-.945.061-2.164 1.033-3.457.563-.746 1.324-1.758 1.377-2.35-.744-3.744-.092-7.003 1.889-9.431 2.168-2.657 5.898-4.181 10.234-4.181 1.038 0 2.106.087 3.177.257.086.014.159.034.244.048-1.174-.683-2.719-1.239-4.789-1.57C9.311-1.125 1.561 3.241 3.51 12.778c0 1.74-3.441 4.438-2.612 5.351.828.913 2.237.949 2.237.949s-.916 1.736-.506 2.218c.414.479 1.557.274 1.557.274s-1.063.767-1.063 1.359c0 .596 1.795 1.387 1.795 1.387s-.329 3.289 2.367 3.062c.51-.043.918-.107 1.28-.183-.001-.034-.008-.077-.009-.11-1.183-.595-1.781-1.224-1.781-1.87z"/></g></svg>${sign}`;
if (sign === 'Cancer') return `<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 38.439 38.439"><g fill="#FFF"><path d="M28.154 17.883c.188-2.563-7.063-4.938-7.063-4.938s-.151-1.979.875-2.688c-.688-1.25-1.938 3.25-1.938 3.25s-.688-.938-1.688 0c-.375 0-.5-3.625-1.5-3.563.438 1.5.25 3.625.25 3.625s-5.5 1.688-6.375 3.75 1.75 9.75 8.375 10.063c6.625.314 8.877-6.936 9.064-9.499zM27.051 14.846c.471.188 1.229 1.381 1.572 1.381.343 0 4.688-3.406 5-4.344s.002-1.141-.404-1.828c-1.063.625-6.637 4.603-6.168 4.791zM28.158 8.289c.809.625 2.59 2.844 2.59 2.844h.125c.668-.388 1.812-1.375 2.312-1.344.5.031-4.72-9.063-10.375-7.875 4.562 1.688 5.03 4.031 3.75 4.781-1.281.75-3.625-.813-4.812-2.375-.437 3.875 5.602 3.344 6.41 3.969zM31.869 20.963c-.729.356-1.424.642-1.963.756-.547.114-.857.037-1.08-.058-.115-.054-.145-.067-.266-.138l-.143-.077-.852 1.81.148.059a3.472 3.472 0 0 0 1.549.27 4.212 4.212 0 0 0 1.129-.254c.738-.279 1.439-.711 2.15-1.191.357-.24.715-.496 1.072-.758a9.558 9.558 0 0 0 1.076-.893c.354-.334.656-.674.938-1.031.291-.35.545-.713.779-1.068a17.92 17.92 0 0 0 1.15-2.01c.596-1.211.881-2.059.881-2.059s-.4.802-1.146 1.904c-.375.548-.836 1.17-1.379 1.785-.271.307-.561.616-.873.902a9.14 9.14 0 0 1-.973.81 8.194 8.194 0 0 1-1.076.665c-.375.203-.754.4-1.121.576z"/><path d="M37.398 22.4c-.162.162-.4.281-.643.431-.229.158-.529.259-.818.396-.295.133-.631.226-.961.345-.684.194-1.418.366-2.166.479-1.492.236-3.014.307-4.104.254-.267-.024-.521-.035-.722-.065-.17-.031-.448-.068-.389-.076-.005 0-.011.008-.019.021-.004.02-.091-.049-.117-.062-.076-.047-.117-.07-.117-.07l-1.006 1.729s.045.02.129.053c.058.021.063.031.188.068.121.037.264.074.426.105.391.077.523.034.822.045.27-.002.545-.037.859-.062 1.221-.14 2.775-.472 4.283-.97.754-.241 1.49-.547 2.16-.862.328-.183.652-.33.939-.519.282-.194.564-.346.787-.553.227-.195.443-.354.592-.555.146-.191.312-.322.379-.49l.248-.473-.318.422c-.076.148-.266.254-.432.409zM30.029 32.116c-.109-.311-.188-.656-.35-.968a7.075 7.075 0 0 0-.49-.942c-.725-1.235-1.719-2.254-2.418-2.996-.17-.183-.326-.346-.465-.491-.125-.138-.26-.286-.26-.306a.259.259 0 0 0-.047-.051c-.025-.051-.051-.093-.066-.125l-.061-.107-1.689 1.07.078.094c.023.031.057.07.096.115l.225.231c.197.2.334.286.512.426.172.125.361.265.57.416.811.589 1.877 1.343 2.715 2.31.221.235.414.488.588.75.199.25.314.531.471.793.121.271.225.545.312.81.057.271.125.526.158.771.014.248.023.475.035.675.006.202-.037.376-.047.522-.035.293-.057.461-.057.461s.053-.162.141-.443c.037-.146.111-.314.146-.521.026-.209.06-.442.095-.7.014-.262-.011-.543-.017-.85a8.701 8.701 0 0 0-.175-.944zM23.781 28.88l-.139-.555c-.016-.074-.027-.146-.041-.209-.018-.072-.025-.129-.016-.117.006-.004-.01-.01 0-.11l.004-.103-1.998.065s.008.035.02.103c.004.033.035.219.104.455.037.131.072.205.105.275.033.077.072.161.111.249l.268.537c.389.762.883 1.74 1.227 2.785.18.52.305 1.053.393 1.562.076.513.102.996.092 1.416-.025.416-.057.771-.117 1.013l-.076.386.158-.36c.113-.229.225-.567.348-.989.104-.427.189-.935.229-1.488.025-.553.021-1.149-.045-1.74-.117-1.185-.414-2.347-.627-3.175zM9.82 16.226c.344 0 1.104-1.193 1.572-1.381.468-.188-5.105-4.165-6.167-4.79-.407.687-.718.89-.405 1.828.312.938 4.657 4.343 5 4.343zM7.57 11.133h.125s1.781-2.219 2.59-2.844 6.848-.094 6.41-3.969c-1.188 1.563-3.531 3.125-4.813 2.375-1.281-.75-.812-3.094 3.75-4.781C9.977.726 4.758 9.82 5.258 9.789c.5-.031 1.646.956 2.312 1.344zM2.029 18.389c.236.355.49.719.779 1.068.282.357.586.695.94 1.032.373.358.67.594 1.074.891.359.263.715.519 1.072.759.713.479 1.414.912 2.153 1.19.373.136.757.229 1.127.254a3.457 3.457 0 0 0 1.55-.269c.098-.038.147-.059.147-.059l-.852-1.809s-.049.025-.142.076c-.121.068-.149.084-.264.137-.225.096-.535.174-1.082.059-.539-.114-1.232-.397-1.963-.756a39.207 39.207 0 0 1-1.126-.575 8.39 8.39 0 0 1-1.074-.665 8.649 8.649 0 0 1-.973-.81 11.545 11.545 0 0 1-.873-.902 18.447 18.447 0 0 1-1.381-1.785C.4 15.122 0 14.32 0 14.32s.283.848.879 2.059c.299.603.68 1.297 1.15 2.01z"/><path d="M10.541 26.051c.297-.011.433.032.82-.045.162-.031.305-.068.426-.105.125-.037.131-.05.188-.068.086-.033.131-.053.131-.053L11.1 24.05l-.119.07c-.027.013-.111.078-.117.062-.008-.013-.012-.021-.018-.021.062.008-.218.045-.388.076-.201.03-.455.041-.721.065-1.094.053-2.611-.018-4.104-.254a17.66 17.66 0 0 1-2.168-.479c-.329-.119-.666-.212-.959-.345-.291-.139-.59-.237-.821-.396-.238-.147-.479-.269-.642-.431-.164-.155-.354-.262-.438-.405-.201-.271-.318-.424-.318-.424s.092.172.25.475c.064.166.232.298.379.49.146.197.365.356.592.554.222.208.505.356.785.553.287.188.611.336.939.52.672.314 1.406.619 2.16.861 1.508.498 3.063.83 4.285.971.317.022.594.057.864.059zM14.182 27.292l.077-.094-1.69-1.07-.057.106a1.721 1.721 0 0 0-.07.125.268.268 0 0 0-.047.052c.002.02-.133.168-.256.306-.14.146-.296.312-.466.491-.698.742-1.694 1.761-2.42 2.996a6.903 6.903 0 0 0-.489.942c-.16.312-.238.657-.351.968a10.42 10.42 0 0 0-.176.94c-.006.305-.027.588-.016.849.034.258.065.492.096.701.031.206.106.377.145.521.088.283.14.443.14.443l-.056-.462c-.01-.146-.053-.319-.045-.521.011-.2.021-.428.033-.674.033-.244.105-.502.158-.771a10.8 10.8 0 0 1 .313-.809c.156-.262.271-.545.472-.795.172-.263.367-.514.586-.748.838-.967 1.906-1.721 2.715-2.311.209-.15.402-.291.572-.416.178-.14.312-.226.512-.426.084-.088.158-.166.225-.232a1.36 1.36 0 0 0 .095-.111zM14.857 27.889c.01.104-.008.106 0 .11.01-.012.002.045-.015.117-.014.063-.026.135-.043.209-.041.166-.086.353-.137.555-.215.828-.512 1.988-.627 3.173-.063.591-.07 1.188-.043 1.739a9.06 9.06 0 0 0 .23 1.488c.12.424.229.764.346.99l.156.36-.074-.387c-.063-.238-.092-.596-.119-1.011a8.824 8.824 0 0 1 .092-1.416c.09-.511.213-1.044.394-1.562.342-1.046.836-2.023 1.227-2.785l.269-.537.11-.249c.031-.069.066-.146.104-.276.069-.235.102-.42.106-.453l.019-.104-1.998-.064c0 .001 0 .037.003.103z"/></g></svg>${sign}`;
if (sign === 'Leo') return `<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 24.438 24.438"><path d="M23.504 15.49c1.125-1.375 2.688-11-5.125-14.25-7.812-3.25-11.562 1.625-11.5 3.625-2.625.937-3.188 3.875-3.188 3.875S-.122 10.615.003 12.865s2.875 2.375 2.875 2.375l.834 1.146.166-1.146s4.109-1.896 4.297-.238c.188 1.656-3.608 2.238-3.608 2.238l-.771-.562.235 1.049s-.839.264-.464 1.075c.75 1.25 3.25-.438 3.25-.438s-1.936 7.307 3.624 5.688c-3.438-1.75-.313-4.438-.313-4.438s.688 7 7.5 2.75c-5.375.563-4.143-2.146-3.562-2.75l3.562-3.705s1.563 2.33-2.25 5.187c5 1.333 5.25-7.792 5.25-7.792s1.188 4.375-1.938 7.312c7.125-1.562 3.562-10.5 3.562-10.5s1.314.436 1.252 5.374zm-18.817-7c-.12-.453.224-.813.583-.875s1.667.324 2.046.527c.379.203-2.509.801-2.629.348z" fill="#FFF"/></svg>${sign}`;
if (sign === 'Virgo') return `<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 32.001 32.001"><g fill="#FFF"><path d="M26.595 9.335C25.511 5.386 23.974-.138 15.813.002c-1.554.512 4.386 1.066 3.897 3.006C16.982 1.435 15.376.386 13.452.561c-1.923.175-2.749 1.876-2.681 3.106 1.555.818 3.562 7.265 4.208 8.628.646 1.363 1.77 3.445 2.923 4.075 1.151.629-1.597 4.631-3.934 4.733-2.337.105-8.229 2.651-8.94 5.978 1.436-1.685 7.085-4.644 9.519-4.556 2.435.091 4.767-2.702 5.156-3.498.106 3.598-3.468 5.002-5.985 5.063-3.621.062-9.057 3.511-8.411 5.622.678-1.816 5.222-3.947 8.228-4.088 3.007-.14 5.8-1.688 7.231-2.956-.694 2.823-3.303 3.837-6.309 4.372-3.006.537-9.045 2.195-8.953 4.96 1.167-1.718 6.522-3.355 12.301-3.729 5.782-.374 10.573-12.049 8.79-18.936zm-6.748-7.677s4.74 2.647 2.396 6.895c.52-4.161-2.396-6.895-2.396-6.895zm3.313 2.957s5.163 7.113-.92 10.608c3.763-4.754.92-10.608.92-10.608z"/><path d="M8.332 13.845c.047.419-.228.961-.297 1.258-.069.297-.472.191-.419.611.052.419.559.579.559.579s-.384.228-.367.542c.088.542 1.083.088 1.153.298.07.209.054.042-.008.476s-.848.572-.376 1.673c.62 1.446 7.166.612 8.739-2.288-5.628-5.071-5.75-12.516-6.87-12.375-1.119.137-2.098 4.821-2.132 5.905-.035 1.083-1.171 1.765-1.312 2.604-.139.839 1.049.49 1.33.717zm.314-3.867c.071-.197 1.66.303 1.66.529 0 .228-1.171.262-1.45.228-.098-.013-.441-.135-.21-.757z"/></g></svg>${sign}`;
if (sign === 'Libra') return `<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 30.773 30.773"><g fill="#FFF"><path d="M18.46 11.25a2.904 2.904 0 1 0-3.384 2.862l-3.523 11.441h6.231L15.53 14.155l.025.001a2.905 2.905 0 0 0 2.905-2.906zM10.343 19.926l-4.383-5.26a.368.368 0 0 0-.301-.133.367.367 0 0 0-.291.156l-3.554 4.963c-.051-.021-.477 4.356 3.881 4.356s4.756-3.933 4.722-3.923a.391.391 0 0 0-.074-.159zm-4.241.851c-.9 0-2.557-.521-3.553-.863l3.146-4.395 3.945 4.735c-.996.208-2.641.523-3.538.523z"/><path d="M24.279 11.794c-1.354-.858-3.838-4.394-6.895-6.004-.474-.332-1.147-.57-1.897-.57-.039 0-.077.004-.116.005-.04-.001-.079-.005-.119-.005-.75 0-1.423.238-1.897.57-3.057 1.611-5.833 5.542-7.021 6.23S.397 12.145.053 9.59c-.469 2.492 2.127 5.422 7.281 4.157 4.847-1.189 4.75-6.165 8.292-6.165s2.932 4.976 7.776 6.165c5.154 1.265 7.467-2.272 7.367-4.111-1.559 2.156-5.133 3.017-6.49 2.158zM25.374 14.689a.371.371 0 0 0-.291-.156.364.364 0 0 0-.301.134l-4.385 5.26a.347.347 0 0 0-.072.159c-.034-.009.362 3.923 4.721 3.923 4.355 0 3.932-4.377 3.881-4.355l-3.553-4.965zm-.734 6.088c-.896 0-2.542-.313-3.539-.521l3.945-4.735 3.146 4.394c-.996.34-2.651.862-3.552.862z"/></g></svg>${sign}`;
if (sign === 'Scorpio') return `<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 31.998 31.998"><g fill="#FFF"><path d="M24.232 22.875a208.08 208.08 0 0 0-2.367-.604c-.364-.096-.793-2.078-.793-2.078l-.217-1.068s1.604.81 2.123 1.068c.516.26 1.271-1.235 1.471-1.43.199-.193.852.312.953 0 .101-.313-.605-1.171-1.125-.996-.521.174-1.039 1.039-1.604.996-.562-.043-1.646-.996-1.646-.996l-.435-1.861s.996.953 1.646 1.039c.65.087 1.561-1.212 1.775-1.991.217-.779.389-2.284-.347-2.251.173 1.082-.75 3.03-1.212 2.9-.463-.13-3.555-2.378-4.117-2.294 1.689-.949 1-2.729 1-2.729s2.178.823 2.9 1.039c.723.217 1.281-.921 1.281-.921s.521.017 1.187-.638C28.817 4.345 22.194-.028 21.11.362c4.07 3.767 2.469 6.191 2.469 6.191s-.909-.217-.865-.736c.043-.52-.341.141-1.861.996s1.299 3.767 1.299 3.767-1.256-.276-1.965-.735c-.569-.261-.5-.25-1.369-.52 0 0-.282-2.536-1.215-2.407.195.65.448 2.216-.396 2.281-1.45.021-.958-1.75-.417-2.313-1.076-.39-1.56 1.672-1.435 2.188-.344.205-.879.351-1.428.669-.548.317-1.75.491-1.75.491s2.82-2.911 1.299-3.767c-1.522-.856-1.905-1.515-1.862-.996s-.866.736-.866.736-1.602-2.424 2.468-6.19c-1.082-.391-8.144 5.952-3.593 9.697.579.304.638.375.839.462.407.043.308 1.185 1.464 1.229 1.157.043 3.065-1.171 3.065-1.171s-.779 2.121.909 3.07c-.563-.083-3.563 1.821-4.026 1.951s-1.386-1.818-1.212-2.9c-.735-.033-.563 1.472-.347 2.251s1.126 2.08 1.775 1.994c.649-.088 1.645-1.04 1.645-1.04l-.433 1.86s-1.082.953-1.646.996c-.563.043-1.082-.823-1.602-.996-.52-.173-1.154.589-1.124.996.03.407.753-.191.953 0 .199.192.955 1.688 1.472 1.43.516-.261 2.121-1.068 2.121-1.068l-.216 1.068s-.429 1.983-.793 2.077c-.365.095-1.719.435-2.368.605-.649.174-1.05.595-.907.861.143.268.432-.168 1.384.221.952.39 2.338-.346 2.685-.908.346-.562.452-1.08.452-1.08s.754 2.353 1.844 3.435c.251.344 1.077 4.719-1.131 4.805-.779 0-2.663-1.529-2.836-2.741-.174-1.212-3.248-3.681-3.248-3.681l-.908.691s2.795 2.495 3.03 3.59c.235 1.092.478 3.295 3.962 4.203 3.484.909 4.642-6.852 4.642-6.852h-.002c.933-1.165 1.555-3.104 1.555-3.104s.105.519.453 1.081c.347.563 1.729 1.301 2.685.909.952-.391 1.46.488 1.646.26.182-.228-.525-1.169-1.173-1.343z"/><path d="M22.316 5.499s-1.549-2.236-1.463-4.401c-1.817.909-.396 5.57-.396 5.57l1.859-1.169zM13.948 6.293s1.342-4.286-.477-5.195c.087 2.165-1.386 4.026-1.386 4.026l1.863 1.169zM8.11 23.287c.331-.281.274-1.039 0-1.275-.275-.239-1.026-.912-2.15-1.537.325.758.043 1.797.238 2.487.194.691.888.996 1.234.802.346-.195.346-.195.678-.477z"/></g></svg>${sign}`;
if (sign === 'Sagittarius') return `<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 31.719 31.719"><path d="M31.719 15.485l-2.341-1.193v.907h-.91C28.41 3.423 15.143 2.491 15.143 2.491L13.549.137l-1.092.537 2.092 3.015-3.232 5.229c-.148-.015-.293-.039-.446-.039-2.252 0-4.078 1.63-4.078 3.641 0 1.14.599 2.145 1.517 2.812C7.332 15.709 0 18.68 0 18.68v2.062l4.638.683s1.524 4.044 1.047 6.002-4.302 2.731-4.302 2.731l.002 1.424h9.458c1.146 0 2.209-2.59 1.146-5.016.321-.609.638-1.293.952-1.984l1.788 3.143-1.833 2.521.765 1.146 1.672-2.483s12.753-.812 13.136-13.134h.908v.906l2.342-1.196zM15.503 3.781c2.647.252 10.083 1.823 10.833 11.418l-12.777.038c.846-.667 1.39-1.632 1.39-2.719 0-1.587-1.145-2.923-2.731-3.421l3.285-5.316zm.092 23.211l-2.083-3.694c.757-1.613.813-3.265.813-3.265l10.944-1.351s.271.308.906.382c-1.433 7.781-9.464 8.278-10.58 7.928zm8.337-9.311l-11.505-.739-.168-1.014c.049-.018.103-.024.151-.042l13.964-.114c.017.348.024.688.021 1.016-.927.231-2.463.893-2.463.893z" fill="#FFF"/></svg>${sign}`;
if (sign === 'Capricorm') return `<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 32 32"><g fill="#FFF"><path d="M28.411 8.186l-.015.002c-1.229.085-2.45.226-3.67.404-1.22.187-2.437.412-3.64.764 1.246.145 2.482.162 3.715.141a55.372 55.372 0 0 0 2.162-.1c-.373.356-.76.699-1.116 1.074-.72.746-1.421 1.514-2.056 2.354.916-.522 1.767-1.121 2.598-1.739a41.514 41.514 0 0 0 2.414-1.944.543.543 0 0 0-.392-.956z"/><path d="M20.693 9.044S22.476 3.076 29.6.346c-2.705-.919-5.205.111-7.25 1.708.385.312.861.774.645 1.014-.289-.313-.847-.442-1.271-.498-.265.23-.517.467-.761.708.395.301 1.021.848.775 1.116-.311-.335-.932-.462-1.363-.511-.205.22-.398.441-.588.661.334.24 1.221.923.938 1.235-.354-.381-1.103-.492-1.521-.525-.207.263-.397.518-.578.765.232.162 1.328.951 1.018 1.293-.362-.391-1.141-.498-1.555-.528-.658.976-1.024 1.658-1.024 1.658h-2.128s-.382-.711-1.065-1.717c-.426.086-1.063.27-1.351.646-.326-.297.577-1.115.853-1.353-.176-.24-.363-.49-.564-.746-.406.068-1.187.248-1.515.676-.363-.33.798-1.308.915-1.404-.16-.188-.324-.375-.496-.563-.391.061-1.22.239-1.559.683-.339-.308.657-1.186.886-1.38-.18-.178-.364-.353-.554-.524-.265.031-1.314.189-1.707.703-.344-.316.699-1.222.896-1.388C7.626.467 5.117-.578 2.399.346c7.124 2.73 8.907 8.698 8.907 8.698s-.147.149-.354.404c-1.186-.344-2.385-.568-3.586-.752a48.712 48.712 0 0 0-3.67-.404l-.016-.001a.545.545 0 0 0-.39.955 40.809 40.809 0 0 0 2.415 1.945c.831.618 1.681 1.216 2.596 1.739-.635-.842-1.335-1.608-2.054-2.355-.359-.375-.745-.718-1.119-1.074a51.82 51.82 0 0 0 2.161.1c1.21.022 2.424.003 3.648-.135-.461.572-1.233 1.704-1.565 3.243-1.11 4.129 2.603 5.646 3.296 7.715.694 2.069.969 6.103 1.572 6.431.603.33.926 3.256.77 4.437.503-.417.312-4.615.503-4.372.192.241.469 5.08.469 5.08l.018-.337c.01.206.018.337.018.337s.277-4.84.468-5.083c.189-.243 0 3.955.503 4.372-.155-1.18.276-4.243.878-4.591.604-.349.771-4.205 1.465-6.274.692-2.069 4.404-3.586 3.295-7.715-.485-2.255-1.934-3.665-1.934-3.665zm-8.686 9.709s-2.04-2.107-2.047-2.545c-.087-.226 1.855-.1 2.167.524.313.625-.12 2.021-.12 2.021zm7.985 0s-.522-1.341-.212-1.965c.312-.625 2.348-.806 2.26-.58-.009.438-2.048 2.545-2.048 2.545z"/></g></svg>${sign}`;
}
ZingGrid.registerMethod(renderSign, 'renderSign');