language

public/locales/en/translation.json

@@ -115,7 +115,7 @@
     "serviceActivityPrice": "Price of the activity",
     "serviceActivityPricePlaceholder": "Enter the price of the activity",
     "serviceActivityPriceUnit": "€",
-    "serviceActivityDurationMinutes": "Duration of activity (minutes)",
+    "serviceActivityDurationMinutes": "Duration of activity",
     "serviceActivityDurationMinutesPlaceholder": "Enter the duration of the activity in minutes",
     "serviceActivityDurationMinutesUnit": "Minutes",
     "serviceActivityResponsible": "Responsible employees",

src/App.css

@@ -1,56 +1,3 @@
-/*.CompanyNameContainer {
-  padding: 12px 12px 0 12px;
-  color: #e67e22;
-  font-weight: bold;
-  font-size: 24px;
-  text-align: center;
-  letter-spacing: 6px;
-}
-
-.CompanyNameContainer span {
-  animation: light 10s infinite;
-}
-
-@keyframes light {
-  20% {
-    color: #e67e22;
-  }
-  25% {
-    color: #ffd700;
-  }
-  30% {
-    color: #e67e22;
-  }
-}
-
-.CompanyNameContainer span:nth-child(1) {
-  animation-delay: 200ms;
-}
-
-.CompanyNameContainer span:nth-child(2) {
-  animation-delay: 400ms;
-}
-
-.CompanyNameContainer span:nth-child(3) {
-  animation-delay: 600ms;
-}
-
-.CompanyNameContainer span:nth-child(4) {
-  animation-delay: 800ms;
-}
-
-.CompanyNameContainer span:nth-child(5) {
-  animation-delay: 1000ms;
-}
- */
-.Subtitle {
-  text-align: center;
-  color: #9b59b6;
-  font-weight: bold;
-  font-size: 14px;
-  padding-bottom: 20px;
-}
-
 /* full screen ant modal for an screen size smaller than 576px */
 @media (max-width: 575px) {
   .ant-modal {
@@ -67,7 +14,3 @@
     content: unset;
   }
 }
-
-.mdx-editor {
-  background: #f4f5f4;
-}

src/Pages/Store/Services/index.js

@@ -255,10 +255,10 @@ function Service({
             >
               {isRequestingActivities ? (
                 <Skeleton active>
-                  <Card title="Test">
+                  <Card title="loading">
-                    <p>Desc</p>
+                    <p>loading</p>
-                    <p>Preis: €</p>
+                    <p>loading</p>
-                    <p>Dauer: Minuten</p>
+                    <p>loading</p>
                   </Card>
                 </Skeleton>
               ) : (
@@ -306,7 +306,7 @@ function Service({
                                   >
                                     <Avatar
                                       size="small"
-                                      style={{ backgroundColor: "#87d068" }}
+                                      style={{ backgroundColor: "#6878d6" }}
                                     >
                                       {user.username.charAt(0)}
                                     </Avatar>
@@ -350,14 +350,33 @@ function Service({
                             </Space>
                           }
                         >
-                          <p>{activity.description}</p>
+                          <Typography.Title level={5}>
-                          <p>Preis: {activity.price} €</p>
+                            {t("storeServices.serviceActivityDescription")}
-                          <p>
+                          </Typography.Title>
-                            Dauer: {activity.duration} Minuten{" "}
+
+                          <Typography.Paragraph>
+                            {activity.description}
+                          </Typography.Paragraph>
+
+                          <Typography.Title level={5}>
+                            {t("storeServices.serviceActivityPrice")}
+                          </Typography.Title>
+
+                          <p>{activity.price} €</p>
+
+                          <Typography.Title level={5}>
+                            {t("storeServices.serviceActivityDurationMinutes")}
+                          </Typography.Title>
+
+                          <Typography.Paragraph>
+                            {activity.duration}{" "}
+                            {activity.duration === 1
+                              ? t("common.unit.minute")
+                              : t("common.unit.minutes")}{" "}
                             <Typography.Text type="secondary">
                               {durationToHoursAndMinutes(t, activity.duration)}
                             </Typography.Text>
-                          </p>
+                          </Typography.Paragraph>
                         </Card>
                       );
                     })
@@ -847,6 +866,9 @@ function ServiceActivityDescriptionFormInput({
 
   return (
     <MyFormInput
+      propsInput={{
+        showCount: true,
+      }}
       inputType="textarea"
       formItemName={formItemName}
       setIsInputValid={setIsInputValid}