1. text two columns, fixed padding between main and sidebar;2. hy-box is...

1. text two columns, fixed padding between main and sidebar;2. hy-box is removed from text paragraph and is set in Drupal, as text paragraph can be nested (inside text 2 columns) and independent (placed directly on page)

src/components/hy-box/readme.md

@@ -29,7 +29,6 @@
 - [hy-key-figure-group](../hy-key-figure-group)
 - [hy-key-highlight-group](../hy-key-highlight-group)
 - [hy-link-box-list](../link-box-list)
-- [hy-paragraph-text](../paragraph-text)
 - [hy-process-flow-box](../process-flow-box)
 - [hy-shortcuts](../hy-shortcuts)
 - [hy-two-columns](../hy-two-columns)
@@ -46,7 +45,6 @@ graph TD;
   hy-key-figure-group --> hy-box
   hy-key-highlight-group --> hy-box
   hy-link-box-list --> hy-box
-  hy-paragraph-text --> hy-box
   hy-process-flow-box --> hy-box
   hy-shortcuts --> hy-box
   hy-two-columns --> hy-box

src/components/hy-two-columns/hy-two-columns.scss

@@ -7,6 +7,17 @@
   display: flex;
   flex-direction: column;
 
+  h2,
+  h3,
+  h4,
+  h5,
+  h6 {
+    margin-top: 0;
+  }
+  p {
+    margin-top: 0;
+  }
+
   @include breakpoint($medium) {
     flex-direction: row;
   }
@@ -23,8 +34,8 @@
       padding-right: 0;
 
       @include breakpoint($medium) {
-        padding-right: calc(100% / 12 * 0.5 + var(--gutter-medium));
         padding-left: 0;
+        padding-right: calc(100% / 12 * 0.5 + var(--gutter-medium));
       }
 
       @include breakpoint($overwide) {
@@ -56,12 +67,12 @@
 
     @include breakpoint($medium) {
       flex-basis: calc(100% / 12 * 5);
-      padding-left: 0;
-      padding-right: calc(100% / 12 * 0.5 + var(--gutter-medium));
+      padding-left: calc(100% / 12 * 0.5 + var(--gutter-medium));
+      padding-right: 0;
     }
 
     @include breakpoint($overwide) {
-      padding-right: calc(100% / 12 * 0.5 + var(--gutter-extrawide));
+      padding-left: calc(100% / 12 * 0.5 + var(--gutter-extrawide));
     }
 
     [slot='side'] {

src/components/paragraph-text/paragraph-text.tsx

@@ -13,7 +13,6 @@ export class ParagraphText {
         <div class={classAttributes.join(' ')}>
           <slot></slot>
         </div>
-        <hy-box pb="3, 5, 6" />
       </Host>
     );
   }

src/components/paragraph-text/readme.md

@@ -29,20 +29,6 @@ Basic text paragraph.
 
 <!-- Auto Generated Below -->
 
-## Dependencies
-
-### Depends on
-
-- [hy-box](../hy-box)
-
-### Graph
-
-```mermaid
-graph TD;
-  hy-paragraph-text --> hy-box
-  style hy-paragraph-text fill:#f9f,stroke:#333,stroke-width:4px
-```
-
 ---
 
 Helsinki University Design System