xwx.moe/el.xwx.moe
xwx.moe/ el.xwx.moe
1
0
Disbranĉigi 0
Fontkodo Issues Tirpetoj Actions Packages Projects Eldonoj Wiki Activity

UI Improvements

This commit is contained in:
Daniel 2022-05-26 21:28:55 +04:30
parent d010e351b5
commit dada207cdf
2 changed files with 9 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/App.js
View File

@ -39,6 +39,7 @@ function App() {
<input className="search" type="search" placeholder="&#xf002; Search for Name / Title / Tag" onChange={search}/> <input className="search" type="search" placeholder="&#xf002; Search for Name / Title / Tag" onChange={search}/>
<button className="add-btn" onClick={() => setIsAdding(true)}>&#xf067;</button> <button className="add-btn" onClick={() => setIsAdding(true)}>&#xf067;</button>
</div> </div>
<p>hi</p>
<List data={filteredData} reFetch={fetchData} /> <List data={filteredData} reFetch={fetchData} />
{isAdding ? <AddModal onExit={exitAdding} reFetch={fetchData} /> : null} {isAdding ? <AddModal onExit={exitAdding} reFetch={fetchData} /> : null}
</div> </div>

15
src/styles/List.css
View File

@ -6,11 +6,11 @@
} }
.list img { .list img {
position: absolute;
filter: blur(3px);
margin: 20px; margin: 20px;
width: 50px; width: 100px;
height: 50px; height: 100px;
border-radius: 10px;
box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, rgba(0, 0, 0, 0.22) 0px 10px 10px;
} }
.img-content-grp { .img-content-grp {
@ -29,6 +29,9 @@
} }
.list-entity-content { .list-entity-content {
text-shadow: 1px 1px 2px black;
z-index: 1;
margin-left: 50px;
padding: 20px; padding: 20px;
justify-content: space-between; justify-content: space-between;
display: flex; display: flex;
@ -59,9 +62,6 @@
.delete:hover { .delete:hover {
background-color: rgb(255, 123, 123); background-color: rgb(255, 123, 123);
}
.delete:active {
box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px; box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
} }
@ -76,6 +76,7 @@
width: fit-content; width: fit-content;
padding: 10px; padding: 10px;
font-size: 1rem; font-size: 1rem;
border-radius: 5px;
} }
.num { .num {