diff options
| author | geireann <geireann.lindfield@gmail.com> | 2021-07-30 13:26:25 -0400 |
|---|---|---|
| committer | geireann <geireann.lindfield@gmail.com> | 2021-07-30 13:26:25 -0400 |
| commit | c9f379adab864132e6cf044f808a43254601e4bb (patch) | |
| tree | 9474a6e05be18f9bd626f4cae616be3513dbc4ad /src/client/views/presentationview/PresElementBox.scss | |
| parent | b33e45f1f839b3c6eaf1076e605abacd1bc6883c (diff) | |
major UI / updates + refactoring
Diffstat (limited to 'src/client/views/presentationview/PresElementBox.scss')
| -rw-r--r-- | src/client/views/presentationview/PresElementBox.scss | 235 |
1 files changed, 0 insertions, 235 deletions
diff --git a/src/client/views/presentationview/PresElementBox.scss b/src/client/views/presentationview/PresElementBox.scss deleted file mode 100644 index 1ad4b820e..000000000 --- a/src/client/views/presentationview/PresElementBox.scss +++ /dev/null @@ -1,235 +0,0 @@ -$light-blue: #AEDDF8; -$dark-blue: #5B9FDD; -$light-background: #ececec; -$slide-background: #d5dce2; -$slide-active: #5B9FDD; - -.presItem-container { - cursor: grab; - display: grid; - grid-template-columns: 20px auto; - font-family: Roboto; - letter-spacing: normal; - position: relative; - pointer-events: all; - width: 100%; - height: 100%; - font-weight: 400; - -webkit-touch-callout: none; - -webkit-user-select: none; - -khtml-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - align-items: center; - - .presItem-number { - margin-top: 3.5px; - font-size: 12px; - font-weight: 700; - text-align: center; - justify-self: center; - align-self: flex-start; - position: relative; - display: inline-block; - overflow: hidden; - } - -} - -.presItem-slide { - position: relative; - background-color: #d5dce2; - border-radius: 5px; - height: calc(100% - 7px); - width: calc(100% - 15px); - display: grid; - 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: 11px; - font-family: Roboto; - font-weight: 500; - position: relative; - padding-left: 10px; - padding-right: 10px; - letter-spacing: normal; - width: max-content; - text-overflow: ellipsis; - overflow: hidden; - 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; - 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; - width: auto; - justify-content: center; - margin: auto; - margin-bottom: 2px; - border-bottom-left-radius: 5px; - border-bottom-right-radius: 5px; - } - - .presItem-embeddedMask { - width: 100%; - height: 100%; - position: absolute; - border-radius: 3px; - top: 0; - left: 0; - z-index: 1; - overflow: hidden; - } - - - .presItem-slideButtons { - display: flex; - grid-column: 7; - grid-row: 1/3; - width: max-content; - justify-self: right; - justify-content: flex-end; - - .slideButton { - cursor: pointer; - position: relative; - border-radius: 100px; - z-index: 300; - width: 18px; - height: 18px; - display: flex; - font-size: 12px; - justify-self: center; - align-self: center; - background-color: rgba(0, 0, 0, 0.5); - color: white; - justify-content: center; - align-items: center; - transition: 0.2s; - margin-right: 3px; - } - - .slideButton:hover { - background-color: rgba(0, 0, 0, 1); - transform: scale(1.2); - } - } -} - -// .presItem-slide:hover { -// .presItem-slideButtons { -// display: flex; -// grid-column: 7; -// grid-row: 1/3; -// width: max-content; -// justify-self: right; -// justify-content: flex-end; - -// .slideButton { -// cursor: pointer; -// position: relative; -// border-radius: 100px; -// z-index: 300; -// width: 18px; -// height: 18px; -// display: flex; -// font-size: 12px; -// justify-self: center; -// align-self: center; -// background-color: rgba(0, 0, 0, 0.5); -// color: white; -// justify-content: center; -// align-items: center; -// transition: 0.2s; -// margin-right: 3px; -// } - -// .slideButton:hover { -// background-color: rgba(0, 0, 0, 1); -// transform: scale(1.2); -// } -// } -// } - -.presItem-slide.active { - box-shadow: 0 0 0px 1.5px $dark-blue; -} - -.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 |
