diff options
Diffstat (limited to 'src/client/views/MainView.scss')
-rw-r--r-- | src/client/views/MainView.scss | 166 |
1 files changed, 160 insertions, 6 deletions
diff --git a/src/client/views/MainView.scss b/src/client/views/MainView.scss index e1ddbc533..f1042ff50 100644 --- a/src/client/views/MainView.scss +++ b/src/client/views/MainView.scss @@ -102,6 +102,46 @@ user-select: none; } +.mainView-propertiesDragger { + background-color: rgb(140, 139, 139); + height: 55px; + width: 15.5px; + position: absolute; + top: 55%; + border: 1px black solid; + border-radius: 0; + border-top-left-radius: 10px; + border-bottom-left-radius: 10px; + border-right: unset; + z-index: 2; + + .mainView-propertiesDragger-icon { + width: 10px; + height: 10px; + float: left; + margin-left: 3px; + padding-top: 19px; + } + + &:hover { + cursor: pointer; + } +} + +.mainiView-propertiesView { + display: flex; + flex-direction: column; + width: 200px; + height: 100%; + position: absolute; + right: 0; + top: 0; + border-left: solid 1px; + z-index: 100000; + cursor: auto; + overflow-x: visible; +} + .mainView-flyoutContainer { display: flex; flex-direction: column; @@ -114,6 +154,111 @@ } } +.mainView-menuPanel { + + max-width: 95px; + background-color: black; + padding: 15px; + /* padding-right: 50px; */ + overflow-y: scroll; + overflow-x: hidden; + + .mainView-menuPanel-button { + width: 60px; + padding: 7.5px; + touch-action: none; + background: black; + transform-origin: top left; + margin-bottom: 5px; + margin-top: 5px; + margin-right: 25px; + border-radius: 8px; + + .mainView-menuPanel-button-label { + color: white; + margin-left: -6px; + border-radius: 8px; + width: 55px; + position: relative; + text-align: center; + font-size: 9.5px; + margin-top: 1px; + letter-spacing: normal; + padding: 3px; + background-color: inherit; + } + + .mainView-menuPanel-button-icon { + width: auto; + height: 35px; + padding: 5px; + } + + svg { + width: 95% !important; + height: 95%; + } + + &:hover { + background: rgb(61, 61, 61); + cursor: pointer; + } + } + + // .mainView-menuPanel-bottomButton { + // width: 45px; + // height: 45px; + // padding: 10px; + // pointer-events: all; + // touch-action: none; + // //border-radius: inherit; + // background: black; + // background-color: black; + // //border-radius: 100%; + // transform-origin: top left; + // margin-bottom: 20px; + // margin-top: 5px; + + // margin-right: 25px; + + // .mainView-menuPanel-bottomButton-label { + // background: black; + // color: white; + // margin-left: -10px; + // border-radius: 8px; + // width: 65px; + // position: absolute; + // text-align: center; + // font-size: 9.5px; + // margin-top: 2px; + // letter-spacing: normal; + // padding: 3px; + // //margin-bottom: 23px; + // } + + // .mainView-menuPanel-bottomButton-icon { + // width: 50px; + // height: 50px; + // color: white; + // } + + // svg { + // width: 95% !important; + // height: 95%; + // } + // } +} + +.mainView-searchPanel { + width: 100%; + height: 33px; + background-color: black; + color: white; + text-align: center; + vertical-align: middle; + padding-top: 6px; +} + .mainView-mainDiv { width: 100%; height: 100%; @@ -166,22 +311,31 @@ .mainView-expandFlyoutButton { position: absolute; - top: 100px; - right: 30px; + top: 120px; + right: 55px; cursor: pointer; } .mainView-libraryHandle { - width: 20px; + width: 28px; left: calc(100% - 10px); - height: 40px; + height: 55px; top: 50%; border: 1px solid black; - border-radius: 5px; + border-radius: 8px; position: absolute; z-index: 2; touch-action: none; - cursor: ew-resize; + cursor: grab; + + .mainView-libraryHandle-icon { + width: 10px; + height: 10px; + float: right; + margin-right: 3px; + padding-top: 19px; + } + } .mainView-workspace { |