Skip to content

Commit cdf70e6

Browse files
committed
change voted.html to only animate inner content
1 parent 00e24ae commit cdf70e6

File tree

1 file changed

+39
-31
lines changed

1 file changed

+39
-31
lines changed

static/voted.html

+39-31
Original file line numberDiff line numberDiff line change
@@ -40,14 +40,13 @@
4040
}
4141

4242
#thanks-container {
43-
display: flex;
44-
justify-content: center;
45-
align-items: center;
46-
flex-direction: column;
4743
background: var(--background);
4844
width: var(--size);
4945
height: var(--size);
5046
border-radius: 3px;
47+
}
48+
49+
#thanks-content {
5150
animation: thanks 800ms var(--ease);
5251
}
5352

@@ -65,37 +64,46 @@
6564
color: var(--color);
6665
opacity: .6;
6766
}
67+
68+
.center {
69+
display: flex;
70+
justify-content: center;
71+
align-items: center;
72+
flex-direction: column;
73+
}
6874
</style>
6975
</head>
7076
<body>
7177
<div id="container">
72-
<div id="thanks-container">
73-
<svg width="60px" height="60px" viewBox="0 0 60 60" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
74-
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
75-
<g id="Artboard" transform="translate(-325.000000, -310.000000)">
76-
<g id="cat" transform="translate(325.000000, 310.000000)">
77-
<g id="Duotone" transform="translate(1.000000, 1.000000)">
78-
<polygon id="Shape" fill="#FFFFFF" fill-rule="nonzero" points="52.75 34 29.75 21.25 29.75 21.25 35.25 19 35.25 0.25 27.75 5.25 17.75 5.25 10.25 0.25 10.25 19 15.25 21 15.25 57.75 52.75 57.75 57.75 49"></polygon>
79-
<path d="M22.75,24 L15.25,21 L15.25,26 L22.75,29 L35,24 L29.75,21 L22.75,24 Z" id="Shape" fill="#E5DBFF" fill-rule="nonzero"></path>
80-
<path d="M15.25,52.75 L15.25,57.75 L52.75,57.75 L57.75,49 L52.75,49 L50.25,52.75 L15.25,52.75 Z" id="Shape" fill="#E5DBFF" fill-rule="nonzero"></path>
81-
<path d="M17.75,10.25 L17.75,12.75" id="Shape" stroke="#7048E8" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"></path>
82-
<path d="M27.75,10.25 L27.75,12.75" id="Shape" stroke="#7048E8" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"></path>
83-
<polyline id="Shape" stroke="#7048E8" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" points="15.25 57.75 6.5 57.75 0.25 51.5 6.5 42.75 1.5 37.75 5.25 32.75"></polyline>
84-
<polygon id="Shape" stroke="#7048E8" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" points="27.75 5.25 17.75 5.25 10.25 0.25 10.25 19 22.75 24 35.25 19 35.25 0.25"></polygon>
85-
<polyline id="Shape" stroke="#7048E8" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" points="15.25 21 15.25 57.75 52.75 57.75 57.75 49 52.75 34 29.75 21.25"></polyline>
86-
<path d="M30.25,57.75 L30.25,35.25" id="Shape" stroke="#7048E8" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"></path>
87-
<path d="M22.75,57.75 L22.75,35.25" id="Shape" stroke="#7048E8" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"></path>
88-
<polyline id="Shape" stroke="#7048E8" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" points="45.25 42.75 39 42.75 30.25 52.75"></polyline>
89-
</g>
90-
<g id="Frames-24px">
91-
<rect id="Rectangle-path" x="0" y="0" width="60" height="60"></rect>
92-
</g>
93-
</g>
94-
</g>
95-
</g>
96-
</svg>
97-
<div id="thanks">Thanks for voting!</div>
98-
<div id="redirect">Redirecting you back in a second.</div>
78+
<div id="thanks-container" class="center">
79+
<div id="thanks-content" class="center">
80+
<svg width="60px" height="60px" viewBox="0 0 60 60" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
81+
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
82+
<g id="Artboard" transform="translate(-325.000000, -310.000000)">
83+
<g id="cat" transform="translate(325.000000, 310.000000)">
84+
<g id="Duotone" transform="translate(1.000000, 1.000000)">
85+
<polygon id="Shape" fill="#FFFFFF" fill-rule="nonzero" points="52.75 34 29.75 21.25 29.75 21.25 35.25 19 35.25 0.25 27.75 5.25 17.75 5.25 10.25 0.25 10.25 19 15.25 21 15.25 57.75 52.75 57.75 57.75 49"></polygon>
86+
<path d="M22.75,24 L15.25,21 L15.25,26 L22.75,29 L35,24 L29.75,21 L22.75,24 Z" id="Shape" fill="#E5DBFF" fill-rule="nonzero"></path>
87+
<path d="M15.25,52.75 L15.25,57.75 L52.75,57.75 L57.75,49 L52.75,49 L50.25,52.75 L15.25,52.75 Z" id="Shape" fill="#E5DBFF" fill-rule="nonzero"></path>
88+
<path d="M17.75,10.25 L17.75,12.75" id="Shape" stroke="#7048E8" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"></path>
89+
<path d="M27.75,10.25 L27.75,12.75" id="Shape" stroke="#7048E8" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"></path>
90+
<polyline id="Shape" stroke="#7048E8" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" points="15.25 57.75 6.5 57.75 0.25 51.5 6.5 42.75 1.5 37.75 5.25 32.75"></polyline>
91+
<polygon id="Shape" stroke="#7048E8" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" points="27.75 5.25 17.75 5.25 10.25 0.25 10.25 19 22.75 24 35.25 19 35.25 0.25"></polygon>
92+
<polyline id="Shape" stroke="#7048E8" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" points="15.25 21 15.25 57.75 52.75 57.75 57.75 49 52.75 34 29.75 21.25"></polyline>
93+
<path d="M30.25,57.75 L30.25,35.25" id="Shape" stroke="#7048E8" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"></path>
94+
<path d="M22.75,57.75 L22.75,35.25" id="Shape" stroke="#7048E8" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"></path>
95+
<polyline id="Shape" stroke="#7048E8" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" points="45.25 42.75 39 42.75 30.25 52.75"></polyline>
96+
</g>
97+
<g id="Frames-24px">
98+
<rect id="Rectangle-path" x="0" y="0" width="60" height="60"></rect>
99+
</g>
100+
</g>
101+
</g>
102+
</g>
103+
</svg>
104+
<div id="thanks">Thanks for voting!</div>
105+
<div id="redirect">Redirecting you back in a second.</div>
106+
</div>
99107
</div>
100108
</div>
101109
<script>

0 commit comments

Comments
 (0)