wikimedia/mediawiki-extensions-TemplateData
1
0
Fork 0
mirror of https://gerrit.wikimedia.org/r/mediawiki/extensions/TemplateData synced 2024-11-27 17:20:01 +00:00
Code Issues Packages Projects Releases Wiki Activity

Make use of LESS features for more structured CSS

Browse source 
This patch includes two bugfixes:
1. The previous rule with a `p + p` didn't do what it was supposed to
   do. It was adding a margin after the 2nd, 3rd and all following <p>
   elements, but not between the 1st and the 2nd. It should have been
   margin-top instead. The approach in this patch is different and
   avoids the need to repead the 0.5em.
2. The red background color was not applied to the input fields any
   more because OOUI doesn't use <input> elements any more.

Change-Id: Ia57b742e8b3cd29c1f55cd7e918f26f70eebab18
This commit is contained in:
Thiemo Kreuz 2022-08-08 11:46:27 +02:00 committed by WMDE-Fisch
parent f92fed31c7
commit d36356326a
2 changed files with 53 additions and 50 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
modules/ext.templateDataGenerator.editTemplatePage/templateDataGenerator.placeholder.less
View file

@ -2,6 +2,6 @@
content: '\00a0'; content: '\00a0';
display: block; display: block;
line-height: 1.42857143em; /* Mirroring the button's line-height */ line-height: 1.42857143em; /* Mirroring the button's line-height */
padding-top: 12px; /* Mirroring the button's ( 5px padding + 1px border ) * 2 = 12 */ padding-top: ( 5px + 1px ) * 2; /* Mirroring the button's 5px padding + 1px border */
padding-bottom: 1em; /* Mirroring the .tdg-editscreen-main margin, but as padding to not collapse */ padding-bottom: 1em; /* Mirroring the .tdg-editscreen-main margin, but as padding to not collapse */
} }

41
modules/ext.templateDataGenerator.editTemplatePage/templateDataGenerator.ui.less
View file

@ -11,65 +11,68 @@
} }
.tdg-templateDataDialog-panels .oo-ui-messageWidget p { .tdg-templateDataDialog-panels .oo-ui-messageWidget p {
margin: 0; &:first-child {
margin-top: 0;
} }
.tdg-templateDataDialog-panels .oo-ui-messageWidget p + p { &:last-child {
margin-bottom: 0.5em; margin-bottom: 0;
}
} }
.tdg-editscreen-input-error input, .tdg-editscreen-input-error .oo-ui-inputWidget-input {
.tdg-editscreen-input-error.oo-ui-inputWidget input.oo-ui-inputWidget-input {
background-color: #ffa3a3; background-color: #ffa3a3;
} }
.tdg-templateDataParamWidget { .tdg-templateDataParamWidget {
padding-right: 0.5em; padding-right: 0.5em;
}
.tdg-templateDataParamWidget .oo-ui-iconElement-icon { .oo-ui-iconElement-icon {
opacity: 0.2; opacity: 0.2;
} }
/* Hover events sometimes fire while dragging, so limit to highlighted widgets */ /* Hover events sometimes fire while dragging, so limit to highlighted widgets */
.tdg-templateDataParamWidget.oo-ui-optionWidget-highlighted .oo-ui-iconElement-icon:hover { &.oo-ui-optionWidget-highlighted .oo-ui-iconElement-icon:hover {
opacity: 0.5; opacity: 0.5;
} }
}
.tdg-templateDataParamWidget-param-name, .tdg-templateDataParamWidget-param {
.tdg-templateDataParamWidget-param-aliases, &-name,
.tdg-templateDataParamWidget-param-description { &-aliases,
&-description {
white-space: nowrap; white-space: nowrap;
text-overflow: ellipsis; text-overflow: ellipsis;
overflow: hidden; overflow: hidden;
} }
.tdg-templateDataParamWidget-param-name { &-name {
font-weight: bold; font-weight: bold;
} }
.tdg-templateDataParamWidget-param-aliases { &-aliases {
float: right; float: right;
font-size: 0.9em; font-size: 0.9em;
padding: 1px; padding: 1px;
} }
.tdg-templateDataParamWidget-param-description { &-description {
color: #666; color: #666;
} }
.tdg-templateDataParamWidget-param-alias { &-alias {
border-radius: 0.3em; border-radius: 0.3em;
padding: 0.125em 0.25em; padding: 0.125em 0.25em;
margin-left: 0.5em; margin-left: 0.5em;
color: #999; color: #999;
background-color: #eee; background-color: #eee;
border: solid 1px #ddd; border: solid 1px #ddd;
}
.tdg-templateDataParamWidget-param-alias:first-child { &:first-child {
background-color: #fff; background-color: #fff;
} }
}
}
.tdg-templateDataParamWidget-paramList-param-description { .tdg-templateDataParamWidget-paramList-param-description {
clear: both; clear: both;
@ -79,13 +82,13 @@
.tdg-templateDataParamImportWidget { .tdg-templateDataParamImportWidget {
display: block; display: block;
margin-top: 1em; margin-top: 1em;
}
.tdg-templateDataParamImportWidget > .oo-ui-buttonElement-button { > .oo-ui-buttonElement-button {
display: block; display: block;
text-align: left; text-align: left;
font-weight: normal; font-weight: normal;
} }
}
/* LanguageSearchWidget */ /* LanguageSearchWidget */