Petar.petkovic has uploaded a new change for review. (
https://gerrit.wikimedia.org/r/370200 )
Change subject: CX2: Adjust spacing for cards
......................................................................
CX2: Adjust spacing for cards
Make separator line go from edge to edge
Adjust card spacings to adhere to style guidelines
Align drop-down menus
Bug: T168280
Bug: T168283
Change-Id: I99b9bf61592afda42ba11525a44727ddbe024b25
---
M modules/tools/styles/mw.cx.tools.InstructionsTool.less
M modules/tools/styles/mw.cx.tools.LinkTool.less
M modules/tools/styles/mw.cx.tools.MachineTranslationTool.less
M modules/tools/styles/mw.cx.tools.NewLinkTool.less
M modules/tools/styles/mw.cx.tools.TemplateTool.less
M modules/ui/styles/widgets/mw.cx.ui.TranslationToolWidget.less
6 files changed, 26 insertions(+), 12 deletions(-)
git pull
ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/ContentTranslation
refs/changes/00/370200/1
diff --git a/modules/tools/styles/mw.cx.tools.InstructionsTool.less
b/modules/tools/styles/mw.cx.tools.InstructionsTool.less
index 83bd60f..09b93d5 100644
--- a/modules/tools/styles/mw.cx.tools.InstructionsTool.less
+++ b/modules/tools/styles/mw.cx.tools.InstructionsTool.less
@@ -15,18 +15,18 @@
margin-right: auto;
overflow: hidden;
clear: both;
- border-bottom: 1px solid #ddd;
- padding: 10px 10px 20px 10px;
+ border-bottom: 1px solid @colorGray13;
+ padding: 8px 16px;
font-size: 16px;
word-wrap: break-word;
- background-color: #fff;
+ background-color: @white;
}
.card-instructions-guidelines {
.mw-ui-item;
text-align: center;
color: @color-primary;
- padding: 10px;
+ padding: 8px 16px;
font-size: 14px;
}
diff --git a/modules/tools/styles/mw.cx.tools.LinkTool.less
b/modules/tools/styles/mw.cx.tools.LinkTool.less
index 3728767..e1adb79 100644
--- a/modules/tools/styles/mw.cx.tools.LinkTool.less
+++ b/modules/tools/styles/mw.cx.tools.LinkTool.less
@@ -2,7 +2,7 @@
.cx-card-sourcelink,
.cx-card-targetlink {
- padding-left: 30%;
+ padding: 8px 0 8px 30%;
background-repeat: no-repeat;
.background-image-svg('../images/link_lightgray.svg',
'../images/link_lightgray.png');
background-size: 30% 100%;
@@ -12,8 +12,12 @@
z-index: 1;
.cx-widget-translationtool-header {
- padding: 0;
margin: 0;
+
+ .card__title,
+ .card__title--language {
+ padding: 0;
+ }
.card__title--language {
float: right;
@@ -22,6 +26,7 @@
.cx-widget-translationtool-container {
.cx-tools-link-info {
.mw-ui-one-whole;
+ padding: 0;
}
.cx-tools-link-text {
@@ -44,6 +49,7 @@
.cx-tools-link-remove-button {
.mw-ui-one-half;
margin-right: 0;
+ padding: 0;
}
}
diff --git a/modules/tools/styles/mw.cx.tools.MachineTranslationTool.less
b/modules/tools/styles/mw.cx.tools.MachineTranslationTool.less
index 1e41925..238c0fd 100644
--- a/modules/tools/styles/mw.cx.tools.MachineTranslationTool.less
+++ b/modules/tools/styles/mw.cx.tools.MachineTranslationTool.less
@@ -5,6 +5,7 @@
.card-mt-providers-menu {
.mw-ui-item;
.mw-ui-one-whole;
+ padding: 0;
.oo-ui-dropdownWidget-handle {
background-color: @white;
}
@@ -13,5 +14,5 @@
}
.card-mt-providers-menu-reset {
- border-bottom: 4px solid #eaecf0;
+ border-bottom: 4px solid @colorGray14;
}
diff --git a/modules/tools/styles/mw.cx.tools.NewLinkTool.less
b/modules/tools/styles/mw.cx.tools.NewLinkTool.less
index aeadd5f..3391595 100644
--- a/modules/tools/styles/mw.cx.tools.NewLinkTool.less
+++ b/modules/tools/styles/mw.cx.tools.NewLinkTool.less
@@ -2,6 +2,7 @@
.cx-card-newlink {
transition: all 0.3s;
+ padding: 8px 16px;
.cx-widget-translationtool-header {
display: none;
diff --git a/modules/tools/styles/mw.cx.tools.TemplateTool.less
b/modules/tools/styles/mw.cx.tools.TemplateTool.less
index cac4854..7cf5dcb 100644
--- a/modules/tools/styles/mw.cx.tools.TemplateTool.less
+++ b/modules/tools/styles/mw.cx.tools.TemplateTool.less
@@ -5,9 +5,15 @@
.card-template-actions-menu {
.mw-ui-item;
.mw-ui-two-thirds;
+ padding: 0;
.oo-ui-dropdownWidget-handle {
background-color: @white;
}
}
}
+ .cx-widget-translationtool-header {
+ .card__title {
+ padding: 0;
+ }
+ }
}
diff --git a/modules/ui/styles/widgets/mw.cx.ui.TranslationToolWidget.less
b/modules/ui/styles/widgets/mw.cx.ui.TranslationToolWidget.less
index 06376bf..95673e9 100644
--- a/modules/ui/styles/widgets/mw.cx.ui.TranslationToolWidget.less
+++ b/modules/ui/styles/widgets/mw.cx.ui.TranslationToolWidget.less
@@ -1,8 +1,9 @@
@import '../../../widgets/common/ext.cx.common.less';
+@card-padding: 8px 16px;
.cx-card {
background-color: #fff;
- padding: 8px 16px;
+ padding: 0;
border-radius: 2px;
box-shadow: 0 2px 2px rgba( 0, 0, 0, 0.25 );
margin-bottom: 20px;
@@ -22,19 +23,19 @@
.cx-widget-translationtool-header {
.mw-ui-item;
- padding: 5px 10px;
+ padding: @card-padding;
clear: both;
}
.cx-widget-translationtool-container {
.mw-ui-item;
- padding: 5px 10px;
+ padding: @card-padding;
clear: both;
}
.cx-widget-translationtool-actions {
.mw-ui-item;
- padding: 5px 10px;
+ padding: @card-padding;
clear: both;
border-top: 1px solid #eee;
}
@@ -44,7 +45,6 @@
.mw-ui-item;
.mw-ui-one-half;
color: @colorGray7;
- padding: 4px;
}
.card__title--language {
--
To view, visit https://gerrit.wikimedia.org/r/370200
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: I99b9bf61592afda42ba11525a44727ddbe024b25
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/extensions/ContentTranslation
Gerrit-Branch: master
Gerrit-Owner: Petar.petkovic <ppetko...@wikimedia.org>
_______________________________________________
MediaWiki-commits mailing list
MediaWiki-commits@lists.wikimedia.org
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
