Refac delete buttons order to be in a row

This commit is contained in:
MerlinScheurer
2025-01-12 15:39:21 +01:00
parent 1c656f917e
commit 5b67d9de24
5 changed files with 13 additions and 6 deletions

View File

@@ -152,8 +152,9 @@ const ChannelAbout = () => {
)} )}
{showDeleteConfirm && ( {showDeleteConfirm && (
<div className="delete-confirm" id="delete-button"> <div className="delete-confirm">
<span>Delete {channel.channel_name} including all videos? </span> <span>Delete {channel.channel_name} including all videos? </span>
<Button <Button
label="Delete" label="Delete"
className="danger-button" className="danger-button"
@@ -161,7 +162,8 @@ const ChannelAbout = () => {
await deleteChannel(channelId); await deleteChannel(channelId);
navigate(Routes.Channels); navigate(Routes.Channels);
}} }}
/>{' '} />
<Button <Button
label="Cancel" label="Cancel"
onClick={() => setShowDeleteConfirm(!showDeleteConfirm)} onClick={() => setShowDeleteConfirm(!showDeleteConfirm)}

View File

@@ -68,6 +68,7 @@ const Channels = () => {
currentPage, currentPage,
userConfig.config.show_subed_only, userConfig.config.show_subed_only,
); );
setChannelListResponse(channelListResponse); setChannelListResponse(channelListResponse);
})(); })();
}, [refresh, userConfig.config.show_subed_only, currentPage, pagination?.current_page]); }, [refresh, userConfig.config.show_subed_only, currentPage, pagination?.current_page]);
@@ -92,10 +93,12 @@ const Channels = () => {
alt="add-icon" alt="add-icon"
title="Subscribe to Channels" title="Subscribe to Channels"
/> />
{showAddForm && ( {showAddForm && (
<div className="show-form"> <div className="show-form">
<div> <div>
<label>Subscribe to channels:</label> <label>Subscribe to channels:</label>
<textarea <textarea
value={channelsToSubscribeTo} value={channelsToSubscribeTo}
onChange={e => { onChange={e => {

View File

@@ -206,7 +206,7 @@ const Playlist = () => {
)} )}
{showDeleteConfirm && ( {showDeleteConfirm && (
<div className="delete-confirm" id="delete-button"> <div className="delete-confirm">
<span>Delete {playlist.playlist_name}?</span> <span>Delete {playlist.playlist_name}?</span>
<Button <Button
@@ -226,7 +226,6 @@ const Playlist = () => {
}} }}
/> />
<br />
<Button label="Cancel" onClick={() => setShowDeleteConfirm(!showDeleteConfirm)} /> <Button label="Cancel" onClick={() => setShowDeleteConfirm(!showDeleteConfirm)} />
</div> </div>
)} )}

View File

@@ -349,8 +349,9 @@ const Video = () => {
)} )}
{showDeleteConfirm && ( {showDeleteConfirm && (
<div className="delete-confirm" id="delete-button"> <div className="delete-confirm">
<span>Are you sure? </span> <span>Are you sure? </span>
<Button <Button
label="Delete" label="Delete"
className="danger-button" className="danger-button"
@@ -358,7 +359,8 @@ const Video = () => {
await deleteVideo(videoId); await deleteVideo(videoId);
navigate(Routes.Channel(video.channel.channel_id)); navigate(Routes.Channel(video.channel.channel_id));
}} }}
/>{' '} />
<Button <Button
label="Cancel" label="Cancel"
onClick={() => setShowDeleteConfirm(!showDeleteConfirm)} onClick={() => setShowDeleteConfirm(!showDeleteConfirm)}

View File

@@ -268,6 +268,7 @@ button:hover {
/* delete button */ /* delete button */
.delete-confirm button { .delete-confirm button {
display: flex;
margin: 3px 0; margin: 3px 0;
} }