mirror of
https://github.com/FranP-code/Hangman-game-with-React.git
synced 2025-10-13 00:42:32 +00:00
layout of actions done
This commit is contained in:
@@ -5,8 +5,11 @@ const AddCategory = () => {
|
||||
console.log('category');
|
||||
|
||||
return (
|
||||
<div>
|
||||
|
||||
<div className="action-form add-category">
|
||||
<form>
|
||||
<input type="text"/>
|
||||
<input type="submit"/>
|
||||
</form>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -5,7 +5,7 @@ const AddWord = () => {
|
||||
console.log('word');
|
||||
|
||||
return (
|
||||
<div className="form-add-word">
|
||||
<div className="action-form add-word">
|
||||
<form>
|
||||
<textarea placeholder="Add the word/words separated by commas" cols="30" rows="10"></textarea>
|
||||
<input type="submit" value="Add Word(s)" />
|
||||
|
||||
@@ -2,8 +2,14 @@ import React from 'react'
|
||||
|
||||
const DeleteCategory = () => {
|
||||
return (
|
||||
<div>
|
||||
|
||||
<div className="action-form delete-category">
|
||||
<form>
|
||||
<select>
|
||||
<option>Select an option</option>
|
||||
<option>AA</option>
|
||||
</select>
|
||||
<input type="submit" value="Delete"/>
|
||||
</form>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -2,8 +2,16 @@ import React from 'react'
|
||||
|
||||
const DeleteWord = () => {
|
||||
return (
|
||||
<div>
|
||||
|
||||
<div className="action-form delete-word">
|
||||
<form>
|
||||
<select>
|
||||
<option>Select category</option>
|
||||
</select>
|
||||
<select>
|
||||
<option>Select word</option>
|
||||
</select>
|
||||
<input type="submit" value="Delete" />
|
||||
</form>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -2,8 +2,17 @@ import React from 'react'
|
||||
|
||||
const EditWord = () => {
|
||||
return (
|
||||
<div>
|
||||
|
||||
<div className="action-form edit-word">
|
||||
<form>
|
||||
<select>
|
||||
<option>Select category</option>
|
||||
</select>
|
||||
<select>
|
||||
<option>Select word</option>
|
||||
</select>
|
||||
<input type="text" placeholder="Place the new word" />
|
||||
<input type="submit" value="Delete" />
|
||||
</form>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -1,13 +1,13 @@
|
||||
import React from 'react'
|
||||
import DefineClassName from './Actions/Scripts/DefineClassName'
|
||||
|
||||
const AdminFunctionButton = ({action, setActualAction}) => {
|
||||
const AdminFunctionButton = ({action, actualAction, setActualAction}) => {
|
||||
|
||||
const classButton = DefineClassName(action)
|
||||
|
||||
return (
|
||||
<button
|
||||
className={classButton}
|
||||
className={action === actualAction ? classButton + ' active' : classButton}
|
||||
onClick={() => setActualAction(action)}
|
||||
>
|
||||
{action}
|
||||
|
||||
@@ -31,11 +31,11 @@ const ControlPanel = (props) => {
|
||||
userLogged ?
|
||||
<div
|
||||
className={actualAction ? 'buttons-container nav-mode' : 'buttons-container'}>
|
||||
<AdminFunctionButton action={'Add Word(s)'} setActualAction={setActualAction}/>
|
||||
<AdminFunctionButton action={'Add Category'} setActualAction={setActualAction}/>
|
||||
<AdminFunctionButton action ={'Delete Category'} setActualAction={setActualAction}/>
|
||||
<AdminFunctionButton action ={'Delete Word'} setActualAction={setActualAction}/>
|
||||
<AdminFunctionButton action ={'Edit Word'} setActualAction={setActualAction}/>
|
||||
<AdminFunctionButton action={'Add Word(s)'} actualAction={actualAction} setActualAction={setActualAction}/>
|
||||
<AdminFunctionButton action={'Add Category'} actualAction={actualAction} setActualAction={setActualAction}/>
|
||||
<AdminFunctionButton action ={'Delete Category'} actualAction={actualAction} setActualAction={setActualAction}/>
|
||||
<AdminFunctionButton action ={'Delete Word'} actualAction={actualAction} setActualAction={setActualAction}/>
|
||||
<AdminFunctionButton action ={'Edit Word'} actualAction={actualAction} setActualAction={setActualAction}/>
|
||||
</div>
|
||||
: null
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user