mirror of
				https://gitlab.com/questable/questable-web-ui
				synced 2025-11-04 04:20:06 +01:00 
			
		
		
		
	Add buttons to modify quest. Add respective scss
This commit is contained in:
		@@ -64,7 +64,16 @@ export default (quest, sideQuest) => {
 | 
			
		||||
			);
 | 
			
		||||
		}
 | 
			
		||||
		else {
 | 
			
		||||
			return (
 | 
			
		||||
			return (<>
 | 
			
		||||
				<div className="back_only">
 | 
			
		||||
					<button
 | 
			
		||||
						className="back"
 | 
			
		||||
						onClick={() => props.setDisplay(
 | 
			
		||||
							{
 | 
			
		||||
								type: props.display.type + "s"
 | 
			
		||||
							})
 | 
			
		||||
						}><</button>
 | 
			
		||||
				</div>
 | 
			
		||||
				<div className="quest nes-container with-title is-dark">
 | 
			
		||||
					<p className="title">{type}</p>
 | 
			
		||||
					<div className="quest_element">
 | 
			
		||||
@@ -102,8 +111,13 @@ export default (quest, sideQuest) => {
 | 
			
		||||
								/>)}
 | 
			
		||||
						</div>
 | 
			
		||||
					</div>
 | 
			
		||||
					<div className="quest_element">
 | 
			
		||||
						<button className="nes-btn is-primary">Update</button>
 | 
			
		||||
						<button className="nes-btn is-success">Mark as done</button>
 | 
			
		||||
						<button className="nes-btn is-error">Delete</button>
 | 
			
		||||
					</div>
 | 
			
		||||
			);
 | 
			
		||||
				</div>
 | 
			
		||||
			</>);
 | 
			
		||||
		}
 | 
			
		||||
	}
 | 
			
		||||
 | 
			
		||||
 
 | 
			
		||||
@@ -28,8 +28,24 @@ body {
 | 
			
		||||
	}
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.back_only {
 | 
			
		||||
	width: 100%;
 | 
			
		||||
	display: flex;
 | 
			
		||||
	justify-content: flex-end;
 | 
			
		||||
	.back {
 | 
			
		||||
		border: none;
 | 
			
		||||
		color: #FFF;
 | 
			
		||||
		background-color: rgba(0,0,0,0);
 | 
			
		||||
		text-align: right;
 | 
			
		||||
		width: 30px;
 | 
			
		||||
		margin: 0;
 | 
			
		||||
		padding: 0;
 | 
			
		||||
	}
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.main {
 | 
			
		||||
	margin: 0 5%;
 | 
			
		||||
	margin: 0 auto;
 | 
			
		||||
	max-width: 1000px;
 | 
			
		||||
	header {
 | 
			
		||||
		width: 100%;
 | 
			
		||||
		margin-top: 1em;
 | 
			
		||||
@@ -39,14 +55,14 @@ body {
 | 
			
		||||
	}
 | 
			
		||||
	.body {
 | 
			
		||||
		padding: 0 1em;
 | 
			
		||||
		.stats {
 | 
			
		||||
			margin: 1em 0;
 | 
			
		||||
			box-sizing: border-box;
 | 
			
		||||
		button {
 | 
			
		||||
			width: 48%;
 | 
			
		||||
			margin: 0 1%;
 | 
			
		||||
			box-sizing: border-box;
 | 
			
		||||
		}
 | 
			
		||||
		.stats {
 | 
			
		||||
			margin: 1em 0;
 | 
			
		||||
			box-sizing: border-box;
 | 
			
		||||
		}
 | 
			
		||||
		.quest {
 | 
			
		||||
			width: 100%;
 | 
			
		||||
@@ -68,6 +84,9 @@ body {
 | 
			
		||||
					flex-direction: row;
 | 
			
		||||
					justify-content: space-between;
 | 
			
		||||
				}
 | 
			
		||||
				button {
 | 
			
		||||
					width: 30%;
 | 
			
		||||
				}
 | 
			
		||||
			}
 | 
			
		||||
 | 
			
		||||
		}
 | 
			
		||||
@@ -118,7 +137,7 @@ body {
 | 
			
		||||
	height: 100vh;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
@media (max-width: 600px) {
 | 
			
		||||
@media (max-width: 900px) {
 | 
			
		||||
	.main {
 | 
			
		||||
		header {
 | 
			
		||||
			padding: 1em 1em;
 | 
			
		||||
@@ -146,6 +165,9 @@ body {
 | 
			
		||||
						flex-direction: column;
 | 
			
		||||
						justify-content: flex-start;
 | 
			
		||||
					}
 | 
			
		||||
					button {
 | 
			
		||||
						width: 100%;
 | 
			
		||||
					}
 | 
			
		||||
				}
 | 
			
		||||
			}
 | 
			
		||||
			.quests {
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user