Horizontal scrolling on delivery activity modal #209

solex2006 · Sep 8, 2020 · 041d837 · 041d837
1 parent c252eba
commit 041d837
Show file tree

Hide file tree

Showing 10 changed files with 15 additions and 1,737 deletions.
diff --git a/SELI-Platform/client/stylesheet/editor.css b/SELI-Platform/client/stylesheet/editor.css
@@ -125,3 +125,9 @@
   color: #757575 !important;
   fill: #757575 !important;
 }
+
+@media only screen and (max-width: 1080px)  {
+  .editor-link-form-container {
+    width: calc(100% - 3vw);
+  }
+}
diff --git a/SELI-Platform/client/stylesheet/item.css b/SELI-Platform/client/stylesheet/item.css
@@ -453,10 +453,12 @@
 }
 
 .item-quiz-panel {
+  width: 100%;
   background-color: transparent !important;
 }
 
 .activity-parent-panel {
+  width: 100%;
   background-color: transparent !important;
 }
 
@@ -483,9 +485,8 @@
 
 .item-quiz-detail-container {
   position: relative;
-  width: 88%;
-  left: 5vw;
-  padding: 2.5vh 0;
+  width: calc(100% - 2vw);
+  padding: 2.5vh 1vw;
 }
 
 .item-quiz-detail {
@@ -532,7 +533,7 @@
 }
 
 .activity-item-container-instruction {
-  width: 100%;
+  width: calc(100% - 5%);
   padding: 1.5vh 2.5%;
   color: #616161;
 }

diff --git a/SELI-Platform/client/stylesheet/storytelling.css b/SELI-Platform/client/stylesheet/storytelling.css
@@ -405,7 +405,8 @@
   display: flex !important;
   position: relative !important;
   align-items: center !important;
-  width: 40vw !important;
+  min-width: 18vw;
+  width: calc(100% - 2vw) !important;
   margin-top: 1vh !important;
   padding: 1.5vh 1vw !important;
   transition: 0.5s !important;
@@ -434,6 +435,7 @@
   font-size: 0.95em;
   margin-left: 0.5vw;
   color: #333;
+  margin-right: 35px;
 }
 
 .story-item-text-secondary {

diff --git a/SELI-Platform/imports/components/course/items/ActivityItem.js b/SELI-Platform/imports/components/course/items/ActivityItem.js
@@ -673,7 +673,7 @@ export default class ActivityItem extends React.Component {
                     return(
                       <Paper 
                         onClick={() => this.selectStory(story._id, story.activity.name)} 
-                        elevation={story._id === this.state.storySelected ? 5 : 1} 
+                        elevation={story._id === this.state.storySelected ? 6 : 1.5} 
                         className="story-item-container"
                       >
                         <LibraryBooksIcon className="story-item-icon"/>