-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
216 lines (211 loc) · 17.2 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
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
<!DOCTYPE html>
<html lang='en'>
<head>
<meta charset='UTF-8'>
<title>Docs | CusMeDroid</title>
<link rel='icon' type='image/x-icon' href='../favicon.ico'>
<link rel='apple-touch-icon' href='../favicon.ico'>
<meta name='theme-color' content='#f4f4f4'/>
<meta name='viewport' content='width=device-width, initial-scale=1'>
<meta name='description' content='Cusmedroid is an android studio application development project name. the name was created by iyortml alias suryo dwijayanto. Initially cusmedroid was a custom rom project on smartphone android, at that time in 2014 - 2015 cusmedroid was still looking for identity, until now - then cusmedroid will be the unique name of me who doesn’t have a team.'>
<meta name='keywords' content='cusmedroid, iyortml, learn php with cusmedroid, learn php with iyortml, cusmedroid android, cusmedroid developer, developer indonesia, made in indonesia, website, php, html, css, js, xml, java, api, apikey, mysqli, phpmyadmin, android studio, android-studio, Suryo DwiJayanto, suryodwijayanto, portfolio, cv, curriculum vitae, profil, biography'/>
<meta name='author' content='CusMeDroid'>
<link rel='stylesheet' type='text/css' href='../css/style.css'>
<link rel='stylesheet' href='https://fonts.googleapis.com/css?family=Audiowide|Sofia|Trirong'>
<link rel='stylesheet' href='../fontawesome-4/css/font-awesome.min.css'>
<script type='text/javascript' src='../js/jquery-3.6.0.min.js'></script>
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src='https://www.googletagmanager.com/gtag/js?id=G-XH5ZCJD408'></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-XH5ZCJD408');
</script>
</head>
<body id='myCopyright'>
<div class='sidebar Trirong'>
<a title='Home' href='../home'>Home</a>
<a title='Docs' class='sdactive' href=''>Docs</a>
<a title='Roadmap' href='../roadmap'>Roadmap</a>
</div>
<button class='collapsible aclp Trirong'><b>Menu</b></button>
<div class='clp-content-mobile Trirong'>
<a title='Home' href='../home'>Home</a>
<a title='Docs' class='sdactive' href=''>Docs</a>
<a title='Roadmap' href='../roadmap'>Roadmap</a>
</div>
<div class='docs-content'>
<div class='padd-16'>
<h1 class='Audiowide animate-left'>Documents</h1>
<p class='Trirong patobo animate-right'>Below is an explanation or description for developers who want to use our style, as well as how it is used.</p>
<!-- HTML Main -->
<h2 class='Audiowide animate-left'>HTML</h2>
<p class='Trirong patobo animate-right'>Html is an interface that can be run in a browser, the main format of 'index.html'.</p>
<b class='Trirong patobo animate-left'>Example :</b>
<pre class='Trirong padd-10 mybasebg animate-right black'>
<span><</span>!DOCTYPE html>
<span><</span>html>
<span><</span>head>
<span><</span>!-- Your title web -->
<span><</span>title>Guide HTML | CusMeDroid<span><</span>title>
<span><</span>/head>
<span><</span>body>
<span><</span>h1>Title<span><</span>/h1>
<span><</span>p>Paragraph<span><</span>/p>
<span><</span>div>Integer Devision<span><</span>/div>
<span><</span>/body>
<span><</span>/html>
</pre>
<h3 class='Audiowide marto animate-left'>Do you need help HTML?</h3>
<p class='Trirong patobo animate-right'>Great! you get it now <a title='Guide HTML by CusMeDroid' class='orange' href='../guide/html'>Here i'am</a>.</p>
<!-- CSS Main -->
<h2 class='Audiowide animate-left'>CSS</h2>
<p class='Trirong patobo animate-right'>Css is a style builder on the display of tags in html, the format used 'style.css',
you can put our style in the head of your index.</p>
<b class='Trirong patobo animate-left'>Example :</b>
<pre class='Trirong padd-10 mybasebg animate-right black'>
<span><</span>head>
<span><</span>link rel='stylesheet' type='text/css' href='https://cusmedroid.github.io/css/style.css'>
<span><</span>/head>
</pre>
<button class='collapsible Trirong'>Text Colors</button>
<div class='clp-content Trirong'>
<p class='padd-8'>By ClassName ex. class='<span class='orange'>orange</span>'</p>
<div class='padd-10'>
<span class='palerto red'>red</span> <span class='palerto pink'>pink</span> <span class='palerto purple'>purple</span> <span class='palerto deep-purple'>deep-purple</span> <span class='palerto indigo'>indigo</span> <span class='palerto blue'>blue</span> <span class='palerto light-blue'>light-blue</span> <span class='palerto cyan'>cyan</span> <span class='palerto teal'>teal</span> <span class='palerto green'>green</span> <span class='palerto light-green'>light-green</span> <span class='palerto lime'>lime</span> <span class='palerto yellow'>yellow</span> <span class='palerto amber'>amber</span> <span class='palerto orange'>orange</span> <span class='palerto deep-orange'>deep-orange</span> <span class='palerto brown'>brown</span> <span class='palerto blue-gray'>blue-gray</span> <span class='palerto gold'>gold</span> <span class='palerto gray'>gray</span> <span class='palerto black-bg white'>white</span> <span class='palerto white-bg black'>black</span> <span class='palerto violet'>violet</span> <span class='palerto magenta'>magenta</span>
</div>
</div>
<br>
<button class='collapsible Trirong'>Background</button>
<div class='clp-content Trirong'>
<p class='padd-8'>By ClassName ex. class='<span class='orange-bg white'>orange-bg</span>'</p>
<div class='padd-10'>
<span class='palerto red-bg white'>red-bg</span> <span class='palerto pink-bg white'>pink-bg</span> <span class='palerto purple-bg white'>purple-bg</span> <span class='palerto deep-purple-bg white'>deep-purple-bg</span> <span class='palerto indigo-bg white'>indigo-bg</span> <span class='palerto blue-bg white'>blue-bg</span> <span class='palerto light-blue-bg white'>light-blue-bg</span> <span class='palerto cyan-bg white'>cyan-bg</span> <span class='palerto teal-bg white'>teal-bg</span> <span class='palerto green-bg white'>green-bg</span> <span class='palerto light-green-bg white'>light-green-bg</span> <span class='palerto lime-bg white'>lime-bg</span> <span class='palerto yellow-bg white'>yellow-bg</span> <span class='palerto amber-bg white'>amber-bg</span> <span class='palerto orange-bg white'>orange-bg</span> <span class='palerto deep-orange-bg white'>deep-orange-bg</span> <span class='palerto brown-bg white'>brown-bg</span> <span class='palerto blue-gray-bg white'>blue-gray-bg</span> <span class='palerto gold-bg white'>gold-bg</span> <span class='palerto gray-bg white'>gray-bg</span> <span class='palerto white-bg black'>white-bg</span> <span class='palerto black-bg white'>black-bg</span> <span class='palerto violet-bg white'>violet-bg</span> <span class='palerto magenta-bg white'>magenta-bg</span> <span class='palerto mybasebg black'>mybasebg</span>
</div>
</div>
<br>
<button class='collapsible Trirong'>BG Image</button>
<div class='clp-content Trirong'>
<p class='padd-8'>By ClassName ex. class='<span class='black'>green-bg-img</span>'</p>
<div class='padd-10'>
<span width='120px' class='palerto green-bg-img black'>green-bg-img</span> <span width='120px' class='palerto orange-bg-img black'>orange-bg-img</span> <span width='120px' class='palerto violet-bg-img black'>violet-bg-img</span> <span width='120px' class='palerto magenta-bg-img black'>magenta-bg-img</span>
</div>
</div>
<br>
<button class='collapsible Trirong'>BG Gradient</button>
<div class='clp-content Trirong'>
<p class='padd-8'>By ClassName ex. class='<span class='green-grad-bg white'>green-grad-bg</span>'</p>
<div class='padd-10'>
<span class='palerto green-grad-bg white'>green-grad-bg</span> <span class='palerto orange-grad-bg white'>orange-grad-bg</span> <span class='palerto violet-grad-bg white'>violet-grad-bg</span> <span class='palerto magenta-grad-bg white'>magenta-grad-bg</span>
</div>
</div>
<br>
<button class='collapsible Trirong'>Button Gradient</button>
<div class='clp-content Trirong'>
<p class='padd-8'>By ClassName ex. class='<span class='green-grad-bg-btn white'>green-grad-bg-btn</span>'</p>
<div class='padd-10'>
<span class='palerto green-grad-bg-btn white'>green-grad-bg-btn</span> <span class='palerto orange-grad-bg-btn white'>orange-grad-bg-btn</span> <span class='palerto violet-grad-bg-btn white'>violet-grad-bg-btn</span> <span class='palerto magenta-grad-bg-btn white'>magenta-grad-bg-btn</span>
</div>
</div>
<br>
<button class='collapsible Trirong'>Padding</button>
<div class='clp-content Trirong'>
<p class='padd-8'>By ClassName ex. class='padd-4'</p>
<div class='padd-10'>
<span class='palerto black'>padd-4</span> <span class='palerto black'>padd-8</span> <span class='palerto black'>padd-10</span> <span class='palerto black'>padd-16</span> <span class='palerto black'>padd-20</span> <span class='palerto black'>padd-26</span>
</div>
</div>
<br>
<button class='collapsible Trirong'>Margin</button>
<div class='clp-content Trirong'>
<p class='padd-8'>By ClassName ex. class='marg-4'</p>
<div class='padd-10'>
<span class='palerto black'>marg-4</span> <span class='palerto black'>marg-8</span> <span class='palerto black'>marg-10</span> <span class='palerto black'>marg-16</span> <span class='palerto black'>marg-20</span> <span class='palerto black'>marg-26</span>
</div>
</div>
<br>
<button class='collapsible Trirong'>Rounded</button>
<div class='clp-content Trirong'>
<p class='padd-8'>By ClassName ex. class='radius-5'</p>
<div class='padd-10'>
<span class='palerto black'>radius-5</span> <span class='palerto black'>radius-10</span> <span class='palerto black'>radius-15</span> <span class='palerto black'>radius-20</span> <span class='palerto black'>radius-25</span> <span class='palerto black'>radius-30</span> <span class='palerto black'>circle</span>
</div>
</div>
<br>
<button class='collapsible Trirong'>Size</button>
<div class='clp-content Trirong'>
<p class='padd-8'>By ClassName ex. class='size-12'</p>
<div class='padd-10'>
<span class='size-12 palerto black'>size-12</span> <span class='size-14 palerto black'>size-14</span> <span class='size-16 palerto black'>size-16</span> <span class='size-18 palerto black'>size-18</span> <span class='size-20 palerto black'>size-20</span> <span class='size-22 palerto black'>size-22</span> <span class='size-24 palerto black'>size-24</span> <span class='size-26 palerto black'>size-26</span> <span class='size-28 palerto black'>size-28</span> <span class='size-30 palerto black'>size-30</span> <span class='size-32 palerto black'>size-32</span> <span class='size-34 palerto black'>size-34</span> <span class='size-36 palerto black'>size-36</span>
</div>
</div>
<h2 class='Audiowide marto animate-left'>Fonts</h2>
<p class='Trirong patobo animate-right'>I'm using fonts from google, and you can paste this in the head.</p>
<b class='Trirong patobo animate-left'>Example :</b>
<pre class='Trirong padd-10 mybasebg animate-right black'>
<span><</span>head>
<span><</span>link rel='stylesheet' type='text/css' href='https://cusmedroid.github.io/css/style.css'>
<span><</span>!-- Include link fonts -->
<span><</span>link rel='stylesheet' href='https://fonts.googleapis.com/css?family=Audiowide|Sofia|Trirong'>
<span><</span>/head>
</pre>
<button class='collapsible Trirong'>Fonts</button>
<div class='clp-content Trirong'>
<p class='padd-8'>By ClassName ex. class='Audiowide'</p>
<div class='padd-10'>
<span class='Audiowide palerto black'>Audiowide</span> <span class='Sofia palerto black'>Sofia</span> <span class='Trirong palerto black'>Trirong</span>
</div>
</div>
<h2 class='Audiowide marto animate-left'>Fontawesome</h2>
<p class='Trirong patobo animate-right'>I'm using icon from <a title='Fontawesome 4' alt='Fontawesome 4' target='_blank' rel='nofollow' class='orange' href='https://fontawesome.com/v4/icons/'>Fontawesome 4</a>, and you can paste this in the head.</p>
<b class='Trirong patobo animate-left'>Example :</b>
<pre class='Trirong padd-10 mybasebg animate-right black'>
<span><</span>head>
<span><</span>link rel='stylesheet' type='text/css' href='https://cusmedroid.github.io/css/style.css'>
<span><</span>!-- Include link fonts -->
<span><</span>link rel='stylesheet' href='https://fonts.googleapis.com/css?family=Audiowide|Sofia|Trirong'>
<span><</span>!-- Include link icon fontawesome -->
<span><</span>link rel='stylesheet' href='https://cusmedroid.github.io/fontawesome-4/css/font-awesome.min.css'>
<span><</span>/head>
</pre>
<button class='collapsible Trirong'>Fontawesome Icon</button>
<div class='clp-content Trirong'>
<p class='padd-8'>By ClassName ex. class='fa fa-cc-discover'</p>
<div class='padd-10'>
<span class='Audiowide palerto black'><i class='fa fa-cc-discover' aria-hidden='true'></i> fa fa-cc-discover</span>
</div>
</div>
<h3 class='Audiowide marto animate-left'>Do you need help CSS?</h3>
<p class='Trirong patobo animate-right'>Great! you get it now <a title='Guide CSS by CusMeDroid' class='orange' href='../guide/css'>Here i'am</a>.</p>
<!-- JS Main -->
<h2 class='Audiowide marto animate-left'>JS</h2>
<p class='Trirong patobo animate-right'>I'm using JS/Javascricpt from <a title='jQuery 3.6.0' alt='jQuery 3.6.0' target='_blank' rel='nofollow' class='orange' href='https://jquery.com'>jQuery 3.6.0</a>, and you can paste this in the head.</p>
<b class='Trirong patobo animate-left'>Example :</b>
<pre class='Trirong padd-10 mybasebg animate-right black'>
<span><</span>head>
<span><</span>link rel='stylesheet' type='text/css' href='https://cusmedroid.github.io/css/style.css'>
<span><</span>!-- Include link fonts -->
<span><</span>link rel='stylesheet' href='https://fonts.googleapis.com/css?family=Audiowide|Sofia|Trirong'>
<span><</span>!-- Include link icon fontawesome -->
<span><</span>link rel='stylesheet' href='https://cusmedroid.github.io/fontawesome-4/css/font-awesome.min.css'>
<span><</span>!-- Include link jQuery 3.6.0 -->
<span><</span>script type='text/javascript' src='https://cusmedroid.github.io/js/jquery-3.6.0.min.js'><span><</span>/script>
<span><</span>/head>
</pre>
<h3 class='Audiowide marto animate-left'>Do you need help JS?</h3>
<p class='Trirong patobo animate-right'>Great! you get it now <a title='Guide JS by CusMeDroid' class='orange' href='../guide/js'>Here i'am</a>.</p>
<div class='home-bottom martobo Trirong size-18' align='right'>
<a title='Home' class='home-btn' href='../home'><span>←</span> Home</a>
<a title='Roadmap' class='home-btn' href='../roadmap'>Roadmap <span>→</span></a>
</div>
</div>
<footer class='orange-bg'>
<h1 class='padd-8 Audiowide animate-left'>Powered by</h1>
<p class='Trirong animate-right'>© <script>document.write(new Date().getFullYear())</script> - <a class='white' alt='CusMeDroid' title='CusMeDroid' href='../'><b>CusMeDroid</b></a></p>
</footer>
</div>
<script type='text/javascript' src='../js/collapse.js'></script>
<script type='text/javascript' src='../js/disclaimer.js'></script>
</body>
</html>