frontend: make marketplace related components responsive

Author: thisconnect

frontends/web/src/components/groupedaccountselector/groupedaccountselector.module.css

@@ -6,6 +6,7 @@
 }
 
 .balanceSingleValue {
+    margin-left: var(--space-quarter);
     margin-right: var(--space-quarter);
 }
 
@@ -26,12 +27,13 @@
 }
 
 .select {
+    font-size: min(var(--size-default), 24px);
     margin-bottom: var(--space-half);
 }
 
 .select :global(.react-select__group-heading) {
     color: var(--color-default);
-    font-size: var(--size-default);
+    font-size: min(var(--size-default), 24px);
     margin: 0;
     padding-right: var(--space-quarter);
     text-transform: unset;
@@ -72,6 +74,7 @@
 
 .select :global(.react-select__control) {
     background-color: var(--background-secondary);
+    min-height: var(--input-height);
     padding: var(--space-quarter) var(--space-eight);
 }
 

frontends/web/src/components/terms/terms.module.css

@@ -1,4 +1,5 @@
 .disclaimerContainer {
+  --size-default: min(1.4rem, 24px);
   align-items: center;
   display: flex;
   flex-basis: 100%;
@@ -21,17 +22,17 @@
   margin: 0 0 var(--space-default) 0;
   max-width: 660px;
   overflow: auto;
-  padding: var(--space-quarter) 1em 1em 1em;
+  padding: var(--space-quarter) var(--space-half) var(--space-half) var(--space-half);
 }
 
 .title {
-  font-size: 1.4rem;
+  font-size: var(--size-default);
   font-weight: bold;
   text-align: left;
 }
 
 .disclaimer p {
-  font-size: 1.4rem;
+  font-size: var(--size-default);
   line-height: 1.5;
 }
 
@@ -45,7 +46,7 @@
 
 .table table {
   border-collapse: collapse;
-  font-size: 1.4rem;
+  font-size: var(--size-default);
   text-align: left;
 }
 
@@ -64,6 +65,11 @@
   padding-left: 0;
 }
 
+.table td:last-child,
+.table th:last-child {
+  padding-right: 0;
+}
+
 .nowrap {
   white-space: nowrap;
 }