Jdlrobson has uploaded a new change for review. (
https://gerrit.wikimedia.org/r/359360 )
Change subject: Hygiene: Migrate various Minerva specific styles to skinStyles
......................................................................
Hygiene: Migrate various Minerva specific styles to skinStyles
Given these modules are not very generic, let's make them skin
styles. This allows us to retain the generic library but skin
them appropriately.
Change-Id: I4456c950d95d3708388d7ccc8138c70e855eb843
---
M extension.json
M resources/mobile.toggle/toggle.less
A skinStyles/mobile.fallbackeditor.styles/FIXME.txt
R skinStyles/mobile.fallbackeditor.styles/minerva.less
A skinStyles/mobile.notifications.overlay/minerva.less
R skinStyles/mobile.pointerOverlay/minerva.less
M skinStyles/mobile.search/SearchOverlay.less
M skinStyles/mobile.startup/Overlay.less
A skinStyles/mobile.toggle/minerva.less
9 files changed, 116 insertions(+), 50 deletions(-)
git pull ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/MobileFrontend
refs/changes/60/359360/1
diff --git a/extension.json b/extension.json
index a4ffe10..ab92c1a 100644
--- a/extension.json
+++ b/extension.json
@@ -958,9 +958,6 @@
"messages": [
"mobile-frontend-pointer-dismiss"
],
- "styles": [
-
"resources/mobile.pointerOverlay/PointerOverlay.less"
- ],
"scripts": [
"resources/mobile.pointerOverlay/PointerOverlay.js"
],
@@ -1516,9 +1513,6 @@
"mobile.fallbackeditor.styles": {
"targets": [
"mobile"
- ],
- "styles": [
-
"resources/mobile.fallbackeditor.styles/fallbackeditor.less"
]
},
"skins.minerva.backtotop": {
@@ -1632,6 +1626,15 @@
"@note5": "Do not use it for modules which non-ResourceLoaderFileModule
classes (T167478).",
"ResourceModuleSkinStyles": {
"minerva": {
+ "mobile.toggle": [
+ "skinStyles/mobile.toggle/minerva.less"
+ ],
+ "mobile.pointerOverlay": [
+ "skinStyles/mobile.pointerOverlay/minerva.less"
+ ],
+ "mobile.fallbackeditor.styles": [
+
"skinStyles/mobile.fallbackeditor.styles/minerva.less"
+ ],
"mobile.startup": [
"skinStyles/mobile.startup/toast.less",
"skinStyles/mobile.startup/Overlay.less"
diff --git a/resources/mobile.toggle/toggle.less
b/resources/mobile.toggle/toggle.less
index 01f1759..3fd61ac 100644
--- a/resources/mobile.toggle/toggle.less
+++ b/resources/mobile.toggle/toggle.less
@@ -1,32 +1,3 @@
-/* Styling of sections and toggling
-moved from beta_common.css in
-Change-Id: I683d029d09340a460b02016c5c4fbd6ada5a9b35
-*/
-@import 'mobile.variables';
-
-.client-js {
- .collapsible-heading,
- .collapsible-block {
- clear: both;
- }
-
- .collapsible-heading {
- cursor: pointer;
- position: relative;
-
- .indicator {
- float: left;
- margin-top: 0.7em;
- font-size: @indicatorFontSize;
- }
- }
-
- .collapsible-block {
- // bug 41401 - without this content doesn't always take up
whole width
- width: 100%;
- }
-}
-
@media print {
.collapsible-heading .indicator,
.collapsible-heading .edit-page {
diff --git a/skinStyles/mobile.fallbackeditor.styles/FIXME.txt
b/skinStyles/mobile.fallbackeditor.styles/FIXME.txt
new file mode 100644
index 0000000..04330d3
--- /dev/null
+++ b/skinStyles/mobile.fallbackeditor.styles/FIXME.txt
@@ -0,0 +1,2 @@
+This should be a skinStyle of mediawiki.action.edit.styles. The reason it
isn't is that mediawiki.action.edit.styles ships unnecessary styles inside the
'styles' property of the ResourceLoader module.
+
diff --git a/resources/mobile.fallbackeditor.styles/fallbackeditor.less
b/skinStyles/mobile.fallbackeditor.styles/minerva.less
similarity index 100%
rename from resources/mobile.fallbackeditor.styles/fallbackeditor.less
rename to skinStyles/mobile.fallbackeditor.styles/minerva.less
diff --git a/skinStyles/mobile.notifications.overlay/minerva.less
b/skinStyles/mobile.notifications.overlay/minerva.less
new file mode 100644
index 0000000..3a26bcb
--- /dev/null
+++ b/skinStyles/mobile.notifications.overlay/minerva.less
@@ -0,0 +1,34 @@
+@import 'minerva.variables';
+
+.notifications-overlay .overlay-content {
+ top: @headerHeight;
+ bottom: @headerHeight;
+
+ .mw-echo-ui-notificationsWidget {
+ top: @headerHeight;
+ }
+}
+
+@media all and ( min-width: @deviceWidthTablet ) {
+ .notifications-overlay {
+ .mw-echo-notification {
+ padding: 1.75em @contentPaddingTablet;
+ }
+ .overlay-header .cancel {
+ // 0 because we want to have some tappable area to the
left of the icon
+ left: 0;
+ }
+ .overlay-header {
+ padding-left: 0;
+ padding-right: 0;
+ }
+
+ .overlay-header,
+ .overlay-content {
+ max-width: none;
+ .content {
+ margin: 0 @contentMargin;
+ }
+ }
+ }
+}
diff --git a/resources/mobile.pointerOverlay/PointerOverlay.less
b/skinStyles/mobile.pointerOverlay/minerva.less
similarity index 82%
rename from resources/mobile.pointerOverlay/PointerOverlay.less
rename to skinStyles/mobile.pointerOverlay/minerva.less
index abfbe4c..508bb1f 100644
--- a/resources/mobile.pointerOverlay/PointerOverlay.less
+++ b/skinStyles/mobile.pointerOverlay/minerva.less
@@ -1,7 +1,3 @@
-@import 'mobile.variables';
-
-// FIXME: `mobile.` LESS modules should not import `minerva.` LESS modules.
-// Move Minerva specific rules into skinStyles.
@import 'minerva.variables';
@media all and ( min-width: @deviceWidthTablet ) {
@@ -19,7 +15,8 @@
top: 0;
left: 0;
right: 0;
- padding: 1em @contentMargin;
+ padding-top: 1em;
+ padding-bottom: 1em;
line-height: 1.4;
font-size: 0.9em;
text-align: center;
@@ -76,7 +73,7 @@
}
&.pointer-overlay-compact {
- background: @toastNotificationColor;
+ background: @colorGray2;
width: auto;
/* @noflip */
right: auto;
@@ -84,18 +81,11 @@
// Pointer color nested so it may be changed in other tutorials
.tutorial-pointer {
- border-bottom-color: @toastNotificationColor;
+ border-bottom-color: @colorGray2;
}
p {
margin: 0;
}
- }
-}
-
-.navigation-drawer {
- .pointer-overlay {
- right: auto;
- width: @menuWidth;
}
}
diff --git a/skinStyles/mobile.search/SearchOverlay.less
b/skinStyles/mobile.search/SearchOverlay.less
index 31987d3..e70325d 100644
--- a/skinStyles/mobile.search/SearchOverlay.less
+++ b/skinStyles/mobile.search/SearchOverlay.less
@@ -3,6 +3,31 @@
// These styles transform the SearchOverlay appearance in the Minerva skin.
// Since SearchOverlay can be used by other skins, these styles are kept
separate from
// the others.
+
+.search-overlay {
+ .spinner-container {
+ top: @headerHeight;
+ }
+
+ .clear {
+ position: absolute;
+ top: ( @headerHeight / 2 ) - ( @iconSize / 2 );
+ right: 0;
+ margin-top: @headerMarginTop;
+ }
+}
+
+.results {
+ // Since search results only contain one line, shrink the space taken
up by the thumbnails
+ li {
+ padding-left: @headerHeight;
+
+ .list-thumb {
+ width: @headerHeight;
+ }
+ }
+}
+
@media all and ( min-width: @deviceWidthTablet ) {
.search-overlay {
.search-box {
diff --git a/skinStyles/mobile.startup/Overlay.less
b/skinStyles/mobile.startup/Overlay.less
index 783c76c..5f3c641 100644
--- a/skinStyles/mobile.startup/Overlay.less
+++ b/skinStyles/mobile.startup/Overlay.less
@@ -1,10 +1,27 @@
@import 'minerva.variables';
@import 'minerva.mixins';
-.overlay .license {
+.overlay {
+ padding-top: @headerHeight;
+
.license {
.secondary-text();
}
+
+ .header-action {
+ a,
+ button {
+ height: @headerHeight;
+ }
+ }
+
+ .slider-button {
+ top: @headerHeight;
+ }
+
+ > ul, button {
+ width: @headerHeight;
+ }
}
@media all and ( min-width: @wgMFDeviceWidthDesktop ) {
diff --git a/skinStyles/mobile.toggle/minerva.less
b/skinStyles/mobile.toggle/minerva.less
new file mode 100644
index 0000000..82cbf25
--- /dev/null
+++ b/skinStyles/mobile.toggle/minerva.less
@@ -0,0 +1,24 @@
+@import 'minerva.variables';
+
+.client-js {
+ .collapsible-heading,
+ .collapsible-block {
+ clear: both;
+ }
+
+ .collapsible-heading {
+ cursor: pointer;
+ position: relative;
+
+ .indicator {
+ float: left;
+ margin-top: 0.7em;
+ font-size: @indicatorFontSize;
+ }
+ }
+
+ .collapsible-block {
+ // bug 41401 - without this content doesn't always take up
whole width
+ width: 100%;
+ }
+}
--
To view, visit https://gerrit.wikimedia.org/r/359360
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: I4456c950d95d3708388d7ccc8138c70e855eb843
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/extensions/MobileFrontend
Gerrit-Branch: master
Gerrit-Owner: Jdlrobson <[email protected]>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
