@pmidc/upyog-css 0.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/example/employee.html +16 -0
- package/example/garbage.webp +0 -0
- package/example/index.css +10476 -0
- package/example/index.html +374 -0
- package/example/map.js +72 -0
- package/example/package.json +24 -0
- package/gulpfile.js +55 -0
- package/img/browser-icon.png +0 -0
- package/img/m_seva_white_logo.png +0 -0
- package/img/mseva-demo.png +0 -0
- package/package.json +53 -0
- package/postcss.config.js +55 -0
- package/src/components/CardBasedOptions.scss +110 -0
- package/src/components/CitizenHomeCard.scss +58 -0
- package/src/components/EllipsisMenu.scss +17 -0
- package/src/components/EventCalendarView.scss +10 -0
- package/src/components/FAQ.scss +64 -0
- package/src/components/OnGroundEventCard.scss +72 -0
- package/src/components/PageBasedInput.scss +31 -0
- package/src/components/PopupHeadingLabel.scss +15 -0
- package/src/components/PropertySearchForm.scss +58 -0
- package/src/components/SearchForm.scss +56 -0
- package/src/components/SearchOnRadioButton.scss +10 -0
- package/src/components/StandaloneSearchBar.scss +10 -0
- package/src/components/TimeLine.scss +68 -0
- package/src/components/WhatsNewCard.scss +13 -0
- package/src/components/actionLink.scss +3 -0
- package/src/components/actionbar.scss +97 -0
- package/src/components/bannercomponents.scss +137 -0
- package/src/components/body.scss +147 -0
- package/src/components/buttons.scss +50 -0
- package/src/components/card.scss +411 -0
- package/src/components/cardHeaderWithOptions.scss +14 -0
- package/src/components/changeLanguage.scss +3 -0
- package/src/components/charts.scss +186 -0
- package/src/components/checkbox.scss +83 -0
- package/src/components/checkpoint.scss +65 -0
- package/src/components/citizenInfoLabel.scss +14 -0
- package/src/components/custombtn.scss +16 -0
- package/src/components/datatable.scss +76 -0
- package/src/components/datewrap.scss +21 -0
- package/src/components/detailscard.scss +6 -0
- package/src/components/detailscontainer.scss +13 -0
- package/src/components/filters.scss +98 -0
- package/src/components/grey.scss +3 -0
- package/src/components/hoc/InboxComposer.scss +115 -0
- package/src/components/hoc/index.scss +1 -0
- package/src/components/howItWorks.scss +71 -0
- package/src/components/imageviewer.scss +33 -0
- package/src/components/info-banner.scss +35 -0
- package/src/components/inputotp.scss +15 -0
- package/src/components/keynote.scss +27 -0
- package/src/components/languageSelector.scss +24 -0
- package/src/components/loader.scss +96 -0
- package/src/components/map.scss +30 -0
- package/src/components/menu.scss +0 -0
- package/src/components/metricsTable.scss +27 -0
- package/src/components/multiLink.scss +88 -0
- package/src/components/multiSelectDropdown.scss +73 -0
- package/src/components/navbar.scss +308 -0
- package/src/components/plusMinus.scss +15 -0
- package/src/components/popup.scss +16 -0
- package/src/components/radiobtn.scss +45 -0
- package/src/components/ratingstar.scss +33 -0
- package/src/components/roundedLabel.scss +10 -0
- package/src/components/searchAction.scss +20 -0
- package/src/components/sectionalDropdown.scss +43 -0
- package/src/components/selectdropdown.scss +201 -0
- package/src/components/staticDynamicMessages.scss +107 -0
- package/src/components/staticSideBar.scss +27 -0
- package/src/components/statushighlight.scss +17 -0
- package/src/components/submiterrors.scss +11 -0
- package/src/components/summary.scss +29 -0
- package/src/components/table.scss +178 -0
- package/src/components/tag.scss +27 -0
- package/src/components/telephone.scss +17 -0
- package/src/components/textfields.scss +111 -0
- package/src/components/toast.scss +31 -0
- package/src/components/toggleSwitch.scss +41 -0
- package/src/components/topbar.scss +148 -0
- package/src/components/uploadcomponents.scss +113 -0
- package/src/index.scss +780 -0
- package/src/pages/citizen/CitizenEngagementNotificationWrapper.scss +8 -0
- package/src/pages/citizen/DocumentList.scss +305 -0
- package/src/pages/citizen/Events.scss +47 -0
- package/src/pages/citizen/HomePageWrapper.scss +163 -0
- package/src/pages/citizen/SurveyList.scss +22 -0
- package/src/pages/citizen/citizenDocument.scss +22 -0
- package/src/pages/citizen/container.scss +19 -0
- package/src/pages/citizen/payment/payment-type.scss +3 -0
- package/src/pages/citizen/updatePropertyNumber.scss +46 -0
- package/src/pages/employee/EmployeeLogin.scss +7 -0
- package/src/pages/employee/cardfix.scss +14 -0
- package/src/pages/employee/container.scss +73 -0
- package/src/pages/employee/dss.scss +249 -0
- package/src/pages/employee/faq.scss +353 -0
- package/src/pages/employee/form-fields.scss +13 -0
- package/src/pages/employee/iframe.scss +66 -0
- package/src/pages/employee/inbox.scss +707 -0
- package/src/pages/employee/index.scss +632 -0
- package/src/pages/employee/landing.scss +177 -0
- package/src/pages/employee/login.scss +570 -0
- package/src/pages/employee/oldMobileInbox.scss +5 -0
- package/src/pages/employee/popupmodule.scss +47 -0
- package/src/pages/employee/response.scss +3 -0
- package/src/pages/employee/scroll-table.scss +114 -0
- package/src/pages/employee/surveys.scss +272 -0
- package/src/pages/employee/tooltip.scss +36 -0
- package/src/pages/employee/updateNumber.scss +13 -0
- package/svg/arrowdown.svg +1 -0
- package/svg/arrowleft.svg +1 -0
- package/svg/calendar.svg +1 -0
- package/svg/camera.svg +4 -0
- package/svg/check.svg +4 -0
- package/svg/close.svg +4 -0
- package/svg/error.svg +4 -0
- package/svg/error2.svg +5 -0
- package/svg/searchicon.svg +4 -0
- package/svg/starempty.svg +4 -0
- package/svg/starfilled.svg +5 -0
- package/svg/success.svg +4 -0
- package/tailwind.config.js +105 -0
|
@@ -0,0 +1,374 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="en">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="utf-8" />
|
|
5
|
+
<title>@egovernments/digit-ui.css</title>
|
|
6
|
+
<!-- map script -->
|
|
7
|
+
<script src="./map.js"></script>
|
|
8
|
+
<!-- all files at https://cdn.jsdelivr.net/npm/@egovernments/digit-ui-css/ -->
|
|
9
|
+
<!-- css prod path https://cdn.jsdelivr.net/npm/@egovernments/digit-ui.css/dist/index.min.css -->
|
|
10
|
+
<link href="index.css" rel="stylesheet" />
|
|
11
|
+
</head>
|
|
12
|
+
|
|
13
|
+
<body class="body-container">
|
|
14
|
+
<div class="navbar">
|
|
15
|
+
<img src="./img/msevalogo.png" />
|
|
16
|
+
<!-- Logo png used may switch to html -->
|
|
17
|
+
<!-- <header class="navbar-header">mSeva</header>
|
|
18
|
+
<label class="navbar-subheader">Demo</label> -->
|
|
19
|
+
</div>
|
|
20
|
+
<div class="app-container">
|
|
21
|
+
<header class="h1">Quick Pay</header>
|
|
22
|
+
|
|
23
|
+
<label class="link-label">Property Tax</label>
|
|
24
|
+
|
|
25
|
+
<!-- <div class="back-btn">
|
|
26
|
+
<label>◄</label>
|
|
27
|
+
<p>Back</p>
|
|
28
|
+
</div> -->
|
|
29
|
+
|
|
30
|
+
<div class="back-btn2">
|
|
31
|
+
<!-- <img src="../svg/arrowleft.svg"/> -->
|
|
32
|
+
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="black" width="19px">
|
|
33
|
+
<path d="M24 0v24H0V0h24z" fill="none" opacity=".87" />
|
|
34
|
+
<path d="M14 7l-5 5 5 5V7z" />
|
|
35
|
+
</svg>
|
|
36
|
+
<p>Back</p>
|
|
37
|
+
</div>
|
|
38
|
+
|
|
39
|
+
<!-- card container -->
|
|
40
|
+
<div class="card">
|
|
41
|
+
<label class="card-caption">Garbage</label>
|
|
42
|
+
<header class="card-header">Choose Complaint Type</header>
|
|
43
|
+
<p class="card-text">
|
|
44
|
+
Select option related to your complaint from the list given below. If the complaint type you are looking for is not listed select others
|
|
45
|
+
</p>
|
|
46
|
+
|
|
47
|
+
<!-- radio select option -->
|
|
48
|
+
<h2 class="card-label">Moholla *</h2>
|
|
49
|
+
<div class="radio-wrap">
|
|
50
|
+
<div>
|
|
51
|
+
<span class="radio-btn-wrap">
|
|
52
|
+
<input class="radio-btn" type="radio" value="streetlights" />
|
|
53
|
+
<span class="radio-btn-checkmark"></span>
|
|
54
|
+
</span>
|
|
55
|
+
<label>Streetlights</label>
|
|
56
|
+
</div>
|
|
57
|
+
<div>
|
|
58
|
+
<span class="radio-btn-wrap">
|
|
59
|
+
<input class="radio-btn" type="radio" value="streetlights" />
|
|
60
|
+
<span class="radio-btn-checkmark"></span>
|
|
61
|
+
</span>
|
|
62
|
+
<label>Streetlights</label>
|
|
63
|
+
</div>
|
|
64
|
+
</div>
|
|
65
|
+
|
|
66
|
+
<h2 class="card-label">City *</h2>
|
|
67
|
+
<h2 class="card-label-error">Enter City</h2>
|
|
68
|
+
<!-- dropdown select option -->
|
|
69
|
+
<div class="select-wrap">
|
|
70
|
+
<div class="select">
|
|
71
|
+
<!-- <p>Banglore</p> -->
|
|
72
|
+
<input type="text" value="Banglore" />
|
|
73
|
+
<!-- <img src="../svg/arrowdown.svg"/> -->
|
|
74
|
+
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="black" width="18px" height="18px">
|
|
75
|
+
<path d="M0 0h24v24H0V0z" fill="none" />
|
|
76
|
+
<path d="M7 10l5 5 5-5H7z" />
|
|
77
|
+
</svg>
|
|
78
|
+
</div>
|
|
79
|
+
<div class="options-card">
|
|
80
|
+
<p>Ahmedabad</p>
|
|
81
|
+
<p>Banglore</p>
|
|
82
|
+
<p>Amritsar</p>
|
|
83
|
+
<p>New Delhi</p>
|
|
84
|
+
</div>
|
|
85
|
+
</div>
|
|
86
|
+
|
|
87
|
+
<!-- <select class="select">
|
|
88
|
+
<option>Ahmedabad</option>
|
|
89
|
+
<option>Banglore</option>
|
|
90
|
+
<option>Amritsar</option>
|
|
91
|
+
<option>New Delhi</option>
|
|
92
|
+
</select> -->
|
|
93
|
+
|
|
94
|
+
<!-- text input fields and areas -->
|
|
95
|
+
<input type="text" class="card-input" />
|
|
96
|
+
<input type="text" class="card-input-error" />
|
|
97
|
+
<textarea class="card-textarea"></textarea>
|
|
98
|
+
|
|
99
|
+
<!-- upload components -->
|
|
100
|
+
<div class="upload-wrap">
|
|
101
|
+
<!-- <img src="../svg/camera.svg"> -->
|
|
102
|
+
<svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" viewBox="0 0 24 24" fill="black" width="46px" height="42px">
|
|
103
|
+
<rect fill="none" height="24" width="24" />
|
|
104
|
+
<path
|
|
105
|
+
d="M3,4V1h2v3h3v2H5v3H3V6H0V4H3z M6,10V7h3V4h7l1.83,2H21c1.1,0,2,0.9,2,2v12c0,1.1-0.9,2-2,2H5c-1.1,0-2-0.9-2-2V10H6z M13,19c2.76,0,5-2.24,5-5s-2.24-5-5-5s-5,2.24-5,5S10.24,19,13,19z M9.8,14c0,1.77,1.43,3.2,3.2,3.2s3.2-1.43,3.2-3.2 s-1.43-3.2-3.2-3.2S9.8,12.23,9.8,14z"
|
|
106
|
+
/>
|
|
107
|
+
</svg>
|
|
108
|
+
</div>
|
|
109
|
+
|
|
110
|
+
<!-- multi image upload -->
|
|
111
|
+
<div class="multi-upload-wrap">
|
|
112
|
+
<div>
|
|
113
|
+
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="white" width="18px" height="18px" class="delete">
|
|
114
|
+
<path d="M0 0h24v24H0V0z" fill="#d4351c" />
|
|
115
|
+
<path
|
|
116
|
+
d="M18.3 5.71c-.39-.39-1.02-.39-1.41 0L12 10.59 7.11 5.7c-.39-.39-1.02-.39-1.41 0-.39.39-.39 1.02 0 1.41L10.59 12 5.7 16.89c-.39.39-.39 1.02 0 1.41.39.39 1.02.39 1.41 0L12 13.41l4.89 4.89c.39.39 1.02.39 1.41 0 .39-.39.39-1.02 0-1.41L13.41 12l4.89-4.89c.38-.38.38-1.02 0-1.4z"
|
|
117
|
+
/>
|
|
118
|
+
</svg>
|
|
119
|
+
<!-- <img src="./svg/close.svg" class="delete"/> -->
|
|
120
|
+
<img src="./garbage.webp" />
|
|
121
|
+
</div>
|
|
122
|
+
<div>
|
|
123
|
+
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="white" width="18px" height="18px" class="delete">
|
|
124
|
+
<path d="M0 0h24v24H0V0z" fill="#d4351c" />
|
|
125
|
+
<path
|
|
126
|
+
d="M18.3 5.71c-.39-.39-1.02-.39-1.41 0L12 10.59 7.11 5.7c-.39-.39-1.02-.39-1.41 0-.39.39-.39 1.02 0 1.41L10.59 12 5.7 16.89c-.39.39-.39 1.02 0 1.41.39.39 1.02.39 1.41 0L12 13.41l4.89 4.89c.39.39 1.02.39 1.41 0 .39-.39.39-1.02 0-1.41L13.41 12l4.89-4.89c.38-.38.38-1.02 0-1.4z"
|
|
127
|
+
/>
|
|
128
|
+
</svg>
|
|
129
|
+
|
|
130
|
+
<!-- <img src="./svg/close.svg" class="delete"/> -->
|
|
131
|
+
<img src="./garbage.webp" />
|
|
132
|
+
</div>
|
|
133
|
+
<div class="upload-img-container">
|
|
134
|
+
<!-- <img src="../svg/camera.svg" class="upload-camera-img"/> -->
|
|
135
|
+
<svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" viewBox="0 0 24 24" fill="black" width="46px" height="42px">
|
|
136
|
+
<rect fill="none" height="24" width="24" />
|
|
137
|
+
<path
|
|
138
|
+
d="M3,4V1h2v3h3v2H5v3H3V6H0V4H3z M6,10V7h3V4h7l1.83,2H21c1.1,0,2,0.9,2,2v12c0,1.1-0.9,2-2,2H5c-1.1,0-2-0.9-2-2V10H6z M13,19c2.76,0,5-2.24,5-5s-2.24-5-5-5s-5,2.24-5,5S10.24,19,13,19z M9.8,14c0,1.77,1.43,3.2,3.2,3.2s3.2-1.43,3.2-3.2 s-1.43-3.2-3.2-3.2S9.8,12.23,9.8,14z"
|
|
139
|
+
/>
|
|
140
|
+
</svg>
|
|
141
|
+
</div>
|
|
142
|
+
</div>
|
|
143
|
+
|
|
144
|
+
<!-- successfull submittion card -->
|
|
145
|
+
<div class="success-wrap">
|
|
146
|
+
<header>Complaint Submitted</header>
|
|
147
|
+
<div>
|
|
148
|
+
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="#00703C">
|
|
149
|
+
<path d="M0 0h24v24H0V0z" fill="none" />
|
|
150
|
+
<path
|
|
151
|
+
d="M1 21h4V9H1v12zm22-11c0-1.1-.9-2-2-2h-6.31l.95-4.57.03-.32c0-.41-.17-.79-.44-1.06L14.17 1 7.59 7.59C7.22 7.95 7 8.45 7 9v10c0 1.1.9 2 2 2h9c.83 0 1.54-.5 1.84-1.22l3.02-7.05c.09-.23.14-.47.14-.73v-2z"
|
|
152
|
+
/>
|
|
153
|
+
</svg>
|
|
154
|
+
<!-- <img src="./svg/success.svg"/> -->
|
|
155
|
+
<h2>Complaint No.</h2>
|
|
156
|
+
<p>02/09/2020/051705</p>
|
|
157
|
+
</div>
|
|
158
|
+
</div>
|
|
159
|
+
|
|
160
|
+
<!-- complaint error card -->
|
|
161
|
+
<div class="error-wrap">
|
|
162
|
+
<header>Complaint Not Submitted</header>
|
|
163
|
+
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="#d4351c">
|
|
164
|
+
<path d="M0 0h24v24H0V0z" fill="none" />
|
|
165
|
+
<circle cx="12" cy="19" r="2" />
|
|
166
|
+
<path d="M10 3h4v12h-4z" />
|
|
167
|
+
</svg>
|
|
168
|
+
<!-- <img src="./svg/error2.svg" alt=""> -->
|
|
169
|
+
</div>
|
|
170
|
+
|
|
171
|
+
<!-- submit / next button bar -->
|
|
172
|
+
<div class="submit-bar">
|
|
173
|
+
<header class="submit-header">Next</header>
|
|
174
|
+
</div>
|
|
175
|
+
|
|
176
|
+
<span class="card-link"> Skip and Continue</span>
|
|
177
|
+
</div>
|
|
178
|
+
|
|
179
|
+
<!-- my complaint section -->
|
|
180
|
+
<div class="card">
|
|
181
|
+
<h2 class="card-sub-header">Burning of Garbage</h2>
|
|
182
|
+
<div class="date-wrap">
|
|
183
|
+
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="black" width="18px" height="18px">
|
|
184
|
+
<path d="M0 0h24v24H0z" fill="none" />
|
|
185
|
+
<path d="M20 3h-1V1h-2v2H7V1H5v2H4c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 18H4V8h16v13z" />
|
|
186
|
+
</svg>
|
|
187
|
+
<!-- <img src="../svg/calendar.svg"> -->
|
|
188
|
+
<p>2-Aug-2020</p>
|
|
189
|
+
</div>
|
|
190
|
+
|
|
191
|
+
<div class="key-note-pair">
|
|
192
|
+
<h3>Complaint No.</h3>
|
|
193
|
+
<p>02/09/2020/051705</p>
|
|
194
|
+
</div>
|
|
195
|
+
|
|
196
|
+
<div class="status-highlight">
|
|
197
|
+
<p>Open</p>
|
|
198
|
+
</div>
|
|
199
|
+
|
|
200
|
+
<p class="card-text-primary">Complaint Pending for Assignment</p>
|
|
201
|
+
</div>
|
|
202
|
+
|
|
203
|
+
<!-- complaint summary -->
|
|
204
|
+
<div class="card">
|
|
205
|
+
<h2 class="card-sub-header">Burning of Garbage</h2>
|
|
206
|
+
<div class="data-table">
|
|
207
|
+
<div>
|
|
208
|
+
<h2>Complaint No.</h2>
|
|
209
|
+
<p>02/09/2020/051705</p>
|
|
210
|
+
</div>
|
|
211
|
+
<div>
|
|
212
|
+
<h2>Complaint Status</h2>
|
|
213
|
+
<p>Filed</p>
|
|
214
|
+
</div>
|
|
215
|
+
<div>
|
|
216
|
+
<h2>Filed Date</h2>
|
|
217
|
+
<p>1-Aug-2020</p>
|
|
218
|
+
</div>
|
|
219
|
+
<div class="row-last">
|
|
220
|
+
<h2>Address</h2>
|
|
221
|
+
<p>Back side Post Office Patiala Road Ajit Nagar Amritsar</p>
|
|
222
|
+
</div>
|
|
223
|
+
</div>
|
|
224
|
+
<div class="photos-wrap">
|
|
225
|
+
<img src="./garbage.webp" />
|
|
226
|
+
<img src="./garbage.webp" />
|
|
227
|
+
<img src="./garbage.webp" class="last" />
|
|
228
|
+
</div>
|
|
229
|
+
</div>
|
|
230
|
+
|
|
231
|
+
<!-- complaint timeline -->
|
|
232
|
+
<div class="card">
|
|
233
|
+
<h2 class="card-sub-header">Complaint Timeline</h2>
|
|
234
|
+
<div class="checkpoint-done">
|
|
235
|
+
<h2></h2>
|
|
236
|
+
<header>Pending for Assignment</header>
|
|
237
|
+
</div>
|
|
238
|
+
|
|
239
|
+
<!-- line connecting dots -->
|
|
240
|
+
<div class="checkpoint-connect"></div>
|
|
241
|
+
|
|
242
|
+
<div class="checkpoint">
|
|
243
|
+
<h2></h2>
|
|
244
|
+
<header>
|
|
245
|
+
Complaint Filed
|
|
246
|
+
<p>12/08/2020</p>
|
|
247
|
+
</header>
|
|
248
|
+
</div>
|
|
249
|
+
</div>
|
|
250
|
+
|
|
251
|
+
<!-- checkbox -->
|
|
252
|
+
<div class="card">
|
|
253
|
+
<p class="card-label">How would you rate your experience with us?</p>
|
|
254
|
+
<div class="rating-star-wrap">
|
|
255
|
+
<!-- <img src="./svg/starfilled.svg" alt="">
|
|
256
|
+
<img src="./svg/starfilled.svg" alt="">
|
|
257
|
+
<img src="./svg/starfilled.svg" alt="">
|
|
258
|
+
<img src="./svg/starfilled.svg" alt=""> -->
|
|
259
|
+
<svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" viewBox="0 0 24 24" fill="#a82227" width="48px" height="48px">
|
|
260
|
+
<g>
|
|
261
|
+
<path d="M0,0h24v24H0V0z" fill="none" />
|
|
262
|
+
<path d="M0,0h24v24H0V0z" fill="none" />
|
|
263
|
+
</g>
|
|
264
|
+
<g>
|
|
265
|
+
<path d="M12,17.27L18.18,21l-1.64-7.03L22,9.24l-7.19-0.61L12,2L9.19,8.63L2,9.24l5.46,4.73L5.82,21L12,17.27z" />
|
|
266
|
+
</g>
|
|
267
|
+
</svg>
|
|
268
|
+
<svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" viewBox="0 0 24 24" fill="#a82227" width="48px" height="48px">
|
|
269
|
+
<g>
|
|
270
|
+
<path d="M0,0h24v24H0V0z" fill="none" />
|
|
271
|
+
<path d="M0,0h24v24H0V0z" fill="none" />
|
|
272
|
+
</g>
|
|
273
|
+
<g>
|
|
274
|
+
<path d="M12,17.27L18.18,21l-1.64-7.03L22,9.24l-7.19-0.61L12,2L9.19,8.63L2,9.24l5.46,4.73L5.82,21L12,17.27z" />
|
|
275
|
+
</g>
|
|
276
|
+
</svg>
|
|
277
|
+
<svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" viewBox="0 0 24 24" fill="#a82227" width="48px" height="48px">
|
|
278
|
+
<g>
|
|
279
|
+
<path d="M0,0h24v24H0V0z" fill="none" />
|
|
280
|
+
<path d="M0,0h24v24H0V0z" fill="none" />
|
|
281
|
+
</g>
|
|
282
|
+
<g>
|
|
283
|
+
<path d="M12,17.27L18.18,21l-1.64-7.03L22,9.24l-7.19-0.61L12,2L9.19,8.63L2,9.24l5.46,4.73L5.82,21L12,17.27z" />
|
|
284
|
+
</g>
|
|
285
|
+
</svg>
|
|
286
|
+
<svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" viewBox="0 0 24 24" fill="#a82227" width="48px" height="48px">
|
|
287
|
+
<g>
|
|
288
|
+
<path d="M0,0h24v24H0V0z" fill="none" />
|
|
289
|
+
<path d="M0,0h24v24H0V0z" fill="none" />
|
|
290
|
+
</g>
|
|
291
|
+
<g>
|
|
292
|
+
<path d="M12,17.27L18.18,21l-1.64-7.03L22,9.24l-7.19-0.61L12,2L9.19,8.63L2,9.24l5.46,4.73L5.82,21L12,17.27z" />
|
|
293
|
+
</g>
|
|
294
|
+
</svg>
|
|
295
|
+
<!-- <img src="./svg/starempty.svg" alt=""> -->
|
|
296
|
+
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="#a82227" width="48px" height="48px">
|
|
297
|
+
<path d="M0 0h24v24H0V0z" fill="none" />
|
|
298
|
+
<path
|
|
299
|
+
d="M22 9.24l-7.19-.62L12 2 9.19 8.63 2 9.24l5.46 4.73L5.82 21 12 17.27 18.18 21l-1.63-7.03L22 9.24zM12 15.4l-3.76 2.27 1-4.28-3.32-2.88 4.38-.38L12 6.1l1.71 4.04 4.38.38-3.32 2.88 1 4.28L12 15.4z"
|
|
300
|
+
/>
|
|
301
|
+
</svg>
|
|
302
|
+
</div>
|
|
303
|
+
<p class="card-label">What was Good?</p>
|
|
304
|
+
<div class="checkbox-wrap">
|
|
305
|
+
<input type="checkbox" />
|
|
306
|
+
<p class="custom-checkbox">
|
|
307
|
+
<!-- <img src="./svg/check.svg" alt=""> -->
|
|
308
|
+
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="#a82227">
|
|
309
|
+
<path d="M0 0h24v24H0z" fill="none" />
|
|
310
|
+
<path d="M9 16.2L4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4L9 16.2z" />
|
|
311
|
+
</svg>
|
|
312
|
+
</p>
|
|
313
|
+
<p class="label">Service</p>
|
|
314
|
+
</div>
|
|
315
|
+
</div>
|
|
316
|
+
|
|
317
|
+
<!-- otp verification -->
|
|
318
|
+
<div class="card">
|
|
319
|
+
<header class="card-header">OTP Verification</header>
|
|
320
|
+
<p class="card-text">Enter the OTP sent to <span>+91 - 9876453444</span></p>
|
|
321
|
+
<div class="input-otp-wrap">
|
|
322
|
+
<input type="number" max="1" />
|
|
323
|
+
<input type="number" max="1" />
|
|
324
|
+
<input type="number" max="1" />
|
|
325
|
+
<input type="number" max="1" />
|
|
326
|
+
</div>
|
|
327
|
+
<p class="card-text">Request another OTP in <span>25</span> seconds</p>
|
|
328
|
+
<p class="card-text-button">RESEND</p>
|
|
329
|
+
</div>
|
|
330
|
+
|
|
331
|
+
<!-- warnings -->
|
|
332
|
+
<div class="card">
|
|
333
|
+
<div class="error-message-wrap">
|
|
334
|
+
<h2>There is a problem</h2>
|
|
335
|
+
<p>Max 3 complaint photos allowed</p>
|
|
336
|
+
</div>
|
|
337
|
+
|
|
338
|
+
<p class="card-text">
|
|
339
|
+
Click on the icon below to upload the complaint photos as evidence. You can capture photos directly through your camera or upload from your
|
|
340
|
+
Gallery. If you do not have complaint photo, you can skip the continue for next step.
|
|
341
|
+
</p>
|
|
342
|
+
</div>
|
|
343
|
+
<!-- <div class="image-viewer-wrap">
|
|
344
|
+
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="white" width="18px" height="18px">
|
|
345
|
+
<path d="M0 0h24v24H0V0z" fill="none" />
|
|
346
|
+
<path
|
|
347
|
+
d="M18.3 5.71c-.39-.39-1.02-.39-1.41 0L12 10.59 7.11 5.7c-.39-.39-1.02-.39-1.41 0-.39.39-.39 1.02 0 1.41L10.59 12 5.7 16.89c-.39.39-.39 1.02 0 1.41.39.39 1.02.39 1.41 0L12 13.41l4.89 4.89c.39.39 1.02.39 1.41 0 .39-.39.39-1.02 0-1.41L13.41 12l4.89-4.89c.38-.38.38-1.02 0-1.4z" />
|
|
348
|
+
</svg>
|
|
349
|
+
<img src="./garbage.webp" />
|
|
350
|
+
</div> -->
|
|
351
|
+
|
|
352
|
+
<!-- map -->
|
|
353
|
+
<div class="card">
|
|
354
|
+
<header class="card-header">Pin Complaint Location</header>
|
|
355
|
+
<p class="card-text">
|
|
356
|
+
Click and hold to drop the pin to complaint location. If you are not able to pin the location you can skip the continue for next step.
|
|
357
|
+
</p>
|
|
358
|
+
<div class="map-wrap">
|
|
359
|
+
<div class="map-search-bar-wrap">
|
|
360
|
+
<!-- <img src="./svg/searchicon.svg" class="map-search-bar-icon" alt=""> -->
|
|
361
|
+
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="#505A5F" width="48px" height="48px" class="map-search-bar-icon">
|
|
362
|
+
<path d="M0 0h24v24H0z" fill="none" />
|
|
363
|
+
<path
|
|
364
|
+
d="M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"
|
|
365
|
+
/>
|
|
366
|
+
</svg>
|
|
367
|
+
<input id="pac-input" class="map-search-bar" type="text" placeholder="Search Address" />
|
|
368
|
+
</div>
|
|
369
|
+
<div id="map" class="map"></div>
|
|
370
|
+
</div>
|
|
371
|
+
</div>
|
|
372
|
+
</div>
|
|
373
|
+
</body>
|
|
374
|
+
</html>
|
package/example/map.js
ADDED
|
@@ -0,0 +1,72 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
let map;
|
|
3
|
+
var script = document.createElement("script");
|
|
4
|
+
const key = globalConfigs?.getConfig("GMAPS_API_KEY");
|
|
5
|
+
script.src = `https://maps.googleapis.com/maps/api/js?key=${key}&callback=initAutocomplete&libraries=places`;
|
|
6
|
+
script.defer = true;
|
|
7
|
+
window.initAutocomplete = function () {
|
|
8
|
+
const map = new google.maps.Map(document.getElementById("map"), {
|
|
9
|
+
center: {
|
|
10
|
+
lat: 28.5355,
|
|
11
|
+
lng: 77.391,
|
|
12
|
+
},
|
|
13
|
+
zoom: 15,
|
|
14
|
+
mapTypeId: "roadmap",
|
|
15
|
+
}); // Create the search box and link it to the UI element.
|
|
16
|
+
|
|
17
|
+
const input = document.getElementById("pac-input");
|
|
18
|
+
const searchBox = new google.maps.places.SearchBox(input);
|
|
19
|
+
// map.controls[google.maps.ControlPosition.TOP_LEFT].push(input); // Bias the SearchBox results towards current map's viewport.
|
|
20
|
+
|
|
21
|
+
map.addListener("bounds_changed", () => {
|
|
22
|
+
searchBox.setBounds(map.getBounds());
|
|
23
|
+
});
|
|
24
|
+
let markers = []; // Listen for the event fired when the user selects a prediction and retrieve
|
|
25
|
+
// more details for that place.
|
|
26
|
+
|
|
27
|
+
searchBox.addListener("places_changed", () => {
|
|
28
|
+
const places = searchBox.getPlaces();
|
|
29
|
+
|
|
30
|
+
if (places.length == 0) {
|
|
31
|
+
return;
|
|
32
|
+
} // Clear out the old markers.
|
|
33
|
+
|
|
34
|
+
markers.forEach((marker) => {
|
|
35
|
+
marker.setMap(null);
|
|
36
|
+
});
|
|
37
|
+
markers = []; // For each place, get the icon, name and location.
|
|
38
|
+
|
|
39
|
+
const bounds = new google.maps.LatLngBounds();
|
|
40
|
+
places.forEach((place) => {
|
|
41
|
+
if (!place.geometry) {
|
|
42
|
+
return;
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
const icon = {
|
|
46
|
+
url: place.icon,
|
|
47
|
+
size: new google.maps.Size(71, 71),
|
|
48
|
+
origin: new google.maps.Point(0, 0),
|
|
49
|
+
anchor: new google.maps.Point(17, 34),
|
|
50
|
+
scaledSize: new google.maps.Size(25, 25),
|
|
51
|
+
}; // Create a marker for each place.
|
|
52
|
+
|
|
53
|
+
markers.push(
|
|
54
|
+
new google.maps.Marker({
|
|
55
|
+
map,
|
|
56
|
+
icon,
|
|
57
|
+
title: place.name,
|
|
58
|
+
position: place.geometry.location,
|
|
59
|
+
})
|
|
60
|
+
);
|
|
61
|
+
|
|
62
|
+
if (place.geometry.viewport) {
|
|
63
|
+
// Only geocodes have viewport.
|
|
64
|
+
bounds.union(place.geometry.viewport);
|
|
65
|
+
} else {
|
|
66
|
+
bounds.extend(place.geometry.location);
|
|
67
|
+
}
|
|
68
|
+
});
|
|
69
|
+
map.fitBounds(bounds);
|
|
70
|
+
});
|
|
71
|
+
};
|
|
72
|
+
document.head.appendChild(script);
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@egovernments/digit-ui.css-example",
|
|
3
|
+
"homepage": ".",
|
|
4
|
+
"version": "0.0.0",
|
|
5
|
+
"private": true,
|
|
6
|
+
"scripts": {
|
|
7
|
+
"start": "hs ./"
|
|
8
|
+
},
|
|
9
|
+
"dependencies": {
|
|
10
|
+
"@egovernments/digit-ui.css": "link:.."
|
|
11
|
+
},
|
|
12
|
+
"devDependencies": {
|
|
13
|
+
"http-server": "^0.12.3"
|
|
14
|
+
},
|
|
15
|
+
"eslintConfig": {
|
|
16
|
+
"extends": "react-app"
|
|
17
|
+
},
|
|
18
|
+
"browserslist": [
|
|
19
|
+
">0.2%",
|
|
20
|
+
"not dead",
|
|
21
|
+
"not ie <= 11",
|
|
22
|
+
"not op_mini all"
|
|
23
|
+
]
|
|
24
|
+
}
|
package/gulpfile.js
ADDED
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
const { series, src, dest, watch, task } = require("gulp");
|
|
2
|
+
const clean = require("gulp-clean");
|
|
3
|
+
const postcss = require("gulp-postcss");
|
|
4
|
+
const sass = require("gulp-sass");
|
|
5
|
+
const postcssPresetEnv = require("postcss-preset-env");
|
|
6
|
+
const cleanCSS = require("gulp-clean-css");
|
|
7
|
+
const rename = require("gulp-rename");
|
|
8
|
+
const livereload = require("gulp-livereload");
|
|
9
|
+
|
|
10
|
+
let output = "./example";
|
|
11
|
+
if (process.env.NODE_ENV === "production") {
|
|
12
|
+
output = "./dist";
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
function cleanStyles() {
|
|
16
|
+
return src(`${output}/*.css`, { read: false }).pipe(clean());
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
function styles() {
|
|
20
|
+
const plugins = [
|
|
21
|
+
require("postcss-import"),
|
|
22
|
+
require("tailwindcss"),
|
|
23
|
+
postcssPresetEnv({ stage: 2, autoprefixer: { cascade: false }, features: { "custom-properties": true } }),
|
|
24
|
+
require("autoprefixer"),
|
|
25
|
+
require("cssnano"),
|
|
26
|
+
];
|
|
27
|
+
return src("src/index.scss").pipe(postcss(plugins)).pipe(sass()).pipe(dest(output));
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
function minify() {
|
|
31
|
+
return src(`${output}/index.css`).pipe(cleanCSS()).pipe(rename(`index.min.css`)).pipe(dest(output));
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
function stylesLive() {
|
|
35
|
+
styles().pipe(livereload({ start: true }));
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
function livereloadStyles() {
|
|
39
|
+
livereload.listen();
|
|
40
|
+
watch("src/**/*.scss", series(stylesLive));
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
exports.styles = styles;
|
|
44
|
+
exports.default = series(styles);
|
|
45
|
+
exports.watch = livereloadStyles;
|
|
46
|
+
if (process.env.NODE_ENV === "production") {
|
|
47
|
+
exports.build = series(cleanStyles, styles, minify);
|
|
48
|
+
} else {
|
|
49
|
+
exports.build = series(styles, livereloadStyles);
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
// gulp.task("watch:styles", function () {
|
|
53
|
+
// livereload.listen();
|
|
54
|
+
// gulp.watch("**/*.scss", ["styles"]);
|
|
55
|
+
// });
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
package/package.json
ADDED
|
@@ -0,0 +1,53 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@pmidc/upyog-css",
|
|
3
|
+
"version": "0.0.1",
|
|
4
|
+
"description": "PMIDC CSS",
|
|
5
|
+
"main": "gulpfile.js",
|
|
6
|
+
"directories": {
|
|
7
|
+
"example": "example"
|
|
8
|
+
},
|
|
9
|
+
"dependencies": {
|
|
10
|
+
"ansi-regex": "^2.1.1",
|
|
11
|
+
"ansi-styles": "^2.2.1",
|
|
12
|
+
"anymatch": "^3.1.3",
|
|
13
|
+
"autoprefixer": "^10.4.20",
|
|
14
|
+
"binary-extensions": "^2.3.0",
|
|
15
|
+
"braces": "^3.0.3",
|
|
16
|
+
"chokidar": "^3.6.0",
|
|
17
|
+
"cliui": "^7.0.4",
|
|
18
|
+
"filename-reserved-regex": "^2.0.0",
|
|
19
|
+
"filenamify": "^4.3.0",
|
|
20
|
+
"fill-range": "^7.1.1",
|
|
21
|
+
"fs-extra": "^8.1.0",
|
|
22
|
+
"get-stdin": "^8.0.0",
|
|
23
|
+
"gh-pages": "^3.2.3",
|
|
24
|
+
"glob-parent": "^5.1.2",
|
|
25
|
+
"gulp-postcss": "^9.0.1",
|
|
26
|
+
"has-flag": "^1.0.0",
|
|
27
|
+
"is-binary-path": "^2.1.0",
|
|
28
|
+
"is-number": "^7.0.0",
|
|
29
|
+
"lilconfig": "^2.1.0",
|
|
30
|
+
"postcss": "^8.4.12",
|
|
31
|
+
"postcss-cli": "^8.3.1",
|
|
32
|
+
"postcss-header": "^2.0.0",
|
|
33
|
+
"postcss-load-config": "^3.1.4",
|
|
34
|
+
"postcss-prefixer": "^2.1.3",
|
|
35
|
+
"postcss-preset-env": "^6.7.2",
|
|
36
|
+
"postcss-reporter": "^7.1.0",
|
|
37
|
+
"postcss-value-parser": "^4.2.0",
|
|
38
|
+
"readdirp": "^3.6.0",
|
|
39
|
+
"source-map": "^0.5.7",
|
|
40
|
+
"strip-ansi": "^3.0.1",
|
|
41
|
+
"supports-color": "^3.2.3",
|
|
42
|
+
"to-regex-range": "^5.0.1",
|
|
43
|
+
"universalify": "^0.1.2",
|
|
44
|
+
"y18n": "^5.0.8",
|
|
45
|
+
"yargs": "^16.2.0"
|
|
46
|
+
},
|
|
47
|
+
"devDependencies": {},
|
|
48
|
+
"scripts": {
|
|
49
|
+
"test": "echo \"Error: no test specified\" && exit 1"
|
|
50
|
+
},
|
|
51
|
+
"author": "ANUJ SINGH",
|
|
52
|
+
"license": "ISC"
|
|
53
|
+
}
|
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
const postcssPresetEnv = require("postcss-preset-env");
|
|
2
|
+
|
|
3
|
+
module.exports = {
|
|
4
|
+
parser: require("postcss-scss"),
|
|
5
|
+
plugins: [
|
|
6
|
+
require("postcss-import"),
|
|
7
|
+
require("postcss-nested").default,
|
|
8
|
+
require("tailwindcss"),
|
|
9
|
+
require("postcss-preset-env"),
|
|
10
|
+
require("autoprefixer"),
|
|
11
|
+
// require("cssnano"),
|
|
12
|
+
],
|
|
13
|
+
};
|
|
14
|
+
|
|
15
|
+
// const fs = require('fs');
|
|
16
|
+
// const { name, version, author, cssConfig } = JSON.parse(fs.readFileSync('package.json'));
|
|
17
|
+
|
|
18
|
+
// const header = `
|
|
19
|
+
// @charset "UTF-8";
|
|
20
|
+
// /*!
|
|
21
|
+
// * ${name} - ${version}
|
|
22
|
+
// *
|
|
23
|
+
// * Copyright (c) ${new Date().getFullYear()} ${author.name}
|
|
24
|
+
// */
|
|
25
|
+
// `;
|
|
26
|
+
|
|
27
|
+
// module.exports = (ctx) => {
|
|
28
|
+
// const prefix = ctx.env === 'compat' ? '' : cssConfig.prefix;
|
|
29
|
+
// const devMessage = `🎉🎉🎉🎉 \n${name} ${ctx.env} build was compiled sucessfully! \n`;
|
|
30
|
+
|
|
31
|
+
|
|
32
|
+
// return {
|
|
33
|
+
// map: ctx.options.map,
|
|
34
|
+
// parser: ctx.options.parser,
|
|
35
|
+
// plugins: {
|
|
36
|
+
// 'postcss-import': { root: ctx.file.dirname },
|
|
37
|
+
// 'postcss-prefixer': {
|
|
38
|
+
// prefix,
|
|
39
|
+
// ignore: [/\[class\*=.*\]/],
|
|
40
|
+
// },
|
|
41
|
+
// 'postcss-preset-env': {
|
|
42
|
+
// autoprefixer: {
|
|
43
|
+
// cascade: false,
|
|
44
|
+
// },
|
|
45
|
+
// features: {
|
|
46
|
+
// 'custom-properties': true,
|
|
47
|
+
// },
|
|
48
|
+
// },
|
|
49
|
+
// cssnano: ctx.env === 'production' || ctx.env === 'compat' ? {} : false,
|
|
50
|
+
// 'postcss-header': {
|
|
51
|
+
// header,
|
|
52
|
+
// },
|
|
53
|
+
// },
|
|
54
|
+
// };
|
|
55
|
+
// };
|