loleaflet/css/mobilewizard.css | 6 +++---
loleaflet/css/notebookbar.css | 32 ++++++++++++++++++++++++--------
2 files changed, 27 insertions(+), 11 deletions(-)
New commits:
commit 65e3a8de12693a4e32b8d0250b1cacdf580ca50a
Author: Pedro Pinto Silva <pedro.si...@collabora.com>
AuthorDate: Mon Jul 27 13:16:25 2020 +0200
Commit: Pedro Silva <pedro.si...@collabora.com>
CommitDate: Mon Jul 27 16:25:02 2020 +0200
Notebookbar: Aesthetic fixes and make sure mobilewizard rules from mobile
do not affect desktop
* Some rules from mobile were affecting notebookbar layout (e.g.: writer:
tab table)
* Fix paddings in every .unolabel
* Adjust .unoarrow and add hover state
* Remove duplicated selectors (mobilewizard.css)
* Add rules (from mobilewizard.css) that are needed uin the notebookbar to
notebookbar.css with proper parent: .hasnotebookbar
Change-Id: I22282c53ede39d7952bde1ea9625b4d928aaaea0
Reviewed-on: https://gerrit.libreoffice.org/c/online/+/99477
Tested-by: Jenkins CollaboraOffice <jenkinscollaboraoff...@gmail.com>
Tested-by: Jenkins
Reviewed-by: Pedro Silva <pedro.si...@collabora.com>
diff --git a/loleaflet/css/mobilewizard.css b/loleaflet/css/mobilewizard.css
index 7bd7cb36c..127e12dfd 100644
--- a/loleaflet/css/mobilewizard.css
+++ b/loleaflet/css/mobilewizard.css
@@ -646,17 +646,17 @@ a.leaflet-control-zoom-in {
vertical-align: top;
padding-left: 4%;
}
-#buttonnone + label, #buttonbefore + label, #buttonafter + label,
#buttonoptimal + label, #buttonparallel + label, #buttonnone + label,
#buttonthrough + label{
+#buttonnone + label, #buttonbefore + label, #buttonafter + label,
#buttonoptimal + label, #buttonparallel + label, #buttonthrough + label{
padding-left: 0;
}
#Color > img{
border-radius:100px;
background-color: #696969;
}
-#SendToBack > span, #ObjectBackOne > span, #ObjectForwardOne > span,
#BringToFront > span, #SetObjectToBackground > span, #SetObjectToForeground >
span, #FlipVertical > span, #FlipHorizontal > span, #Bold > span, #Italic >
span, #Underline > span, #Strikeout > span, #StyleApply > span,
#StyleUpdateByExample > span, #StyleNewByExample > span, #Shadowed > span,
#Grow > span, #Shrink > span, #Color > span, #Spacing > span, #SuperScript >
span, #SubScript > span, #AlignLeft > span, #AlignRight > span,
#AlignHorizontalCenter > span, #AlignBlock > span, #ParaLeftToRight > span,
#ParaRightToLeft > span, #AlignTop > span, #AlignVCenter > span, #AlignBottom >
span, #IncrementIndent > span, #DecrementIndent > span, #LeftPara > span,
#RightPara > span, #CenterPara > span, #JustifyPara > span, #DefaultBullet >
span, #DefaultNumbering > span, #ParaspaceIncrease > span, #ParaspaceDecrease >
span, #LineSpacing > span, #HangingIndent > span, #CellVertTop > span,
#CellVertCenter > span, #CellVertBot
tom > span, .mobile-wizard > div[id*='Table'] > span, div[id*='Row'] > span,
div[id*='Column'] > span, .mobile-wizard > div[id*='Cell'] > span,
div[id^=Outline] > span, #nolines > img{
+#mobile-wizard #SendToBack > span, #mobile-wizard #ObjectBackOne > span,
#mobile-wizard #ObjectForwardOne > span, #mobile-wizard #BringToFront > span,
#mobile-wizard #SetObjectToBackground > span, #mobile-wizard
#SetObjectToForeground > #mobile-wizard span, #mobile-wizard #FlipVertical >
span, #mobile-wizard #FlipHorizontal > span, #mobile-wizard #Bold > span,
#mobile-wizard #Italic > span, #mobile-wizard #Underline > span, #mobile-wizard
#Strikeout > span, #mobile-wizard #StyleApply > span, #mobile-wizard
#StyleUpdateByExample > span, #mobile-wizard #StyleNewByExample > span,
#mobile-wizard #Shadowed > span, #mobile-wizard #Grow > span, #mobile-wizard
#Shrink > span, #mobile-wizard #Color > span, #mobile-wizard #Spacing > span,
#mobile-wizard #SuperScript > span, #mobile-wizard #SubScript > span,
#mobile-wizard #AlignLeft > span, #mobile-wizard #AlignRight > span,
#mobile-wizard #AlignHorizontalCenter > span, #mobile-wizard #AlignBlock >
span, #mobile-wizard #ParaLeftToRight > spa
n, #mobile-wizard #ParaRightToLeft > span, #mobile-wizard #AlignTop > span,
#mobile-wizard #AlignVCenter > span, #mobile-wizard #AlignBottom > span,
#mobile-wizard #IncrementIndent > span, #mobile-wizard #DecrementIndent > span,
#mobile-wizard #LeftPara > span, #mobile-wizard #RightPara > span,
#mobile-wizard #CenterPara > span, #mobile-wizard #JustifyPara > span,
#mobile-wizard #DefaultBullet > span, #mobile-wizard #DefaultNumbering > span,
#mobile-wizard #ParaspaceIncrease > span, #mobile-wizard #ParaspaceDecrease >
span, #mobile-wizard #LineSpacing > span, #mobile-wizard #HangingIndent > span,
#mobile-wizard #CellVertTop > span, #mobile-wizard #CellVertCenter > span,
#mobile-wizard #CellVertBottom > span, #mobile-wizard div[id*='Table'] > span,
#mobile-wizard div[id*='Row'] > span, #mobile-wizard div[id*='Column'] > span,
#mobile-wizard div[id*='Cell'] > span, #mobile-wizard div[id^='Outline'] >
span, #mobile-wizard #nolines > img{
display: none !important;
}
-#SendToBack, #ObjectBackOne, #ObjectForwardOne, #BringToFront,
#SetObjectToBackground, #SetObjectToForeground, #FlipVertical, #FlipHorizontal,
#Bold, #Italic, #Underline, #Strikeout, #StyleApply, #StyleUpdateByExample,
#StyleNewByExample, #Shadowed, #Grow, #Shrink, #Spacing, #SuperScript,
#SubScript,#AlignLeft, #AlignRight, #AlignHorizontalCenter, #AlignBlock,
#ParaRightToLeft, #ParaLeftToRight, #AlignTop, #AlignVCenter, #AlignBottom,
#IncrementIndent, #DecrementIndent, #LeftPara, #RightPara, #CenterPara,
#JustifyPara, #DefaultBullet, #DefaultNumbering, #ParaspaceIncrease,
#ParaspaceDecrease, #LineSpacing, #HangingIndent, #CellVertTop,
#CellVertCenter, #CellVertBottom, #ParaspaceIncrease, #ParaspaceDecrease,
div[id*='Row'], div[id*='Column'], #DeleteTable, #MergeCells, div[id^=Outline],
.mobile-wizard > #EntireCell, .mobile-wizard > #SelectTable, .mobile-wizard >
#EntireColumn, .mobile-wizard > #EntireRow, .mobile-wizard > #SplitCell,
.mobile-wizard > #SplitTable{
+#mobile-wizard #SendToBack, #mobile-wizard #ObjectBackOne, #mobile-wizard
#ObjectForwardOne, #mobile-wizard #BringToFront, #mobile-wizard
#SetObjectToBackground, #mobile-wizard #SetObjectToForeground, #mobile-wizard
#FlipVertical, #mobile-wizard #FlipHorizontal, #mobile-wizard #Bold,
#mobile-wizard #Italic, #mobile-wizard #Underline, #Strikeout, #mobile-wizard
#StyleApply, #mobile-wizard #StyleUpdateByExample, #mobile-wizard
#StyleNewByExample, #mobile-wizard #Shadowed, #mobile-wizard #Grow,
#mobile-wizard #Shrink, #mobile-wizard #Spacing, #mobile-wizard #SuperScript,
#mobile-wizard #SubScript, #mobile-wizard #AlignLeft, #mobile-wizard
#AlignRight, #mobile-wizard #AlignHorizontalCenter, #mobile-wizard #AlignBlock,
#mobile-wizard #ParaRightToLeft, #mobile-wizard #ParaLeftToRight,
#mobile-wizard #AlignTop, #mobile-wizard #AlignVCenter, #mobile-wizard
#AlignBottom, #mobile-wizard #IncrementIndent, #mobile-wizard #DecrementIndent,
#mobile-wizard #LeftPara, #mobile-wizard #RightPara, #mo
bile-wizard #CenterPara, #mobile-wizard #JustifyPara, #mobile-wizard
#DefaultBullet, #mobile-wizard #DefaultNumbering, #mobile-wizard
#ParaspaceIncrease, #mobile-wizard #ParaspaceDecrease, #mobile-wizard
#LineSpacing, #mobile-wizard #HangingIndent, #mobile-wizard #CellVertTop,
#mobile-wizard #CellVertCenter, #mobile-wizard #CellVertBottom, #mobile-wizard
div[id*='Row'], #mobile-wizard div[id*='Column'], #mobile-wizard #DeleteTable,
#mobile-wizard #MergeCells, #mobile-wizard div[id^='Outline'], #mobile-wizard
#EntireCell, #mobile-wizard #SelectTable, #mobile-wizard #EntireColumn,
#mobile-wizard #EntireRow, #mobile-wizard #SplitCell, #mobile-wizard
#SplitTable{
padding: 16px 28px 16px 4% !important;
margin: 0px !important;
float:left;
diff --git a/loleaflet/css/notebookbar.css b/loleaflet/css/notebookbar.css
index 906cbb76a..09626e911 100644
--- a/loleaflet/css/notebookbar.css
+++ b/loleaflet/css/notebookbar.css
@@ -100,7 +100,22 @@
/* unobuttons */
-div[id*='Row'].notebookbar, div[id*='Column'].notebookbar,
#SendToBack.notebookbar, #ObjectBackOne.notebookbar,
#ObjectForwardOne.notebookbar, #BringToFront.notebookbar,
#SetObjectToBackground.notebookbar, #SetObjectToForeground.notebookbar,
#FlipVertical.notebookbar, #FlipHorizontal.notebookbar, #Bold.notebookbar,
#Italic.notebookbar, #Underline.notebookbar, #Strikeout.notebookbar,
#StyleApply.notebookbar, #StyleUpdateByExample.notebookbar,
#StyleNewByExample.notebookbar, #Shadowed.notebookbar, #Grow.notebookbar,
#Shrink.notebookbar, #Spacing.notebookbar, #SuperScript.notebookbar,
#SubScript.notebookbar,#AlignLeft.notebookbar, #AlignRight.notebookbar,
#AlignHorizontalCenter.notebookbar, #AlignBlock.notebookbar,
#ParaRightToLeft.notebookbar, #ParaLeftToRight.notebookbar,
#AlignTop.notebookbar, #AlignVCenter.notebookbar, #AlignBottom.notebookbar,
#IncrementIndent.notebookbar, #DecrementIndent.notebookbar,
#LeftPara.notebookbar, #RightPara.notebookbar, #CenterPara.notebookbar, #Justif
yPara.notebookbar, #DefaultBullet.notebookbar, #DefaultNumbering.notebookbar,
#ParaspaceIncrease.notebookbar, #ParaspaceDecrease.notebookbar,
#LineSpacing.notebookbar, #HangingIndent.notebookbar, #CellVertTop.notebookbar,
#CellVertCenter.notebookbar, #CellVertBottom.notebookbar,
#ParaspaceIncrease.notebookbar, #ParaspaceDecrease.notebookbar,
#DeleteTable.notebookbar, #MergeCells.notebookbar{
+.hasnotebookbar .ui-content .unobutton {
+ width: 32px;
+ height: 32px;
+ margin-right: 5px;
+ vertical-align: middle;
+}
+
+.hasnotebookbar .ui-content.unobutton.selected {
+ -webkit-filter: grayscale(0) brightness(90%) sepia(90%)
hue-rotate(-179deg) saturate(800%) contrast(0.7);
+ filter: grayscale(0) brightness(90%) sepia(90%) hue-rotate(-179deg)
saturate(800%) contrast(0.7);
+ box-shadow: 0 0 0px 8px #e6e6e640;
+ border-radius: 0.1px;
+ background-color: #e6e6e640;
+}
+
+div[id*='Row'].notebookbar, div[id*='Column'].notebookbar,
#SendToBack.notebookbar, #ObjectBackOne.notebookbar,
#ObjectForwardOne.notebookbar, #BringToFront.notebookbar,
#SetObjectToBackground.notebookbar, #SetObjectToForeground.notebookbar,
#FlipVertical.notebookbar, #FlipHorizontal.notebookbar, #Bold.notebookbar,
#Italic.notebookbar, #Underline.notebookbar, #Strikeout.notebookbar,
#StyleApply.notebookbar, #StyleUpdateByExample.notebookbar,
#StyleNewByExample.notebookbar, #Shadowed.notebookbar, #Grow.notebookbar,
#Shrink.notebookbar, #Spacing.notebookbar, #SuperScript.notebookbar,
#SubScript.notebookbar,#AlignLeft.notebookbar, #AlignRight.notebookbar,
#AlignHorizontalCenter.notebookbar, #AlignBlock.notebookbar,
#ParaRightToLeft.notebookbar, #ParaLeftToRight.notebookbar,
#AlignTop.notebookbar, #AlignVCenter.notebookbar, #AlignBottom.notebookbar,
#IncrementIndent.notebookbar, #DecrementIndent.notebookbar,
#LeftPara.notebookbar, #RightPara.notebookbar, #CenterPara.notebookbar, #Justif
yPara.notebookbar, #DefaultBullet.notebookbar, #DefaultNumbering.notebookbar,
#ParaspaceIncrease.notebookbar, #ParaspaceDecrease.notebookbar,
#LineSpacing.notebookbar, #HangingIndent.notebookbar, #CellVertTop.notebookbar,
#CellVertCenter.notebookbar, #CellVertBottom.notebookbar,
#DeleteTable.notebookbar, #MergeCells.notebookbar{
padding: 0px !important;
margin: 0px 5px 0px 0px !important;
}
@@ -128,17 +143,18 @@ div[id*='Row'].notebookbar,
div[id*='Column'].notebookbar, #SendToBack.notebookb
.unotoolbutton.notebookbar .unolabel {
font-family: var(--loleaflet-font);
color: var(--gray-light-txt--color);
- padding-left: 5px !important;
+ padding: 0px 5px !important;
}
.unotoolbutton.notebookbar .unoarrow {
- margin-left: 5px;
- border: solid #555;
- border-width: 0 3px 3px 0;
+ border: 4px solid transparent;
+ border-top: 5px solid #8D99A7;
display: inline-block;
- padding: 3px;
- transform: rotate(45deg);
- -webkit-transform: rotate(45deg);
+ margin-left: 3px;
+}
+
+.unotoolbutton.notebookbar:hover .unoarrow {
+ border-top: 5px solid #4c566a;
}
.unotoolbutton.notebookbar .unobutton.selected {
_______________________________________________
Libreoffice-commits mailing list
libreoffice-comm...@lists.freedesktop.org
https://lists.freedesktop.org/mailman/listinfo/libreoffice-commits
