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

Reply via email to