add styles for courses module & tasks-components

Author: Awakich

projects/social_platform/src/app/office/courses/detail/course-detail.component.scss

@@ -28,9 +28,9 @@ $detail-bar-mb: 12px;
 
   &__cover {
     position: relative;
+    width: 100%;
     height: 136px;
     border-radius: 15px 15px 0 0;
-    width: 100%;
 
     img {
       position: absolute;

projects/social_platform/src/app/office/courses/detail/info/info.component.scss

@@ -48,11 +48,11 @@
     position: relative;
     height: 48px;
     padding: 10px;
+    margin-bottom: 18px;
     text-align: center;
     background-color: var(--light-white);
     border: 0.5px solid var(--medium-grey-for-outline);
     border-radius: var(--rounded-lg);
-    margin-bottom: 18px;
 
     &--cover {
       position: absolute;

projects/social_platform/src/app/office/courses/lesson/shared/exclude-task/exclude-task.component.scss

@@ -9,7 +9,6 @@
   &--hasContent {
     display: flex;
     flex-direction: row-reverse;
-
   }
 
   &__answer {
@@ -21,8 +20,8 @@
 
     &--hasContent {
       display: flex;
-      align-items: center;
       flex-direction: column;
+      align-items: center;
       align-self: center;
       justify-content: center;
 

projects/social_platform/src/app/office/courses/lesson/shared/file-task/file-task.component.scss

@@ -109,8 +109,8 @@
 
   &__image {
     width: 100%;
-    height: 100%;
     max-width: 110px;
+    height: 100%;
     max-height: 150px;
     border-radius: var(--rounded-lg);
 

projects/social_platform/src/app/office/courses/lesson/shared/radio-select-task/radio-select-task.component.scss

@@ -105,10 +105,10 @@
       display: flex;
       flex-direction: column;
       gap: 5px;
-      text-align: center;
       align-items: center;
       justify-content: center;
       max-width: 333px;
+      text-align: center;
     }
   }
 

projects/social_platform/src/app/office/courses/lesson/shared/write-task/write-task.component.scss

@@ -28,11 +28,11 @@
 
   &__description,
   &__text {
-    margin-top: 23px;
-    white-space: pre-line;
     display: flex;
     flex-direction: column;
     gap: 10px;
+    margin-top: 23px;
+    white-space: pre-line;
 
     &--hasVideo {
       display: flex;

projects/social_platform/src/app/office/courses/shared/course/course.component.scss

@@ -42,8 +42,8 @@
 
   &__image {
     width: 100%;
-    height: 100%;
     max-width: 333px;
+    height: 100%;
     max-height: 137px;
     border-radius: var(--rounded-lg);
   }
@@ -60,15 +60,15 @@
   }
 
   &__action {
-    display: flex;
-    align-items: center;
-    gap: 5px;
-
     position: absolute;
     right: 14px;
     bottom: 16px;
+    display: flex;
+    gap: 5px;
+    align-items: center;
 
-    &--started, &-icon {
+    &--started,
+    &-icon {
       color: var(--green) !important;
     }
   }

projects/social_platform/src/app/ui/components/file-item/file-item.component.scss

@@ -19,8 +19,8 @@
 
   &__left {
     display: flex;
-    align-items: center;
     gap: 5px;
+    align-items: center;
   }
 
   &__meta {
@@ -34,9 +34,9 @@
     justify-content: center;
     width: 35px;
     height: 35px;
+    cursor: pointer;
     border: 0.5px solid var(--medium-grey-for-outline);
     border-radius: var(--rounded-xxl);
-    cursor: pointer;
 
     &--delete {
       color: var(--red);
@@ -49,8 +49,8 @@
     }
 
     &--file {
-      cursor: pointer;
       color: var(--accent);
+      cursor: pointer;
     }
   }
 }

projects/social_platform/src/app/ui/components/snackbar/snackbar.component.scss

@@ -35,7 +35,7 @@
   }
 
   &--info {
-    background-color: var(--lime);
     color: var(--black);
+    background-color: var(--lime);
   }
 }