mirror of
https://github.com/standardebooks/web.git
synced 2025-07-20 22:33:57 -04:00
Add password login option for some users, and further refinements to artwork management system
This commit is contained in:
Alex Cabal
parent
8a1b11b815
commit
5a1c05d8c5
22 changed files with 234 additions and 150 deletions
|
|
@ -128,8 +128,8 @@ ol.artwork-list.list > li{
|
|||
padding: 1rem;
|
||||
}
|
||||
|
||||
ol.artwork-list.list > li.in_use{
|
||||
background-color: rgba(0, 0, 0, .2);
|
||||
ol.artwork-list.list > li.in-use{
|
||||
opacity: .5;
|
||||
background-image: url("/images/stripes.svg");
|
||||
}
|
||||
|
||||
|
|
@ -142,6 +142,12 @@ ol.artwork-list.list > li .thumbnail-container{
|
|||
margin-left: auto;
|
||||
}
|
||||
|
||||
ol.artwork-list.list > li .thumbnail-container a:has(img){
|
||||
display: block;
|
||||
line-height: 0;
|
||||
border-radius: .25rem;
|
||||
}
|
||||
|
||||
ol.artwork-list.list > li p{
|
||||
text-align: left;
|
||||
}
|
||||
|
|
@ -209,13 +215,16 @@ main.artworks nav ol li a:hover{
|
|||
text-shadow: 1px 1px 0 rgba(0, 0, 0, .5);
|
||||
}
|
||||
|
||||
.artworks img{
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.artworks form[action="/artworks"]{
|
||||
align-items: end;
|
||||
display: grid;
|
||||
grid-gap: 1rem;
|
||||
grid-template-columns: auto auto auto auto 1fr;
|
||||
margin: 0 1rem;
|
||||
margin-bottom: 4rem;
|
||||
margin-top: 2rem;
|
||||
max-width: calc(100% - 2rem);
|
||||
}
|
||||
|
||||
|
|
@ -312,11 +321,12 @@ main.artworks nav ol li.highlighted:nth-last-child(2)::after{
|
|||
|
||||
.artwork-metadata td:first-child{
|
||||
font-weight: bold;
|
||||
width: 25%;
|
||||
text-align: right;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.artwork-metadata td:last-child{
|
||||
width: 75%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.artwork-metadata td{
|
||||
|
|
@ -325,6 +335,7 @@ main.artworks nav ol li.highlighted:nth-last-child(2)::after{
|
|||
|
||||
.artworks h1 + a{
|
||||
width: auto;
|
||||
line-height: 0;
|
||||
}
|
||||
|
||||
.artworks aside.tip{
|
||||
|
|
@ -362,74 +373,6 @@ main.artworks nav ol li.highlighted:nth-last-child(2)::after{
|
|||
justify-content: unset;
|
||||
}
|
||||
|
||||
@media(max-width: 730px){
|
||||
main.artwork nav ol li:not(.highlighted){
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media(max-width: 680px){
|
||||
main.artworks nav ol li.highlighted::before,
|
||||
main.artworks nav ol li.highlighted::after{
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media(max-width: 500px){
|
||||
main.artworks nav{
|
||||
margin-top: .5rem;
|
||||
}
|
||||
|
||||
main.artworks nav > a{
|
||||
margin-bottom: 0;
|
||||
font-size: 0;
|
||||
}
|
||||
|
||||
main.artworks nav > a::before,
|
||||
main.artworks nav > a::after{
|
||||
font-size: 1rem;
|
||||
margin: 0 !important;
|
||||
}
|
||||
|
||||
main.artworks nav a[rel]::before,
|
||||
main.artworks nav a[rel]::after{
|
||||
font-size: 1rem;
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media(max-width: 400px){
|
||||
/* Artist details */
|
||||
form[action="/artworks"] > fieldset:nth-of-type(1){
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
form[action="/artworks"] > fieldset:nth-of-type(2){
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
form[action="/artworks"] > fieldset label:has(input[name="artwork-tags"]),
|
||||
form[action="/artworks"] > fieldset label:has(input[name="artwork-image"]){
|
||||
grid-column: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@media(max-width: 380px){
|
||||
main.artworks nav > a{
|
||||
padding: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media(prefers-reduced-motion: reduce){
|
||||
.artworks nav > a:last-child::after,
|
||||
.artworks nav > a:last-child[href]:hover::after,
|
||||
.artworks nav > a:first-child:before,
|
||||
.artworks nav > a:first-child[href]:hover::before,
|
||||
.artworks nav > a:last-child[href]:hover::after{
|
||||
transition: none;
|
||||
}
|
||||
}
|
||||
|
||||
.artworks figure p{
|
||||
background: #333;
|
||||
border: 1px solid var(--border);
|
||||
|
|
@ -494,3 +437,84 @@ main.artworks nav ol li.highlighted:nth-last-child(2)::after{
|
|||
font-family: "Fira Mono", monospace;
|
||||
font-size: .8rem;
|
||||
}
|
||||
|
||||
@media(max-width: 730px){
|
||||
main.artwork nav ol li:not(.highlighted){
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media(max-width: 680px){
|
||||
main.artworks nav ol li.highlighted::before,
|
||||
main.artworks nav ol li.highlighted::after{
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media(max-width: 500px){
|
||||
main.artworks nav{
|
||||
margin-top: .5rem;
|
||||
}
|
||||
|
||||
main.artworks nav > a{
|
||||
margin-bottom: 0;
|
||||
font-size: 0;
|
||||
}
|
||||
|
||||
main.artworks nav > a::before,
|
||||
main.artworks nav > a::after{
|
||||
font-size: 1rem;
|
||||
margin: 0 !important;
|
||||
}
|
||||
|
||||
main.artworks nav a[rel]::before,
|
||||
main.artworks nav a[rel]::after{
|
||||
font-size: 1rem;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.artwork-metadata td{
|
||||
display: block;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.artwork-metadata td:first-child{
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.artwork-metadata tr + tr td:first-child{
|
||||
padding-top: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media(max-width: 400px){
|
||||
/* Artist details */
|
||||
form[action="/artworks"] > fieldset:nth-of-type(1){
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
form[action="/artworks"] > fieldset:nth-of-type(2){
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
form[action="/artworks"] > fieldset label:has(input[name="artwork-tags"]),
|
||||
form[action="/artworks"] > fieldset label:has(input[name="artwork-image"]){
|
||||
grid-column: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@media(max-width: 380px){
|
||||
main.artworks nav > a{
|
||||
padding: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media(prefers-reduced-motion: reduce){
|
||||
.artworks nav > a:last-child::after,
|
||||
.artworks nav > a:last-child[href]:hover::after,
|
||||
.artworks nav > a:first-child:before,
|
||||
.artworks nav > a:first-child[href]:hover::before,
|
||||
.artworks nav > a:last-child[href]:hover::after{
|
||||
transition: none;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -821,6 +821,7 @@ h2 + .download-list tr.year-header:first-child th{
|
|||
.ebooks nav li.highlighted a:focus,
|
||||
a.button:focus,
|
||||
input[type="email"]:focus,
|
||||
input[type="password"]:focus,
|
||||
input[type="text"]:focus,
|
||||
input[type="month"]:focus,
|
||||
input[type="number"]:focus,
|
||||
|
|
@ -1714,6 +1715,7 @@ input[type="month"],
|
|||
input[type="number"],
|
||||
input[type="url"],
|
||||
input[type="email"],
|
||||
input[type="password"],
|
||||
input[type="search"]{
|
||||
-webkit-appearance: none;
|
||||
appearance: none;
|
||||
|
|
@ -1733,7 +1735,9 @@ input[type="search"]{
|
|||
}
|
||||
|
||||
label.email input,
|
||||
label.search input{
|
||||
label.search input,
|
||||
label.captcha input,
|
||||
label:has(input[type="password"]) input{
|
||||
padding-left: 2.5rem;
|
||||
}
|
||||
|
||||
|
|
@ -1816,16 +1820,20 @@ label.select:hover > span + span::after{
|
|||
|
||||
label.select > span + span,
|
||||
label.email,
|
||||
label.search{
|
||||
label.search,
|
||||
label.captcha,
|
||||
label:has(input[type="password"]){
|
||||
position: relative;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
label.email::before,
|
||||
label.search::before{
|
||||
label.search::before,
|
||||
label.captcha::before,
|
||||
label:has(input[type="password"])::before{
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: calc(2rem + .7rem);
|
||||
bottom: 1.2rem;
|
||||
left: 1rem;
|
||||
font-family: "Fork Awesome";
|
||||
font-size: 1rem;
|
||||
|
|
@ -1843,10 +1851,18 @@ label.search::before{
|
|||
content: "\f002";
|
||||
}
|
||||
|
||||
label.email::before{
|
||||
label:has(input[type="email"])::before{
|
||||
content: "\f0e0";
|
||||
}
|
||||
|
||||
label:has(input[type="password"])::before{
|
||||
content: "\f084";
|
||||
}
|
||||
|
||||
label.captcha::before{
|
||||
content: "\f256";
|
||||
}
|
||||
|
||||
nav li.highlighted a,
|
||||
nav a[rel],
|
||||
a.button,
|
||||
|
|
@ -1856,6 +1872,7 @@ input[type="month"],
|
|||
input[type="number"],
|
||||
input[type="url"],
|
||||
input[type="email"],
|
||||
input[type="password"],
|
||||
input[type="search"],
|
||||
select{
|
||||
transition: border-color .5s, background-color .5s;
|
||||
|
|
@ -1878,6 +1895,8 @@ input[type="url"]:focus,
|
|||
input[type="url"]:hover,
|
||||
input[type="email"]:focus,
|
||||
input[type="email"]:hover,
|
||||
input[type="password"]:focus,
|
||||
input[type="password"]:hover,
|
||||
input[type="search"]:focus,
|
||||
input[type="search"]:hover,
|
||||
textarea:focus,
|
||||
|
|
@ -1894,6 +1913,7 @@ input[type="month"]:user-invalid,
|
|||
input[type="number"]:user-invalid,
|
||||
input[type="url"]:user-invalid,
|
||||
input[type="email"]:user-invalid,
|
||||
input[type="password"]:user-invalid,
|
||||
input[type="search"]:user-invalid{
|
||||
border-color: #ff0000;
|
||||
box-shadow: 1px 1px 0 #ff0000, -1px -1px 0 #ff0000;
|
||||
|
|
@ -1904,6 +1924,7 @@ input[type="month"]:-moz-ui-invalid,
|
|||
input[type="number"]:-moz-ui-invalid,
|
||||
input[type="url"]:-moz-ui-invalid,
|
||||
input[type="email"]:-moz-ui-invalid,
|
||||
input[type="password"]:-moz-ui-invalid,
|
||||
input[type="search"]:-moz-ui-invalid{
|
||||
border-color: #ff0000;
|
||||
box-shadow: 1px 1px 0 #ff0000, -1px -1px 0 #ff0000;
|
||||
|
|
@ -1974,6 +1995,7 @@ form[action="/ebooks"] button{
|
|||
form.single-row{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
form.single-row label{
|
||||
|
|
@ -3601,6 +3623,7 @@ ul.feed p{
|
|||
input[type="number"],
|
||||
input[type="url"],
|
||||
input[type="email"],
|
||||
input[type="password"],
|
||||
input[type="search"],
|
||||
select,
|
||||
a.button:hover,
|
||||
|
|
@ -3617,6 +3640,8 @@ ul.feed p{
|
|||
input[type="url"]:hover,
|
||||
input[type="email"]:focus,
|
||||
input[type="email"]:hover,
|
||||
input[type="password"]:focus,
|
||||
input[type="password"]:hover,
|
||||
input[type="search"]:focus,
|
||||
input[type="search"]:hover,
|
||||
select:focus,
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue