yjd

src/components/Istochnik.vue

@@ -71,14 +71,10 @@
         </button>
       </div>
     </div>
-    
+
     <!-- Список источников -->
-    <div class="p-4 xl:flex gap-2 justify-between">
-      <div 
-        v-for="source in filteredSources" 
-        :key="source.url"
-        class="mb-4"
-      >
+    <div class="p-4 grid gap-2 grid-cols-1 lg:grid-cols-2 2xl:grid-cols-3">
+      <div v-for="source in filteredSources" :key="source.url" class="mb-4">
         <Istochnik_one_kard :source="source" />
       </div>
     </div>
@@ -110,9 +106,7 @@ const fetchCategories = async () => {
 
 const fetchSources = async () => {
   try {
-    const data = await axios.get(
-      "https://allowlgroup.ru/api/8001/all_sources",
-    );
+    const data = await axios.get("https://allowlgroup.ru/api/8001/all_sources");
     sources.value = data.data.sources || [];
   } catch (err) {
     console.error("Ошибка загрузки источников:", err);
@@ -121,9 +115,10 @@ const fetchSources = async () => {
 
 const filteredSources = computed(() => {
   if (!poisk.value) return sources.value;
-  return sources.value.filter(source => 
-    source.url.toLowerCase().includes(poisk.value.toLowerCase()) ||
-    source.promt.toLowerCase().includes(poisk.value.toLowerCase())
+  return sources.value.filter(
+    (source) =>
+      source.url.toLowerCase().includes(poisk.value.toLowerCase()) ||
+      source.promt.toLowerCase().includes(poisk.value.toLowerCase()),
   );
 });
 
@@ -164,4 +159,4 @@ onMounted(() => {
   fetchCategories();
   fetchSources();
 });
-</script>
+</script>