strepsirrhini/libreoffice-online
3
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 1
libreoffice-online/loleaflet/css/override-vex.css

139 lines
2.7 KiB
CSS
Raw Normal View History

Fix vex dialog close issues. Amazingly - due to a bug in vex, without an animation closing a dialog silently fails. cf. broken vex code determining hasAnimation which needs to handle empty states in missing css properties eg. -moz-animation-name. Change-Id: I9834b438d33c908f4f9e96274ce1c2603a22c1fa
2019-11-02 13:53:31 -05:00
@keyframes vex-fadeout {
CSS lint: Code refactoring - Detected many duplicated selectors within the same file (squashed them) - Detected inconsistency (sometimes spaces sometimes tabs). Tabify as in JS. - Detected quotes' inconsistency (sometimes none, sometimes '', sometimes ""). Use '' as in JS - Avoid touching on files from 3rd party sources (jquery, w2ui), ignore files Change-Id: Idd82945f29ac6c5c9f522e5d5df4a783a367654d Reviewed-on: https://gerrit.libreoffice.org/c/online/+/102009 Tested-by: Jenkins Tested-by: Jenkins CollaboraOffice <jenkinscollaboraoffice@gmail.com> Reviewed-by: Pedro Silva <pedro.silva@collabora.com>
2020-09-03 09:41:01 -05:00
0% {
opacity: 1; }
100% {
opacity: 0; } }
Fix vex dialog close issues. Amazingly - due to a bug in vex, without an animation closing a dialog silently fails. cf. broken vex code determining hasAnimation which needs to handle empty states in missing css properties eg. -moz-animation-name. Change-Id: I9834b438d33c908f4f9e96274ce1c2603a22c1fa
2019-11-02 13:53:31 -05:00
Fix z-index: about dialog, hamburger menu were appearing under edit FAB Change-Id: I0ef992ab221e3e3d96e1f35baa8c314fadd2e02f Reviewed-on: https://gerrit.libreoffice.org/81034 Reviewed-by: Szymon Kłos <szymon.klos@collabora.com> Tested-by: Szymon Kłos <szymon.klos@collabora.com>
2019-10-17 10:09:33 -05:00
/* Infobar */
.vex-theme-bottom-right-corner .vex-dialog-message {
font-size: 1em;
}
loleaflet: AlertDialog: Style link - wrap it in element - reduce size (it's not a title) - add URL icon/tag at the beginning so to avoiding scaring user when opening long links Signed-off-by: Pedro Pinto Silva <pedro.silva@collabora.com> Change-Id: I5c4bbec29d05ed49d034c4f11f740b5327c05d26
2021-03-05 04:51:48 -06:00
.vex-dialog-external-url::before {
content: 'URL';
border-radius: 3px;
padding: 1px 2px;
margin-right: 2px;
font-size: 11px;
border: thin solid lightgray;
CSS var: Add one more gray and replace instances Signed-off-by: Pedro Pinto Silva <pedro.silva@collabora.com> Change-Id: I8091ebd6e720dba8b6af4c503f515899e7f5f2d1
2021-03-16 05:22:12 -05:00
background: var(--gray-light-bg-color);
loleaflet: AlertDialog: Style link - wrap it in element - reduce size (it's not a title) - add URL icon/tag at the beginning so to avoiding scaring user when opening long links Signed-off-by: Pedro Pinto Silva <pedro.silva@collabora.com> Change-Id: I5c4bbec29d05ed49d034c4f11f740b5327c05d26
2021-03-05 04:51:48 -06:00
color: gray;
box-sizing: border-box;
vertical-align: top;
font-weight: bold;
}
.vex-dialog-external-url {
font-size: 16px;
loleaflet: Mobile: AlertDialog: Ensure normal font-weight - to avoid having the link in bold on smartphones Signed-off-by: Pedro Pinto Silva <pedro.silva@collabora.com> Change-Id: If2363f36af43ed1e19daad35c13ba395f4b55e92
2021-03-10 06:30:18 -06:00
font-weight: normal;
loleaflet: AlertDialog: Style link - wrap it in element - reduce size (it's not a title) - add URL icon/tag at the beginning so to avoiding scaring user when opening long links Signed-off-by: Pedro Pinto Silva <pedro.silva@collabora.com> Change-Id: I5c4bbec29d05ed49d034c4f11f740b5327c05d26
2021-03-05 04:51:48 -06:00
}
Fix z-index: about dialog, hamburger menu were appearing under edit FAB Change-Id: I0ef992ab221e3e3d96e1f35baa8c314fadd2e02f Reviewed-on: https://gerrit.libreoffice.org/81034 Reviewed-by: Szymon Kłos <szymon.klos@collabora.com> Tested-by: Szymon Kłos <szymon.klos@collabora.com>
2019-10-17 10:09:33 -05:00
/* Place above statusbar */
.vex.vex-theme-bottom-right-corner .vex-content {
bottom: 40px !important;
right: 10px !important;
}
/* Vex dialogs */
.vex-open .vex-overlay {
/* TODO: remove specific z-index from our codebase
so that the following line can also be removed */
z-index: 2000;
CSS lint: add more rules and fix problems - Fix duplicated properties (ignore cases where it's needed for browser compatibility); - Fix space inconsistencies before ! - Fix space inconsistencies after colon - Fix space inconsistencies after and before combinator (>, +, ~) - Invalid calc - Many rules added to json, namely no-extra-semicolons Change-Id: I78af6bc546aeb1d7d7090e2ef278c895f0393a07 Reviewed-on: https://gerrit.libreoffice.org/c/online/+/102289 Tested-by: Jenkins CollaboraOffice <jenkinscollaboraoffice@gmail.com> Reviewed-by: Pedro Silva <pedro.silva@collabora.com>
2020-09-09 04:02:15 -05:00
background-color: #1c5fa814;
Vex: bring back dimming but make it discreet though Change-Id: I8f036a85963a9861268971998115870a3087a9be Reviewed-on: https://gerrit.libreoffice.org/83978 Reviewed-by: Pedro Pinto da Silva <pedro.silva@collabora.com> Tested-by: Pedro Pinto da Silva <pedro.silva@collabora.com>
2019-11-28 04:06:31 -06:00
min-height: 100%;
Vex overlay: Add missing min-width rule Change-Id: I480c730273970400c2668f9d19efd768dd810c88 Reviewed-on: https://gerrit.libreoffice.org/84041 Reviewed-by: Pedro Pinto da Silva <pedro.silva@collabora.com> Tested-by: Pedro Pinto da Silva <pedro.silva@collabora.com>
2019-11-29 02:50:16 -06:00
min-width: 100%;
Vex: bring back dimming but make it discreet though Change-Id: I8f036a85963a9861268971998115870a3087a9be Reviewed-on: https://gerrit.libreoffice.org/83978 Reviewed-by: Pedro Pinto da Silva <pedro.silva@collabora.com> Tested-by: Pedro Pinto da Silva <pedro.silva@collabora.com>
2019-11-28 04:06:31 -06:00
position: absolute;
top: 0px;
Fix z-index: about dialog, hamburger menu were appearing under edit FAB Change-Id: I0ef992ab221e3e3d96e1f35baa8c314fadd2e02f Reviewed-on: https://gerrit.libreoffice.org/81034 Reviewed-by: Szymon Kłos <szymon.klos@collabora.com> Tested-by: Szymon Kłos <szymon.klos@collabora.com>
2019-10-17 10:09:33 -05:00
}
Style Paste special dialog and fix html structure - improve normal paste html structure - style special pasting - make sure we are using consistent font size across the board Signed-off-by: Pedro Pinto Silva <pedro.silva@collabora.com> Change-Id: I9a0942ce086c9c96082ef79aa0450c4aab7daf35
2021-04-22 09:49:32 -05:00
.vex-content .vex-footnote {
color: var(--gray-light-txt--color) !important;
font-size: 0.78em;
}
Fix z-index: about dialog, hamburger menu were appearing under edit FAB Change-Id: I0ef992ab221e3e3d96e1f35baa8c314fadd2e02f Reviewed-on: https://gerrit.libreoffice.org/81034 Reviewed-by: Szymon Kłos <szymon.klos@collabora.com> Tested-by: Szymon Kłos <szymon.klos@collabora.com>
2019-10-17 10:09:33 -05:00
/* dialog shown when user is idle */
.vex-open .loleaflet-user-idle {
Vex: idle: differentiate styles depending on device Change-Id: I236e64b2688e38c6651563f2c206a7b9276bae50 Reviewed-on: https://gerrit.libreoffice.org/82131 Reviewed-by: Michael Meeks <michael.meeks@collabora.com> Tested-by: Michael Meeks <michael.meeks@collabora.com>
2019-11-06 04:00:51 -06:00
background: #ffffffe0 !important;
font-size: xx-large !important;
color: #7a8592 !important;
text-align: center !important;
Fix z-index: about dialog, hamburger menu were appearing under edit FAB Change-Id: I0ef992ab221e3e3d96e1f35baa8c314fadd2e02f Reviewed-on: https://gerrit.libreoffice.org/81034 Reviewed-by: Szymon Kłos <szymon.klos@collabora.com> Tested-by: Szymon Kłos <szymon.klos@collabora.com>
2019-10-17 10:09:33 -05:00
}
.vex-open .loleaflet-user-idle .vex-dialog-buttons {
Vex: idle: differentiate styles depending on device Change-Id: I236e64b2688e38c6651563f2c206a7b9276bae50 Reviewed-on: https://gerrit.libreoffice.org/82131 Reviewed-by: Michael Meeks <michael.meeks@collabora.com> Tested-by: Michael Meeks <michael.meeks@collabora.com>
2019-11-06 04:00:51 -06:00
display: none !important;
Fix z-index: about dialog, hamburger menu were appearing under edit FAB Change-Id: I0ef992ab221e3e3d96e1f35baa8c314fadd2e02f Reviewed-on: https://gerrit.libreoffice.org/81034 Reviewed-by: Szymon Kłos <szymon.klos@collabora.com> Tested-by: Szymon Kłos <szymon.klos@collabora.com>
2019-10-17 10:09:33 -05:00
}
Fix vex dialog close issues. Amazingly - due to a bug in vex, without an animation closing a dialog silently fails. cf. broken vex code determining hasAnimation which needs to handle empty states in missing css properties eg. -moz-animation-name. Change-Id: I9834b438d33c908f4f9e96274ce1c2603a22c1fa
2019-11-02 13:53:31 -05:00
Desktop: Vex-bottom-right-corner: Fix missing z-index and remove duplicated rule Change-Id: I502aea7c7fb012a4464444ae415738a6c90b1306 Reviewed-on: https://gerrit.libreoffice.org/c/online/+/90414 Tested-by: Jenkins CollaboraOffice <jenkinscollaboraoffice@gmail.com> Tested-by: Pedro Pinto da Silva <pedro.silva@collabora.com> Reviewed-by: Pedro Pinto da Silva <pedro.silva@collabora.com>
2020-03-12 09:36:14 -05:00
.vex.vex-theme-plain, .vex.vex-theme-bottom-right-corner{
Fix z-index: about dialog, hamburger menu were appearing under edit FAB Change-Id: I0ef992ab221e3e3d96e1f35baa8c314fadd2e02f Reviewed-on: https://gerrit.libreoffice.org/81034 Reviewed-by: Szymon Kłos <szymon.klos@collabora.com> Tested-by: Szymon Kłos <szymon.klos@collabora.com>
2019-10-17 10:09:33 -05:00
z-index: 2001 !important;
}
Style Paste special dialog and fix html structure - improve normal paste html structure - style special pasting - make sure we are using consistent font size across the board Signed-off-by: Pedro Pinto Silva <pedro.silva@collabora.com> Change-Id: I9a0942ce086c9c96082ef79aa0450c4aab7daf35
2021-04-22 09:49:32 -05:00
.vex.vex-theme-plain .vex-content,
.vex-dialog-message {
font-size: 1.1em;
}
Fix z-index: about dialog, hamburger menu were appearing under edit FAB Change-Id: I0ef992ab221e3e3d96e1f35baa8c314fadd2e02f Reviewed-on: https://gerrit.libreoffice.org/81034 Reviewed-by: Szymon Kłos <szymon.klos@collabora.com> Tested-by: Szymon Kłos <szymon.klos@collabora.com>
2019-10-17 10:09:33 -05:00
.vex.vex-theme-plain .vex-content{
border: 1px solid #a4a4a4;
box-shadow: 0 -1px 2px 0 rgba(0, 0, 0, 0.15), 0 2px 2px 0 rgba(0, 0, 0, 0.1);
border-radius: 4px;
Desktop: disable outline on non form elements (vex dialogs) Example: Keyboard Shortcuts dialog was getting an getting an outline every-time it was being opened Signed-off-by: Pedro Pinto Silva <pedro.silva@collabora.com> Change-Id: I2be8ffa7678a71ecd51ea7477e70ba2ea4baac36
2020-10-28 08:28:59 -05:00
outline: none;
Fix z-index: about dialog, hamburger menu were appearing under edit FAB Change-Id: I0ef992ab221e3e3d96e1f35baa8c314fadd2e02f Reviewed-on: https://gerrit.libreoffice.org/81034 Reviewed-by: Szymon Kłos <szymon.klos@collabora.com> Tested-by: Szymon Kłos <szymon.klos@collabora.com>
2019-10-17 10:09:33 -05:00
}
Help dialogs: avoid closing it by mistake and make it selectable - Only close when user expressly pressed the close button - Make it possible to select text This type of dialogs with a lot of text should only be close when pressing close button so to avoid accidentally closing it. The text should also be selectable, allowing the user to save it in his own notes , to share or to use it to simply report something Fixes https://github.com/CollaboraOnline/online/issues/2357 Signed-off-by: Pedro Pinto Silva <pedro.silva@collabora.com> Change-Id: I88e01904bad4d0fa2504296c892e28ba6df9d112
2021-05-13 04:38:36 -05:00
.vex-selectable {
-webkit-touch-callout: text;
-webkit-user-select: text;
-khtml-user-select: text;
-moz-user-select: text;
-ms-user-select: text;
user-select: text;
}
Vex dialog: close btn: approximate style to regular dialogs Signed-off-by: Pedro Pinto Silva <pedro.silva@collabora.com> Change-Id: I7e25cfd716cba88364682dcf1093fa2224a1da5b
2020-11-12 04:37:29 -06:00
.vex.vex-theme-plain .vex-close:before {
width: 20px;
height: 20px;
line-height: 18px;
font-size: 30px;
Vex dialogs: Fix close vertical alignment on hover to match its height (that is comming from vex theme) Signed-off-by: Pedro Pinto Silva <pedro.silva@collabora.com> Change-Id: Ibffc3040d07afd2ea98af65a3aeaa041b0dc73fe
2020-11-12 04:12:52 -06:00
}
Fix vex dialog close issues. Amazingly - due to a bug in vex, without an animation closing a dialog silently fails. cf. broken vex code determining hasAnimation which needs to handle empty states in missing css properties eg. -moz-animation-name. Change-Id: I9834b438d33c908f4f9e96274ce1c2603a22c1fa
2019-11-02 13:53:31 -05:00
.vex-closing {
Resolved: Keyboard shortcut help window won't scroll Help usually don't fit in the resulting popup window, but wasn't possible to scroll. Change-Id: Iff14620730ba9cee6e679e4b6b69e84342019cd1 Reviewed-on: https://gerrit.libreoffice.org/84998 Tested-by: Jenkins CollaboraOffice <jenkinscollaboraoffice@gmail.com> Reviewed-by: Andras Timar <andras.timar@collabora.com>
2019-12-11 17:53:47 -06:00
-webkit-animation: vex-fadeout .25s forwards;
animation: vex-fadeout .25s forwards;
Fix vex dialog close issues. Amazingly - due to a bug in vex, without an animation closing a dialog silently fails. cf. broken vex code determining hasAnimation which needs to handle empty states in missing css properties eg. -moz-animation-name. Change-Id: I9834b438d33c908f4f9e96274ce1c2603a22c1fa
2019-11-02 13:53:31 -05:00
}
Vex: input fields: remove outdated width rule and add style Signed-off-by: Pedro Pinto Silva <pedro.silva@collabora.com> Change-Id: Ie825d15a12732e6f55b370460115227e45a43589
2021-02-16 06:42:01 -06:00
.vex.vex-theme-plain .vex-dialog-form .vex-dialog-input input{
border-radius: 3px;
box-shadow: inset 0 0 2px 0 lightgray;
Vex input field: ensure box-sizing to avoid padding affecting otter size anywhere Signed-off-by: Pedro Pinto Silva <pedro.silva@collabora.com> Change-Id: I45122bbb27d37de3bfb15f201c10a4888f2ff5c2
2021-03-02 05:19:58 -06:00
box-sizing: border-box;
Vex: input: fix paddings and widths (mobile and desktop) Change-Id: I0f1882ca785b211ffd18bdbc972c1152cfa3d275 Reviewed-on: https://gerrit.libreoffice.org/82126 Reviewed-by: Pedro Pinto da Silva <pedro.silva@collabora.com> Reviewed-by: Michael Meeks <michael.meeks@collabora.com> Tested-by: Michael Meeks <michael.meeks@collabora.com>
2019-11-06 03:12:40 -06:00
}
Fix vex dialog close issues. Amazingly - due to a bug in vex, without an animation closing a dialog silently fails. cf. broken vex code determining hasAnimation which needs to handle empty states in missing css properties eg. -moz-animation-name. Change-Id: I9834b438d33c908f4f9e96274ce1c2603a22c1fa
2019-11-02 13:53:31 -05:00
Resolved: Keyboard shortcut help window won't scroll Help usually don't fit in the resulting popup window, but wasn't possible to scroll. Change-Id: Iff14620730ba9cee6e679e4b6b69e84342019cd1 Reviewed-on: https://gerrit.libreoffice.org/84998 Tested-by: Jenkins CollaboraOffice <jenkinscollaboraoffice@gmail.com> Reviewed-by: Andras Timar <andras.timar@collabora.com>
2019-12-11 17:53:47 -06:00
.vex {
position: fixed;
overflow: auto;
left: 0;
right: 0;
top: 0;
bottom: 0;
}
Keyboard keys: Fix style inconsistencies fixes #2011 Signed-off-by: Pedro Pinto Silva <pedro.silva@collabora.com> Change-Id: I227fed8bc8838f09e878290650d47d000ac53801
2021-04-15 05:43:49 -05:00
/* Keyboard input keys */
kbd,
.kbd {
background-color: #eee;
border-radius: 3px;
border: 1px solid #dcdcdc;
box-shadow: 0 1px 1px 0px rgba(0,0,0,.2), 0 2px 0 0 rgba(255,255,255,.7) inset;
color: #555;
display: inline-block;
font-family: monospace;
font-size: .85em;
font-weight: 700;
line-height: 1;
padding: 4px;
white-space: nowrap;
}
.kbd--plus {
color: #ccc;
padding: 0 2px;
font-size: 0.65em;
warnCopyPaste: Fix layout - Remove unorthodox spaces before and after punctuation - The use of a list in this case is hurting the user: - Too wordy text - Inefficient use of space - Bullets work as a distraction and still focus from the verbs and the shortcuts - Fix: paragraph was wrapping a list - Replace with a table that is full width and it makes it easier to scan and understand what we are conveying Signed-off-by: Pedro Pinto Silva <pedro.silva@collabora.com> Change-Id: I12d6f433fa02f575c60f30f33c71ef820085e76e
2021-04-15 06:33:20 -05:00
}
.warn-copy-paste {
width: 100%;
}
Reference in a new issue Copy permalink