primo commit

media/com_associations/css/sidebyside.css

@@ -0,0 +1,66 @@
+@charset "UTF-8";
+.sidebyside .outer-panel {
+  float: left;
+  width: 50%;
+}
+
+.sidebyside #left-panel .inner-panel, .sidebyside #right-panel .inner-panel {
+  padding-inline-end: 10px;
+}
+
+.sidebyside .full-width {
+  float: none !important;
+  width: 100% !important;
+}
+
+.sidebyside .full-width .inner-panel {
+  padding: 0 !important;
+}
+
+#reference-association, #target-association {
+  width: 100%;
+  height: 1500px;
+  overflow-y: auto;
+  border: 0 !important;
+}
+
+.sidebyside .langtarget {
+  float: left;
+}
+
+.sidebyside .modaltarget {
+  float: left;
+  margin-inline-start: .5rem;
+}
+
+.sidebyside #target-association {
+  margin-top: .5rem;
+}
+
+.sidebyside #reference-association {
+  margin-top: 3.35rem;
+}
+
+.target-text {
+  float: left;
+  width: auto;
+}
+
+[dir="rtl"] .sidebyside .outer-panel, [dir="rtl"] .sidebyside .langtarget, [dir="rtl"] .sidebyside .modaltarget, [dir="rtl"] .target-text {
+  float: right;
+}
+
+@media (width <= 767.98px) {
+  .sidebyside .outer-panel {
+    float: none;
+    width: 100%;
+  }
+
+  .sidebyside #reference-association {
+    margin-top: 0;
+  }
+
+  .sidebyside #left-panel .inner-panel, .sidebyside #right-panel .inner-panel {
+    padding: 0;
+  }
+}