Changes

2024-11-03 17:42:10 +05:00
parent 63e760872b
commit 03ff222263
71 changed files with 2916 additions and 2117 deletions
@@ -0,0 +1,123 @@
+<template>
+
+	<div class="text-sm text-gray-600 leading-6 md:text-[16px] md:text-[#374151] md:leading-8 md:font-light paragraph-container" v-html="wrapTables(block).data.content" />
+</template>
+
+<script>
+import slugify from "slugify";
+
+export default {
+	name: "ParagraphBlock",
+	methods: {
+		wrapTables(data) {
+			if (data.type === 'paragraph' && data.data && data.data.content) {
+				// Используем регулярное выражение для поиска всех таблиц
+				const wrappedContent = data.data.content.replace(/<table([^>]*)>([\s\S]*?)<\/table>/g, (match, attrs, content) => {
+					return `<div class="div-table"><table${attrs}>${content}</table></div>`;
+				});
+
+				// Возвращаем новый объект с обновленным контентом
+				return {
+					...data,
+					data: {
+						...data.data,
+						content: wrappedContent
+					}
+				};
+			}
+			return data; // Если тип не 'paragraph', возвращаем объект без изменений
+		}
+	},
+	props: {
+		block: {
+			type: Object,
+		},
+	},
+}
+</script>
+
+<style>
+
+.paragraph-container a {
+	@apply text-secondAzure;
+	@apply underline;
+}
+
+.paragraph-container a:hover {
+	@apply text-secondDarkBlue;
+	@apply underline;
+}
+
+.paragraph-container p {
+	@apply mb-4
+}
+
+.paragraph-container ol li {
+	@apply list-decimal list-inside
+}
+
+.paragraph-container ul li {
+	@apply list-disc list-inside
+}
+
+.paragraph-container li ol {
+	@apply ml-10
+}
+
+.paragraph-container ul {
+	@apply mb-4
+}
+
+.paragraph-container hr {
+	@apply my-4
+}
+
+.paragraph-container strong {
+	@apply text-xl
+}
+
+.div-table {
+	@apply overflow-x-auto
+}
+
+
+.paragraph-container table {
+	@apply w-full border-collapse mt-4 mb-4 overflow-hidden; /* Ширина 100%, стыковка границ, отступы, закругленные края */
+}
+
+.paragraph-container th, .paragraph-container td {
+	@apply border border-gray-300 p-3 text-left; /* Границы, отступы, выравнивание текста */
+}
+
+.paragraph-container th {
+	@apply bg-gray-100 text-gray-800 font-semibold; /* Фон заголовка, цвет текста, жирный шрифт */
+}
+
+.paragraph-container tr {
+	@apply transition-colors duration-200; /* Плавный переход цветов */
+}
+
+
+.paragraph-container tr:hover {
+	@apply bg-gray-200; /* Фон строки при наведении */
+}
+
+.paragraph-container td {
+	@apply text-gray-600; /* Цвет текста ячеек */
+}
+
+
+
+
+
+.paragraph-container tr:hover {
+	@apply bg-gray-100;
+}
+
+
+
+
+
+
+
+</style>