Skip to content

Commit

Permalink
Updates
Browse files Browse the repository at this point in the history
  • Loading branch information
@avidrucker
avidrucker committed Aug 5, 2024
1 parent b68183b commit d35a8be
Showing 1 changed file with 1 addition and 1 deletion.
2 changes: 1 addition & 1 deletion Starry Night Poster.json
View file
Original file line number Diff line number Diff line change
@@ -1 +1 @@
{"frontHtml":"<section\n class=\"m-plus-rounded-1c-bold tc min-h-100 lh-copy relative overflow-hidden h-100\"\n>\n <div class=\"blur-bg w-100 h-100 bg-center cover white absolute z-0\"></div>\n <section\n class=\"z-1 h-100 flex flex-column justify-center w-100 measure mr-auto ml-auto pa3\"\n >\n <p class=\"ma0 dib mr-auto ml-auto grow-custom append-play-btn-text cyan\">\n {{audio}}\n </p>\n <p class=\"ma0 f3 pt2 ph2 z-1 measure-narrow balance mr-auto ml-auto yellow\">\n What is the meaning of what is being said?\n </p>\n <!---->\n <!-- INPUT BLOCK START -->\n <div\n id=\"input-container\"\n class=\"pt2 z-1\"\n placeholder=\"Type your answer here\"\n >\n {{type:term}}\n </div>\n <!---->\n <!-- HINT BLOCK START -->\n <div class=\"hint-block lh-title pv2 z-1\">\n <a\n class=\"hint link underline o-70 cyan f3\"\n href=\"#\"\n onclick=\"this.style.display='none';document.getElementById('hint4753594160').style.display='inline-block';return false;\"\n >\n Click here for a hint</a\n >\n <div id=\"hint4753594160\" class=\"hint cyan f3\" style=\"display: none\">\n {{Tags}}\n </div>\n </div>\n <!---->\n </section>\n</section>\n<!-- DON'T TOUCH BELOW THIS LINE PLEASE THANK YOU. The following img tag will configure Anki's built-in text input placeholder -->\n<img\n class=\"dn\"\n src\n onerror=\"document.getElementById('typeans').placeholder=document.getElementById('input-container').getAttribute('placeholder'); document.getElementById('typeans').value=''; document.getElementById('typeans').removeAttribute('readonly');\"\n/>\n","backHtml":"<section\n class=\"libre-franklin tc min-h-100 lh-copy relative overflow-hidden fw6\"\n>\n <div class=\"blur-bg bg-center w-100 cover h-100 white absolute z-0\"></div>\n <section class=\"z-1 flex flex-column justify-center\">\n <section class=\"z-1 pa3\">\n <p\n class=\"ma0 dib mr-auto ml-auto grow-custom append-play-btn-text z-5 cyan\"\n >\n {{audio}}\n </p>\n\n <section class=\"\">\n <div class=\"relative dib show-hide-children lh-title shift-up-title\">\n <h1\n class=\"z-4 w-100 show left-0 ma0 dib text-stroke-yellow noto-sans-jp fw6 f-headline lh-tiny-ja ma0 mr-auto ml-auto measure tc pv2 yellow\"\n >\n {{term}}\n </h1>\n </div>\n\n <p class=\"ma0 f2 lh-title shift-up-subtitle cyan\">{{reading}}</p>\n <p class=\"ma0 f3 lh-copy yellow\">{{translation}}</p>\n <p class=\"ma0 f3 lh-copy yellow\">{{transliteration}}</p>\n <p class=\"ma0 f4 lh-copy yellow\">{{Tags}}</p>\n\n {{#picture}}\n <div\n class=\"relative measure mt2 mr-auto ml-auto\"\n style=\"overflow: hidden\"\n >\n <div class=\"z-999 child-img-lh-0\">{{picture}}</div>\n </div>\n {{/picture}}\n </section>\n </section>\n </section>\n</section>\n\n<div class=\"off-screen\">\n <svg style=\"height: 0; width: 0;\" xmlns=\"http://www.w3.org/2000/svg\">\n <defs>\n <filter id=\"text-stroke-yellow\">\n <feFlood flood-color=\"gold\" result=\"flood\"></feFlood>\n <feComposite\n in=\"flood\"\n in2=\"SourceAlpha\"\n operator=\"in\"\n result=\"mask\"\n ></feComposite>\n <feMorphology\n in=\"mask\"\n operator=\"dilate\"\n radius=\"2\"\n result=\"dilated\"\n ></feMorphology>\n <feComposite\n in=\"dilated\"\n in2=\"SourceAlpha\"\n operator=\"out\"\n result=\"outline\"\n ></feComposite>\n <feMerge>\n <feMergeNode in=\"outline\"></feMergeNode>\n </feMerge>\n </filter>\n </defs>\n </svg>\n</div>\n","cardCss":"@import url(\"https://unpkg.com/[email protected]/css/tachyons.min.css\");\n\n@import url(\"https://fonts.googleapis.com/css2?family=Libre+Franklin:ital,wght@0,100..900;1,100..900&display=swap\");\n\n@import url(\"https://fonts.googleapis.com/css2?family=Noto+Sans+JP:[email protected]&display=swap\");\n\n.noto-sans-jp {\n font-family: \"Noto Sans JP\", sans-serif;\n font-optical-sizing: auto;\n font-style: normal;\n}\n\n.libre-franklin {\n font-family: \"Libre Franklin\", sans-serif;\n font-optical-sizing: auto;\n font-style: normal;\n}\n\n.blur-bg {\n background-image: linear-gradient(\n rgba(10, 10, 10, 0.5),\n rgba(10, 10, 10, 0.5)\n ),\n url(\"bg_starry_night.jpg\"),\n url(\"https://cdn.jsdelivr.net/gh/avidrucker/anki-card-test-1/public/bg_starry_night.jpg\");\n background-attachment: fixed;\n}\n\n:root {\n}\n\n.text-stroke-yellow {\n filter: url(#text-stroke-yellow);\n}\n\n.lh-tiny-en {\n line-height: 0.85;\n}\n\n.lh-tiny-ja {\n line-height: 1.1;\n}\n\n.cyan {\n color: #00e5ff;\n}\n\n/*.card is primarily for styling the background of both front and back cards*/\n.card {\n -ms-overflow-style: none; /* IE and Edge */\n scrollbar-width: none; /* Firefox */\n}\n\n.show-hide-children * {\n transition: opacity 0.5s ease-out;\n}\n\n.show-hide-children:hover *.show {\n opacity: 1;\n}\n\n.show-hide-children:hover *.hide {\n opacity: 0;\n}\n\n.show-on-hover {\n opacity: 0;\n transition: opacity 0.5s ease-out;\n}\n\n.show-on-hover:hover {\n opacity: 1;\n}\n\n.lh-0 {\n vertical-align: middle;\n line-height: 0;\n}\n\n/* Anki-only styling to take up all vertical space of the card display window */\nhtml,\nbody,\ndiv#qa {\n height: 100%;\n}\n\n/* Hide scrollbar for Chrome, Safari and Opera */\n.invisible-scrollbar::-webkit-scrollbar {\n display: none;\n}\n\n.card::-webkit-scrollbar {\n display: none;\n}\n\n/* Hide scrollbar for IE, Edge and Firefox */\n.invisible-scrollbar {\n -ms-overflow-style: none; /* IE and Edge */\n scrollbar-width: none; /* Firefox */\n}\n\n.shift-up-right {\n position: relative;\n top: -0.1rem;\n}\n\n.visually-hidden {\n position: absolute;\n width: 1px;\n height: 1px;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap; /* Prevents content from \"spilling\" */\n border-width: 0;\n}\n\n.visually-hidden:hover {\n position: inherit;\n width: auto;\n height: auto;\n margin: 0;\n overflow: visible;\n clip: auto;\n white-space: normal;\n border-width: 0;\n}\n\n.off-screen {\n position: absolute;\n left: -9999px;\n}\n\n.balance {\n text-wrap: balance;\n}\n\n.play-button {\n color: inherit;\n background-color: transparent;\n border: none;\n z-index: inherit;\n cursor: inherit;\n text-shadow: inherit;\n line-height: inherit;\n padding: 0;\n}\n\n.lh-audio {\n line-height: 2.5rem;\n}\n\n.grow-custom > * {\n -moz-osx-font-smoothing: grayscale;\n backface-visibility: hidden;\n transform: translateZ(0);\n transition: transform 0.25s ease-out;\n}\n\n.grow-custom > *:hover,\n.grow-custom > *:focus {\n transform: scale(1.05);\n}\n\n.grow-custom > *:active {\n transform: scale(0.9);\n}\n\n/* input-reset input-8-bit f3 w-100 dark-green ba b--medium-green bg-green pa2 */\n#input-container input {\n -webkit-appearance: none;\n background-color: transparent;\n color: white;\n font-size: 1.5rem;\n padding: 0.5rem;\n border: 1px solid gray;\n width: 100%;\n text-align: center;\n -webkit-appearance: none;\n -moz-appearance: none;\n}\n\n#input-container input::placeholder {\n color: lightgray;\n opacity: 0.7;\n}\n\n#input-container input:focus {\n outline: 0 none;\n background-color: transparent;\n border: 1px solid lightgray !important;\n}\n\n#input-container input::-moz-focus-inner {\n border: 0;\n padding: 0;\n}\n\n/* Anki Only Styles*/\n.append-play-btn-text a::after {\n content: \"▶\";\n color: white;\n}\n\n.append-play-btn-text svg {\n display: none;\n}\n\n.append-play-btn-text button {\n font-size: 2.5rem;\n line-height: 4rem;\n cursor: pointer;\n height: 4rem;\n width: 4rem;\n vertical-align: top;\n}\n\n.append-play-btn-text {\n}\n\n.replay-button {\n margin: 0;\n font-size: 2.5rem;\n}\n\n.poster-effect {\n filter: url(#poster-effect);\n}\n\n.shift-up-title {\n transform: translateY(-0.5rem);\n}\n\n.shift-up-subtitle {\n transform: translateY(-0.25rem);\n}\n\n.v-align-mid {\n vertical-align: middle;\n}\n\n.child-img-lh-0 img {\n line-height: 0;\n vertical-align: middle;\n}\n","designName":"Starry Night Poster"}
{"frontHtml":"<section\n class=\"m-plus-rounded-1c-bold tc min-h-100 lh-copy relative overflow-hidden h-100\"\n>\n <div class=\"blur-bg w-100 h-100 bg-center cover white absolute z-0\"></div>\n <section\n class=\"z-1 h-100 flex flex-column justify-center w-100 measure mr-auto ml-auto pa3\"\n >\n <p class=\"ma0 dib mr-auto ml-auto grow-custom append-play-btn-text cyan\">\n {{audio}}\n </p>\n <p class=\"ma0 f3 pt2 ph2 z-1 measure-narrow balance mr-auto ml-auto yellow\">\n What is the meaning of what is being said?\n </p>\n <!---->\n <!-- INPUT BLOCK START -->\n <div\n id=\"input-container\"\n class=\"pt2 z-1\"\n placeholder=\"Type your answer here\"\n >\n {{type:term}}\n </div>\n <!---->\n <!-- HINT BLOCK START -->\n <div class=\"hint-block lh-title pv2 z-1\">\n <a\n class=\"hint link underline o-70 cyan f3\"\n href=\"#\"\n onclick=\"this.style.display='none';document.getElementById('hint4753594160').style.display='inline-block';return false;\"\n >\n Click here for a hint</a\n >\n <div id=\"hint4753594160\" class=\"hint cyan f3\" style=\"display: none\">\n {{Tags}}\n </div>\n </div>\n <!---->\n </section>\n</section>\n<!-- DON'T TOUCH BELOW THIS LINE PLEASE THANK YOU. The following img tag will configure Anki's built-in text input placeholder -->\n<img\n class=\"dn\"\n src\n onerror=\"document.getElementById('typeans').placeholder=document.getElementById('input-container').getAttribute('placeholder'); document.getElementById('typeans').value=''; document.getElementById('typeans').removeAttribute('readonly');\"\n/>\n","backHtml":"<section\n class=\"libre-franklin tc min-h-100 lh-copy relative overflow-hidden fw6\"\n>\n <div class=\"blur-bg bg-center w-100 cover h-100 white absolute z-0\"></div>\n <section class=\"z-1 flex flex-column justify-center\">\n <section class=\"z-1 pa3\">\n <p\n class=\"ma0 dib mr-auto ml-auto grow-custom append-play-btn-text z-5 cyan\"\n >\n {{audio}}\n </p>\n\n <section class=\"\">\n <div class=\"relative dib show-hide-children lh-title shift-up-title\">\n <h1\n class=\"z-4 w-100 show left-0 ma0 dib text-stroke-yellow noto-sans-jp fw6 f-subheadline lh-tiny-ja ma0 mr-auto ml-auto measure tc pv2 yellow\"\n >\n {{term}}\n </h1>\n </div>\n\n <p class=\"ma0 f2 lh-title shift-up-subtitle cyan\">{{reading}}</p>\n <p class=\"ma0 f3 lh-copy yellow\">{{translation}}</p>\n <p class=\"ma0 f3 lh-copy yellow\">{{transliteration}}</p>\n <p class=\"ma0 f4 lh-copy yellow\">{{Tags}}</p>\n\n {{#picture}}\n <div\n class=\"relative measure mt2 mr-auto ml-auto\"\n style=\"overflow: hidden\"\n >\n <div class=\"z-999 child-img-lh-0\">{{picture}}</div>\n </div>\n {{/picture}}\n </section>\n </section>\n </section>\n</section>\n\n<div class=\"off-screen\">\n <svg style=\"height: 0; width: 0;\" xmlns=\"http://www.w3.org/2000/svg\">\n <defs>\n <filter id=\"text-stroke-yellow\">\n <feFlood flood-color=\"gold\" result=\"flood\"></feFlood>\n <feComposite\n in=\"flood\"\n in2=\"SourceAlpha\"\n operator=\"in\"\n result=\"mask\"\n ></feComposite>\n <feMorphology\n in=\"mask\"\n operator=\"dilate\"\n radius=\"2\"\n result=\"dilated\"\n ></feMorphology>\n <feComposite\n in=\"dilated\"\n in2=\"SourceAlpha\"\n operator=\"out\"\n result=\"outline\"\n ></feComposite>\n <feMerge>\n <feMergeNode in=\"outline\"></feMergeNode>\n </feMerge>\n </filter>\n </defs>\n </svg>\n</div>\n","cardCss":"@import url(\"https://unpkg.com/[email protected]/css/tachyons.min.css\");\n\n@import url(\"https://fonts.googleapis.com/css2?family=Libre+Franklin:ital,wght@0,100..900;1,100..900&display=swap\");\n\n@import url(\"https://fonts.googleapis.com/css2?family=Noto+Sans+JP:[email protected]&display=swap\");\n\n.noto-sans-jp {\n font-family: \"Noto Sans JP\", sans-serif;\n font-optical-sizing: auto;\n font-style: normal;\n}\n\n.libre-franklin {\n font-family: \"Libre Franklin\", sans-serif;\n font-optical-sizing: auto;\n font-style: normal;\n}\n\n.blur-bg {\n background-image: linear-gradient(\n rgba(10, 10, 10, 0.5),\n rgba(10, 10, 10, 0.5)\n ),\n url(\"bg_starry_night.jpg\"),\n url(\"https://cdn.jsdelivr.net/gh/avidrucker/anki-card-test-1/public/bg_starry_night.jpg\");\n background-attachment: fixed;\n}\n\n:root {\n}\n\n.text-stroke-yellow {\n filter: url(#text-stroke-yellow);\n}\n\n.lh-tiny-en {\n line-height: 0.85;\n}\n\n.lh-tiny-ja {\n line-height: 1.1;\n}\n\n.cyan {\n color: #00e5ff;\n}\n\n/*.card is primarily for styling the background of both front and back cards*/\n.card {\n -ms-overflow-style: none; /* IE and Edge */\n scrollbar-width: none; /* Firefox */\n}\n\n.show-hide-children * {\n transition: opacity 0.5s ease-out;\n}\n\n.show-hide-children:hover *.show {\n opacity: 1;\n}\n\n.show-hide-children:hover *.hide {\n opacity: 0;\n}\n\n.show-on-hover {\n opacity: 0;\n transition: opacity 0.5s ease-out;\n}\n\n.show-on-hover:hover {\n opacity: 1;\n}\n\n.lh-0 {\n vertical-align: middle;\n line-height: 0;\n}\n\n/* Anki-only styling to take up all vertical space of the card display window */\nhtml,\nbody,\ndiv#qa {\n height: 100%;\n}\n\n/* Hide scrollbar for Chrome, Safari and Opera */\n.invisible-scrollbar::-webkit-scrollbar {\n display: none;\n}\n\n.card::-webkit-scrollbar {\n display: none;\n}\n\n/* Hide scrollbar for IE, Edge and Firefox */\n.invisible-scrollbar {\n -ms-overflow-style: none; /* IE and Edge */\n scrollbar-width: none; /* Firefox */\n}\n\n.shift-up-right {\n position: relative;\n top: -0.1rem;\n}\n\n.visually-hidden {\n position: absolute;\n width: 1px;\n height: 1px;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap; /* Prevents content from \"spilling\" */\n border-width: 0;\n}\n\n.visually-hidden:hover {\n position: inherit;\n width: auto;\n height: auto;\n margin: 0;\n overflow: visible;\n clip: auto;\n white-space: normal;\n border-width: 0;\n}\n\n.off-screen {\n position: absolute;\n left: -9999px;\n}\n\n.balance {\n text-wrap: balance;\n}\n\n.play-button {\n color: inherit;\n background-color: transparent;\n border: none;\n z-index: inherit;\n cursor: inherit;\n text-shadow: inherit;\n line-height: inherit;\n padding: 0;\n}\n\n.lh-audio {\n line-height: 2.5rem;\n}\n\n.grow-custom > * {\n -moz-osx-font-smoothing: grayscale;\n backface-visibility: hidden;\n transform: translateZ(0);\n transition: transform 0.25s ease-out;\n}\n\n.grow-custom > *:hover,\n.grow-custom > *:focus {\n transform: scale(1.05);\n}\n\n.grow-custom > *:active {\n transform: scale(0.9);\n}\n\n/* input-reset input-8-bit f3 w-100 dark-green ba b--medium-green bg-green pa2 */\n#input-container input {\n -webkit-appearance: none;\n background-color: transparent;\n color: white;\n font-size: 1.5rem;\n padding: 0.5rem;\n border: 1px solid gray;\n width: 100%;\n text-align: center;\n -webkit-appearance: none;\n -moz-appearance: none;\n}\n\n#input-container input::placeholder {\n color: lightgray;\n opacity: 0.7;\n}\n\n#input-container input:focus {\n outline: 0 none;\n background-color: transparent;\n border: 1px solid lightgray !important;\n}\n\n#input-container input::-moz-focus-inner {\n border: 0;\n padding: 0;\n}\n\n/* Anki Only Styles*/\n.append-play-btn-text a::after {\n content: \"▶\";\n color: white;\n}\n\n.append-play-btn-text svg {\n display: none;\n}\n\n.append-play-btn-text button {\n font-size: 2.5rem;\n line-height: 4rem;\n cursor: pointer;\n height: 4rem;\n width: 4rem;\n vertical-align: top;\n}\n\n.append-play-btn-text {\n}\n\n.replay-button {\n margin: 0;\n font-size: 2.5rem;\n}\n\n.poster-effect {\n filter: url(#poster-effect);\n}\n\n.shift-up-title {\n transform: translateY(-0.5rem);\n}\n\n.shift-up-subtitle {\n transform: translateY(-0.25rem);\n}\n\n.v-align-mid {\n vertical-align: middle;\n}\n\n.child-img-lh-0 img {\n line-height: 0;\n vertical-align: middle;\n}\n","designName":"Starry Night Poster"}

0 comments on commit d35a8be

Please sign in to comment.