change again #9

assets/css/custom.css

@@ -1,28 +1,17 @@
 .section-title {
-    position: relative;
-    height: 0;
-    overflow: visible;
-    margin: 2rem 0; /* Adjust as needed to match original spacing */
-}
-
-.section-title::before {
-    content: attr(data-title);
     position: absolute;
-    left: -60px; /* Adjust as needed */
-    top: 50%;
-    transform: translateY(-50%) rotate(180deg);
-    writing-mode: vertical-rl;
-    font-size: 1.5rem;
-    font-weight: bold;
-    color: inherit;
+    left: -200px; /* Adjust this value as needed */
+    width: 180px; /* Adjust as needed */
+    text-align: right;
+    padding-right: 20px;
 }
 
-/* Hide the original horizontal text */
-.section-title span {
-    display: none;
+/* Adjust the container of the section content */
+.section-title + * {
+    margin-left: 20px; /* Add some space between the title and content */
 }
 
-/* Add space for the vertical titles */
-.section-title + * {
-    margin-left: 40px; /* Adjust as needed */
+/* Ensure the parent container has relative positioning */
+.section-title:not(:first-child) {
+    position: relative;
 }

assets/js/custom.js

@@ -53,14 +53,9 @@ document.addEventListener('DOMContentLoaded', function() {
 
         console.log(`Processing section ${index}:`, section.textContent);
 
-        const title = section.textContent.trim();
         section.classList.add('section-title');
-        section.setAttribute('data-title', title);
 
-        // Wrap the original text in a span
-        section.innerHTML = `<span>${title}</span>`;
-
-        console.log(`Processed: "${title}"`);
+        console.log(`Processed: "${section.textContent.trim()}"`);
     });
 
     console.log('Finished processing all sections');