Stephen Kerr 2 years ago
commit e0058d4b44

@ -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"
}]
]
}

Binary file not shown.

Before

Width:  |  Height:  |  Size: 840 KiB

After

Width:  |  Height:  |  Size: 1018 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 556 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 MiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.4 MiB

After

Width:  |  Height:  |  Size: 878 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.6 MiB

After

Width:  |  Height:  |  Size: 586 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.0 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 753 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 799 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.0 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 811 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 832 KiB

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

@ -45,6 +45,11 @@
for (let i = 0; i < ups.length; i++) {
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>

Binary file not shown.

Before

Width:  |  Height:  |  Size: 3.0 MiB

@ -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");
}

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

@ -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>

@ -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!")

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 5.4 KiB

@ -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>

After

Width:  |  Height:  |  Size: 4.4 KiB

@ -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>

After

Width:  |  Height:  |  Size: 4.2 KiB

@ -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 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>
<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>
</div>
<img class="top-left-corner" src="crystals.svg">
</body>

@ -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>

After

Width:  |  Height:  |  Size: 1.4 KiB

@ -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>

After

Width:  |  Height:  |  Size: 872 B

@ -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>

After

Width:  |  Height:  |  Size: 1.2 KiB

@ -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>

After

Width:  |  Height:  |  Size: 3.1 KiB

@ -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%;
}

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 72 KiB

Loading…
Cancel
Save