albert/qmining-page
1
0
Fork 0
mirror of https://gitlab.com/MrFry/qmining-page synced 2025-04-01 20:23:44 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

Todo description now shows up in a modal

Browse source
This commit is contained in:
mrfry 2021-03-22 15:43:30 +01:00
parent e311b88508
commit df4fd775f3
4 changed files with 25 additions and 18 deletions
Download patch file Download diff file Expand all files Collapse all files

2
src/components/todoStuff/todoCard.js
View file

@ -27,7 +27,7 @@ export default function TodoCard(props) {
backgroundColor: categories[category].color, backgroundColor: categories[category].color,
color: 'white', color: 'white',
borderRadius: '2px', borderRadius: '2px',
padding: '0px 2px', padding: '2px 4px',
}} }}
> >
{categories[category].name} {categories[category].name}

11
src/components/todoStuff/todoSidebar.js
View file

@ -25,9 +25,9 @@ export default function Todos({
// TODO: hide vote button if not voteable // TODO: hide vote button if not voteable
return ( return (
<div className={styles.container}> <div className={styles.container}>
<div className={styles.name}> <div className={styles.title}>
<span className={styles.id}>#{id}</span> <span className={styles.id}>#{id}</span>
{name} <div className={styles.name}>{name}</div>
<span <span
style={{ style={{
margin: '0px 5px', margin: '0px 5px',
@ -35,7 +35,7 @@ export default function Todos({
backgroundColor: categories[category].color, backgroundColor: categories[category].color,
color: 'white', color: 'white',
borderRadius: '2px', borderRadius: '2px',
padding: '0px 2px', padding: '2px 4px',
whiteSpace: 'nowrap', whiteSpace: 'nowrap',
}} }}
> >
@ -74,7 +74,10 @@ export default function Todos({
{description && ( {description && (
<> <>
<div className={styles.title}>Leírás</div> <div className={styles.title}>Leírás</div>
<div dangerouslySetInnerHTML={{ __html: description }} /> <div
className={styles.description}
dangerouslySetInnerHTML={{ __html: description }}
/>
<hr /> <hr />
</> </>
)} )}

14
src/components/todoStuff/todoSidebar.module.css
View file

@ -13,10 +13,13 @@
font-size: 18px; font-size: 18px;
} }
.name { .title {
color: var(--text-color); color: var(--text-color);
font-size: 20px; font-size: 20px;
margin: 20px 0px; margin: 5px 0px;
}
.name {
} }
.category { .category {
@ -30,6 +33,13 @@
color: #999; color: #999;
} }
.description {
overflow-x: hidden;
overflow-y: scroll;
max-height: calc(38vh);
margin: 5px;
}
.row { .row {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;

16
src/components/todoStuff/todos.js
View file

@ -4,8 +4,7 @@ import LoadingIndicator from '../LoadingIndicator.js'
import TodoBoard from './todoBoard.js' import TodoBoard from './todoBoard.js'
import TodoTable from './todoTable.js' import TodoTable from './todoTable.js'
import TodoSidebar from './todoSidebar.js' import TodoSidebar from './todoSidebar.js'
import Modal from '../modal.js'
import Sidebar from '../sidebar.js'
import styles from './todo.module.css' import styles from './todo.module.css'
// import styles from './todos.module.css' // import styles from './todos.module.css'
@ -140,8 +139,8 @@ export default function Todos() {
return ( return (
<div> <div>
{sidebarCard && ( {sidebarCard && (
<Sidebar <Modal
onClose={() => { closeClick={() => {
setSidebarCard(null) setSidebarCard(null)
}} }}
> >
@ -165,15 +164,10 @@ export default function Todos() {
}) })
}} }}
/> />
</Sidebar> </Modal>
)} )}
{renderGrouper()} {renderGrouper()}
<div <div>
style={{
// width: '100%',
marginRight: sidebarCard ? 380 : 0,
}}
>
<TodoBoard <TodoBoard
columns={cols} columns={cols}
cards={bCards} cards={bCards}