aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/presentationview/PresElementBox.scss
diff options
context:
space:
mode:
authorusodhi <61431818+usodhi@users.noreply.github.com>2020-11-17 19:28:30 +0530
committerusodhi <61431818+usodhi@users.noreply.github.com>2020-11-17 19:28:30 +0530
commit86408e6d93fbe6501694371736fe74b81ed39cf3 (patch)
tree17b89a6209c66284f89e2636a8157435ce1045c0 /src/client/views/presentationview/PresElementBox.scss
parenta002e0e5c5910f78c8f3910ad4101386d30ebf70 (diff)
parent28dccafaa4aa446dd88c1b6f4218a0d7f79fa1bb (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.scss89
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