dwd-projects/teenybeanspreschoolcurriculum.com
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

u

Browse Source
This commit is contained in:
dev sp
2023-01-18 11:14:29 +00:00
parent c0460334ef
commit 4032087bfb
137 changed files with 4979 additions and 2879 deletions
Download Patch File Download Diff File Expand all files Collapse all files

61
src/components/Roundchart.vue Normal file
View File

@@ -0,0 +1,61 @@
<template>
<div>
<div class="grid">
<div class="flex relative justify-center text-xs">
<img class="animate-[spin_20s_ease-in-out_1]" src="/img/frame1.png" alt="">
<p class="literacy absolute ml-24 -mt-10 md:-mt-0 md:ml-28 cursor-pointer"><abbr title="Lorem ipsum dolor sit amet consectetur, adipisicing elit. Laborum dicta sequi repudiandae vero sed aspernatur ratione voluptatem expedita quis quibusdam ipsam tenetur culpa autem possimus quaerat dolor, fugiat iste excepturi.">
Literacy</abbr>
</p>
<p class="comunication absolute -mt-8 md:mt-12 ml-48 md:ml-72 text-center cursor-pointer"><abbr title="Lorem ipsum dolor sit amet consectetur, adipisicing elit. Laborum dicta sequi repudiandae vero sed aspernatur ratione voluptatem expedita quis quibusdam ipsam tenetur culpa autem possimus quaerat dolor, fugiat iste excepturi.">
Comunication <br>& Language</abbr>
</p>
<p class="mathematics absolute ml-48 md:ml-72 -mt-32 md:-mt-0 text-center cursor-pointer"><abbr title="Lorem ipsum dolor sit amet consectetur, adipisicing elit. Laborum dicta sequi repudiandae vero sed aspernatur ratione voluptatem expedita quis quibusdam ipsam tenetur culpa autem possimus quaerat dolor, fugiat iste excepturi.">
Mathematics</abbr>
</p>
<p class="world absolute -mt-36 ml-12 md:-mt-4 lg:ml-20 text-center cursor-pointer"><abbr title="Lorem ipsum dolor sit amet consectetur, adipisicing elit. Laborum dicta sequi repudiandae vero sed aspernatur ratione voluptatem expedita quis quibusdam ipsam tenetur culpa autem possimus quaerat dolor, fugiat iste excepturi.">
Understanding <br> the World </abbr>
</p>
<p class="physical absolute -mt-24 md:mt-4 -ml-40 md:-ml-56 text-center cursor-pointer"><abbr title="Lorem ipsum dolor sit amet consectetur, adipisicing elit. Laborum dicta sequi repudiandae vero sed aspernatur ratione voluptatem expedita quis quibusdam ipsam tenetur culpa autem possimus quaerat dolor, fugiat iste excepturi.">
Physical <br> Development </abbr>
</p>
<p class="expressive absolute -mt-16 md:mt-4 -ml-48 md:-ml-80 text-center cursor-pointer"><abbr title="Lorem ipsum dolor sit amet consectetur, adipisicing elit. Laborum dicta sequi repudiandae vero sed aspernatur ratione voluptatem expedita quis quibusdam ipsam tenetur culpa autem possimus quaerat dolor, fugiat iste excepturi.">
Expressive Arts<br> & Desgine </abbr>
</p>
<p class="preschool absolute -ml-28 md:-ml-40 -mt-4 md:mt-4 text-center cursor-pointer"><abbr title="Lorem ipsum dolor sit amet consectetur, adipisicing elit. Laborum dicta sequi repudiandae vero sed aspernatur ratione voluptatem expedita quis quibusdam ipsam tenetur culpa autem possimus quaerat dolor, fugiat iste excepturi.">
Preschool, Social <br>& Emotional <br>Development</abbr>
</p>
</div>
</div>
</div>
</template>
<style>
.comunication {
transform: rotate(80deg);
/* left: 360px; */
top: 170px;
}
.mathematics {
transform: rotate(-50deg);
top: 373px;
}
.world {
transform: rotate(-10deg);
top: 420px;
}
.physical {
transform: rotate(44deg);
top: 340px;
}
.expressive {
transform: rotate(-90deg);
top: 225px;
}
.preschool {
transform: rotate(-35deg);
top: 95px;
}
.border-radius{
border-top-left-radius: 200px;
height: 400px;
}
</style>