fix: profile ui

lms/public/css/style.css

@@ -125,9 +125,10 @@ input[type=checkbox] {
 }
 
 .course-card-title {
-  font-weight: 600;
-  color: var(--gray-900);
-  margin-bottom: 1.25rem;
+    font-weight: 600;
+    color: var(--gray-900);
+    margin-bottom: 1.25rem;
+    font-size: 1.125rem;
 }
 
 .card-divider {
@@ -1399,8 +1400,8 @@ pre {
 
 .lms-nav .nav-link {
     color: var(--text-muted);
-    padding: 0 0 var(--padding-md);
-    margin-right: var(--margin-xl);
+    padding: var(--padding-md) 0;
+    margin: 0 var(--margin-md);
 }
 
 .lms-nav .nav-link.active {
@@ -1409,6 +1410,12 @@ pre {
   color: var(--text-color);
 }
 
+@media (min-width: 500px) {
+    .lms-nav .nav-item:first-child .nav-link {
+        margin-left: 0;
+    }
+}
+
 .lms-nav .nav-link:hover {
   color: inherit;
 }
@@ -1691,6 +1698,12 @@ li {
     cursor: pointer;
 }
 
+@media (min-width: 500px) {
+    .role:last-child {
+        margin-left: 5rem
+    }
+}
+
 .icon-xl {
     width: 2.75rem;
     height: 2.75rem;