d0436fb67c
These used to make sense in the past, when we had completely different look and feel. Plus even back then this was not super elegant way of showing that the tab container is draggable. Furthermore, currently, the tab container is quite distinguishable form its parent making it visible that the notebookbar-tabs-container has more content to show. Signed-off-by: Pedro Pinto Silva <pedro.silva@collabora.com> Change-Id: I6e4c0d5b3bc5e0e21d6cd470446d13b9811846ab
135 lines
2.9 KiB
CSS
135 lines
2.9 KiB
CSS
/* CSS specific for tablets. */
|
|
|
|
/* Disable tooltips when on touch devices */
|
|
.w2ui-tag .w2ui-tag-top {
|
|
display: none !important;
|
|
}
|
|
|
|
/* Make the upper toolbar scrollable using swipe as on phones. */
|
|
#toolbar-up > .w2ui-scroll-wrapper {
|
|
overflow-x: scroll !important;
|
|
scrollbar-width: none; /*css draft (firefox only)*/
|
|
-ms-scrollbar: none; /*ie*/
|
|
}
|
|
#toolbar-up > .w2ui-scroll-wrapper::-webkit-scrollbar { /*webkit only*/
|
|
display: none;
|
|
}
|
|
#toolbar-up .w2ui-scroll-left, #toolbar-up .w2ui-scroll-right{
|
|
background: none;
|
|
height: 100%;
|
|
width: 0px;
|
|
top: 0%;
|
|
box-shadow: 8px 0 13px 2px var(--color-primary), -6px 0px 6px 6px var(--color-primary);
|
|
border-radius: 0px;
|
|
}
|
|
#toolbar-up .w2ui-scroll-right{
|
|
right: 0;
|
|
-webkit-transform: rotate(180deg);
|
|
-moz-transform: rotate(180deg);
|
|
-ms-transform: rotate(180deg);
|
|
-o-transform: rotate(180deg);
|
|
transform: rotate(180deg);
|
|
}
|
|
|
|
/* Additions for the main menu. */
|
|
.main-nav {
|
|
margin: 0;
|
|
}
|
|
.main-nav.hasnotebookbar {
|
|
overflow: visible; /*make sure #Menubar's contents are visible*/
|
|
display: -webkit-flex;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
flex-direction: row;
|
|
-webkit-box-align: center;
|
|
-ms-flex-align: center;
|
|
-webkit-align-items: center;
|
|
align-items: center;
|
|
}
|
|
.hasnotebookbar{
|
|
overflow: auto hidden;
|
|
scrollbar-width: none;
|
|
-ms-overflow-style: none;
|
|
}
|
|
.hasnotebookbar::-webkit-scrollbar {
|
|
width: 0;
|
|
height: 0;
|
|
}
|
|
.vex-content .cool-annotation-img {
|
|
box-sizing: content-box !important;
|
|
}
|
|
|
|
/* pan tabs & overflow indicator */
|
|
|
|
.notebookbar-tabs-container > div {
|
|
white-space: nowrap;
|
|
-webkit-box-flex: 1;
|
|
-webkit-flex: 1 0 auto;
|
|
-ms-flex: 1 0 auto;
|
|
flex: 1 0 auto;
|
|
display: -webkit-box;
|
|
display: -webkit-flex;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
list-style-type: none;
|
|
}
|
|
|
|
.notebookbar-tabs-container::-webkit-scrollbar {
|
|
display: none;
|
|
}
|
|
.notebookbar-tabs-container {
|
|
position: relative;
|
|
z-index: 1;
|
|
overflow-x: auto;
|
|
overflow-y: hidden;
|
|
display: -webkit-box;
|
|
display: -webkit-flex;
|
|
display: -ms-flexbox;
|
|
display: inline-flex;
|
|
-webkit-box-pack: start;
|
|
-webkit-justify-content: flex-start;
|
|
-ms-flex-pack: start;
|
|
justify-content: flex-start;
|
|
-webkit-overflow-scrolling: touch;
|
|
-ms-overflow-style: -ms-autohiding-scrollbar;
|
|
-ms-autohiding-scrollbar: none;
|
|
scrollbar-width: none;
|
|
-webkit-flex-wrap: nowrap;
|
|
-ms-flex-wrap: nowrap;
|
|
flex-wrap: nowrap;
|
|
word-wrap: nowrap;
|
|
}
|
|
|
|
.main-nav.readonly.hasnotebookbar .notebookbar-tabs-container {
|
|
display: none;
|
|
}
|
|
|
|
.hasnotebookbar #document-titlebar {
|
|
position: static;
|
|
display: inline-flex;
|
|
margin: 0 32px 0 4px;
|
|
width: auto;
|
|
}
|
|
|
|
.main-nav.readonly.hasnotebookbar #document-titlebar {
|
|
width: auto;
|
|
}
|
|
|
|
.main-nav.readonly.hasnotebookbar #document-name-input {
|
|
min-width: 100%;
|
|
}
|
|
|
|
.main-nav.readonly.hasnotebookbar #document-title-pencil {
|
|
min-width: 24px;
|
|
margin: 0;
|
|
}
|
|
|
|
#coolwsd-version span:before,
|
|
#lokit-version > span:before {
|
|
content: ' (';
|
|
white-space: pre;
|
|
}
|
|
#coolwsd-version span:after,
|
|
#lokit-version > span:after {
|
|
content: ')';
|
|
}
|