VolkerE has uploaded a new change for review. (
https://gerrit.wikimedia.org/r/367612 )
Change subject: Apex theme: Replace and unify `border-radius` with variables
......................................................................
Apex theme: Replace and unify `border-radius` with variables
Replacing fix values with `@border-radius*` variables and unifiying
them by `4px` value instead of `0.3em` and `0.3125em` ones. A `px`
doesn't have disadvantages on `border-radius` compared to other
properties.
Change-Id: I4de5c0fda6e096b6c3a0ca9811e4bcb7d9c5022b
---
M src/themes/apex/common.less
M src/themes/apex/tools.less
M src/themes/apex/widgets.less
M src/themes/apex/windows.less
4 files changed, 35 insertions(+), 35 deletions(-)
git pull ssh://gerrit.wikimedia.org:29418/oojs/ui refs/changes/12/367612/1
diff --git a/src/themes/apex/common.less b/src/themes/apex/common.less
index 7bfe443..71aafa1 100644
--- a/src/themes/apex/common.less
+++ b/src/themes/apex/common.less
@@ -40,7 +40,7 @@
@start-frameless: -@padding-horizontal-frameless;
@border-radius-base: 0.25em;
-@border-radius-button: 0.3em;
+@border-radius-button: 4px;
@border-radius-taboption: 0.5em;
@padding-base: @padding-vertical-base @padding-horizontal-base;
diff --git a/src/themes/apex/tools.less b/src/themes/apex/tools.less
index aa34bc8..a8fdc5f 100644
--- a/src/themes/apex/tools.less
+++ b/src/themes/apex/tools.less
@@ -60,13 +60,13 @@
// Like .oo-ui-tool in barToolGroup
&:first-child > .oo-ui-popupToolGroup {
- border-top-left-radius: 0.3125em;
- border-bottom-left-radius: 0.3125em;
+ border-top-left-radius: @border-radius-button;
+ border-bottom-left-radius: @border-radius-button;
}
&:last-child > .oo-ui-popupToolGroup {
- border-top-right-radius: 0.3125em;
- border-bottom-right-radius: 0.3125em;
+ border-top-right-radius: @border-radius-button;
+ border-bottom-right-radius: @border-radius-button;
}
// Like .oo-ui-tool-link in barToolGroup
@@ -89,7 +89,7 @@
.theme-oo-ui-toolGroup () {
margin: 0.375em;
- border-radius: 0.3125em;
+ border-radius: @border-radius-button;
border: 1px solid transparent;
.oo-ui-transition( border-color @medium-ease );
@@ -116,14 +116,14 @@
border: 1px solid transparent;
&:first-child {
- border-top-left-radius: 0.3125em;
- border-bottom-left-radius: 0.3125em;
+ border-top-left-radius: @border-radius-button;
+ border-bottom-left-radius: @border-radius-button;
}
&:last-child {
margin-right: -1px;
- border-top-right-radius: 0.3125em;
- border-bottom-right-radius: 0.3125em;
+ border-top-right-radius: @border-radius-button;
+ border-bottom-right-radius: @border-radius-button;
}
> .oo-ui-tool-link {
@@ -436,16 +436,16 @@
}
&:first-child > .oo-ui-popupToolGroup-handle {
- border-bottom-left-radius: 0.3em;
- border-top-left-radius: 0.3em;
+ border-bottom-left-radius: @border-radius-button;
+ border-top-left-radius: @border-radius-button;
margin-left: 0;
}
&:last-child {
margin-right: 0.5em;
& > .oo-ui-popupToolGroup-handle {
- border-bottom-right-radius: 0.3em;
- border-top-right-radius: 0.3em;
+ border-bottom-right-radius:
@border-radius-button;
+ border-top-right-radius: @border-radius-button;
}
}
}
diff --git a/src/themes/apex/widgets.less b/src/themes/apex/widgets.less
index 32ce2ac..9eba3c0 100644
--- a/src/themes/apex/widgets.less
+++ b/src/themes/apex/widgets.less
@@ -15,7 +15,7 @@
.theme-oo-ui-buttonGroupWidget () {
display: inline-block;
white-space: nowrap;
- border-radius: 0.3em;
+ border-radius: @border-radius-button;
.oo-ui-inline-spacing(0.5em);
.oo-ui-buttonElement {
@@ -29,14 +29,14 @@
}
&:first-child .oo-ui-buttonElement-button {
- border-bottom-left-radius: 0.3em;
- border-top-left-radius: 0.3em;
+ border-bottom-left-radius: @border-radius-button;
+ border-top-left-radius: @border-radius-button;
margin-left: 0;
}
&:last-child .oo-ui-buttonElement-button {
- border-bottom-right-radius: 0.3em;
- border-top-right-radius: 0.3em;
+ border-bottom-right-radius: @border-radius-button;
+ border-top-right-radius: @border-radius-button;
}
}
}
@@ -55,7 +55,7 @@
}
.theme-oo-ui-buttonSelectWidget () {
- border-radius: 0.3em;
+ border-radius: @border-radius-button;
.oo-ui-inline-spacing(0.5em);
@@ -66,14 +66,14 @@
}
&:first-child .oo-ui-buttonElement-button {
- border-bottom-left-radius: 0.3em;
- border-top-left-radius: 0.3em;
+ border-bottom-left-radius: @border-radius-button;
+ border-top-left-radius: @border-radius-button;
margin-left: 0;
}
&:last-child .oo-ui-buttonElement-button {
- border-bottom-right-radius: 0.3em;
- border-top-right-radius: 0.3em;
+ border-bottom-right-radius: @border-radius-button;
+ border-top-right-radius: @border-radius-button;
}
}
}
@@ -112,7 +112,7 @@
.oo-ui-vertical-gradient(#fff, #ddd);
border: 1px solid #ccc;
color: @color-base;
- border-radius: 0.25em;
+ border-radius: @border-radius-base;
&:focus {
outline: 0;
@@ -163,7 +163,7 @@
padding: 0.15em 0.25em;
border: 1px solid rgba( 0, 0, 0, 0.1 );
- border-radius: 0.25em;
+ border-radius: @border-radius-base;
.oo-ui-box-sizing(border-box);
@@ -304,7 +304,7 @@
&-handle {
height: 2.5em;
border: 1px solid rgba( 0, 0, 0, 0.1 );
- border-radius: 0.25em;
+ border-radius: @border-radius-base;
&:hover {
border-color: rgba( 0, 0, 0, 0.2 );
@@ -362,7 +362,7 @@
font-size: inherit;
font-family: inherit;
border: 1px solid rgba( 0, 0, 0, 0.1 );
- border-radius: 0.25em;
+ border-radius: @border-radius-base;
}
option {
@@ -453,7 +453,7 @@
background-color: @background-color-main;
margin-top: -1px;
border: 1px solid #ccc;
- border-radius: 0 0 0.25em 0.25em;
+ border-radius: 0 0 @border-radius-base @border-radius-base;
box-shadow: 0 0.15em 1em 0 rgba( 0, 0, 0, 0.2 );
}
@@ -608,7 +608,7 @@
&-popup {
background-color: @background-color-main;
border: 1px solid #ccc;
- border-radius: 0.25em;
+ border-radius: @border-radius-base;
box-shadow: 0 0.15em 0.5em 0 rgba( 0, 0, 0, 0.2 );
}
@@ -735,7 +735,7 @@
max-width: @max-width-input-base;
background-color: @background-color-main;
border: 1px solid #ccc;
- border-radius: 0.25em;
+ border-radius: @border-radius-base;
overflow: hidden;
&-bar {
@@ -1030,7 +1030,7 @@
.oo-ui-vertical-gradient(#fff, #ddd);
border: 1px solid #ccc;
color: @color-base;
- border-radius: 0.25em;
+ border-radius: @border-radius-base;
&:focus {
outline: 0;
@@ -1081,7 +1081,7 @@
padding: 0.15em 0.25em;
border: 1px solid rgba( 0, 0, 0, 0.1 );
- border-radius: 0.25em;
+ border-radius: @border-radius-base;
.oo-ui-box-sizing(border-box);
@@ -1164,7 +1164,7 @@
color: #000;
border: 1px solid #ccc;
box-shadow: 0 0 0 #fff, inset 0 0.1em 0.2em #ddd;
- border-radius: 0.25em;
+ border-radius: @border-radius-base;
.oo-ui-transition( border-color @medium-ease, box-shadow
@medium-ease );
&.oo-ui-pendingElement-pending {
diff --git a/src/themes/apex/windows.less b/src/themes/apex/windows.less
index 9b0040d..0465010 100644
--- a/src/themes/apex/windows.less
+++ b/src/themes/apex/windows.less
@@ -276,7 +276,7 @@
padding: 1em;
border: 1px solid #ff9e9e;
background-color: #fff7f7;
- border-radius: 0.25em;
+ border-radius: @border-radius-base;
}
}
--
To view, visit https://gerrit.wikimedia.org/r/367612
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: I4de5c0fda6e096b6c3a0ca9811e4bcb7d9c5022b
Gerrit-PatchSet: 1
Gerrit-Project: oojs/ui
Gerrit-Branch: master
Gerrit-Owner: VolkerE <[email protected]>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
