From 2e96bff0d1c5dc88a86ac43e5935e2de46262b3a Mon Sep 17 00:00:00 2001 From: Hector Correa Date: Tue, 17 Dec 2024 15:57:40 -0500 Subject: [PATCH 1/6] Started playing with the new style. Early work in progress while we figure out how to copy the styles from Figma. Co-authored-by: Robert-Anthony Lee-Faison --- app/assets/stylesheets/_project.scss | 83 ++++++++++++++++++++++++-- app/views/projects/_edit_form.html.erb | 21 +++++++ 2 files changed, 100 insertions(+), 4 deletions(-) diff --git a/app/assets/stylesheets/_project.scss b/app/assets/stylesheets/_project.scss index 951889d9..2a20c2e8 100644 --- a/app/assets/stylesheets/_project.scss +++ b/app/assets/stylesheets/_project.scss @@ -15,7 +15,7 @@ font-weight: 400; line-height: 18px; width: 100%; - + thead { background-color: $gray-10; overflow: hidden; @@ -31,7 +31,7 @@ } tr { - border: 1px solid $gray-20; + border: 1px solid $gray-20; overflow: hidden; color: $gray-100; text-overflow: ellipsis; @@ -68,8 +68,83 @@ #project-contents { margin-bottom: 0.75rem; - + .sorting:hover { cursor: pointer; } -} \ No newline at end of file +} + +.frame-218 { + display: inline-flex; + align-items: flex-start; + gap: 6.75rem; + + .title { + color: $black; + /* Body L Bold */ + font-family: "Libre Franklin"; + font-size: 1.25rem; + font-style: normal; + font-weight: 600; + line-height: 1.875rem; /* 150% */ + } + + .frame-187 { + display: flex; + width: 55.9375rem; + flex-direction: column; + align-items: flex-start; + gap: 0.5rem; + + .table-5 { + display: flex; + flex-direction: column; + align-items: flex-start; + align-self: stretch; + border-radius: 0.5rem; + + .table { + display: flex; + width: 55.9375rem; + flex-direction: column; + align-items: flex-start; + border-radius: 0.25rem; + border: 1px solid $gray-20; + + .thead { + display: flex; + height: 2.9375rem; + align-items: flex-start; + align-self: stretch; + background: $gray-10; + + .cell { + display: flex; + flex-direction: column; + justify-content: center; + align-items: flex-start; + flex: 1 0 0; + align-self: stretch; + background: rgba(255, 255, 255, 0.05); + + .content { + display: flex; + padding: 0.25rem 0.75rem; + align-items: flex-start; + align-self: stretch; + } + } + } + + .tbody { + display: flex; + height: 2.25rem; + align-items: flex-start; + align-self: stretch; + background: #FFF; + } + } + + } + } + } diff --git a/app/views/projects/_edit_form.html.erb b/app/views/projects/_edit_form.html.erb index e062f989..9641a697 100644 --- a/app/views/projects/_edit_form.html.erb +++ b/app/views/projects/_edit_form.html.erb @@ -38,6 +38,27 @@ +
+ Data Users +
+
+
+
+
NetID
+
Read Only
+
Read Write
+
Action
+
+
+
+ No Data User(s) added +
+
+
+
+
+
+
From be2d1af0b997d4fbf3f212a38cf4b856c911207a Mon Sep 17 00:00:00 2001 From: Hector Correa Date: Thu, 19 Dec 2024 16:55:46 -0500 Subject: [PATCH 2/6] Got the table header working and the No Data Users message. Still have to make sure the rows are displayed on different lines, though --- app/assets/stylesheets/_project.scss | 132 ++++++++++++++++++++++--- app/views/projects/_edit_form.html.erb | 79 +++++++++++---- 2 files changed, 183 insertions(+), 28 deletions(-) diff --git a/app/assets/stylesheets/_project.scss b/app/assets/stylesheets/_project.scss index 2a20c2e8..353b3b81 100644 --- a/app/assets/stylesheets/_project.scss +++ b/app/assets/stylesheets/_project.scss @@ -74,21 +74,21 @@ } } -.frame-218 { +.data-users-title { + color: $black; + /* Body L Bold */ + font-family: "Libre Franklin"; + font-size: 1.25rem; + font-style: normal; + font-weight: 600; + line-height: 1.875rem; /* 150% */ + } + + .frame-218 { display: inline-flex; align-items: flex-start; gap: 6.75rem; - .title { - color: $black; - /* Body L Bold */ - font-family: "Libre Franklin"; - font-size: 1.25rem; - font-style: normal; - font-weight: 600; - line-height: 1.875rem; /* 150% */ - } - .frame-187 { display: flex; width: 55.9375rem; @@ -102,6 +102,7 @@ align-items: flex-start; align-self: stretch; border-radius: 0.5rem; + margin-bottom: -10px; /* not in Figma */ .table { display: flex; @@ -126,6 +127,7 @@ flex: 1 0 0; align-self: stretch; background: rgba(255, 255, 255, 0.05); + font-weight: 600; /* not in Figma */ .content { display: flex; @@ -142,9 +144,117 @@ align-items: flex-start; align-self: stretch; background: #FFF; + + #row-no-users { + display: flex; + height: 2.25rem; + align-items: flex-start; + align-self: stretch; + background: #FFF; + width: 100%; /* not in Figma */ + + /* cell */ + #text-no-users { + display: flex; + flex-direction: column; + justify-content: center; + align-items: flex-start; + flex: 1 0 0; + align-self: stretch; + background: rgba(255, 255, 255, 0.00); + + + /* content */ + div { + display: flex; + padding: 0.625rem 0.75rem; + justify-content: center; + align-items: center; + align-self: stretch; + + color: var(--Neutral-Dark-Gray, #717171); + /* Body XS */ + font-family: "Libre Franklin"; + font-size: 0.875rem; + font-style: normal; + font-weight: 400; + line-height: 1.3125rem; /* 150% */ + } + } + } + + .row-data { + display: flex; + height: 2.25rem; + align-items: flex-start; + align-self: stretch; + background: var(--Neutral-White, #FFF); + + .cell { + display: flex; + flex-direction: column; + justify-content: center; + align-items: flex-start; + flex: 1 0 0; + align-self: stretch; + + .column1 { + display: flex; + padding: 0.625rem 0.75rem; + justify-content: space-between; + align-items: center; + align-self: stretch; + } + + .column2 { + display: flex; + padding: 0.625rem 0.75rem; + align-items: flex-start; + align-self: stretch; + } + + .column3 { + display: flex; + padding: 0.625rem 0.75rem; + align-items: flex-start; + align-self: stretch; + } + + .column4 { + display: flex; + padding: 0.625rem 0.75rem; + align-items: center; + gap: 0.5rem; + align-self: stretch; + } + } + } } } } + + .frame-106 { + display: flex; + width: 55.9375rem; + justify-content: space-between; + align-items: center; + + .frame-252 { + display: flex; + align-items: center; + gap: 0.75rem; + + a { + color: var(--Neutral-Black, #121212); + /* Body S Bold */ + font-family: "Libre Franklin"; + font-size: 1rem; + font-style: normal; + font-weight: 600; + line-height: 1.5rem; /* 150% */ + } + } + } } } diff --git a/app/views/projects/_edit_form.html.erb b/app/views/projects/_edit_form.html.erb index 9641a697..2261fd36 100644 --- a/app/views/projects/_edit_form.html.erb +++ b/app/views/projects/_edit_form.html.erb @@ -38,26 +38,71 @@
-
- Data Users -
-
-
-
-
NetID
-
Read Only
-
Read Write
-
Action
+
+
+ Data Users +
+
+
+
+
+
+
+
NetID
+
Read Only
+
Read Write
+
Action
+
+
+
+
+
No Data User(s) added
+
+
+
+
+
aaa
+
+
+
bbb
+
+
+
ccc
+
+
+
ddd
+
+
+
+
+
aaa
+
+
+
bbb
+
+
+
ccc
+
+
+
ddd
+
+
+
+
-
-
- No Data User(s) added +
+
+ + + +  Add User(s)
-
-
-
-
+
+
+
+
+
From a1cbc85e1dce90fbfb9f08ebda15b13c113727a0 Mon Sep 17 00:00:00 2001 From: Hector Correa Date: Fri, 20 Dec 2024 14:29:59 -0500 Subject: [PATCH 3/6] Got the rows to display correctly (hard-coded rows, but they display right) --- app/assets/stylesheets/_project.scss | 112 ++++++++----------------- app/views/projects/_edit_form.html.erb | 50 +++-------- 2 files changed, 48 insertions(+), 114 deletions(-) diff --git a/app/assets/stylesheets/_project.scss b/app/assets/stylesheets/_project.scss index 353b3b81..bf62506b 100644 --- a/app/assets/stylesheets/_project.scss +++ b/app/assets/stylesheets/_project.scss @@ -136,103 +136,61 @@ align-self: stretch; } } - } + } /* thead */ - .tbody { + .table-row { display: flex; height: 2.25rem; align-items: flex-start; align-self: stretch; background: #FFF; - #row-no-users { + .table-col { display: flex; - height: 2.25rem; + flex-direction: column; + justify-content: center; align-items: flex-start; + flex: 1 0 0; align-self: stretch; - background: #FFF; - width: 100%; /* not in Figma */ + background: rgba(255, 255, 255, 0.05); - /* cell */ - #text-no-users { + .i-do-not-think-we-need-this-content { display: flex; - flex-direction: column; - justify-content: center; + padding: 0.25rem 0.75rem; align-items: flex-start; - flex: 1 0 0; align-self: stretch; - background: rgba(255, 255, 255, 0.00); - - - /* content */ - div { - display: flex; - padding: 0.625rem 0.75rem; - justify-content: center; - align-items: center; - align-self: stretch; - - color: var(--Neutral-Dark-Gray, #717171); - /* Body XS */ - font-family: "Libre Franklin"; - font-size: 0.875rem; - font-style: normal; - font-weight: 400; - line-height: 1.3125rem; /* 150% */ - } } } + } /* table-row */ - .row-data { + .table-row-no-data { + display: flex; + height: 2.25rem; + align-items: flex-start; + align-self: stretch; + background: #FFF; + width: 100%; /* not in Figma */ + + #text-no-users { display: flex; - height: 2.25rem; - align-items: flex-start; + flex-direction: column; + justify-content: center; + align-items: center; + flex: 1 0 0; align-self: stretch; - background: var(--Neutral-White, #FFF); - - .cell { - display: flex; - flex-direction: column; - justify-content: center; - align-items: flex-start; - flex: 1 0 0; - align-self: stretch; - - .column1 { - display: flex; - padding: 0.625rem 0.75rem; - justify-content: space-between; - align-items: center; - align-self: stretch; - } - - .column2 { - display: flex; - padding: 0.625rem 0.75rem; - align-items: flex-start; - align-self: stretch; - } - - .column3 { - display: flex; - padding: 0.625rem 0.75rem; - align-items: flex-start; - align-self: stretch; - } + background: rgba(255, 255, 255, 0.00); + color: var(--Neutral-Dark-Gray, #717171); - .column4 { - display: flex; - padding: 0.625rem 0.75rem; - align-items: center; - gap: 0.5rem; - align-self: stretch; - } - } + /* Body XS */ + font-family: "Libre Franklin"; + font-size: 0.875rem; + font-style: normal; + font-weight: 400; + line-height: 1.3125rem; /* 150% */ } - } - } - - } + } /* table-row-no-data */ + } /* table */ + } /* table-5 */ .frame-106 { display: flex; @@ -243,7 +201,7 @@ .frame-252 { display: flex; align-items: center; - gap: 0.75rem; + gap: 0.25rem; a { color: var(--Neutral-Black, #121212); diff --git a/app/views/projects/_edit_form.html.erb b/app/views/projects/_edit_form.html.erb index 2261fd36..bda7f322 100644 --- a/app/views/projects/_edit_form.html.erb +++ b/app/views/projects/_edit_form.html.erb @@ -53,49 +53,25 @@
Read Write
Action
-
-
-
-
No Data User(s) added
-
+
+
+ No Data User(s) added
-
-
-
aaa
-
-
-
bbb
-
-
-
ccc
-
-
-
ddd
-
-
-
-
-
aaa
-
-
-
bbb
-
-
-
ccc
-
-
-
ddd
-
-
+
+
+
NetID
+
Read Only
+
Read Write
+
Action
- - - -  Add User(s) + + + + Add User(s)
From 4bc7f3ae586944b2adc1aa776269b4219e742118 Mon Sep 17 00:00:00 2001 From: Hector Correa Date: Fri, 20 Dec 2024 15:19:14 -0500 Subject: [PATCH 4/6] Got the rows to display correctly (data driven again) --- app/assets/stylesheets/_project.scss | 193 +++++++++++++----------- app/assets/stylesheets/application.scss | 32 +--- app/views/projects/_edit_form.html.erb | 43 ++---- 3 files changed, 118 insertions(+), 150 deletions(-) diff --git a/app/assets/stylesheets/_project.scss b/app/assets/stylesheets/_project.scss index bf62506b..04097cb0 100644 --- a/app/assets/stylesheets/_project.scss +++ b/app/assets/stylesheets/_project.scss @@ -84,115 +84,136 @@ line-height: 1.875rem; /* 150% */ } - .frame-218 { +.added-user-textbox { + border: none !important; + background-color: white !important; + width: 100% !important; +} + +.delete-user-row { + color: $red-dark; +} + +/* Used for the delete button when adding users within the modal */ +.transparent-button { + background-color: transparent; + background-repeat: no-repeat; + border: none; + cursor: pointer; + overflow: hidden; + outline: none; +} + +.frame-218 { display: inline-flex; align-items: flex-start; gap: 6.75rem; .frame-187 { - display: flex; - width: 55.9375rem; - flex-direction: column; - align-items: flex-start; - gap: 0.5rem; - - .table-5 { - display: flex; - flex-direction: column; - align-items: flex-start; - align-self: stretch; - border-radius: 0.5rem; - margin-bottom: -10px; /* not in Figma */ - - .table { - display: flex; - width: 55.9375rem; - flex-direction: column; - align-items: flex-start; - border-radius: 0.25rem; - border: 1px solid $gray-20; - - .thead { + display: flex; + width: 55.9375rem; + flex-direction: column; + align-items: flex-start; + gap: 0.5rem; + + .table-5 { + display: flex; + flex-direction: column; + align-items: flex-start; + align-self: stretch; + border-radius: 0.5rem; + margin-bottom: -10px; /* not in Figma */ + + .table { display: flex; - height: 2.9375rem; + width: 55.9375rem; + flex-direction: column; align-items: flex-start; - align-self: stretch; - background: $gray-10; - - .cell { - display: flex; - flex-direction: column; - justify-content: center; - align-items: flex-start; - flex: 1 0 0; - align-self: stretch; - background: rgba(255, 255, 255, 0.05); - font-weight: 600; /* not in Figma */ - - .content { + border-radius: 0.25rem; + border: 1px solid $gray-20; + + .thead { display: flex; - padding: 0.25rem 0.75rem; + height: 2.9375rem; align-items: flex-start; align-self: stretch; - } - } - } /* thead */ + background: $gray-10; - .table-row { - display: flex; - height: 2.25rem; - align-items: flex-start; - align-self: stretch; - background: #FFF; + .cell { + display: flex; + flex-direction: column; + justify-content: center; + align-items: flex-start; + flex: 1 0 0; + align-self: stretch; + background: rgba(255, 255, 255, 0.05); + font-weight: 600; /* not in Figma */ + + .content { + display: flex; + padding: 0.25rem 0.75rem; + align-items: flex-start; + align-self: stretch; + } + } + } /* thead */ - .table-col { + .table-row { display: flex; - flex-direction: column; - justify-content: center; + height: 2.25rem; align-items: flex-start; - flex: 1 0 0; align-self: stretch; - background: rgba(255, 255, 255, 0.05); + background: #FFF; - .i-do-not-think-we-need-this-content { + .table-col { display: flex; - padding: 0.25rem 0.75rem; + flex-direction: column; + justify-content: center; align-items: flex-start; + flex: 1 0 0; align-self: stretch; + background: rgba(255, 255, 255, 0.05); + + .content { + display: flex; + padding: 0.25rem 0.75rem; + align-items: flex-start; + align-self: stretch; + width: 100%; /* not in Figma */ + } } - } - } /* table-row */ - - .table-row-no-data { - display: flex; - height: 2.25rem; - align-items: flex-start; - align-self: stretch; - background: #FFF; - width: 100%; /* not in Figma */ + } /* table-row */ - #text-no-users { + .table-row-no-data { display: flex; - flex-direction: column; - justify-content: center; - align-items: center; - flex: 1 0 0; + height: 2.25rem; + align-items: flex-start; align-self: stretch; - background: rgba(255, 255, 255, 0.00); - color: var(--Neutral-Dark-Gray, #717171); + background: #FFF; + width: 100%; /* not in Figma */ - /* Body XS */ - font-family: "Libre Franklin"; - font-size: 0.875rem; - font-style: normal; - font-weight: 400; - line-height: 1.3125rem; /* 150% */ - } - } /* table-row-no-data */ - } /* table */ - } /* table-5 */ + #text-no-users { + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + flex: 1 0 0; + align-self: stretch; + background: rgba(255, 255, 255, 0.00); + color: var(--Neutral-Dark-Gray, #717171); + + /* Body XS */ + font-family: "Libre Franklin"; + font-size: 0.875rem; + font-style: normal; + font-weight: 400; + line-height: 1.3125rem; /* 150% */ + } + } /* table-row-no-data */ + } /* table */ + } /* table-5 */ - .frame-106 { + .frame-106 { display: flex; width: 55.9375rem; justify-content: space-between; @@ -213,6 +234,6 @@ line-height: 1.5rem; /* 150% */ } } - } + } } - } +} diff --git a/app/assets/stylesheets/application.scss b/app/assets/stylesheets/application.scss index 71af1f8d..a1673a0a 100644 --- a/app/assets/stylesheets/application.scss +++ b/app/assets/stylesheets/application.scss @@ -61,7 +61,7 @@ h1, h2, h3, h4, h5, h6 { } .hidden-element { - display: none; + display: none !important; } .netid-large { @@ -118,36 +118,6 @@ h1, h2, h3, h4, h5, h6 { color: var(--Secondary-Red-Dark, #b00002); } -/* Used for the delete button when adding users */ -.transparent-button { - background-color: transparent; - background-repeat: no-repeat; - border: none; - cursor: pointer; - overflow: hidden; - outline: none; -} - -/* Data users in the Edit form */ -#data-users-table { - border-color: gray; - border-style: solid; - border-width: 1px; -} - -#data-users-table > thead { - background-color: lightgray; -} - -.added-user-textbox { - border: none !important; - background-color: white !important; -} - -.delete-user-row { - color: red; -} - .alert-primary { position: absolute; } diff --git a/app/views/projects/_edit_form.html.erb b/app/views/projects/_edit_form.html.erb index bda7f322..9e514324 100644 --- a/app/views/projects/_edit_form.html.erb +++ b/app/views/projects/_edit_form.html.erb @@ -46,7 +46,7 @@
-
+
NetID
Read Only
@@ -58,12 +58,6 @@ No Data User(s) added
-
-
NetID
-
Read Only
-
Read Write
-
Action
-
@@ -77,29 +71,6 @@
-
- - -
-
- -
-
- - - - - - - - - - - - -
NetIDRead OnlyRead WriteAction
No Data User(s) added
- + Add User(s) -

Project Description

@@ -273,8 +244,14 @@ rwHtml += " checked>" } const actionHtml = `Remove`; - const rowHtml = `${netIdHtml}${roHtml}${rwHtml}${actionHtml}`; - $(`#data-users-table>tbody`).append(rowHtml); + const rowHtml = ` +
+
${netIdHtml}
+
${roHtml}
+
${rwHtml}
+
${actionHtml}
+
`; + $(`#data-users-table`).append(rowHtml); } // Returns the netids of the users already in the HTML FORM @@ -392,7 +369,7 @@ // Delete a `` that represents a user. $(document).on("click", ".delete-user-row", (el) => { - $(el.target.parentElement.parentElement).remove(); + $(el.target.parentElement.parentElement.parentElement).remove(); return false; }); From 845e1aa079548fe8b4e0bbd9f025e63a2c1d6eea Mon Sep 17 00:00:00 2001 From: Hector Correa Date: Fri, 20 Dec 2024 15:30:29 -0500 Subject: [PATCH 5/6] Minor tweaks --- app/assets/stylesheets/_project.scss | 14 ++++++++------ spec/system/project_roles_spec.rb | 6 +++--- spec/system/project_spec.rb | 8 ++++---- 3 files changed, 15 insertions(+), 13 deletions(-) diff --git a/app/assets/stylesheets/_project.scss b/app/assets/stylesheets/_project.scss index 04097cb0..fe69ae3b 100644 --- a/app/assets/stylesheets/_project.scss +++ b/app/assets/stylesheets/_project.scss @@ -150,10 +150,10 @@ font-weight: 600; /* not in Figma */ .content { - display: flex; - padding: 0.25rem 0.75rem; - align-items: flex-start; - align-self: stretch; + display: flex; + padding: 0.25rem 0.75rem; + align-items: flex-start; + align-self: stretch; } } } /* thead */ @@ -178,8 +178,10 @@ display: flex; padding: 0.25rem 0.75rem; align-items: flex-start; - align-self: stretch; - width: 100%; /* not in Figma */ + /* align-self: stretch; */ + input { + width: 100% !important; + } } } } /* table-row */ diff --git a/spec/system/project_roles_spec.rb b/spec/system/project_roles_spec.rb index 2a26e11e..2ff11e12 100644 --- a/spec/system/project_roles_spec.rb +++ b/spec/system/project_roles_spec.rb @@ -38,7 +38,7 @@ expect(page.find("button[value=Submit]").disabled?).to be false # Adds a data user (read-only) - click_on "+ Add User(s)" + click_on "Add User(s)" fill_in_and_out "data-user-uid-to-add", with: read_only.uid click_on "Save changes" @@ -172,7 +172,7 @@ it "allows a Data Sponsor to assign a Data User" do sign_in sponsor_user visit "/projects/#{project.id}/edit" - click_on "+ Add User(s)" + click_on "Add User(s)" fill_in_and_out "data-user-uid-to-add", with: ro_data_user.uid click_on "Save changes" click_on "Submit" @@ -182,7 +182,7 @@ it "allows a Data Manager to assign a Data User" do sign_in data_manager visit "/projects/#{project.id}/edit" - click_on "+ Add User(s)" + click_on "Add User(s)" fill_in_and_out "data-user-uid-to-add", with: ro_data_user.uid click_on "Save changes" click_on "Submit" diff --git a/spec/system/project_spec.rb b/spec/system/project_spec.rb index d40def68..a1170223 100644 --- a/spec/system/project_spec.rb +++ b/spec/system/project_spec.rb @@ -262,7 +262,7 @@ click_on "Create new project" expect(page.find("#non-editable-data-sponsor").text).to eq sponsor_user.uid fill_in_and_out "data_manager", with: data_manager.uid - click_on "+ Add User(s)" + click_on "Add User(s)" fill_in_and_out "data-user-uid-to-add", with: read_only.uid click_on "Save changes" select "Research Data and Scholarship Services", from: "departments" @@ -283,7 +283,7 @@ click_on "Create new project" expect(page.find("#non-editable-data-sponsor").text).to eq sponsor_user.uid fill_in_and_out "data_manager", with: data_manager.uid - click_on "+ Add User(s)" + click_on "Add User(s)" fill_in_and_out "data-user-uid-to-add", with: read_write.uid click_on "Save changes" find(:xpath, "//*[@id='data_user_1_rw']").click # make user read-write @@ -308,7 +308,7 @@ expect(page).to have_content "No Data User(s) added" # Launch the modal, trigger the validation, and then add a valid user - click_on "+ Add User(s)" + click_on "Add User(s)" fill_in_and_out "data-user-uid-to-add", with: "notuser" expect(page.find("#data-user-uid-to-add_error").text).to eq "Invalid value entered" fill_in_and_out "data-user-uid-to-add", with: read_only.uid @@ -317,7 +317,7 @@ # Launch the modal again and this time don't add any users # (but we already had added some so we don't expect the "no data users" message) - click_on "+ Add User(s)" + click_on "Add User(s)" click_on "Save changes" expect(page).not_to have_content "No Data User(s) added" end From aff6fa4bd2e013633a4f68cfac23553cede6ff3f Mon Sep 17 00:00:00 2001 From: Hector Correa Date: Fri, 20 Dec 2024 15:41:55 -0500 Subject: [PATCH 6/6] Renamed the classes to make more sense. Kept the reference to the original frame in Figma as a comment. --- app/assets/stylesheets/_project.scss | 10 +++++----- app/views/projects/_edit_form.html.erb | 11 ++++++----- 2 files changed, 11 insertions(+), 10 deletions(-) diff --git a/app/assets/stylesheets/_project.scss b/app/assets/stylesheets/_project.scss index fe69ae3b..32f6ba01 100644 --- a/app/assets/stylesheets/_project.scss +++ b/app/assets/stylesheets/_project.scss @@ -104,19 +104,19 @@ outline: none; } -.frame-218 { +.data-users-section { /* frame-218 in Figma */ display: inline-flex; align-items: flex-start; gap: 6.75rem; - .frame-187 { + .data-users-container { /* frame-187 in Figma */ display: flex; width: 55.9375rem; flex-direction: column; align-items: flex-start; gap: 0.5rem; - .table-5 { + .data-users-table { /* table-5 in Figma */ display: flex; flex-direction: column; align-items: flex-start; @@ -237,5 +237,5 @@ } } } - } -} + } /* data-users-container */ +} /* data-users-section */ diff --git a/app/views/projects/_edit_form.html.erb b/app/views/projects/_edit_form.html.erb index 9e514324..a25bbff1 100644 --- a/app/views/projects/_edit_form.html.erb +++ b/app/views/projects/_edit_form.html.erb @@ -43,9 +43,9 @@ Data Users
-
-
-
+
+
+
NetID
@@ -58,6 +58,7 @@ No Data User(s) added
+
@@ -68,8 +69,8 @@ Add User(s)
-
-
+
+