Minior CSS & JS modernizing

joedolson · Apr 14, 2024 · ffdb170 · ffdb170
1 parent 85607ea
commit ffdb170
Show file tree

Hide file tree

Showing 4 changed files with 41 additions and 33 deletions.
diff --git a/src/css/post-styles.css b/src/css/post-styles.css
@@ -192,21 +192,17 @@ button.time div {
 }
 
 .wpt_log, #wpt_set_tweet_time {
-	padding: .5em;
+	padding: .5rem 0;
 }
 
 #wpt_set_tweet_time {
-	background: #f6f6f6;
-	color: #333;
+	display: flex;
 }
 
-.tweet-buttons {
-	display: grid;
-	grid-template-columns: 48% 34% 18%;
-	column-gap: 2px;
-	padding: .75em 12px;
-	margin: -6px -14px 0;
-	background: #f3f3f3;
+.tweet-buttons .wpt-buttons {
+	display: flex;
+	flex-wrap: wrap;
+	gap: 3px;
 }
 
 .wpt-wrap {

diff --git a/src/js/ajax.js b/src/js/ajax.js
@@ -14,19 +14,19 @@
 			}
 		);
 		$('button.tweet').on('click', function (e) {
-			visible = $( '.wpt_log' ).is( ':visible' );
+			let visible = $( '.wpt_log' ).is( ':visible' );
 			if ( visible ) {
 				$( '.wpt_log' ).hide( 200 );
 			}
 			e.preventDefault();
-			var text   = $('#wpt_custom_tweet').val();
-			var date   = $('#wpt_set_tweet_time .date').val();
-			var time   = $('#wpt_set_tweet_time .time').val();
-			var auth   = $('#wpt_authorized_users').val();
+			let text   = $('#wpt_custom_tweet').val();
+			let date   = $('#wpt_set_tweet_time .date').val();
+			let time   = $('#wpt_set_tweet_time .time').val();
+			let auth   = $('#wpt_authorized_users').val();
 
-			var upload = $('input:radio[name=_wpt_image]:checked').val();
-			var tweet_action = ( $(this).attr('data-action') === 'tweet' ) ? 'tweet' : 'schedule'
-			var data = {
+			let upload = $('input:radio[name=_wpt_image]:checked').val();
+			let tweet_action = ( $(this).attr('data-action') === 'tweet' ) ? 'tweet' : 'schedule'
+			let data = {
 				'action': wpt_data.action,
 				'tweet_post_id': wpt_data.post_ID,
 				'tweet_text': text,

diff --git a/src/js/tabs.js b/src/js/tabs.js
@@ -1,27 +1,27 @@
 jQuery(document).ready(function ($) {
-	var tabs = $('.wpt-settings .wptab').length;
+	const tabs = $('.wpt-settings .wptab').length;
 	$('.wpt-settings .tabs a[href="#' + wpt.firstItem + '"]').addClass('active').attr( 'aria-selected', 'true' );
 	if (tabs > 1) {
 		$('.wpt-settings .wptab').not('#' + wpt.firstItem).hide();
 		$('.wpt-settings .tabs a').on('click', function (e) {
 			e.preventDefault();
 			$('.wpt-settings .tabs a').removeClass('active').attr( 'aria-selected', 'false' );
 			$(this).addClass('active').attr( 'aria-selected', 'true' );
-			var target = $(this).attr('href');
+			let target = $(this).attr('href');
 			$('.wpt-settings .wptab').not(target).hide();
 			$(target).show().attr( 'tabindex', '-1' ).focus();
 		});
 	};
 
-	var permissions = $('.wpt-permissions .wptab').length;
+	const permissions = $('.wpt-permissions .wptab').length;
 	$('.wpt-permissions .tabs a[href="#' + wpt.firstPerm + '"]').addClass('active').attr( 'aria-selected', 'true' );
 	if (permissions > 1) {
 		$('.wpt-permissions .wptab').not('#' + wpt.firstPerm).hide();
 		$('.wpt-permissions .tabs a').on('click', function (e) {
 			e.preventDefault();
 			$('.wpt-permissions .tabs a').removeClass('active').attr( 'aria-selected', 'false' );
 			$(this).addClass('active').attr( 'aria-selected', 'true' );
-			var target = $(this).attr('href');
+			let target = $(this).attr('href');
 			$('.wpt-permissions .wptab').not(target).hide();
 			$(target).show().attr( 'tabindex', '-1' ).focus();
 		});

diff --git a/src/wp-to-twitter.php b/src/wp-to-twitter.php
@@ -1442,23 +1442,35 @@ function wpt_add_twitter_inner_box( $post ) {
 		if ( 'publish' === $status && ( current_user_can( 'wpt_tweet_now' ) || current_user_can( 'manage_options' ) ) ) {
 			?>
 			<div class='tweet-buttons'>
-				<button type='button' class='tweet button-primary' data-action='tweet'><span class='dashicons dashicons-share' aria-hidden='true'></span><?php _e( 'Share Now', 'wp-to-twitter' ); ?></button>
-			<?php
-			if ( function_exists( 'wpt_pro_exists' ) && wpt_pro_exists() ) {
+				<div class="wpt-buttons">
+					<button type='button' class='tweet button-primary' data-action='tweet'><span class='dashicons dashicons-share' aria-hidden='true'></span><?php _e( 'Share Now', 'wp-to-twitter' ); ?></button>
+				<?php
+				if ( function_exists( 'wpt_pro_exists' ) && wpt_pro_exists() ) {
+					?>
+				<button type='button' class='tweet schedule button-secondary' data-action='schedule' disabled><?php _e( 'Schedule', 'wp-to-twitter' ); ?></button>
+				<button type='button' class='time button-secondary'>
+					<span class="dashicons dashicons-clock" aria-hidden="true"></span><span class="screen-reader-text"><?php _e( 'Set Date/Time', 'wp-to-twitter' ); ?></span>
+				</button>
+					<?php
+				}
 				?>
-			<button type='button' class='tweet schedule button-secondary' data-action='schedule' disabled><?php _e( 'Schedule', 'wp-to-twitter' ); ?></button>
-			<button type='button' class='time button-secondary'>
-				<span class="dashicons dashicons-clock" aria-hidden="true"></span><span class="screen-reader-text"><?php _e( 'Set Date/Time', 'wp-to-twitter' ); ?></span>
-			</button>
+				</div>
+				<?php
+				if ( function_exists( 'wpt_pro_exists' ) && wpt_pro_exists() ) {
+					?>
 			<div id="wpt_set_tweet_time">
 				<?php
 				$datavalue = gmdate( 'Y-m-d', current_time( 'timestamp' ) ); // phpcs:ignore WordPress.DateTime.CurrentTimeTimestamp.Requested
 				$timevalue = date_i18n( 'h:s a', current_time( 'timestamp' ) + 3600 ); // phpcs:ignore WordPress.DateTime.CurrentTimeTimestamp.Requested
 				?>
-				<label for='wpt_date'><?php _e( 'Date', 'wp-to-twitter' ); ?></label>
-				<input type='date' value='' class='wpt_date date' name='wpt_datetime' id='wpt_date' data-value='<?php echo $datavalue; ?>' /><br/>
-				<label for='wpt_time'><?php _e( 'Time', 'wp-to-twitter' ); ?></label>
-				<input type='text' value='<?php echo $timevalue; ?>' class='wpt_time time' name='wpt_datetime' id='wpt_time'/>
+				<div class="wpt-date-field">
+					<label for='wpt_date'><?php _e( 'Date', 'wp-to-twitter' ); ?></label>
+					<input type='date' value='' class='wpt_date date' name='wpt_datetime' id='wpt_date' data-value='<?php echo $datavalue; ?>' /><br/>
+				</div>
+				<div class="wpt-time-field">
+					<label for='wpt_time'><?php _e( 'Time', 'wp-to-twitter' ); ?></label>
+					<input type='time' value='<?php echo $timevalue; ?>' class='wpt_time time' name='wpt_datetime' id='wpt_time'/>
+				</div>
 			</div>
 				<?php
 			}