From 443458eae4fdec87e849b3ead203ede5728274e1 Mon Sep 17 00:00:00 2001
From: Ivan Urdenko <vaniaurdenko@gmail.com>
Date: Tue, 12 Sep 2023 17:42:39 +0200
Subject: [PATCH] restyled the course about page, where removed button to
 enroll if user is already enrolled and redefined buttons position on the page
 for mobile

---
 src/example/Course_about.jsx        | 26 ++++++++++++++------------
 src/example/custom_scss/styles.scss |  5 +++++
 2 files changed, 19 insertions(+), 12 deletions(-)

diff --git a/src/example/Course_about.jsx b/src/example/Course_about.jsx
index 3500ec3..83eb7ac 100644
--- a/src/example/Course_about.jsx
+++ b/src/example/Course_about.jsx
@@ -351,15 +351,19 @@ const About = () => {
                 <strong className="text-block-footer">End: {date(data?.end)}</strong>
               </div>
             </span>
-            {enrollMessage ? (
-              <Button disabled="true">
-                {enrollMessage}
-              </Button>
-            ) : (
-              <Button onClick={handleEnroll} disabled={enrolled}>
-                {enrolled ? 'Enrolled' : 'Enroll'}
-              </Button>
-            )}
+            {
+              enrollMessage ? (
+                <Button disabled="true">
+                  {enrollMessage}
+                </Button>
+              ) : (
+                !enrolled && (
+                  <Button onClick={handleEnroll}>
+                    'Enroll'
+                  </Button>
+                )
+              )
+            }
             {enrolled && (
               <a className="btn btn-primary" href={`${appsurl}/learning/course/${courseId}/home`}>
                 View Course
@@ -383,9 +387,7 @@ const About = () => {
                   isActive={active === id}
               />
             ))}
-            </div>
-            <div className="tabs">
-            {enrollMessage ? (
+              {enrollMessage ? (
               <Button id="enroll-button" disabled="true">
                 {enrollMessage}
               </Button>
diff --git a/src/example/custom_scss/styles.scss b/src/example/custom_scss/styles.scss
index d6b1dee..7c7f685 100644
--- a/src/example/custom_scss/styles.scss
+++ b/src/example/custom_scss/styles.scss
@@ -106,6 +106,11 @@ div.wrapper-continer {
       @extend .theme-btn;
     }
   }
+  @media (max-width: 499px) {
+    .wrapper-continer {
+      display: grid;
+    }
+  }
 }
 
 .white-continer-claim {