Kaldari has uploaded a new change for review.
https://gerrit.wikimedia.org/r/145443
Change subject: Improvements for viewing mobile site on very small screens
(<=280px)
......................................................................
Improvements for viewing mobile site on very small screens (<=280px)
Hide the watchlist star.
Add a border around the search field so that it is clear where to
click.
Change-Id: I9ce307ad687a376596cebb9088ef49c3738f9823
---
M includes/skins/MinervaTemplate.php
M less/common/icons.less
M less/common/ui.less
M less/modules/search/SearchOverlay.less
4 files changed, 32 insertions(+), 3 deletions(-)
git pull ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/MobileFrontend
refs/changes/43/145443/1
diff --git a/includes/skins/MinervaTemplate.php
b/includes/skins/MinervaTemplate.php
index 1a63505..81d5cb0 100644
--- a/includes/skins/MinervaTemplate.php
+++ b/includes/skins/MinervaTemplate.php
@@ -332,7 +332,7 @@
// FIXME: change this
into a search icon instead of a text button
echo
$this->makeSearchButton(
'fulltext',
- array( 'class'
=> 'no-js-only icon icon-search' )
+ array( 'class'
=> 'fulltext-search no-js-only icon icon-search' )
);
?>
</form>
diff --git a/less/common/icons.less b/less/common/icons.less
index 9a11d97..88d1f49 100644
--- a/less/common/icons.less
+++ b/less/common/icons.less
@@ -218,6 +218,13 @@
}
}
+// Hide the watchlist star on small screens
+@media all and (max-width: @wgMFDeviceWidthMobileSmall) {
+ .watch-this-article {
+ display: none;
+ }
+}
+
// Icon (search)
//
// Renders a search icon.
diff --git a/less/common/ui.less b/less/common/ui.less
index 35e2633..0a76a56 100644
--- a/less/common/ui.less
+++ b/less/common/ui.less
@@ -69,7 +69,20 @@
// FIXME: Overrides rules in common.less for input area that are
present in reset.less - should be unnecessary
.search {
border: none;
- padding: 0;
+ padding: .3em .1em;
+ }
+
+ .fulltext-search {
+ margin-left: 0.6em;
+ }
+}
+
+// Make search input clear for users on small screens
+@media all and (max-width: @wgMFDeviceWidthMobileSmall) {
+ .header {
+ .search {
+ border: 1px solid @grayLight;
+ }
}
}
diff --git a/less/modules/search/SearchOverlay.less
b/less/modules/search/SearchOverlay.less
index 3b7ce19..73667f8 100644
--- a/less/modules/search/SearchOverlay.less
+++ b/less/modules/search/SearchOverlay.less
@@ -12,7 +12,7 @@
input {
border: none;
- padding: 0;
+ padding: .3em .1em;
}
.search-content {
@@ -53,3 +53,12 @@
box-shadow: 0 1px 5px 0 rgba(117, 117, 117, .5);
}
}
+
+// Make search input clear for users on small screens
+@media all and (max-width: @wgMFDeviceWidthMobileSmall) {
+ .search-overlay {
+ input {
+ border: 1px solid @grayLight;
+ }
+ }
+}
--
To view, visit https://gerrit.wikimedia.org/r/145443
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: I9ce307ad687a376596cebb9088ef49c3738f9823
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/extensions/MobileFrontend
Gerrit-Branch: master
Gerrit-Owner: Kaldari <[email protected]>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
