fix toast

This commit is contained in:
haakel 2024-06-15 12:17:59 +03:30
parent a63f6af98a
commit 9b5ea52006
3 changed files with 40 additions and 20 deletions

View File

@ -1,16 +1,16 @@
body { .audio-diary-admin-page {
background-color: #d1cbcb; max-width: 600px;
color: #fff; margin: 0 auto;
text-align: center; text-align: center;
}
.audio-diary-admin-page body {
background-color: #000;
color: #fff;
font-family: Arial, sans-serif; font-family: Arial, sans-serif;
} }
.wrap { .audio-diary-admin-page #recording-button {
max-width: 600px;
margin: 0 auto;
}
#recording-button {
background-color: red; background-color: red;
color: white; color: white;
border: none; border: none;
@ -29,22 +29,34 @@ body {
margin: 20px auto; /* برای قرارگیری در وسط صفحه */ margin: 20px auto; /* برای قرارگیری در وسط صفحه */
} }
#visualizer { .audio-diary-admin-page #visualizer {
display: none; display: none;
margin-top: 20px; margin-top: 20px;
} }
audio { .audio-diary-admin-page audio {
display: none; display: none;
margin: 20px auto; margin: 20px auto;
width: 300px; width: 300px;
} }
audio.show { .audio-diary-admin-page audio.show {
display: block; display: block;
} }
canvas { .audio-diary-admin-page canvas {
display: block; display: block;
margin: 20px auto; margin: 20px auto;
border: 2px solid #c5c3c3; /* مثال: خط قرمز دور canvas */
border-radius: 10px; /* مثال: گوشه‌های گرد */
width: 100%; /* عرض 100% از والد */
max-width: 600px; /* حداکثر عرض 600px */
height: 100px; /* ارتفاع 100px */
background-color: rgba(255, 255, 255, 0.1); /* مثال: زمینه نیمه شفاف سفید */
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* سایه برای دادن عمق */
}
/* افزودن این استایل برای تغییر رنگ و ظاهر خط */
.audio-diary-admin-page canvas {
background-color: transparent; /* حذف پس‌زمینه سیاه */
} }

View File

@ -90,17 +90,25 @@ jQuery(document).ready(function($) {
allowToastClose: true, // Boolean value true or false allowToastClose: true, // Boolean value true or false
hideAfter: 3000, // false to make it sticky or number representing the miliseconds as time after which toast needs to be hidden hideAfter: 3000, // false to make it sticky or number representing the miliseconds as time after which toast needs to be hidden
stack: 3, // false if there should be only one toast at a time or a number representing the maximum number of toasts to be shown at a time stack: 3, // false if there should be only one toast at a time or a number representing the maximum number of toasts to be shown at a time
position: 'bottom-left', // bottom-left or bottom-right or bottom-center or top-left or top-right or top-center or mid-center or an object representing the left, right, top, bottom values position: 'bottom-center', // bottom-left or bottom-right or bottom-center or top-left or top-right or top-center or mid-center or an object representing the left, right, top, bottom values
textAlign: 'left', // Text alignment i.e. left, right or center textAlign: 'left', // Text alignment i.e. left, right or center
loader: true, // Whether to show loader or not. True by default loader: true, // Whether to show loader or not. True by default
loaderBg: '#9EC600', // Background color of the toast loader loaderBg: '#9EC600', // Background color of the toast loader
}); });
} else { } else {
alert('Failed to save audio'); $.toast({
text: "Failed to save audio", // Text that is to be shown in the toast
heading: 'Note', // Optional heading to be shown on the toast
icon: 'Error', // Type of toast icon
showHideTransition: 'fade', // fade, slide or plain
allowToastClose: true, // Boolean value true or false
hideAfter: 3000, // false to make it sticky or number representing the miliseconds as time after which toast needs to be hidden
stack: 3, // false if there should be only one toast at a time or a number representing the maximum number of toasts to be shown at a time
position: 'top-center', // bottom-left or bottom-right or bottom-center or top-left or top-right or top-center or mid-center or an object representing the left, right, top, bottom values
textAlign: 'left', // Text alignment i.e. left, right or center
loader: true, // Whether to show loader or not. True by default
loaderBg: '#9EC600', // Background color of the toast loader
});
} }
} }
}); });

View File

@ -1,4 +1,4 @@
<div class="wrap"> <div class="wrap audio-diary-admin-page">
<h1><?php _e('Audio Diary', 'audio-diary'); ?></h1> <h1><?php _e('Audio Diary', 'audio-diary'); ?></h1>
<button id="recording-button"></button> <button id="recording-button"></button>
<audio id="audio-player" controls></audio> <audio id="audio-player" controls></audio>