jenkins-bot has submitted this change and it was merged.

Change subject: MediaWiki Theme: Add focus state for frameless button
......................................................................


MediaWiki Theme: Add focus state for frameless button

 - Use inset box shadow, same as other buttons
 - Increase right margin to add white space after label
 - The hover state doesn't get an outline anyway
 - Add frameless button with indicator to the demo

Bug: T87692
Change-Id: I6248b8294861fe3d41997f1143818c6ff4b1c6b3
---
M demos/pages/widgets.js
M src/themes/mediawiki/elements.less
2 files changed, 18 insertions(+), 1 deletion(-)

Approvals:
  Trevor Parscal: Looks good to me, approved
  jenkins-bot: Verified



diff --git a/demos/pages/widgets.js b/demos/pages/widgets.js
index c13249d..57f553a 100644
--- a/demos/pages/widgets.js
+++ b/demos/pages/widgets.js
@@ -432,6 +432,18 @@
                                                label: 'ButtonWidget 
(frameless, constructive, disabled)\u200E',
                                                align: 'top'
                                        }
+                               ),
+                               new OO.ui.FieldLayout(
+                                       new OO.ui.ButtonWidget( {
+                                               framed: false,
+                                               icon: 'picture',
+                                               indicator: 'down',
+                                               label: 'Labeled'
+                                       } ),
+                                       {
+                                               label: 'ButtonWidget 
(frameless, indicator)\u200E',
+                                               align: 'top'
+                                       }
                                )
                        ]
                } ),
diff --git a/src/themes/mediawiki/elements.less 
b/src/themes/mediawiki/elements.less
index c60b8fb..8ed4628 100644
--- a/src/themes/mediawiki/elements.less
+++ b/src/themes/mediawiki/elements.less
@@ -36,9 +36,13 @@
 
        &-frameless {
                > .oo-ui-buttonElement-button {
-                       &:hover,
                        &:focus {
+                               box-shadow: inset 0 0 0 1px rgba(0,0,0,0.2);
                                outline: none;
+                       }
+
+                       .oo-ui-indicatorElement-indicator {
+                               margin-right: 0em;
                        }
                }
 
@@ -46,6 +50,7 @@
                        > .oo-ui-buttonElement-button {
                                > .oo-ui-labelElement-label {
                                        margin-left: 0.25em;
+                                       margin-right: 0.25em;
                                }
                        }
                }

-- 
To view, visit https://gerrit.wikimedia.org/r/189949
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings

Gerrit-MessageType: merged
Gerrit-Change-Id: I6248b8294861fe3d41997f1143818c6ff4b1c6b3
Gerrit-PatchSet: 2
Gerrit-Project: oojs/ui
Gerrit-Branch: master
Gerrit-Owner: Prtksxna <psax...@wikimedia.org>
Gerrit-Reviewer: Bartosz DziewoƄski <matma....@gmail.com>
Gerrit-Reviewer: Esanders <esand...@wikimedia.org>
Gerrit-Reviewer: Prtksxna <psax...@wikimedia.org>
Gerrit-Reviewer: Trevor Parscal <tpars...@wikimedia.org>
Gerrit-Reviewer: jenkins-bot <>

_______________________________________________
MediaWiki-commits mailing list
MediaWiki-commits@lists.wikimedia.org
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits

Reply via email to