Add taggit, ckeditor, Dockerfile and update CSS styles

Dockerfile

@@ -0,0 +1,14 @@
+FROM python:3.11-slim
+
+WORKDIR /app
+
+RUN apt-get update && apt-get install -y --no-install-recommends gcc libpq-dev && rm -rf /var/lib/apt/lists/*
+
+COPY requirements.txt .
+RUN pip install --no-cache-dir -r requirements.txt
+
+COPY . .
+
+EXPOSE 8000
+
+CMD ["gunicorn", "OneCprogsite.wsgi:application", "--bind", "0.0.0.0:8000"]

requirements.txt

@@ -5,4 +5,6 @@ Pillow==10.0.0
 psycopg2-binary==2.9.7
 django-bootstrap5==23.3
 django-extensions==3.2.3
-python-dotenv>=1.0.0
+python-dotenv>=1.0.0
+django-taggit
+django_ckeditor_5

static/programmer/css/recall.css

@@ -160,6 +160,14 @@
 
 /* Адаптивность для мобильных устройств */
 @media (max-width: 768px) {
+    .content-card .image-style-align-left,
+    .content-card .image-style-align-right {
+        float: none !important;
+        margin-left: auto !important;
+        margin-right: auto !important;
+        max-width: 100% !important;
+    }
+
     .recall-content {
         flex-direction: column;
         gap: 1.5rem;
@@ -225,4 +233,22 @@
     .scan-hint {
         background: linear-gradient(transparent, rgba(0,0,0,0.7));
     }
+}
+
+.content-card img {
+    max-width: 100% !important;
+    height: auto !important;
+}
+
+.content-card figure.image {
+    max-width: 100%;
+    margin: 1rem auto;
+    text-align: center;
+}
+
+.content-card figure.image img {
+    max-width: 100%;
+    height: auto;
+    display: block;
+    margin: 0 auto;
 }

static/programmer/css/styles_dark.css

@@ -867,7 +867,25 @@ body {
     border: 1px solid var(--border-light);
     margin-bottom: 2rem;
     position: relative;
-    overflow: hidden;
+    /* overflow: visible !important;  */
+}
+
+.content-card img {
+    max-width: 100% !important;
+    height: auto !important;
+}
+
+.content-card figure.image {
+    max-width: 100%;
+    margin: 1rem auto;
+    text-align: center;
+}
+
+.content-card figure.image img {
+    max-width: 100%;
+    height: auto;
+    display: block;
+    margin: 0 auto;
 }
 
 .content-card::before {
@@ -1298,6 +1316,14 @@ body {
     .breadcrumbs {
         font-size: 0.8rem;
     }
+
+    .content-card .image-style-align-left,
+    .content-card .image-style-align-right {
+        float: none !important;
+        margin-left: auto !important;
+        margin-right: auto !important;
+        max-width: 100% !important;
+    }
 }
 
 @media (max-width: 480px) {