wikimedia/mediawiki-extensions-VisualEditor
1
0
Fork 0
mirror of https://gerrit.wikimedia.org/r/mediawiki/extensions/VisualEditor synced 2024-09-25 11:16:51 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge "Simplify pulsating dot to one DOM node using :before/:after"

Browse source
This commit is contained in:
jenkins-bot 2019-06-28 16:40:05 +00:00 committed by Gerrit Code Review
parent 8f4c75bc1f 3f892fe368
commit d1b9844300
2 changed files with 16 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

25
modules/ve-mw/ui/styles/tools/ve.ui.MWEducationPopupTool.css
View file

@ -9,21 +9,27 @@
cursor: pointer;
}
.ve-ui-pulsatingDot,
.ve-ui-stillDot {
.ve-ui-pulsatingDot {
position: absolute;
bottom: 0;
left: 50%;
z-index: 1;
}
.ve-ui-pulsatingDot:before,
.ve-ui-pulsatingDot:after {
content: '';
display: block;
position: absolute;
border-radius: 50%;
background-color: #36c;
}
.ve-ui-pulsatingDot {
.ve-ui-pulsatingDot:before {
width: 36px;
height: 36px;
margin-bottom: -18px;
margin-left: -18px;
top: -18px;
left: -18px;
opacity: 0;
-webkit-animation: pulse 3s ease-out;
-moz-animation: pulse 3s ease-out;
@ -33,12 +39,12 @@
animation-iteration-count: infinite;
}
.ve-ui-stillDot {
.ve-ui-pulsatingDot:after {
/* Use whole pixel values to improve rendering (T214203) */
width: 12px;
height: 12px;
margin-bottom: -6px;
margin-left: -6px;
top: -6px;
left: -6px;
}
.ve-ui-educationPopup-shield {
@ -49,8 +55,7 @@
left: 0;
}
.oo-ui-widget-disabled .ve-ui-pulsatingDot,
.oo-ui-widget-disabled .ve-ui-stillDot {
.oo-ui-widget-disabled .ve-ui-pulsatingDot {
display: none;
}

5
modules/ve-mw/ui/tools/ve.ui.MWEducationPopupTool.js
View file

@ -64,22 +64,19 @@ ve.ui.MWEducationPopupTool = function VeUiMwEducationPopupTool( config ) {
this.shownEducationPopup = false;
this.$pulsatingDot = $( '<div>' ).addClass( 've-ui-pulsatingDot' );
this.$stillDot = $( '<div>' ).addClass( 've-ui-stillDot' );
$shield = $( '<div>' ).addClass( 've-ui-educationPopup-shield' );
this.$element
.addClass( 've-ui-educationPopup' )
.append( $shield, this.popup.$element, this.$stillDot, this.$pulsatingDot );
.append( $shield, this.popup.$element, this.$pulsatingDot );
this.$element.children().not( this.popup.$element ).on( 'click', function () {
if ( !tool.shownEducationPopup ) {
if ( ve.init.target.openEducationPopupTool ) {
ve.init.target.openEducationPopupTool.popup.toggle( false );
ve.init.target.openEducationPopupTool.setActive( false );
ve.init.target.openEducationPopupTool.$pulsatingDot.removeClass( 'oo-ui-element-hidden' );
ve.init.target.openEducationPopupTool.$stillDot.removeClass( 'oo-ui-element-hidden' );
}
ve.init.target.openEducationPopupTool = tool;
tool.$pulsatingDot.addClass( 'oo-ui-element-hidden' );
tool.$stillDot.addClass( 'oo-ui-element-hidden' );
tool.popup.toggle( true );
$shield.remove();