Henning Snater has uploaded a new change for review.
https://gerrit.wikimedia.org/r/64038
Change subject: (bug 48145) TimeInput expert styling improvements
......................................................................
(bug 48145) TimeInput expert styling improvements
Improved styling and put advanced adjustments to the bottom of the input
extender.
Change-Id: Ia668d8a110f4852a3ce53a4466269feb0b9cd99d
---
M ValueView/resources/jquery.ui/jquery.ui.inputextender.js
M ValueView/resources/jquery.ui/jquery.ui.listrotator.css
M ValueView/resources/jquery.ui/jquery.ui.listrotator.js
M ValueView/resources/jquery.valueview/valueview.experts/experts.TimeInput.css
M ValueView/resources/jquery.valueview/valueview.experts/experts.TimeInput.js
5 files changed, 36 insertions(+), 29 deletions(-)
git pull ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/DataValues
refs/changes/38/64038/1
diff --git a/ValueView/resources/jquery.ui/jquery.ui.inputextender.js
b/ValueView/resources/jquery.ui/jquery.ui.inputextender.js
index 00e56ec..577fe05 100644
--- a/ValueView/resources/jquery.ui/jquery.ui.inputextender.js
+++ b/ValueView/resources/jquery.ui/jquery.ui.inputextender.js
@@ -58,7 +58,8 @@
position: {
my: ( isRtl ) ? 'right top' : 'left top',
at: ( isRtl ) ? 'right bottom' : 'left bottom',
- collision: 'none'
+ collision: 'none',
+ offset: '-4 2'
}
},
diff --git a/ValueView/resources/jquery.ui/jquery.ui.listrotator.css
b/ValueView/resources/jquery.ui/jquery.ui.listrotator.css
index 383ef20..73c598d 100644
--- a/ValueView/resources/jquery.ui/jquery.ui.listrotator.css
+++ b/ValueView/resources/jquery.ui/jquery.ui.listrotator.css
@@ -10,6 +10,11 @@
border: none;
}
+.ui-listrotator .ui-listrotator-label {
+ background: none;
+ border: none;
+}
+
.ui-listrotator .ui-state-active a {
text-decoration: underline;
}
@@ -37,7 +42,7 @@
text-align: center;
padding: 0 5px 0 10px;
background: none;
- border-color: #CCCCCC;
+ border: 1px solid #CCCCCC;
}
.ui-listrotator .ui-listrotator-curr a {
float: left;
diff --git a/ValueView/resources/jquery.ui/jquery.ui.listrotator.js
b/ValueView/resources/jquery.ui/jquery.ui.listrotator.js
index c6813a0..7b86489 100644
--- a/ValueView/resources/jquery.ui/jquery.ui.listrotator.js
+++ b/ValueView/resources/jquery.ui/jquery.ui.listrotator.js
@@ -200,25 +200,8 @@
}
this.element.append( this.$prev ).append( this.$curr
).append( this.$next );
- // Apply hover functionality:
$.each( [ this.$auto, this.$curr, this.$prev,
this.$next ], function( i, $node ) {
- $node
- .addClass( 'ui-state-default' )
- .on( 'mouseover', function( event ) {
- var $this = $( this );
- if( $this.hasClass( 'ui-state-disabled'
) ) {
- return;
- }
- $this.addClass( 'ui-state-hover' );
- } )
- .on( 'mouseout', function( event ) {
- var $this = $( this );
- if( $this.hasClass( 'ui-state-disabled'
) ) {
- return;
- }
- $this.removeClass( 'ui-state-hover' );
- } )
- .find( 'a' ).attr( 'href',
'javascript:void(0);' );
+ $node.find( 'a' ).attr( 'href',
'javascript:void(0);' );
} );
// Construct and initialize menu widget:
@@ -331,7 +314,7 @@
clickCallback( event );
}
} )
- .append( $( '<a/>' ).addClass( this.widgetBaseClass +
'-label' ) );
+ .append( $( '<a/>' ).addClass( this.widgetBaseClass +
'-label ui-state-default' ) );
},
/**
diff --git
a/ValueView/resources/jquery.valueview/valueview.experts/experts.TimeInput.css
b/ValueView/resources/jquery.valueview/valueview.experts/experts.TimeInput.css
index 3c41193..3da26a1 100644
---
a/ValueView/resources/jquery.valueview/valueview.experts/experts.TimeInput.css
+++
b/ValueView/resources/jquery.valueview/valueview.experts/experts.TimeInput.css
@@ -14,16 +14,34 @@
}
.ui-inputextender-extension .valueview-expert-timeinput-advancedtoggler {
- margin-top: 0;
-}
-
-/* TODO: Put style into more generic place along with moving the preview out
of the TimeInput expert */
-.valueview-preview {
- width: 100%;
+ border: none;
+ background: none;
margin-top: 0.5em;
padding-top: 0.5em;
border-top: 1px dashed #CCC;
+ width: 100%;
+}
+
+.ui-inputextender-extension .valueview-expert-timeinput-calendarhint {
+ margin-top: 0;
+}
+
+.ui-inputextender-extension .valueview-expert-timeinput-calendarhint-message {
+ margin-right: 0.5em;
+}
+
+.ui-inputextender-extension .valueview-expert-timeinput-calendarhint-switch {
+ border: none;
+ background: none;
+}
+
+/* TODO: Put style into more generic place along with moving the preview out
of the TimeInput expert */
+.ui-inputextender-extension .valueview-preview {
+ margin-top: 0;
+ width: 100%;
}
.valueview-preview-value {
margin-top: 0.2em;
+ font-size: 150%;
+ font-weight: bold;
}
diff --git
a/ValueView/resources/jquery.valueview/valueview.experts/experts.TimeInput.js
b/ValueView/resources/jquery.valueview/valueview.experts/experts.TimeInput.js
index 6c6e1b6..54acb2a 100644
---
a/ValueView/resources/jquery.valueview/valueview.experts/experts.TimeInput.js
+++
b/ValueView/resources/jquery.valueview/valueview.experts/experts.TimeInput.js
@@ -176,7 +176,7 @@
.append( $( '<span/>' ).addClass( this.uiBaseClass +
'-calendarhint-message' ) )
.append(
$( '<a/>' )
- .addClass( this.uiBaseClass +
'-calendarhint-switch' )
+ .addClass( this.uiBaseClass +
'-calendarhint-switch ui-state-default' )
.attr( 'href', 'javascript:void(0);' )
);
@@ -196,7 +196,7 @@
// TODO: Move input extender out of here to a more
generic place since it is not
// TimeInput specific.
.inputextender( {
- content: [ $toggler, this.$precisionContainer,
this.$calendarContainer, this.$preview, this.$calendarhint ],
+ content: [ this.$preview, this.$calendarhint,
$toggler, this.$precisionContainer, this.$calendarContainer ],
initCallback: function() {
self.$precision.data( 'listrotator'
).initWidths();
self.$calendar.data( 'listrotator'
).initWidths();
--
To view, visit https://gerrit.wikimedia.org/r/64038
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: Ia668d8a110f4852a3ce53a4466269feb0b9cd99d
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/extensions/DataValues
Gerrit-Branch: master
Gerrit-Owner: Henning Snater <[email protected]>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits