mirfalah-tech
/
pasca
Seguir 10
Destacar 0
Cuchillo 0
Código Incidencias 0 Peticiones pull 0 Lanzamientos 0 Wiki Actividad
Explorar el Código

responsive table

master
azri hace 13 horas
padre
cb58bdf301
commit
aae886835e
Se han modificado 2 ficheros con 14 adiciones y 13 borrados
Dividir vista Mostrar estadísticas de diff
  1. 8
    7
      resources/views/agency.blade.php
  2. 6
    6
      resources/views/agency_performance.blade.php

+ 8
- 7
resources/views/agency.blade.php Ver fichero 

@@ -22,16 +22,17 @@
22 22 
             </div>
23 23 
         </div>
24 24
25 
-        <div class="flex" style="gap:10px">
26 
-            <div class="relative w-fit">
25 
+        <div class="flex flex-col lg:flex-row gap-2 w-full">
26 
+            <div class="relative w-full lg:w-fit">
27 27 
                 <input type="text" placeholder="Carian"
28 28 
                     class="w-full pl-4 pr-10 py-1 px-5 border border-gray-300 rounded-lg text-sm text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-blue-500" />
29 
-                <div class="pointer-events-none absolute text-gray-500 text-xs" style="top: 50%; transform: translateY(-50%); right:10px">
29 
+                <div class="pointer-events-none absolute text-gray-500 text-xs"
30 
+                    style="top: 50%; transform: translateY(-50%); right:10px">
30 31 
                     <i class="fas fa-search"></i>
31 32 
                 </div>
32 33 
             </div>
33 34
34 
-            <div class="relative w-fit">
35 
+            <div class="relative w-full lg:w-fit">
35 36 
                 <select
36 37 
                     class="appearance-none w-full pl-4 pr-10 py-1 px-5 border border-gray-300 rounded-lg text-sm text-gray-700 cursor-pointer bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-blue-500">
37 38 
                     <option value="all" selected>Agensi</option>
 
@@ -40,7 +41,7 @@
40 41 
                 </select>
41 42 
             </div>
42 43
43 
-            <div class="relative w-fit">
44 
+            <div class="relative w-full lg:w-fit">
44 45 
                 <select
45 46 
                     class="appearance-none w-full pl-4 pr-10 py-1 px-5 border border-gray-300 rounded-lg text-sm text-gray-700 cursor-pointer bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-blue-500">
46 47 
                     <option value="all" selected>Status Prestasi</option>
 
@@ -49,13 +50,13 @@
49 50 
                     <option value="3">Baik</option>
50 51 
                 </select>
51 52 
             </div>
52 
-
53 53 
         </div>
54 54
55 
+
55 56 
         <div class="border rounded">
56 57 
             <h5 class="font-semibold m-5">Senarai Agensi</h5>
57 58 
             <div class="overflow-x-auto overflow-hidden rounded-[10px]">
58 
-                <table class="w-full text-sm text-left text-gray-700 border-collapse">
59 
+                <table class="min-w-[800px] text-sm text-left text-gray-700 border-collapse">
59 60 
                     <thead>
60 61 
                         <tr>
61 62 
                             <th class="text-xs px-4 py-2">Bil</th>

+ 6
- 6
resources/views/agency_performance.blade.php Ver fichero 

@@ -22,8 +22,8 @@
22 22 
             </div>
23 23 
         </div>
24 24
25 
-        <div class="flex" style="gap:10px">
26 
-            <div class="relative w-fit">
25 
+        <div class="flex flex-col lg:flex-row gap-2 w-full">
26 
+            <div class="relative w-full lg:w-fit">
27 27 
                 <input type="text" placeholder="Carian"
28 28 
                     class="w-full pl-4 pr-10 py-1 px-5 border border-gray-300 rounded-lg text-sm text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-blue-500" />
29 29 
                 <div class="pointer-events-none absolute text-gray-500 text-xs"
 
@@ -32,7 +32,7 @@
32 32 
                 </div>
33 33 
             </div>
34 34
35 
-            <div class="relative w-fit">
35 
+            <div class="relative w-full lg:w-fit">
36 36 
                 <select
37 37 
                     class="appearance-none w-full pl-4 pr-10 py-1 px-5 border border-gray-300 rounded-lg text-sm text-gray-700 cursor-pointer bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-blue-500">
38 38 
                     <option value="all" selected>Agensi</option>
 
@@ -41,7 +41,7 @@
41 41 
                 </select>
42 42 
             </div>
43 43
44 
-            <div class="relative w-fit">
44 
+            <div class="relative w-full lg:w-fit">
45 45 
                 <select
46 46 
                     class="appearance-none w-full pl-4 pr-10 py-1 px-5 border border-gray-300 rounded-lg text-sm text-gray-700 cursor-pointer bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-blue-500">
47 47 
                     <option value="all" selected>Status Prestasi</option>
 
@@ -50,13 +50,13 @@
50 50 
                     <option value="3">Baik</option>
51 51 
                 </select>
52 52 
             </div>
53 
-
54 53 
         </div>
55 54
55 
+
56 56 
         <div class="border rounded">
57 57 
             <h5 class="font-semibold m-5">Senarai Agensi</h5>
58 58 
             <div class="overflow-x-auto overflow-hidden rounded-[10px]">
59 
-                <table class="w-full text-sm text-left text-gray-700 border-collapse">
59 
+                <table class="min-w-[800px] text-sm text-left text-gray-700 border-collapse">
60 60 
                     <thead>
61 61 
                         <tr>
62 62 
                             <th class="text-xs px-4 py-2">Bil</th>

Write Preview
Loading…
Cancelar
Guardar