Pginer has uploaded a new change for review. https://gerrit.wikimedia.org/r/257873
Change subject: Adjust the visual hierarchy of suggestion items ...................................................................... Adjust the visual hierarchy of suggestion items Styling changes to: - Reduce the size of the image and item information from 100px to 90px - Increase in size and weight for title to clarify the text hierarchy. - Adjust element padding to facilitate scanning. - Actions vertically aligned. - Items missing an image show an article icon instead of a link as a placeholde$ Bug:T120930 Change-Id: I2a11ecb206be6b63349a76d0b5c026d1c6b8eeed --- A modules/dashboard/images/page_lightgray.png A modules/dashboard/images/page_lightgray.svg M modules/dashboard/styles/ext.cx.lists.common.less M modules/dashboard/styles/ext.cx.suggestionlist.less M modules/dashboard/styles/ext.cx.translationlist.less 5 files changed, 55 insertions(+), 12 deletions(-) git pull ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/ContentTranslation refs/changes/73/257873/1 diff --git a/modules/dashboard/images/page_lightgray.png b/modules/dashboard/images/page_lightgray.png new file mode 100644 index 0000000..7d3a5c8 --- /dev/null +++ b/modules/dashboard/images/page_lightgray.png Binary files differ diff --git a/modules/dashboard/images/page_lightgray.svg b/modules/dashboard/images/page_lightgray.svg new file mode 100644 index 0000000..03ccf75 --- /dev/null +++ b/modules/dashboard/images/page_lightgray.svg @@ -0,0 +1,33 @@ +<?xml version="1.0" encoding="UTF-8" standalone="no"?> +<!-- Created with Inkscape (http://www.inkscape.org/) --> + +<svg + xmlns:dc="http://purl.org/dc/elements/1.1/"; + xmlns:cc="http://creativecommons.org/ns#"; + xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"; + xmlns:svg="http://www.w3.org/2000/svg"; + xmlns="http://www.w3.org/2000/svg"; + version="1.1" + width="100%" + height="100%" + viewBox="0 0 612 792" + id="svg2"> + <metadata + id="metadata12"> + <rdf:RDF> + <cc:Work + rdf:about=""> + <dc:format>image/svg+xml</dc:format> + <dc:type + rdf:resource="http://purl.org/dc/dcmitype/StillImage"; /> + <dc:title></dc:title> + </cc:Work> + </rdf:RDF> + </metadata> + <defs + id="defs10" /> + <path + d="M 321.38473,365.23084 H 444.46169 V 211.38473 H 321.38473 V 365.23084 z M 167.53835,426.76915 H 444.46169 V 395.99996 H 167.53835 v 30.76919 z m 0,61.53861 H 444.46169 V 457.53861 H 167.53835 v 30.76915 z m 0,61.53835 H 444.46169 V 519.07692 H 167.53835 v 30.76919 z M 290.61531,272.92304 H 167.53835 v 30.76915 h 123.07696 v -30.76915 z m 0,61.53862 H 167.53835 v 30.76918 h 123.07696 v -30.76918 z m 0,-123.07693 H 167.53835 v 30.76915 H 290.61531 V 211.38473 z M 106,149.84612 H 506 V 642.15388 H 198.30781 C 146,642.15388 106,602.15388 106,549.84611 V 149.84612 z" + id="path5" + style="fill:#dddddd;fill-opacity:1" /> +</svg> diff --git a/modules/dashboard/styles/ext.cx.lists.common.less b/modules/dashboard/styles/ext.cx.lists.common.less index 72a5a31..c41d4e7 100644 --- a/modules/dashboard/styles/ext.cx.lists.common.less +++ b/modules/dashboard/styles/ext.cx.lists.common.less @@ -3,7 +3,7 @@ .cx-tlitem, .cx-slitem { .mw-ui-one-whole; - padding: 5px; + padding: 8px; background-color: #fff; border: 1px solid #ddd; border-bottom: 0; @@ -110,9 +110,9 @@ .cx-slitem__image { .mw-ui-one-sixth; padding: 0; - width: 100px; - min-height: 100px; - .background-image-svg('../../tools/images/link_lightgray.svg', '../../tools/images/link_lightgray.png'); + width: 90px; + min-height: 90px; + .background-image-svg('../../dashboard/images/page_lightgray.svg', '../../dashboard/images/page_lightgray.png'); background-repeat: no-repeat; background-color: #fbfbfb; background-position: center center; diff --git a/modules/dashboard/styles/ext.cx.suggestionlist.less b/modules/dashboard/styles/ext.cx.suggestionlist.less index bddf027..23c6cef 100644 --- a/modules/dashboard/styles/ext.cx.suggestionlist.less +++ b/modules/dashboard/styles/ext.cx.suggestionlist.less @@ -63,21 +63,22 @@ .cx-slitem__desc { color: #555; font-size: 1.2em; - padding: 10px 0; + padding: 5px 0; clear: both; text-align: left; } .cx-slitem__details { .mw-ui-four-sixths; - padding-left: 15px; + padding-left: 10px; position: relative; - height: 100px; + min-height: 90px; font-size: small; .cx-slitem__translation-link { .mw-ui-one-whole; - font-size: large; + font-size: 1.5em; + font-weight: bolder; text-decoration: none; padding-left: 0; cursor: pointer; @@ -96,6 +97,8 @@ .cx-slitem__actions { .mw-ui-one-sixth; float: right; + position: relative; + padding-top: 90px/2 - 30px/2; } .cx-slitem__action { @@ -105,6 +108,11 @@ height: 30px; background-repeat: no-repeat; background-position: center center; + opacity: 0.8; + + &:hover{ + opacity: 1; + } &--discard { background-size: 16px; @@ -123,6 +131,7 @@ &--nonfavorite, &--favorite:hover { .background-image-svg('../images/star-green.svg', '../images/star-green.png'); + opacity: 1; } } diff --git a/modules/dashboard/styles/ext.cx.translationlist.less b/modules/dashboard/styles/ext.cx.translationlist.less index 6f2b065..1af370a 100644 --- a/modules/dashboard/styles/ext.cx.translationlist.less +++ b/modules/dashboard/styles/ext.cx.translationlist.less @@ -66,9 +66,9 @@ .cx-tlitem__details { .mw-ui-four-fifths; - padding-left: 15px; + padding-left: 10px; position: relative; - height: 100px; + height: 90px; font-size: 12px; color: #fff; @@ -94,13 +94,14 @@ .last-updated { color: #565656; clear: both; - padding: 10px 0; + padding: 5px 0 10px 0; } .translation-link { .mw-ui-one-whole; - font-size: large; + font-size: 1.5em; + font-weight: bolder; text-decoration: none; padding-left: 0; -- To view, visit https://gerrit.wikimedia.org/r/257873 To unsubscribe, visit https://gerrit.wikimedia.org/r/settings Gerrit-MessageType: newchange Gerrit-Change-Id: I2a11ecb206be6b63349a76d0b5c026d1c6b8eeed Gerrit-PatchSet: 1 Gerrit-Project: mediawiki/extensions/ContentTranslation Gerrit-Branch: master Gerrit-Owner: Pginer <[email protected]> _______________________________________________ MediaWiki-commits mailing list [email protected] https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
