8eaa96840b
Remove the now necessary max-width from tablets - We now have those parent elements being set as flex box and thus we have now no need to limit the max width of this container - Plus by limiting the max-width we were hiding more of the tabs while not gaining anything useful in return Signed-off-by: Pedro Pinto Silva <pedro.silva@collabora.com> Change-Id: I1ef477902fd95a4751009f8bf08350b6ce88aa97
151 lines
3.3 KiB
CSS
151 lines
3.3 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;
|
|
}
|
|
|
|
.notebookbar-tabs-container:after,
|
|
.notebookbar-tabs-container:before {
|
|
content: '';
|
|
position: relative;
|
|
z-index: -1;
|
|
display: block;
|
|
min-width: 2rem;
|
|
margin: 0;
|
|
-webkit-box-flex: 1;
|
|
-webkit-flex: 1 0 auto;
|
|
-ms-flex: 1 0 auto;
|
|
flex: 1 0 auto;
|
|
max-width: 2rem;
|
|
box-shadow: 0px 0 13px 2px var(--color-primary), 0px 0px 26px 6px var(--color-primary-lighter);
|
|
}
|
|
|
|
.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: ')';
|
|
}
|