From dd6649ee2d7f80c4a46262de8ef840e6abf2393b Mon Sep 17 00:00:00 2001 From: Aki Date: Sun, 14 Jul 2024 22:24:18 +0200 Subject: A stub flippable card The form is not a form and it does not work for obvious reasons. This could be implemented all in SVG, HTML, JavaScript, or have some actual backend to generate questions and gather answers to get proper statistics. This is intended to recreate experiment performed for "On the Perception of Incongruity: A Paradigm" [[1949 Bruner and Postman]] as briefly explained in "The Structure of Scientific Revolutions" [[1962 Kuhn]]. --- card.svg | 57 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++ index.html | 11 +++++++++++ style.css | 31 +++++++++++++++++++++++++++++++ 3 files changed, 99 insertions(+) create mode 100644 card.svg create mode 100644 index.html create mode 100644 style.css diff --git a/card.svg b/card.svg new file mode 100644 index 0000000..f648df3 --- /dev/null +++ b/card.svg @@ -0,0 +1,57 @@ + + + + + + + + + + + + + + + 5 + ♣ + ♣ + 5 + ♣ + ♣ + ♣ + ♣ + ♣ + + + + + + + + + diff --git a/index.html b/index.html new file mode 100644 index 0000000..bab0463 --- /dev/null +++ b/index.html @@ -0,0 +1,11 @@ + + + + +What Is This Card? +
+

What Is This Card?

+ +

Answer the question in the shortest exposition time.
Click the card to flip it.

+ +
diff --git a/style.css b/style.css new file mode 100644 index 0000000..641b380 --- /dev/null +++ b/style.css @@ -0,0 +1,31 @@ +body { + background-color: #293e28; +} + +body, input { + color: #e6fee5; + font-family: monospace; + font-size: 16px; +} + +main { + max-width: 32em; + width: 100%; + margin: 0 auto; + text-align: center; +} + +img, object { + max-width: 50%; +} + +input[type=text] { + background: none; + border: none; + border-bottom: 1px solid #e6fee5; +} + +input[type=submit] { + background: none; + border: 1px solid #e6fee5; +} -- cgit v1.1