diff options
| author | usodhi <61431818+usodhi@users.noreply.github.com> | 2020-11-17 19:28:30 +0530 |
|---|---|---|
| committer | usodhi <61431818+usodhi@users.noreply.github.com> | 2020-11-17 19:28:30 +0530 |
| commit | 86408e6d93fbe6501694371736fe74b81ed39cf3 (patch) | |
| tree | 17b89a6209c66284f89e2636a8157435ce1045c0 /src/client/views/presentationview/PresElementBox.scss | |
| parent | a002e0e5c5910f78c8f3910ad4101386d30ebf70 (diff) | |
| parent | 28dccafaa4aa446dd88c1b6f4218a0d7f79fa1bb (diff) | |
Merge branch 'master' of https://github.com/browngraphicslab/Dash-Web into acls_uv
Diffstat (limited to 'src/client/views/presentationview/PresElementBox.scss')
| -rw-r--r-- | src/client/views/presentationview/PresElementBox.scss | 89 |
1 files changed, 72 insertions, 17 deletions
diff --git a/src/client/views/presentationview/PresElementBox.scss b/src/client/views/presentationview/PresElementBox.scss index f1bdb7737..73a08b6de 100644 --- a/src/client/views/presentationview/PresElementBox.scss +++ b/src/client/views/presentationview/PresElementBox.scss @@ -2,7 +2,6 @@ $light-blue: #AEDDF8; $dark-blue: #5B9FDD; $light-background: #ececec; $slide-background: #d5dce2; -$slide-hover: #98b7da; $slide-active: #5B9FDD; .presItem-container { @@ -25,7 +24,7 @@ $slide-active: #5B9FDD; align-items: center; .presItem-number { - margin-top: 7px; + margin-top: 3.5px; font-size: 12px; font-weight: 700; text-align: center; @@ -36,7 +35,6 @@ $slide-active: #5B9FDD; overflow: hidden; } - } .presItem-slide { @@ -44,19 +42,20 @@ $slide-active: #5B9FDD; background-color: #d5dce2; border-radius: 5px; height: calc(100% - 7px); - width: calc(100% - 5px); + width: calc(100% - 15px); display: grid; - grid-template-rows: 23px auto; + grid-template-rows: 16px 10px auto; grid-template-columns: max-content max-content max-content max-content auto; .presItem-name { + min-width: 20px; z-index: 300; + top: 2px; align-self: center; - font-size: 13px; + font-size: 11px; font-family: Roboto; font-weight: 500; position: relative; - top: 1px; padding-left: 10px; padding-right: 10px; letter-spacing: normal; @@ -66,20 +65,40 @@ $slide-active: #5B9FDD; white-space: pre; } + .presItem-docName { + min-width: 20px; + z-index: 300; + align-self: center; + font-size: 9px; + font-family: Roboto; + font-weight: 300; + position: relative; + padding-left: 10px; + padding-right: 10px; + letter-spacing: normal; + width: max-content; + text-overflow: ellipsis; + overflow: hidden; + white-space: pre; + grid-row: 2; + grid-column: 1/6; + } + .presItem-time { align-self: center; position: relative; - top: 2px; padding-right: 10px; + top: 1px; font-size: 10; font-weight: 300; font-family: Roboto; z-index: 300; letter-spacing: normal; } - + .presItem-embedded { overflow: hidden; + grid-row: 3; grid-column: 1/8; position: relative; display: flex; @@ -90,7 +109,7 @@ $slide-active: #5B9FDD; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; } - + .presItem-embeddedMask { width: 100%; height: 100%; @@ -106,6 +125,7 @@ $slide-active: #5B9FDD; .presItem-slideButtons { display: flex; grid-column: 7; + grid-row: 1/3; width: 60px; justify-self: right; justify-content: flex-end; @@ -115,10 +135,10 @@ $slide-active: #5B9FDD; position: relative; border-radius: 100%; z-index: 300; - width: 15px; - height: 15px; + width: 18px; + height: 18px; display: flex; - font-size: 10px; + font-size: 12px; justify-self: center; align-self: center; background-color: rgba(0, 0, 0, 0.5); @@ -131,17 +151,52 @@ $slide-active: #5B9FDD; .slideButton:hover { background-color: rgba(0, 0, 0, 1); - transform: scale(1.15); + transform: scale(1.2); } } } + + .presItem-slide.active { box-shadow: 0 0 0px 1.5px $dark-blue; } -// .presItem-slide:hover { -// background: $slide-hover; -// } +.presItem-multiDrag { + font-family: Roboto; + font-weight: 600; + color: white; + text-align: center; + justify-content: center; + align-content: center; + width: 100px; + height: 30px; + position: absolute; + background-color: $dark-blue; + z-index: 4000; + border-radius: 10px; + box-shadow: black 0.4vw 0.4vw 0.8vw; + line-height: 30px; +} + +.presItem-miniSlide { + font-weight: 700; + font-size: 12; + grid-column: 1/8; + align-self: center; + justify-self: center; + background-color: #d5dce2; + width: 26px; + text-align: center; + height: 26px; + line-height: 28px; + border-radius: 100%; +} +.presItem-miniSlide.active { + box-shadow: 0 0 0px 1.5px $dark-blue; +} +// .presItem-slide:hover { +// background: $slide-hover; +// }
\ No newline at end of file |
