XPUB
/
SI20
57
2
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Merge branch 'main' of https://git.xpub.nl/XPUB/SI20

Browse Source
main
Stephen Kerr 2 years ago
parent 0dbed6d49f 3483610f1d
commit e0058d4b44
30 changed files with 30246 additions and 60 deletions
Show Stats Download Patch File Download Diff File

54
carddeck1/cards.json
Unescape Escape View File

@ -2,22 +2,58 @@
"cards" : [{
"name" : "body",
"text" : "Some text of this card",
"image": "3.jpg"
"image": "4.jpg"
},
{
"name" : "panopticon",
"text" : "The panopticon is a design of institutional building with an inbuilt system of control!",
"image": "2.jpg"
"name" : "body",
"text" : "Some text of this card",
"image": "4.jpg"
},
{
"name" : "body",
"text" : "Some text of this card",
"image": "4.jpg"
},
{
"name" : "body",
"text" : "Some text of this card",
"image": "4.jpg"
},
{
"name" : "body",
"text" : "Some text of this card",
"image": "4.jpg"
},
{
"name" : "body",
"text" : "Some text of this card",
"image": "4.jpg"
},
{
"name" : "body",
"text" : "Some text of this card",
"image": "4.jpg"
},
{
"name" : "body",
"text" : "Some text of this card",
"image": "4.jpg"
},
{
"name" : "body",
"text" : "Some text of this card",
"image": "4.jpg"
},
{
"name" : "body",
"text" : "Some text of this card",
"image": "4.jpg"
},
{
"name" : "",
"text" : "been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum. Lorem lorem lorem lorem",
"image": ""
},
{
"name" : "gezi",
"text" : "these are the protests in 2013",
"image": "3.jpg"
}]
]
}

BIN
carddeck1/images/1.jpg
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 840 KiB

After

Width:  |  Height:  |  Size: 1018 KiB

BIN
carddeck1/images/10.jpg
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 556 KiB

BIN
carddeck1/images/11.jpg
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.3 MiB

BIN
carddeck1/images/2.jpg
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.4 MiB

After

Width:  |  Height:  |  Size: 878 KiB

BIN
carddeck1/images/3.jpg
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.6 MiB

After

Width:  |  Height:  |  Size: 586 KiB

BIN
carddeck1/images/4.jpg
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.0 MiB

BIN
carddeck1/images/5.jpg
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 753 KiB

BIN
carddeck1/images/6.jpg
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 799 KiB

BIN
carddeck1/images/7.jpg
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.0 MiB

BIN
carddeck1/images/8.jpg
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 811 KiB

BIN
carddeck1/images/9.jpg
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 832 KiB

1
carddeck1/stylesheet.css
Unescape Escape View File

@ -30,6 +30,7 @@
top: 15mm;
left: 10mm;
text-align: center;
margin: 0;
}
.card > p.textnoimage {
width: 60mm;

5
ogcardeck/cards.html
Unescape Escape View File

@ -46,6 +46,11 @@
new CircleType(ups[i]).radius(160);
}
var downs = document.querySelectorAll(".down");
for (let i = 0; i < downs.length; i++) {
new CircleType(downs[i]).dir(-1).radius(160);
}
</script>
</html>

BIN
ogcardeck/images/coffee.PNG
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 3.0 MiB

8
ogcardeck/stylesheet.css
Unescape Escape View File

@ -9,6 +9,7 @@
position: relative;
border-radius: 100%;
text-align: center;
break-inside: avoid;
}
.card > img {
width: calc(100% - 8mm - 8mm);
@ -22,8 +23,15 @@ p {
position: absolute;
margin: 2mm;
width: 100%;
font-family: "Trickster";
}
p.down {
bottom:0;
}
@font-face {
font-family: "Trickster";
src:
url("trickster-COLRv1.otf") format("opentype");
}

18417
web/00-booklet/booklet.html
View File

File diff suppressed because it is too large Load Diff

11431
web/00-booklet/booklet.md
View File

File diff suppressed because it is too large Load Diff

2
web/00-booklet/booklet.template.html
Unescape Escape View File

@ -5,7 +5,7 @@
<meta charset="utf-8">
<script src="paged.js/paged.polyfill.js"></script>
<link href="paged.js/pagedjs.css" rel="stylesheet" type="text/css">
<link rel="stylesheet" type="text/css" href="stylesheet.css">
<link rel="stylesheet" type="text/css" href="print_style.css">
</head>
<body>
<div id="contenteo">{{ content }}</div>

35
web/generate-booklet.py
Unescape Escape View File

@ -12,7 +12,7 @@ all_html = ""
all_md = ""
html=[]
folders = glob("content/*")
folders = glob("./*")
print(folders)
for folder in folders:
@ -27,14 +27,9 @@ for folder in folders:
file = file.replace(" ", "\ ")
print(file)
# html_file = file.replace(".md", ".html")
# pandoc_cmd = "pandoc -s -c style.css -f markdown -t html " + file + " -o " + html_file
# os.system(pandoc_cmd)
# print("standalone html files saved!")
pandoc2 = "pandoc -f markdown -t html " + file
html_data = subprocess.run(pandoc2, capture_output=True, text=True).stdout
print("html_data: ", html_data)
# pandoc2 = "pandoc -f markdown -t html " + file
# html_data = subprocess.run(pandoc2, capture_output=True, text=True).stdout
# print("html_data: ", html_data)
# #editing the html before creatings the main file
# # filename = os.path.basename(file)
@ -46,24 +41,30 @@ for folder in folders:
# # and then collect all that content into a variable called "all_html"
# # add this content to all_html
# all_html = all_html + html_data
html.append(html_data)
# html.append(html_data)
md_data = open(file).read()
all_md += "\n"+md_data
#create md and use pandoc to convert to html
output = open("booklet.md", "w")
#create booklet.md
output = open("00-booklet/booklet.md", "w")
output.write(all_md)
output.close()
# pandoc_md = "pandoc -s --toc -c style.css -f markdown -t html booklet.md -o booklet.html"
# os.system(pandoc_md)
print("booklet md files saved!")
env = jinja2.Environment(loader=jinja2.FileSystemLoader("."))
# use pandoc to convert booklet.md to html
pandoc_command = "pandoc --toc -f markdown -t html 00-booklet/booklet.md"
#html_data = subprocess.run(pandoc_command, capture_output=True, text=True).stdout
html_data = subprocess.check_output(pandoc_command, shell=True, text=True,encoding="utf-8")
print("html has been generated!")
#print("html data!", html_data)
#html to template environment
env = jinja2.Environment(loader=jinja2.FileSystemLoader("00-booklet"))
template = env.get_template("booklet.template.html")
booklet_html = template.render(content=html)
booklet_html = template.render(content=html_data)
print("this is the html: ", booklet_html)
output = open("booklet.html", "w")
output = open("00-booklet/booklet.html", "w")
output.write(booklet_html)
output.close()
print("booklet html files saved!")

1
web/spin-wheel/cards.svg
View File

File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 5.4 KiB

1
web/spin-wheel/crystals.svg
Unescape Escape View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 274.93 343.57"><defs><style>.cls-1{fill:none;}.cls-1,.cls-2{stroke:#000;stroke-miterlimit:10;}</style></defs><g id="Layer_2" data-name="Layer 2"><g id="Layer_1-2" data-name="Layer 1"><line class="cls-1" x1="87.21" y1="0.44" x2="30.34" y2="65.23"/><line class="cls-1" x1="51.15" y1="281.26" x2="30.34" y2="65.23"/><line class="cls-1" x1="87.21" y1="0.44" x2="169.73" y2="43.38"/><line class="cls-1" x1="187.76" y1="273.78" x2="169.73" y2="43.38"/><line class="cls-1" x1="51.15" y1="281.26" x2="128.47" y2="341.74"/><line class="cls-1" x1="187.76" y1="273.78" x2="128.47" y2="341.74"/><line class="cls-1" x1="30.34" y1="65.23" x2="71.26" y2="78.06"/><line class="cls-1" x1="87.21" y1="0.44" x2="71.26" y2="78.06"/><line class="cls-1" x1="125.35" y1="66.69" x2="169.73" y2="43.38"/><line class="cls-1" x1="87.21" y1="0.44" x2="125.35" y2="66.69"/><line class="cls-1" x1="71.26" y1="78.06" x2="125.35" y2="66.69"/><line class="cls-1" x1="51.15" y1="281.26" x2="98.3" y2="292.75"/><line class="cls-1" x1="187.76" y1="273.78" x2="147.54" y2="294.31"/><line class="cls-1" x1="71.26" y1="78.06" x2="98.3" y2="292.75"/><line class="cls-1" x1="125.35" y1="66.69" x2="147.54" y2="294.31"/><line class="cls-1" x1="98.3" y1="292.75" x2="147.54" y2="294.31"/><line class="cls-1" x1="51.15" y1="281.26" x2="94.47" y2="262.29"/><line class="cls-1" x1="187.76" y1="273.78" x2="147.54" y2="262.29"/><line class="cls-1" x1="94.69" y1="262.37" x2="147.25" y2="262.37"/><line class="cls-1" x1="30.34" y1="65.23" x2="79.23" y2="49.99"/><line class="cls-1" x1="169.73" y1="43.38" x2="112.83" y2="44.95"/><line class="cls-1" x1="79.23" y1="49.99" x2="112.83" y2="44.95"/><line class="cls-1" x1="98.3" y1="292.75" x2="128.47" y2="341.74"/><line class="cls-1" x1="147.54" y1="294.31" x2="128.47" y2="341.74"/><line class="cls-1" x1="207.7" y1="198.91" x2="254.88" y2="160.13"/><line class="cls-1" x1="254.88" y1="160.13" x2="274.43" y2="204.55"/><line class="cls-1" x1="207.7" y1="198.91" x2="234.52" y2="210.01"/><line class="cls-1" x1="254.88" y1="160.13" x2="234.52" y2="210.01"/><line class="cls-1" x1="274.43" y1="204.55" x2="251.18" y2="211.43"/><line class="cls-1" x1="254.88" y1="160.13" x2="251.18" y2="211.43"/><line class="cls-1" x1="207.7" y1="198.91" x2="187.86" y2="309.38"/><line class="cls-1" x1="216.99" y1="343.15" x2="187.86" y2="309.38"/><line class="cls-1" x1="234.52" y1="210.01" x2="215.37" y2="317.75"/><line class="cls-1" x1="251.18" y1="211.43" x2="234.52" y2="210.01"/><line class="cls-1" x1="274.43" y1="204.55" x2="261.03" y2="314.81"/><line class="cls-1" x1="216.99" y1="343.15" x2="261.03" y2="314.81"/><line class="cls-1" x1="236.11" y1="320.97" x2="251.18" y2="211.43"/><line class="cls-1" x1="261.03" y1="314.81" x2="236.11" y2="320.97"/><line class="cls-1" x1="215.37" y1="317.75" x2="187.86" y2="309.38"/><line class="cls-1" x1="236.11" y1="320.97" x2="215.37" y2="317.75"/><line class="cls-1" x1="216.99" y1="343.15" x2="215.37" y2="317.75"/><line class="cls-1" x1="236.11" y1="320.97" x2="216.99" y2="343.15"/><line class="cls-1" x1="207.7" y1="198.91" x2="239.76" y2="197.18"/><line class="cls-1" x1="274.43" y1="204.55" x2="252.47" y2="199.99"/><line class="cls-1" x1="239.76" y1="197.18" x2="252.47" y2="199.99"/><line class="cls-1" x1="187.86" y1="309.38" x2="217.12" y2="307.89"/><line class="cls-1" x1="261.03" y1="314.81" x2="237.82" y2="308.55"/><line class="cls-1" x1="217.12" y1="307.89" x2="237.82" y2="308.55"/><polygon class="cls-1" points="212.21 39.25 194.93 38.02 184.12 51.54 179.96 34.73 163.75 28.63 178.45 19.48 179.25 2.17 192.5 13.33 209.2 8.74 202.68 24.79 212.21 39.25"/><polygon class="cls-1" points="219.22 65.69 224.8 64.03 226.6 58.49 229.9 63.29 235.72 63.29 232.18 67.91 233.98 73.45 228.49 71.51 223.78 74.93 223.93 69.11 219.22 65.69"/><polygon class="cls-2" points="207.02 156.49 200.23 155.33 195.42 160.26 194.43 153.44 188.25 150.39 194.43 147.34 195.43 140.52 200.23 145.46 207.02 144.3 203.81 150.39 207.02 156.49"/><polygon class="cls-2" points="252.61 102.26 253.44 113.9 263.5 119.82 252.68 124.2 250.16 135.6 242.65 126.67 231.04 127.79 237.21 117.89 232.55 107.19 243.88 110 252.61 102.26"/><polygon class="cls-1" points="19.9 220.43 13.11 219.27 8.29 224.2 7.31 217.38 1.13 214.33 7.31 211.28 8.3 204.46 13.11 209.4 19.9 208.24 16.69 214.33 19.9 220.43"/><polygon class="cls-2" points="44.21 272.76 38.01 282.64 42.64 293.36 31.32 290.51 22.56 298.22 21.77 286.58 11.73 280.63 22.56 276.28 25.11 264.89 32.6 273.85 44.21 272.76"/></g></g></svg>
Side by Side

After

Width:  |  Height:  |  Size: 4.4 KiB

1
web/spin-wheel/dream-catcher.svg
Unescape Escape View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 178 316"><defs><style>.cls-1{fill:none;}.cls-1,.cls-2{stroke:#000;stroke-width:3px;}.cls-1,.cls-2,.cls-3{stroke-miterlimit:10;}.cls-3{fill:#fff;stroke:#fff;}</style></defs><g id="Layer_2" data-name="Layer 2"><g id="Layer_1-2" data-name="Layer 1"><circle class="cls-1" cx="89" cy="90" r="87.5"/><circle class="cls-2" cx="89" cy="59" r="57.5"/><line class="cls-1" x1="1.5" y1="124" x2="1.5" y2="180"/><line class="cls-1" x1="165.5" y1="217" x2="165.5" y2="234"/><line class="cls-1" x1="89.5" y1="263" x2="89.5" y2="297"/><line class="cls-1" x1="89.5" y1="188" x2="89.5" y2="241"/><line class="cls-1" x1="111.5" y1="256" x2="111.5" y2="271"/><line class="cls-1" x1="173.5" y1="178" x2="173.5" y2="205"/><line class="cls-1" x1="89.5" y1="245" x2="89.5" y2="258"/><line class="cls-1" x1="165.5" y1="148" x2="164.95" y2="197"/><line class="cls-1" x1="173.5" y1="132" x2="173.01" y2="175"/><line class="cls-1" x1="139.5" y1="220" x2="139.5" y2="234"/><line class="cls-1" x1="158.5" y1="159" x2="158.5" y2="172"/><line class="cls-1" x1="139.5" y1="239" x2="139.5" y2="281"/><line class="cls-1" x1="89.5" y1="303" x2="89.5" y2="316"/><line class="cls-1" x1="9.5" y1="219" x2="9.5" y2="253"/><line class="cls-1" x1="9.5" y1="144" x2="9.5" y2="197"/><line class="cls-1" x1="9.5" y1="201" x2="9.5" y2="215"/><line class="cls-1" x1="148.5" y1="239" x2="148.5" y2="252"/><line class="cls-1" x1="71.5" y1="239" x2="71.5" y2="292"/><line class="cls-1" x1="158.5" y1="232" x2="158.5" y2="245"/><line class="cls-1" x1="158.5" y1="178" x2="157.95" y2="227"/><line class="cls-1" x1="52.5" y1="180" x2="52.5" y2="233"/><line class="cls-1" x1="130.5" y1="240" x2="130.5" y2="266"/><line class="cls-1" x1="121.5" y1="216" x2="121.5" y2="230"/><line class="cls-1" x1="121.5" y1="179" x2="121.5" y2="214"/><line class="cls-1" x1="111.5" y1="200" x2="111.5" y2="253"/><line class="cls-1" x1="111.5" y1="183" x2="111.5" y2="196"/><line class="cls-1" x1="173.5" y1="211" x2="173.5" y2="225"/><line class="cls-1" x1="100.5" y1="187" x2="100.5" y2="200"/><line class="cls-1" x1="100.5" y1="205" x2="99.95" y2="254"/><line class="cls-1" x1="139.5" y1="191" x2="139.5" y2="217"/><line class="cls-1" x1="121.5" y1="234" x2="121.5" y2="259"/><line class="cls-1" x1="165.5" y1="200" x2="165.5" y2="214"/><line class="cls-1" x1="139.5" y1="170" x2="139.5" y2="188"/><line class="cls-1" x1="149.5" y1="165" x2="149.5" y2="178"/><line class="cls-1" x1="149.5" y1="184" x2="148.95" y2="233"/><line class="cls-1" x1="130.5" y1="199" x2="130.5" y2="234"/><line class="cls-1" x1="130.5" y1="175" x2="130.5" y2="193"/><line class="cls-1" x1="61.5" y1="244" x2="61.5" y2="259"/><line class="cls-1" x1="80.5" y1="230" x2="80.5" y2="256"/><line class="cls-1" x1="71.5" y1="186" x2="71.5" y2="200"/><line class="cls-1" x1="62.5" y1="185" x2="62.5" y2="238"/><line class="cls-1" x1="71.5" y1="208" x2="71.5" y2="233"/><line class="cls-1" x1="80.5" y1="189" x2="80.5" y2="224"/><line class="cls-1" x1="43.5" y1="235" x2="43.5" y2="222"/><line class="cls-1" x1="43.5" y1="217" x2="43.5" y2="175"/><line class="cls-1" x1="16.5" y1="170" x2="16.5" y2="157"/><line class="cls-1" x1="16.5" y1="189" x2="16.5" y2="177"/><line class="cls-1" x1="16.5" y1="241" x2="17.04" y2="193"/><line class="cls-1" x1="43.5" y1="264" x2="43.5" y2="238"/><line class="cls-1" x1="43.5" y1="285" x2="43.5" y2="267"/><line class="cls-1" x1="52.5" y1="289" x2="53.04" y2="240"/><line class="cls-1" x1="25.5" y1="213" x2="25.5" y2="227"/><line class="cls-1" x1="25.5" y1="232" x2="25.5" y2="274"/><line class="cls-1" x1="25.5" y1="184" x2="25.5" y2="210"/><line class="cls-1" x1="25.5" y1="163" x2="25.5" y2="181"/><line class="cls-1" x1="34.5" y1="207" x2="34.5" y2="221"/><line class="cls-1" x1="34.5" y1="170" x2="34.5" y2="205"/><line class="cls-1" x1="34.5" y1="225" x2="34.5" y2="250"/><line class="cls-1" x1="1.5" y1="224" x2="1.5" y2="238"/><line class="cls-1" x1="1.5" y1="187" x2="1.5" y2="222"/><line class="cls-1" x1="1.5" y1="242" x2="1.5" y2="267"/><line class="cls-1" x1="61.5" y1="301" x2="61.5" y2="267"/><polygon class="cls-3" points="101.32 66.04 96.61 73.54 100.12 81.66 91.54 79.51 84.9 85.35 84.3 76.52 76.68 72.01 84.89 68.71 86.83 60.08 92.51 66.87 101.32 66.04"/></g></g></svg>
Side by Side

After

Width:  |  Height:  |  Size: 4.2 KiB

47
web/spin-wheel/index.html
Unescape Escape View File

@ -13,13 +13,11 @@
<script>
console.log("hey there");
function preload(){
img=loadImage('wheel-of-fortune')
img=loadImage('wheel.svg')
}
function setup() {
createCanvas(windowWidth, windowHeight);
button = createButton("spin the wheel!");
button.position(windowWidth/2-250, windowHeight/2);
button.mousePressed(spin);
var canvas = createCanvas(windowWidth/2, windowHeight/2);
canvas.parent("wheel");
}
var spinning = 1;
@ -34,12 +32,13 @@ function card(){
console.log("hey pop up here");
}
function draw() {
background(220);
clear();
// background(220);
imageMode(CENTER);
angleMode(DEGREES);
translate (windowWidth/2, windowHeight/2);
translate (windowWidth/4, windowHeight/4);
rotate(currentSpinning);
image (img,0,0,200,200);
image (img,0,0,250,250);
currentSpinning = currentSpinning+10;
if (currentSpinning > spinning){
currentSpinning = spinning;
@ -51,18 +50,30 @@ function draw() {
<body>
<div class="bg-image"></div>
<div class="bg-text">
<h1>Spin the Wheel of Fortune!</h1>
<p>Welcome, my dear!
<div class="bg-text-top">
<h1>Wheel of Fortune</h1>
<h2>Welcome, my dear!</h2>>
<br>This exercise you are about to start revolves around healing, in a sense of reconnecting to what is essential and authentic about yourself. As we understand the true nature of our suffering, we can evoke compassion for ourselves as we move through our uncomfortable feelings on the path to healing and peace.
<p>This exercise you are about to start revolves around healing, in a sense of reconnecting to what is essential and authentic about yourself. As we understand the true nature of our suffering, we can evoke compassion for ourselves as we move through our uncomfortable feelings on the path to healing and peace.
<br>Here are a few things I prepared for you before you begin:
<br>Have a strong sense of intention to commit to this exercise for some time.
<br>Find a quiet room, free of distraction.
<br>Get a notebook and a pen. Handwriting will engage your mind more actively and profoundly, help you connect with yourself, and enable the tracing of your progress over time.
<br>I will be guiding you through a series of carefully collected questions written by different authors, some well-known and others unknown. You begin the exercise by spinning the Wheel of Fortune. After a few seconds, a question appears on the screen. Then, you take a photo slide from the deck and try to think of an answer to that question by looking at it and the tiny film simultaneously.</p>
</div>
<button class="spin-wheel" onclick="spin()" > Spin</button>
<div id="wheel"></div>
<div class="bg-text-bottom">
<h2>Here are a few things I prepared for you before you begin:</h2>
<p>
<br>1. Have a strong sense of intention to commit to this exercise for some time.
<br>2. Find a quiet room, free of distraction.
<br>3. Get a notebook and a pen. Handwriting will engage your mind more actively and profoundly, help you connect with yourself, and enable the tracing of your progress over time.</p>
<br>I will be guiding you through a series of carefully collected questions written by different authors, some well-known and others unknown. You begin the exercise by spinning the Wheel of Fortune you will find at https://issue.xpub.nl/20/wheel.
After a few seconds, a question appears on the screen. Then, you take a photo slide from the deck and try to thankful of an answer to that question by looking at it and the tiny film simultaneously.</p>
</div>
<img class="top-left-corner" src="crystals.svg">
</body>

1
web/spin-wheel/moon-and-stars.svg
Unescape Escape View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 287.27 319.67"><defs><style>.cls-1,.cls-2{stroke:#000;stroke-miterlimit:10;}.cls-2{fill:none;}</style></defs><g id="Layer_2" data-name="Layer 2"><g id="Layer_1-2" data-name="Layer 1"><path class="cls-1" d="M285.38,266.23A164.17,164.17,0,0,1,102.44,3.07,164.17,164.17,0,1,0,285.38,266.23Z"/><polygon class="cls-2" points="137.53 102.47 126.08 100.5 117.97 108.81 116.31 97.31 105.89 92.17 116.31 87.03 117.99 75.54 126.09 83.86 137.54 81.9 132.13 92.18 137.53 102.47"/><polygon class="cls-1" points="187.1 9.77 180.26 20.68 185.36 32.5 172.88 29.36 163.21 37.87 162.34 25.02 151.26 18.46 163.21 13.66 166.03 1.1 174.28 10.98 187.1 9.77"/><polygon class="cls-2" points="232.38 229.66 234.96 234.2 240.17 234.64 236.65 238.5 237.84 243.59 233.07 241.44 228.6 244.14 229.18 238.95 225.23 235.53 230.35 234.47 232.38 229.66"/><polygon class="cls-1" points="251.32 190.21 260.1 189.08 264.15 181.21 267.94 189.21 276.67 190.63 270.23 196.7 271.58 205.45 263.82 201.2 255.92 205.19 257.56 196.49 251.32 190.21"/><polygon class="cls-2" points="205.83 108.81 209.54 115.32 217.01 115.96 211.96 121.5 213.66 128.8 206.83 125.71 200.41 129.59 201.24 122.14 195.57 117.23 202.92 115.72 205.83 108.81"/><polygon class="cls-1" points="153.36 208.33 157.75 207.76 159.77 203.83 161.67 207.83 166.03 208.54 162.81 211.57 163.49 215.95 159.61 213.82 155.66 215.82 156.48 211.47 153.36 208.33"/></g></g></svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.4 KiB

1
web/spin-wheel/moon-triangle.svg
Unescape Escape View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 206.05 238.65"><defs><style>.cls-1,.cls-2{stroke:#000;stroke-miterlimit:10;}.cls-2{fill:none;}</style></defs><g id="Layer_2" data-name="Layer 2"><g id="Layer_1-2" data-name="Layer 1"><path class="cls-1" d="M203.48,98.21a111.87,111.87,0,0,1-16.57,37.63c-33.16,48.7-97.25,62.85-143.15,31.6C22,152.64,8.29,130.33,3.35,105.77-6.12,146.35,8.23,189.25,43,212.91c45.89,31.25,110,17.1,143.15-31.6,17.46-25.65,22.86-55.77,17.36-83.1Z"/><line class="cls-2" x1="101.52" y1="0.19" x2="5.8" y2="237.47"/><line class="cls-2" x1="196.98" y1="238.15" x2="101.52" y2="0.19"/><line class="cls-2" x1="5.8" y1="237.47" x2="196.98" y2="238.15"/><polygon class="cls-1" points="109.3 104.79 109.93 113.62 117.56 118.11 109.35 121.43 107.44 130.07 101.75 123.3 92.94 124.15 97.62 116.64 94.09 108.53 102.67 110.66 109.3 104.79"/></g></g></svg>
Side by Side

After

Width:  |  Height:  |  Size: 872 B

1
web/spin-wheel/shooting-star.svg
Unescape Escape View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 307 158"><defs><style>.cls-1,.cls-4{fill:none;}.cls-1,.cls-2,.cls-4{stroke:#000;stroke-miterlimit:10;}.cls-1,.cls-2{stroke-width:3px;}.cls-3{fill:#fff;}</style></defs><g id="Layer_2" data-name="Layer 2"><g id="Layer_1-2" data-name="Layer 1"><line class="cls-1" x1="7.4" y1="6.32" x2="299.78" y2="152.25"/><circle class="cls-1" cx="4.5" cy="4.5" r="3"/><circle class="cls-1" cx="302.5" cy="153.5" r="3"/><circle class="cls-1" cx="142" cy="71" r="29.5"/><circle class="cls-1" cx="148" cy="82" r="29.5"/><circle class="cls-1" cx="238.5" cy="121.5" r="20"/><circle class="cls-2" cx="247" cy="128" r="17.5"/><polygon class="cls-3" points="248.96 133.71 244.52 134.56 242.7 138.69 240.53 134.73 236.03 134.27 239.13 130.98 238.17 126.57 242.26 128.5 246.16 126.22 245.59 130.7 248.96 133.71"/><polygon class="cls-4" points="157.38 66.14 154.62 66.02 152.96 68.21 152.22 65.55 149.62 64.64 151.93 63.13 151.98 60.37 154.14 62.09 156.78 61.3 155.81 63.88 157.38 66.14"/><polygon class="cls-4" points="141.58 94 137.96 91.94 134.2 93.76 135.04 89.68 132.15 86.67 136.29 86.21 138.26 82.53 139.98 86.33 144.09 87.06 141.01 89.87 141.58 94"/></g></g></svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.2 KiB

1
web/spin-wheel/spiral.svg
Unescape Escape View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 211.44 175.55"><defs><style>.cls-1,.cls-3,.cls-4{stroke:#000;stroke-miterlimit:10;}.cls-1{stroke-width:3px;}.cls-2{fill:#fff;}.cls-3{fill:none;}</style></defs><g id="Layer_2" data-name="Layer 2"><g id="Layer_1-2" data-name="Layer 1"><path d="M194,49.76a107.37,107.37,0,0,1-2,23.16,107.18,107.18,0,0,1-7.1,22.23,108.07,108.07,0,0,1-27.83,37.44c-23.86,20.47-57.11,30.29-88.56,23.86a86.81,86.81,0,0,1-22.46-8.23,91.66,91.66,0,0,1-10.15-6.41,92.77,92.77,0,0,1-9.17-7.75A87.42,87.42,0,0,1,0,69.13,72.14,72.14,0,0,1,1.35,57.05a72.14,72.14,0,0,1,8.74-22.63,72.77,72.77,0,0,1,7.14-9.86A70.06,70.06,0,0,1,58.86,1,74.75,74.75,0,0,1,71,0C73,.11,75.1.17,77.15.35l3,.46,1.53.24a11.2,11.2,0,0,1,1.51.3,57.27,57.27,0,0,1,45,52.08,45.95,45.95,0,0,1-43.69,50.23c-1,0-2,.14-3.09.08l-3.12-.18a41,41,0,0,1-6.13-1.19A38.31,38.31,0,0,1,61,97.11,37.79,37.79,0,0,1,46.59,77.43a38.52,38.52,0,0,1-1.53-12.22A29.92,29.92,0,0,1,55.88,43.54a29.11,29.11,0,0,1,17-6.62,22.76,22.76,0,0,1,3.09,0c.52,0,1,0,1.56.12l1.53.25a9.85,9.85,0,0,1,1.52.35c.5.14,1,.26,1.5.41A26.67,26.67,0,0,1,85,39.24a23.62,23.62,0,0,1,5.17,3.38,23.22,23.22,0,0,1,7.69,22.13A18.88,18.88,0,0,1,91.48,75a18.41,18.41,0,0,1-11.13,4.21A14.78,14.78,0,0,1,69.4,75,14.5,14.5,0,0,1,65,64.35h.4A14,14,0,0,0,80.31,78.27a17.47,17.47,0,0,0,10.44-4.15,17.68,17.68,0,0,0,5.78-9.65A21.73,21.73,0,0,0,89,43.93a22.11,22.11,0,0,0-4.83-3,25.5,25.5,0,0,0-2.67-1.05c-.45-.14-.92-.24-1.38-.36a11.66,11.66,0,0,0-1.4-.3,26.29,26.29,0,0,0-11.36.75,27.19,27.19,0,0,0-10.07,5.34,27.89,27.89,0,0,0-7,9,27.39,27.39,0,0,0-2.76,11,36,36,0,0,0,1.53,11.34A34.28,34.28,0,0,0,73,99.49a37.21,37.21,0,0,0,5.65,1l2.87.14c1,0,1.91-.08,2.87-.1a43,43,0,0,0,21.56-7.23,43.52,43.52,0,0,0,14.79-17.27,43,43,0,0,0,4-22.38,53.49,53.49,0,0,0-6.45-21.92,54.5,54.5,0,0,0-15-17.2A53.91,53.91,0,0,0,82.42,5.09,8.38,8.38,0,0,0,81,4.81l-1.42-.22-2.85-.42C74.83,4,72.91,4,71,3.86a69.86,69.86,0,0,0-11.47,1A67.36,67.36,0,0,0,20.19,27.13,67.57,67.57,0,0,0,5.05,57.8,69.82,69.82,0,0,0,3.76,69.24a83.81,83.81,0,0,0,25.41,62.34,83.88,83.88,0,0,0,40.05,21.83,85,85,0,0,0,22.94,2A104.85,104.85,0,0,0,115,152.07,105.61,105.61,0,0,0,193.6,49.76Z"/><circle class="cls-1" cx="79.66" cy="60.73" r="17.5"/><polygon class="cls-2" points="81.61 66.44 77.17 67.28 75.35 71.41 73.18 67.45 68.69 67 71.78 63.71 70.83 59.29 74.91 61.22 78.81 58.95 78.24 63.43 81.61 66.44"/><polygon class="cls-3" points="48.63 119.55 44.98 115.81 39.83 116.7 42.26 112.07 39.82 107.45 44.97 108.33 48.62 104.58 49.37 109.75 54.06 112.06 49.38 114.38 48.63 119.55"/><polygon class="cls-4" points="40.27 162.51 32.06 165.82 30.14 174.46 24.45 167.67 15.64 168.51 20.34 161.01 16.82 152.89 25.41 155.03 32.04 149.18 32.65 158.01 40.27 162.51"/><polygon class="cls-3" points="209.75 128.36 207.31 133.89 210.48 139.04 204.46 138.43 200.55 143.04 199.27 137.12 193.68 134.82 198.91 131.78 199.37 125.75 203.87 129.78 209.75 128.36"/><polygon class="cls-4" points="152.24 115.48 148.23 111.3 142.51 112.23 145.25 107.13 142.59 101.98 148.29 103 152.37 98.89 153.15 104.63 158.33 107.23 153.11 109.75 152.24 115.48"/></g></g></svg>
Side by Side

After

Width:  |  Height:  |  Size: 3.1 KiB

42
web/spin-wheel/style.css
Unescape Escape View File

@ -5,16 +5,15 @@ html {
html::before { /* Add a pseudo-element to the html element */
content: "";
position: fixed;
top: 0;
left: 0;
width: 200vw;
height: 200vh;
top: -50vh;
left: -50vw;
right: 0;
bottom: 0;
z-index: -1; /* Set a negative z-index to move the pseudo-element below the content */
background: url(bg-images/bg1.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
background-size: 200%;
/* Add animation properties */
-webkit-animation: spin 100s linear infinite;
@ -42,12 +41,43 @@ html {
}
}
.top-left-corner{
position: fixed;
top: 0px;
left: 0px;
transform: translate(-50%,-50%);
width: 50vw;
filter: hue-rotate(180deg);
}
#wheel{
text-align: center;
}
.spin-wheel{
position: center;
}
h1 {
position: relative;
margin-top: 5%;
text-align: center;
font-family: fantasy;
font-size:larger;
color:antiquewhite;
}
h2 {
text-align: center;
font-family: fantasy;
color:antiquewhite;
}
p {
text-align: center;
font-family: fantasy;
color:antiquewhite;
padding:10%;
}

253
web/spin-wheel/wheel.svg
View File

File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 72 KiB

Write Preview
Loading…
Cancel
Save