scss: make table widgets responsive (#41734)

static/includes/wcs/_bulk.scss

@@ -653,6 +653,60 @@ div.file-upload-widget {
 	}
 }
 
+.TableListRowsWidget {
+	.widget {
+		margin-bottom: 0;
+	}
+}
+// Responsive TableWidget
+// work with JS : `new Responsive_table(table);`
+.responsive-tableWidget {
+	table-layout: fixed;
+	// table headers
+	th, td::before {
+		text-align: left;
+		font-weight: normal;
+	}
+
+	@media ($max-mobile-viewport) {
+		&, & tbody {
+			display: block;
+		}
+		thead th {
+			display: none;
+		}
+		tbody {
+			th {
+				display: block;
+			}
+			tr {
+				display: block;
+				padding-top: 0.5rem;
+				padding-bottom: 0.5rem;
+
+				&:nth-child(even) {
+					background-color: rgba(0, 0, 0, 0.065);
+				}
+			}
+			td {
+				display: flex;
+				align-items: last baseline;
+			}
+			td::before {
+				content: attr(data-col-header);
+				display: block;
+				flex: 0 1 33%;
+				margin-right: .66em;
+			}
+		}
+	}
+	@media (max-width: $very-small-limit) {
+		tbody td {
+			display: block;
+		}
+	}
+}
+
 p.use-file-from-fargo {
 	margin-top: 0;
 }