-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
125 lines (107 loc) · 8.56 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
<!DOCTYPE html>
<html lang="en">
<head>
<!-- meta -->
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link class="profileico" rel="icon" type="" />
<meta name="title" content="Ipsum-generator">
<meta name="description"
content="A handy Lorem Ipsum Generator that helps to create dummy text for all layout needs.simply dummy text of the printing and typesetting industry. Lorem Ipsum has 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.">
<meta name="keywords" content="dummy text,lipsum,lorem ipsum,filler text,fill text,online-tool,generator,css-formatting,webdesign,lorem ipsum,lorem ipsum generator,lorem ipsum dolor sit amet,lorem ipsum dolor sit amet, consectetuer adipiscing elit ,lorem ipsum meaning,lorem ipsum text,lorum ipsum,ipsum lorem,lorem ipsum dolor sit amet consectetuer adipiscing elit,Sign up for Ahrefs,loren ipsum,ipsum lorem generator,lorem ipsum dolor,what does lorem ipsum mean,lorem ipsum xbox,bacon ipsum,lorem ipsum dolor sit amet consectetur adipiscing elit,hipster ipsum,lorem ipsum dolor sit amet, consectetur adipiscing elit,what is lorem ipsum,lorem ipsum translation,ipsum generator,lorem ipsum copy,lorem ipsum dolor sit amet in english,lorem ipsum text copy,loreum ip,lorem ipsum translation to english,cupcake ipsum,lorem ipsum paragraph,ipsum diagnostics,lorem ipsum dolor sit amet consectetur adipiscing elit in english,text generator lorem ipsum,lorem ipsum dolorlink in biosit amet,lorem ipsum dolor sit amet consectetuer adipiscing elit in english,lorem ipsum copy paste,lorem ipsum dolor sit amet.translation,nosce te ipsum meaning,lorem ipsum dolor sit amet consectetur adipiscing elit.translate,filler text lorem ipsum,lorem ipsum text generator,lorum ipsum generator,lorem ipsum generator funny,lorem ipsum filler text,ipsum lorem text,lorem ipsum dolor sit amet consectetur adipiscing elit. in english,lorem ipsum meaning in english,lorem ipsum translation english,lorem ipsum translated to english,ipsum meaning,lorem ipsum fun,lorem ipsum dolor sit amet meaning,funny lorem ipsum,lorem ipsum full text,lorem ipsum in english,lorem ipsum dolor sit amet,ipsum text,lorem ipsum funny,placeholder text lorem ipsum,lore ipsum,lorem ipsum dummy text,lorem ipsum dolor sit,html lorem ipsum,lorem ipsum dolor sit amet.,cat ipsum,lorem ipsum generator characters,lorem ipsum character generator,lorem ipsum language,lorem ipsum latin,lorem ipsum text copy paste,lauren ipsum,lorem ipsum dolor meaning,what language is lorem ipsum,lorim ipsum,dummy text lorem ipsum,lorem ipsum placeholder text,latin lorem ipsum,lorem ipsum html,word lorem ipsum,latin ipsum,toyota ipsum,ipsum latin,translate lorem ipsum,lorem ipsum image,lorem ipsum font,lorem ipsum images,lorem ipsum alternatives,nosce te ipsum tattoo,lorem ipsum text sample,alternative lorem ipsum,lorum ipsum text,sample text lorem ipsum,lorem ipsum definition,lorium ipsum,lorem ipsum dolor sit amet, consectetuer adipiscing elit.,hipster lorem ipsum">
<meta name="robots" content="index, follow">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="language" content="English">
<meta name="revisit-after" content="1 days">
<meta name="author" content="Raval Arth">
<title>Ipsume Generator</title>
<!-- css -->
<link rel="stylesheet" href="src/css/style.css" />
<!-- development -->
<script src="src/js/tailwind.min.js"></script>
<link rel="stylesheet" href="src/css/typography.min.css" />
</head>
<body class="bg-slate-50 text-slate-900">
<div class="mobileSidebarCanvas"></div>
<!-- nav -->
<div class="nav">
<img src="src/img/dice/1.svg" class='hidden' alt="">
<img src="src/img/dice/2.svg" class='hidden' alt="">
<img src="src/img/dice/3.svg" class='hidden' alt="">
<img src="src/img/dice/4.svg" class='hidden' alt="">
<img src="src/img/dice/5.svg" class='hidden' alt="">
<img src="src/img/dice/6.svg" class='hidden' alt="">
</div>
<!-- -->
<div class="">
<div class="px-4 md:px-10 py-5 bg-white shadow-md font-bold text-xl`">Ipsume Generator</div>
<div class="mt-2 px-4 md:px-10 py-2 grid grid-cols-1 gap-2 md:gap-4 rounded-lg md:items-center">
<div
class="px-4 md:px-10 flex gap-4 bg-white rounded-lg items-center justify-between border border-slate-900">
<div class="px-2 pt-5 py-4 flex gap-4 overflow-x-auto">
<button onclick="setIpsumeCategory(this)" data-ipsume-category="1"
class=" px-4 py-1 bg-slate-100 rounded-full border border-slate-900 activeCategory">Chocolate</button>
<button onclick="setIpsumeCategory(this)" data-ipsume-category="2"
class=" px-4 py-1 bg-slate-100 rounded-full">Sports</button>
<button onclick="setIpsumeCategory(this)" data-ipsume-category="3"
class=" px-4 py-1 bg-slate-100 rounded-full">Travel</button>
</div>
<button onclick="diceRandom()" class="diceRandom"></button>
</div>
<div
class="px-4 py-4 md:px-10 flex gap-4 bg-white rounded-lg items-center justify-between border border-slate-900">
<div class="mt-2 flex gap-4">
<div class="relative inline-block w-10 mr-2 align-middle select-none">
<input onclick="isEntropyController()" type="checkbox" name="toggle" id="isEmoji"
class="toggle-checkbox absolute block w-6 h-6 rounded-full outline-none bg-white border-4 border-slate-300 appearance-none cursor-pointer" />
<label for="toggle"
class="toggle-label block overflow-hidden w-full h-6 rounded-full outline-none bg-slate-300 cursor-pointer">
</label>
</div>
<div class="flex flex-col mt-1 gap-2">
<input min="1" max="100" step="1" onchange="setEmojiEntropy(this.value)"
oninput="setEmojiEntropy(this.value)" type="range" class="range emojiEntropy"
value="50"></input>
<label for="toggle" class="emojiLable text-xs text-gray-700">Emojis Entropy</label>
</div>
</div>
</div>
<div
class="px-4 py-6 md:px-10 flex gap-4 bg-white rounded-lg items-center justify-between border border-slate-900">
<div class="grid grid-cols-2 md:grid-cols-3 gap-4 md:items-center">
<div class="flex flex-col mt-1 gap-2">
<input min="1" max="20" step="1" onchange="setLineLength(this.value)"
oninput="setLineLength(this.value)" type="range" class="range lineLength" value="5"></input>
<label for="toggle" class="text-xs text-gray-700">Words per Line</label>
</div>
<div class="flex flex-col mt-1 gap-2">
<input min="1" max="20" step="1" onchange="setLineNumber(this.value)"
oninput="setLineNumber(this.value)" type="range" class="range numberOfLine"
value="5"></input>
<label for="toggle" class="text-xs text-gray-700">Number of Line</label>
</div>
<div class="flex flex-col mt-1 gap-2">
<input min="1" max="10" step="1" onchange="setNumberOfParagraph(this.value)"
oninput="setNumberOfParagraph(this.value)" type="range" class="numberOfParagraph"
value="2"></input>
<label for="toggle" class="text-xs text-gray-700">Number of Paragraph</label>
</div>
</div>
</div>
</div>
<div id="main" class="h-fit py-2 w-full px-4 md:px-10 flex flex-col gap-4 ">
<div class="ipsumCanavas bg-white px-6 py-4 rounded-lg border border-slate-900"></div>
<div class="quoteCanavas">
</div>
</div>
</div>
<!-- footer -->
<div class="text-xl"></div>
</body>
<script src="src/js/jquery-3.6.0.min.js"></script>
<script src="data/dictionary.js"></script>
<script src="src/js/generate.js"></script>
<!-- <script src="src/js/test.js"></script> -->
<script src="app.js" defer></script>
</html>