refactor: replace use of LumoUtility properties

Close #10

Author: paodb

src/main/java/com/flowingcode/vaadin/addons/cronexpressionfield/CronExpressionField.java

@@ -56,7 +56,7 @@
 import com.vaadin.flow.data.provider.DataProvider;
 import com.vaadin.flow.function.SerializableConsumer;
 import com.vaadin.flow.internal.JsonSerializer;
-import com.vaadin.flow.theme.lumo.LumoUtility;
+
 import elemental.json.JsonObject;
 import org.springframework.scheduling.support.CronExpression;
 import it.burning.cron.CronExpressionDescriptor;
@@ -196,10 +196,10 @@ private void configureLayout() {
     cronExpressionLayoutCb.setWidth("40%");
     cronDescriptionDiv.setWidthFull();
     cronDescriptionDiv.setClassName("description-div");
-    addClassNames(LumoUtility.JustifyContent.CENTER, LumoUtility.AlignItems.CENTER, LumoUtility.Padding.NONE);
+    addClassName("fc-cron-expression-field");
     setMaxWidth("450px");
 
-    mainLayout.addClassNames(LumoUtility.Margin.NONE, LumoUtility.Padding.NONE);
+    mainLayout.addClassName("fc-cron-expression-field-main-layout");
 
     topLayout.setWidthFull();
     topLayout.setAlignItems(Alignment.END);
@@ -260,7 +260,7 @@ private void setAdvancedLayout() {
 
       commonExpressionsCb.addValueChangeListener(v -> updateCronExpression(commonExpressionsCb.getValue()));
       commonExpressionsCb.setWidthFull();
-      commonExpressionsCb.addClassName(LumoUtility.AlignSelf.CENTER);
+      commonExpressionsCb.addClassName("fc-common-expressions-combobox");
       commonExpressionsCb.setLabel(i18n.getCommonExpressionsLabel());
       commonExpressionsCb.setAllowCustomValue(false);
       mainLayout.add(commonExpressionsCb);
@@ -305,7 +305,7 @@ private void setDailyLayout() {
         getDailyExpression(timeUnitCb.getValue(), v.getValue());
       }
     });
-    timeAmountField.addClassName(LumoUtility.Margin.NONE);
+    timeAmountField.addClassName("fc-daily-layout-time-amount");
     timeAmountField.setSuffixComponent(timeUnitCb);
 
     DayOfWeekSelector daySelector = new DayOfWeekSelector();
@@ -364,7 +364,6 @@ private void setMonthlyLayout() {
     }
     HorizontalLayout layout = new HorizontalLayout(startsAtTp, dayOfMonthField, monthField);
     layout.setWidthFull();
-    layout.setJustifyContentMode(JustifyContentMode.CENTER);
     mainLayout.add(layout);
   }
 

src/main/resources/META-INF/frontend/styles/cron-expression-field-styles.css

@@ -22,16 +22,38 @@
 	margin: 0;
 	padding: 0;
 }
+
 .inline-combobox::part(input-field) {
     background-color: transparent;
 	padding: 0;
 	margin: 0;
 }
+
 vaadin-grid::part(header) {
     display: none;
 }
-.description-div{
+
+.description-div {
 	padding: 0;
 	margin: 0;
 	text-align: center;
 }
+
+.fc-cron-expression-field {
+	justify-content: center;
+	align-items: center;
+	padding: 0; 
+}
+
+.fc-cron-expression-field-main-layout {
+	padding: 0; 
+	margin: 0;
+}
+
+.fc-common-expressions-combobox {
+	align-self: center;
+}
+
+.fc-daily-layout-time-amount {
+	margin: 0;
+}