mirror of
https://gitlab.com/MrFry/qmining-page
synced 2025-04-01 20:23:44 +02:00
All questions / Subject browser page improve #4
This commit is contained in:
parent
38c6f67963
commit
55e3788b29
6 changed files with 69 additions and 14 deletions
|
@ -215,15 +215,6 @@ a {
|
|||
color: black;
|
||||
}
|
||||
|
||||
.searchBar {
|
||||
margin: 10px;
|
||||
width: 100%;
|
||||
color: white;
|
||||
background-color: #212127;
|
||||
border: none;
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.subjItem:hover:not(.activeSubjItem) {
|
||||
background-color: #555;
|
||||
color: white;
|
||||
|
|
|
@ -4,6 +4,7 @@ import fetch from 'unfetch'
|
|||
import LoadingIndicator from '../components/LoadingIndicator.js'
|
||||
import QuestionSearchResult from '../components/QuestionSearchResult.js'
|
||||
|
||||
import styles from './allQuestions.module.css'
|
||||
import constants from '../constants.json'
|
||||
|
||||
export default function AllQuestions (props) {
|
||||
|
@ -23,14 +24,22 @@ export default function AllQuestions (props) {
|
|||
if (data) {
|
||||
return (
|
||||
<div>
|
||||
<div>
|
||||
<div className={styles.searchContainer}>
|
||||
<input
|
||||
placeholder='Keresés...'
|
||||
className='searchBar'
|
||||
className={styles.searchBar}
|
||||
type='text'
|
||||
value={searchTerm}
|
||||
onChange={(e) => { setSearchTerm(e.target.value) }}
|
||||
/>
|
||||
<button
|
||||
onClick={() => {
|
||||
setSearchTerm('')
|
||||
}}
|
||||
className={styles.clearButton}
|
||||
>
|
||||
X
|
||||
</button>
|
||||
</div>
|
||||
<hr />
|
||||
<div>
|
||||
|
|
22
src/pages/allQuestions.module.css
Normal file
22
src/pages/allQuestions.module.css
Normal file
|
@ -0,0 +1,22 @@
|
|||
.searchBar {
|
||||
margin: 10px;
|
||||
color: white;
|
||||
background-color: #212127;
|
||||
border: none;
|
||||
font-size: 18px;
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
.searchContainer {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.clearButton {
|
||||
width: 80px;
|
||||
background-color: var(--background-color);
|
||||
color: white;
|
||||
font-size: 23px;
|
||||
cursor: pointer;
|
||||
border: none;
|
||||
}
|
|
@ -7,6 +7,7 @@
|
|||
text-decoration: none;
|
||||
display: inline-block;
|
||||
font-size: 16px;
|
||||
margin: 5px;
|
||||
}
|
||||
|
||||
.motdHeader {
|
||||
|
|
|
@ -5,9 +5,10 @@ import LoadingIndicator from '../components/LoadingIndicator.js'
|
|||
import Subject from '../components/Subject.js'
|
||||
import SubjectSelector from '../components/SubjectSelector.js'
|
||||
|
||||
import styles from './subjectBrowser.module.css'
|
||||
import constants from '../constants.json'
|
||||
|
||||
export default function AllQuestions (props) {
|
||||
export default function SubjectBrowser (props) {
|
||||
const [data, setData] = useState(null)
|
||||
const [activeSubjName, setActiveSubjName] = useState('')
|
||||
const [searchTerm, setSearchTerm] = useState('')
|
||||
|
@ -30,14 +31,22 @@ export default function AllQuestions (props) {
|
|||
|
||||
return (
|
||||
<div>
|
||||
<div>
|
||||
<div className={styles.searchContainer}>
|
||||
<input
|
||||
placeholder='Keresés...'
|
||||
className='searchBar'
|
||||
className={styles.searchBar}
|
||||
type='text'
|
||||
value={searchTerm}
|
||||
onChange={(e) => { setSearchTerm(e.target.value) }}
|
||||
/>
|
||||
<button
|
||||
onClick={() => {
|
||||
setSearchTerm('')
|
||||
}}
|
||||
className={styles.clearButton}
|
||||
>
|
||||
X
|
||||
</button>
|
||||
</div>
|
||||
<SubjectSelector
|
||||
data={data}
|
||||
|
|
23
src/pages/subjectBrowser.module.css
Normal file
23
src/pages/subjectBrowser.module.css
Normal file
|
@ -0,0 +1,23 @@
|
|||
.searchBar {
|
||||
margin: 10px;
|
||||
color: white;
|
||||
background-color: #212127;
|
||||
border: none;
|
||||
font-size: 18px;
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
|
||||
.searchContainer {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.clearButton {
|
||||
width: 80px;
|
||||
background-color: var(--background-color);
|
||||
color: white;
|
||||
font-size: 23px;
|
||||
cursor: pointer;
|
||||
border: none;
|
||||
}
|
Loading…
Add table
Add a link
Reference in a new issue