From 08c23d67a80388c96229f7787e5a68e04c525200 Mon Sep 17 00:00:00 2001
From: Benjamin Renard <brenard@easter-eggs.com>
Date: Thu, 4 Jun 2020 12:42:09 +0200
Subject: [PATCH] LSformElement :: jsonCompositeAttribute: make CSS responsive

---
 .../LSformElement_jsonCompositeAttribute.css  | 34 +++++++++++++++++++
 1 file changed, 34 insertions(+)

diff --git a/src/css/default/LSformElement_jsonCompositeAttribute.css b/src/css/default/LSformElement_jsonCompositeAttribute.css
index 8a3c7599..fd40d644 100644
--- a/src/css/default/LSformElement_jsonCompositeAttribute.css
+++ b/src/css/default/LSformElement_jsonCompositeAttribute.css
@@ -18,6 +18,7 @@ ul.LSformElement_jsonCompositeAttribute div label {
 	vertical-align: top;
 	width: 10em;
 	font-weight: bold;
+	color: #666;
 }
 
 ul.LSformElement_jsonCompositeAttribute div ul {
@@ -53,3 +54,36 @@ div.jsonCompositeAttribute_possibleValues li:hover {
 ul.LSformElement_jsonCompositeAttribute div select {
 	margin: 2px;
 }
+
+@media (max-width: 1024px) {
+	ul.LSformElement_jsonCompositeAttribute {
+		width: 40vw;
+	}
+
+	ul.LSformElement_jsonCompositeAttribute div label {
+		width: auto;
+	}
+
+	ul.LSformElement_jsonCompositeAttribute div input[type=text], ul.LSformElement_jsonCompositeAttribute div select {
+		width: calc(40vw - 10px);
+		box-sizing: border-box;
+	}
+}
+
+@media (max-width: 400px) {
+	ul.LSformElement_jsonCompositeAttribute {
+		width: calc(100% - 1em);
+	}
+
+	ul.LSformElement_jsonCompositeAttribute div ul {
+		width: 100%;
+	}
+
+	ul.LSformElement_jsonCompositeAttribute div ul input[type=text] {
+		width: 100%;
+	}
+
+	ul.LSformElement_jsonCompositeAttribute div select {
+		width: calc(100% - 4px);
+	}
+}