[TikiWiki-commits] [Git][tikiwiki/tiki][master] [REF] _cypht-tiki.scss: reintroduce styles with improved organization and mobile responsiveness

"Victor Emanouilov \(@kroky\) via TikiWiki-cvs" <[email protected]>
Newsgroups gmane.comp.cms.tiki.cvs
Message-ID <68a5fcc8bba35_2cd6d94-352@gitlab-sidekiq-low-urgency-cpu-bound-v2-7cf5dbccb9-drp8b.mail>

Victor Emanouilov pushed to branch master at Tiki Wiki CMS Groupware / Tiki


Commits:
137ecc11 by Joseph Lwanzo Kausi at 2025-08-20T16:42:17+00:00
[REF] _cypht-tiki.scss: reintroduce styles with improved organization and mobile responsiveness
---
* [REF] _cypht-tiki.scss: reintroduce styles with improved organization and mobile responsiveness

See merge request tikiwiki/tiki!8085

- - - - -


1 changed file:

- themes/base_files/scss/_cypht-tiki.scss


Changes:

=====================================
themes/base_files/scss/_cypht-tiki.scss
=====================================
@@ -224,6 +224,88 @@
         overflow-y: auto;
         border-radius: var(--bs-border-radius);
     }
+    
+    /* Bootstrap-based message headers */
+    .msg_text * {
+        white-space: normal !important;
+        word-break: break-word;
+        overflow-wrap: anywhere;
+    }
+    
+    .long_header {
+        display: none;
+    }
+    
+    .long_header[style*="display: block"],
+    .long_header[style*="display: flex"],
+    .long_header[style*="display: grid"] {
+        display: flex !important;
+        column-gap: 0.15rem;
+    }
+    
+    .long_header > div:nth-of-type(2) {
+        overflow-wrap: break-word !important;
+    }
+
+    .small_header .col-md-2,
+    .long_header .col-md-2 {
+        font-weight: 500;
+    }
+    
+    .small_header > div:nth-of-type(2),
+    .small_header > div:nth-of-type(2) > div {
+        display: flex;
+        column-gap: 0.15rem;
+    }
+    
+    .small_header {
+        display: flex;
+    }
+    
+    .all_headers {
+        display: inline-block;
+    }
+    
+    .small_headers {
+        display: none;
+    }
+    
+    /* Mobile responsive overrides for Bootstrap classes */
+    @media (max-width: 768px) {
+        .small_header {
+        display: flex;
+        flex-direction: row;
+        column-gap: 0.5rem;
+        flex-wrap: nowrap;
+        }
+    
+        .small_header > div {
+        flex: 0 0 auto;
+        padding: 0;
+        flex-wrap: wrap;
+        }
+    
+        .small_header .col-md-2 {
+        font-weight: bold;
+        white-space: nowrap;
+        width: fit-content !important;
+        }
+    
+        .long_header .col-md-2 {
+        font-weight: bold;
+        }
+    
+        .msg_actions a {
+        padding: 0.5rem;
+        border-radius: 0.25rem;
+        background-color: #f8f9fa;
+        text-decoration: none;
+        color: #495057;
+        font-size: 0.6rem;
+        margin-right: 0;
+        }
+    }
+    
     .collapsed ul {
         display: inherit;
     }
@@ -299,7 +381,7 @@
             box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
             backdrop-filter: blur(10px);
         }
-        .mobile nav .menu-toggle {
+        nav .menu-toggle {
             right: 20px;
             left: unset;
             text-align: left;
@@ -312,16 +394,17 @@
             color: var(--bs-primary);
           }
 
-        .mobile .nav-header {
-        display: flex;
-        flex-direction: row-reverse;
-        justify-content: flex-end;
-        padding: 0;
-        border-bottom: 1px solid var(--bs-secondary-bg);
+        .nav-header {
+            display: flex;
+            flex-direction: row-reverse;
+            justify-content: flex-end;
+            padding: 0;
+            border-bottom: 1px solid var(--bs-secondary-bg);
+            background-color: var(--bs-body-bg);
         }
         
         .nav-header a {
-        margin: auto 45% auto auto;
+            margin: auto 45% auto auto;
         }
         
         .mobile .nav-header .app-logo {
@@ -525,3 +608,9 @@
         }
     }
 }
+
+html body.tiki.tiki-webmail #middle.container.container-std.middle {
+    width: 95% !important;
+    max-width: 95% !important;
+    min-width: 95% !important;
+}



View it on GitLab: https://gitlab.com/tikiwiki/tiki/-/commit/137ecc11619216655f15d7f0b4de8122fb528975

-- 
View it on GitLab: https://gitlab.com/tikiwiki/tiki/-/commit/137ecc11619216655f15d7f0b4de8122fb528975
You're receiving this email because of your account on gitlab.com.

_______________________________________________
TikiWiki-cvs mailing list
[email protected]
https://lists.sourceforge.net/lists/listinfo/tikiwiki-cvs
lmpx.com only provides a reader for public news (NNTP) servers. It is not affiliated with the servers or forums shown here and is not responsible for the content of articles, which is written by their respective authors.