Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Submission redesign] Additional author functionality #1893

Merged
merged 21 commits into from
Dec 3, 2024
Merged

[Submission redesign] Additional author functionality #1893

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
21 commits
Select commit Hold shift + click to select a range
05b9fc9
Closes https://github.com/datadryad/dryad-product-roadmap/issues/2291
ahamelers Oct 22, 2024
2595d0c
Closes https://github.com/datadryad/dryad-product-roadmap/issues/3021
ahamelers Oct 23, 2024
407d32d
Closes https://github.com/datadryad/dryad-product-roadmap/issues/2482
ahamelers Oct 23, 2024
f636281
Closes https://github.com/datadryad/dryad-product-roadmap/issues/2855
ahamelers Oct 23, 2024
525407d
Closes https://github.com/datadryad/dryad-product-roadmap/issues/3381
ahamelers Oct 23, 2024
80627e1
add drag and drop instruction
ahamelers Oct 23, 2024
a9b9c77
jest updates
ahamelers Oct 23, 2024
410f5a7
rspec updates
ahamelers Oct 23, 2024
1af9b3e
Closes https://github.com/datadryad/dryad-product-roadmap/issues/3546
ahamelers Oct 23, 2024
2a439d7
jest test updates for more specific labeling
ahamelers Oct 23, 2024
300034f
more label, button, error message style
ahamelers Oct 24, 2024
4b6fdf4
jest
ahamelers Oct 24, 2024
c77c97e
file alert style
ahamelers Oct 24, 2024
96aff97
Merge branch 'submission' into authors
ahamelers Oct 24, 2024
b786951
Merge branch 'submission' into authors
ahamelers Oct 24, 2024
4cd7ce5
annotate models update
ahamelers Oct 24, 2024
3936a18
readme button restyle and readme accessibility
ahamelers Oct 29, 2024
321c77b
validate author email
ahamelers Oct 29, 2024
32e880b
dupe check exception fix
ahamelers Oct 29, 2024
5ea23c1
dupe check exception fix
ahamelers Oct 29, 2024
c4002b4
duplicate aff fix
ahamelers Oct 29, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 6 additions & 1 deletion app/assets/stylesheets/scss/_buttons.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -101,7 +101,12 @@ input[type=file]::file-selector-button {
@extend %o-button__link-style;
padding: 5px 0;
color: $dark-blue;
font-size: 0.9em;
font-size: 0.98rem;
}

.o-button__plain-textlink {
@extend %o-button__link-style;
color: $dark-blue;
}

.o-button__plain-text6 {
Expand Down
8 changes: 5 additions & 3 deletions app/assets/stylesheets/scss/_drop.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,9 +25,12 @@
.dd-list-item {
list-style: "";
margin: 1rem auto;
padding: 1rem;
padding: 1rem;
background-color: $lightest-blue;
text-align: left;
display: flex;
align-items: flex-start;
flex-wrap: wrap;
gap: 1.5ch;

&.dragon-inactive {
}
Expand All @@ -36,7 +39,6 @@
@extend %o-button__link-style;
cursor: ns-resize;
float: left;
margin-right: 1.5ch;
margin-top: 28px;
&:before {
font-family: 'Font Awesome 6 Free';
Expand Down
29 changes: 28 additions & 1 deletion app/assets/stylesheets/scss/_input.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,13 +15,40 @@ input {
flex-wrap: wrap;
column-gap: 2ch;
row-gap: 1ch;

&.spaced {
justify-content: space-between;
align-items: baseline;
}
}

.input-label {
color: $dark-navy;
}

label.optional:after, label span.details {
.input-example, [id$='-ex'] {
font-size: .98rem;
color: $medium-gray;
margin-top: .35ch;
i:not(.fas, .far) {
&:before {
font-style: normal;
display: inline-block;
content: 'e.g.';
color: $dark-gray;
margin-right: .5ch;
}
&.hint:before {
content: 'Hint:';
}
&.ie:before {
content: 'i.e.'
}
}
}

label.optional:after,
label span.details {
display: inline-block;
font-size: .98rem;
font-weight: normal;
Expand Down
2 changes: 2 additions & 0 deletions app/assets/stylesheets/scss/_keywords.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -37,7 +37,9 @@
.c-keywords__keyword-remove {
border: none;
background-color: $medium-green;
border: thin solid $light-green;
color: white;
font-size: .98rem;
line-height: 0;
&:hover, &:active, &:focus {
background-color: $dark-blue;
Expand Down
4 changes: 4 additions & 0 deletions app/assets/stylesheets/scss/_steps.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,10 @@
flex-direction: column;
align-items: center;
flex: 1;
cursor: pointer;
&:hover .step-name {
text-decoration: underline;
}

&::after {
position: absolute;
Expand Down
37 changes: 37 additions & 0 deletions app/assets/stylesheets/scss/_submission-help.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,3 +1,40 @@
#submission-help {
//position: sticky;
//bottom: 0;
//box-shadow: $lightest-green 0px -4px 4px -6px;
border-top: thick solid $lightest-green;
background-color: white;
padding: 2rem;
padding-left: 30px;
width: 100%;
display: flex;
gap: 2ch;
align-items: flex-start;
justify-content: space-between;
flex-direction: row-reverse;

#submission-help-text {
font-size: 1rem;
*:first-child {
margin-top: 0;
}
*:last-child {
margin-top: 0;
}
}

@media (max-width: 811px){
flex-direction: column-reverse;
*:first-child {
margin-left: auto;
}
}

button {
white-space: nowrap;
}
}

#infographic {
margin: 2ch auto;
display: grid;
Expand Down
128 changes: 74 additions & 54 deletions app/assets/stylesheets/scss/_submission.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -503,45 +503,22 @@ dialog#submission-step[open] {
h1 {
margin-bottom: 0;
}
& + h2 {
& + h2, & + div > h2:first-child {
margin-top: 1.1rem;
}
}

#submission-help {
//position: sticky;
//bottom: 0;
//box-shadow: $lightest-green 0px -4px 4px -6px;
border-top: thick solid $lightest-green;
background-color: white;
padding: 2rem;
padding-left: 30px;
width: 100%;
.drag-instruct {
font-size: .98rem;
display: flex;
align-items: baseline;
gap: 2ch;
align-items: flex-start;
justify-content: space-between;
flex-direction: row-reverse;

#submission-help-text {
font-size: 1rem;
*:first-child {
margin-top: 0;
}
*:last-child {
margin-top: 0;
}
}

@media (max-width: 811px){
flex-direction: column-reverse;
*:first-child {
margin-left: auto;
}
flex-wrap: wrap;
i {
margin: 0 .5ch;
}

button {
white-space: nowrap;
& > * {
margin-bottom: 0;
}
}

Expand Down Expand Up @@ -571,52 +548,95 @@ dialog#submission-step[open] {
flex-wrap: wrap;
column-gap: 1.5ch;
row-gap: 1ch;
flex: 1;

& > span {
display: block;
align-self: start;
}

.remove-record {
.remove-record, & + .remove-record {
@extend %o-button__link-style;
margin-top: 28px;
}
}

%author-form-button {
color: $dark-blue;
background-color: white;
border: thin solid $medium-blue;
padding: 2px 5px;
&:hover, &:active, &:focus {
background-color: $dark-blue;
color: white;
}
}

.author-form > div {
flex-basis: 25%;
max-width: calc(25% - 2.2ch);
flex-basis: calc(33% - 1ch);
flex-shrink: 1;
flex-grow: 0;
max-width: 100%;
min-width: 165px;
* {
max-width: 100%;
text-overflow: ellipsis;
}
&.affiliation-input {
flex: 1;
min-width: 200px;

.input-line {
align-items: baseline;
gap: 1ch;
flex-wrap: nowrap;
button {
@extend %author-form-button;
line-height: 0;
font-size: .9rem;
}
}

& + span {
display: block;
align-self: start;
button {
@extend %author-form-button;
margin-top: 28px;
font-size: .98rem;
padding-bottom: 0;
}
}
}
@media (max-width: $screen-lg-min) {
flex-basis: 50%;
max-width: calc(50% - 2.2ch);
flex-basis: calc(50% - 1ch);
}
@media (max-width: 600px) {
@media (max-width: 520px) {
flex-basis: 100%;
max-width: 100%;
}
}

.open .author-form > div {
@media (max-width: 740px) {
flex-basis: 100%;
}
}

.auth-buttons {
display: flex;
flex-direction: row-reverse;
align-items: center;

i {
transform: rotate(75deg);
color: $dark-gray;
}
}

.funder-form {
padding-bottom: 1ch;
& > div {
flex-basis: 33%;
max-width: calc(33% - 2.2ch);
flex-basis: 25%;
flex: 1;
* {
max-width: 100%;
text-overflow: ellipsis;
}
@media (max-width: 800px) {
flex-basis: 50%;
max-width: calc(50% - 2.2ch);
}
@media (max-width: 600px) {
flex-basis: 100%;
max-width: 100%;
}
}
}

Expand Down
3 changes: 2 additions & 1 deletion app/assets/stylesheets/scss/_upload-table.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,10 +16,11 @@

.c-uploadtable {
min-width: 100%;
font-size: 1rem;

th,
td {
padding: $spacing-sm;
padding: .75rem;
border: thin solid #888;
text-align: left;
}
Expand Down
1 change: 1 addition & 0 deletions app/assets/stylesheets/scss/_variables.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@ $light-blue: rgb(55, 150, 196);
$lighter-blue: lighten($light-blue, 25%);
$lightest-blue: lighten($light-blue, 44%);
$dark-gray: rgb(78, 80, 80);
$medium-gray: #767676;
$light-gray: rgb(157, 159, 162);
$lighter-gray: rgb(211, 211, 211);
$lightest-gray: rgb(235, 235, 235);
Expand Down
Loading