ngn/anonymous_overflow
1
0
Fork 0
Code Issues 1 Pull Requests 1 Actions Packages Activity

feat: sort select with button

Browse Source
This commit is contained in:
httpjamesm
2023-02-04 12:58:50 -05:00
parent bd48b309ac
commit d7bca93af8
3 changed files with 62 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
public/icons/sort.svg Normal file
View File

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">
<path stroke-linecap="round" stroke-linejoin="round" d="M12 3c2.755 0 5.455.232 8.083.678.533.09.917.556.917 1.096v1.044a2.25 2.25 0 01-.659 1.591l-5.432 5.432a2.25 2.25 0 00-.659 1.591v2.927a2.25 2.25 0 01-1.244 2.013L9.75 21v-6.568a2.25 2.25 0 00-.659-1.591L3.659 7.409A2.25 2.25 0 013 5.818V4.774c0-.54.384-1.006.917-1.096A48.32 48.32 0 0112 3z" />
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 491 B

36
public/question.css
View File

@ -111,6 +111,42 @@ img {
margin-bottom: 1rem;
}
.answers-header {
display: flex;
justify-content: space-between;
align-items: center;
}
.answers-header .sorting form {
display: flex;
align-items: center;
gap: .5rem;
}
.answers-header select {
border: 0;
border-radius: 5px;
padding: 0.5rem;
background-color: var(--meta-bg);
color: var(--text-color);
height: 2rem;
}
.answers-header button {
width: 2rem;
border: 0;
height: 2rem;
border-radius: 5px;
background-color: var(--meta-bg);
color: var(--text-color);
font-size: 1.5rem;
cursor: pointer;
display: flex;
justify-content: center;
align-items: center;
}
@media only screen and (max-width: 800px) {
body {
padding-left: 1rem;