Spaces:
Running
Running
feedback improved..
Browse files- frontend/vehicles.html +59 -46
frontend/vehicles.html
CHANGED
|
@@ -1142,33 +1142,40 @@
|
|
| 1142 |
</div>
|
| 1143 |
|
| 1144 |
<!-- TAB: Feedback -->
|
| 1145 |
-
<div id="tab-feedback" class="hidden flex-1 min-h-0 overflow-y-auto"
|
|
|
|
| 1146 |
<div class="max-w-6xl mx-auto space-y-6">
|
| 1147 |
-
<div class="
|
| 1148 |
-
<
|
| 1149 |
-
|
| 1150 |
-
|
| 1151 |
-
<
|
| 1152 |
-
|
| 1153 |
-
<span class="text-[10px] font-bold uppercase tracking-widest text-[#a89f97]">Takes about 2 minutes to complete</span>
|
| 1154 |
-
</div>
|
| 1155 |
</div>
|
|
|
|
| 1156 |
|
| 1157 |
-
|
| 1158 |
-
|
| 1159 |
-
|
| 1160 |
-
|
| 1161 |
-
|
| 1162 |
-
|
| 1163 |
-
|
| 1164 |
-
|
| 1165 |
-
|
| 1166 |
-
|
| 1167 |
-
|
| 1168 |
-
|
| 1169 |
-
</
|
|
|
|
|
|
|
|
|
|
|
|
|
| 1170 |
</div>
|
| 1171 |
-
|
|
|
|
|
|
|
|
|
|
| 1172 |
<div>
|
| 1173 |
<label class="text-[10px] font-bold uppercase tracking-widest block mb-3" style="color:#a89f97">Recommend Product</label>
|
| 1174 |
<div class="flex gap-2" id="fb-recommend">
|
|
@@ -1216,7 +1223,29 @@
|
|
| 1216 |
</div>
|
| 1217 |
</div>
|
| 1218 |
|
| 1219 |
-
<
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 1220 |
<div>
|
| 1221 |
<label class="text-[10px] font-bold uppercase tracking-widest block mb-3" style="color:#a89f97">Primary Use Case</label>
|
| 1222 |
<select class="fb-select w-full" id="fb-usecase">
|
|
@@ -1239,37 +1268,21 @@
|
|
| 1239 |
</select>
|
| 1240 |
</div>
|
| 1241 |
</div>
|
| 1242 |
-
</div>
|
| 1243 |
-
|
| 1244 |
-
<!-- Right Side: Features & Text -->
|
| 1245 |
-
<div class="space-y-6 flex flex-col">
|
| 1246 |
-
<div>
|
| 1247 |
-
<label class="text-[10px] font-bold uppercase tracking-widest block mb-4" style="color:#a89f97">Feature Prioritization (Select all that apply)</label>
|
| 1248 |
-
<div class="grid grid-cols-2 gap-3" id="fb-priorities">
|
| 1249 |
-
<div class="fb-chip" onclick="this.classList.toggle('active')" data-val="live-rtsp">Live RTSP Streams</div>
|
| 1250 |
-
<div class="fb-chip" onclick="this.classList.toggle('active')" data-val="api-access">REST API Access</div>
|
| 1251 |
-
<div class="fb-chip" onclick="this.classList.toggle('active')" data-val="multi-cam">Junction Stitching</div>
|
| 1252 |
-
<div class="fb-chip" onclick="this.classList.toggle('active')" data-val="violation">Traffic Violations</div>
|
| 1253 |
-
<div class="fb-chip" onclick="this.classList.toggle('active')" data-val="edge-deploy">Cloud-to-Edge Sync</div>
|
| 1254 |
-
<div class="fb-chip" onclick="this.classList.toggle('active')" data-val="anpr">ANPR Integration</div>
|
| 1255 |
-
</div>
|
| 1256 |
-
</div>
|
| 1257 |
|
| 1258 |
-
<div class="flex-1
|
| 1259 |
<label class="text-[10px] font-bold uppercase tracking-widest block mb-3" style="color:#a89f97">Detailed Word Feedback</label>
|
| 1260 |
-
<textarea class="fb-textarea w-full
|
| 1261 |
</div>
|
| 1262 |
|
| 1263 |
-
<button onclick="submitFeedback()" class="w-full py-4 font-bold text-sm rounded-xl transition hover:scale-[1.01] active:scale-95 shadow-lg flex items-center justify-center gap-3 mt-4"
|
| 1264 |
-
style="background:#111;border:1px solid var(--cocoa);color:var(--cocoa-l)">
|
| 1265 |
Transmit Feedback <i class="fa-solid fa-paper-plane text-[10px]"></i>
|
| 1266 |
</button>
|
| 1267 |
</div>
|
| 1268 |
</div>
|
|
|
|
| 1269 |
|
| 1270 |
-
|
| 1271 |
-
|
| 1272 |
-
</div>
|
| 1273 |
</div>
|
| 1274 |
</div>
|
| 1275 |
</div>
|
|
|
|
| 1142 |
</div>
|
| 1143 |
|
| 1144 |
<!-- TAB: Feedback -->
|
| 1145 |
+
<div id="tab-feedback" class="hidden flex-1 min-h-0 overflow-y-auto">
|
| 1146 |
+
<!-- Full Header Area -->
|
| 1147 |
<div class="max-w-6xl mx-auto space-y-6">
|
| 1148 |
+
<div class="text-center space-y-3 mb-6">
|
| 1149 |
+
<h2 class="text-2xl font-bold tracking-tight" style="color:#f0ece6">Share Your Feedback</h2>
|
| 1150 |
+
<p class="text-xs" style="color:#777">We are actively refining UrbanFlow. Your technical insights directly drive our roadmap.</p>
|
| 1151 |
+
<div class="inline-flex items-center gap-2 px-4 py-1.5 bg-[#111] border border-[#222] rounded-full mt-2">
|
| 1152 |
+
<i class="fa-regular fa-clock text-[#c89a6c] text-[10px]"></i>
|
| 1153 |
+
<span class="text-[10px] font-bold uppercase tracking-widest text-[#a89f97]">Takes about 2 minutes to complete</span>
|
|
|
|
|
|
|
| 1154 |
</div>
|
| 1155 |
+
</div>
|
| 1156 |
|
| 1157 |
+
<div class="grid grid-cols-1 lg:grid-cols-2 gap-6 w-full">
|
| 1158 |
+
<!-- Left Side: Experience & Requirements (All Selective Choices) -->
|
| 1159 |
+
<div class="col-span-1 bg-black rounded-xl border border-slate-800 shadow-sm overflow-hidden flex flex-col">
|
| 1160 |
+
<div class="px-6 py-4 border-b border-slate-800 bg-[#050505]">
|
| 1161 |
+
<h3 class="font-bold text-white text-sm flex items-center">Experience & Priorities</h3>
|
| 1162 |
+
<p class="text-[10px] text-slate-400 mt-0.1 uppercase tracking-widest font-medium">Rate your experience</p>
|
| 1163 |
+
</div>
|
| 1164 |
+
<div class="p-6 flex-1 space-y-8">
|
| 1165 |
+
<!-- Overall Experience Centered -->
|
| 1166 |
+
<div class="flex flex-col items-center justify-center border-b border-slate-800 pb-6">
|
| 1167 |
+
<label class="text-[10px] font-bold uppercase tracking-widest block mb-3 text-center" style="color:#a89f97">Overall Experience</label>
|
| 1168 |
+
<div class="fb-stars" id="fb-stars">
|
| 1169 |
+
<span class="fb-star" data-v="1" onclick="setRating(1)">★</span>
|
| 1170 |
+
<span class="fb-star" data-v="2" onclick="setRating(2)">★</span>
|
| 1171 |
+
<span class="fb-star" data-v="3" onclick="setRating(3)">★</span>
|
| 1172 |
+
<span class="fb-star" data-v="4" onclick="setRating(4)">★</span>
|
| 1173 |
+
<span class="fb-star" data-v="5" onclick="setRating(5)">★</span>
|
| 1174 |
</div>
|
| 1175 |
+
</div>
|
| 1176 |
+
|
| 1177 |
+
<!-- Emojis Grid -->
|
| 1178 |
+
<div class="grid grid-cols-1 sm:grid-cols-2 gap-6">
|
| 1179 |
<div>
|
| 1180 |
<label class="text-[10px] font-bold uppercase tracking-widest block mb-3" style="color:#a89f97">Recommend Product</label>
|
| 1181 |
<div class="flex gap-2" id="fb-recommend">
|
|
|
|
| 1223 |
</div>
|
| 1224 |
</div>
|
| 1225 |
|
| 1226 |
+
<!-- Feature Prioritization -->
|
| 1227 |
+
<div class="pt-4 border-t border-slate-800">
|
| 1228 |
+
<label class="text-[10px] font-bold uppercase tracking-widest block mb-4" style="color:#a89f97">Feature Prioritization (Select all that apply)</label>
|
| 1229 |
+
<div class="grid grid-cols-2 gap-3" id="fb-priorities">
|
| 1230 |
+
<div class="fb-chip" onclick="this.classList.toggle('active')" data-val="live-rtsp">Live RTSP Streams</div>
|
| 1231 |
+
<div class="fb-chip" onclick="this.classList.toggle('active')" data-val="api-access">REST API Access</div>
|
| 1232 |
+
<div class="fb-chip" onclick="this.classList.toggle('active')" data-val="anpr">ANPR Recognition</div>
|
| 1233 |
+
<div class="fb-chip" onclick="this.classList.toggle('active')" data-val="security">Security Focus</div>
|
| 1234 |
+
<div class="fb-chip" onclick="this.classList.toggle('active')" data-val="regulation">Regulation & Policies</div>
|
| 1235 |
+
<div class="fb-chip" onclick="this.classList.toggle('active')" data-val="helmet">Helmet Compliance</div>
|
| 1236 |
+
</div>
|
| 1237 |
+
</div>
|
| 1238 |
+
</div>
|
| 1239 |
+
</div>
|
| 1240 |
+
|
| 1241 |
+
<!-- Right Side: Categorization & Feedback Text -->
|
| 1242 |
+
<div class="col-span-1 bg-black rounded-xl border border-slate-800 shadow-sm overflow-hidden flex flex-col">
|
| 1243 |
+
<div class="px-6 py-4 border-b border-slate-800 bg-[#050505]">
|
| 1244 |
+
<h3 class="font-bold text-white text-sm flex items-center">Categorization & Feedback</h3>
|
| 1245 |
+
<p class="text-[10px] text-slate-400 mt-0.1 uppercase tracking-widest font-medium">Detailed workflow insights</p>
|
| 1246 |
+
</div>
|
| 1247 |
+
<div class="p-6 flex-1 flex flex-col space-y-6">
|
| 1248 |
+
<div class="grid grid-cols-2 gap-4">
|
| 1249 |
<div>
|
| 1250 |
<label class="text-[10px] font-bold uppercase tracking-widest block mb-3" style="color:#a89f97">Primary Use Case</label>
|
| 1251 |
<select class="fb-select w-full" id="fb-usecase">
|
|
|
|
| 1268 |
</select>
|
| 1269 |
</div>
|
| 1270 |
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 1271 |
|
| 1272 |
+
<div class="flex-1 flex flex-col">
|
| 1273 |
<label class="text-[10px] font-bold uppercase tracking-widest block mb-3" style="color:#a89f97">Detailed Word Feedback</label>
|
| 1274 |
+
<textarea class="fb-textarea w-full flex-1 min-h-[180px]" id="fb-text" placeholder="Please take a moment to provide a meaningful response. Describe your specific workflow needs or any limitations you encountered..."></textarea>
|
| 1275 |
</div>
|
| 1276 |
|
| 1277 |
+
<button onclick="submitFeedback()" class="w-full py-4 font-bold text-sm rounded-xl transition hover:scale-[1.01] active:scale-95 shadow-lg flex items-center justify-center gap-3 mt-4" style="background:#111;border:1px solid var(--cocoa);color:var(--cocoa-l)">
|
|
|
|
| 1278 |
Transmit Feedback <i class="fa-solid fa-paper-plane text-[10px]"></i>
|
| 1279 |
</button>
|
| 1280 |
</div>
|
| 1281 |
</div>
|
| 1282 |
+
</div>
|
| 1283 |
|
| 1284 |
+
<div class="pt-6 border-t border-[#111]">
|
| 1285 |
+
<p class="text-[10px] text-center uppercase tracking-widest" style="color:#444">Queries: <strong style="color:#c89a6c">support@urbanflow.in</strong></p>
|
|
|
|
| 1286 |
</div>
|
| 1287 |
</div>
|
| 1288 |
</div>
|