darkhelm/notifications-admin
1
0
Fork 0
mirror of https://github.com/GSA/notifications-admin.git synced 2026-09-05 09:08:25 -04:00
Code Issues Packages Projects Releases Wiki Activity
Files
295f301c19df42db59aff6c131f6bc4dc630c024
notifications-admin/app/assets/stylesheets/components/tick-cross.scss

47 lines
660 B
SCSS
Raw Normal View History

Tidy layout of team page The team page was a bit of a mess: - invited and active tables didn’t line up - lots of things were wrapping onto two lines - the empty fields for when a user didn’t have permissions looked broken This commit splits each row of the table (not actually a table any more) onto two lines. First line has the user’s info, second has their permissions and any associated actions.
2016-07-07 09:17:50 +01:00
%tick-cross {
Use 19px not 16px type in more places Making the navigation narrower means that we have more space on every page. So on pages where we had to use 16px type just to fit stuff on the page we can now bump the type size up to something less miserly. This is mainly the team and settings pages. We still need to use 16px on pages which list notifications or previews of spreadsheets, because we’re still trying to fit a lot of information onto these pages, so every little space-saving helps.
2017-03-15 12:50:45 +00:00
@include core-19;
Tidy layout of team page The team page was a bit of a mess: - invited and active tables didn’t line up - lots of things were wrapping onto two lines - the empty fields for when a user didn’t have permissions looked broken This commit splits each row of the table (not actually a table any more) onto two lines. First line has the user’s info, second has their permissions and any associated actions.
2016-07-07 09:17:50 +01:00
display: inline-block;
background-size: 19px 19px;
background-repeat: no-repeat;
Change manage team layout to fit extra option We’ve moved from three to four permissions. Four permissions don’t fit in the exiting horizontal layout. This commit makes the permissions stack vertically instead. This approach has some downsides: - makes the permissions less easy to scan vertically - makes them take up a lot more space (and at lives services, most of them have somewhere around 15 team members) But I think for now it’s better than any horizontal alternative that I tried.
2017-08-17 14:30:53 +01:00
background-position: 0 6px;
padding: 6px 0 5px 25px;
Tidy layout of team page The team page was a bit of a mess: - invited and active tables didn’t line up - lots of things were wrapping onto two lines - the empty fields for when a user didn’t have permissions looked broken This commit splits each row of the table (not actually a table any more) onto two lines. First line has the user’s info, second has their permissions and any associated actions.
2016-07-07 09:17:50 +01:00
}
.tick-cross {
&-tick {
@extend %tick-cross;
background-image: file-url('tick.png');
}
&-cross {
@extend %tick-cross;
color: $secondary-text-colour;
Change cross icon to one with better contrast Swaps out the old one (solid colour with lighter grey) for one with the same colour as the text, but no fill. Also swaps out for an SVG for better scaling.
2020-09-09 15:09:05 +01:00
background-image: file-url('cross-grey.svg');
Tidy layout of team page The team page was a bit of a mess: - invited and active tables didn’t line up - lots of things were wrapping onto two lines - the empty fields for when a user didn’t have permissions looked broken This commit splits each row of the table (not actually a table any more) onto two lines. First line has the user’s info, second has their permissions and any associated actions.
2016-07-07 09:17:50 +01:00
}
&-list {
Change manage team layout to fit extra option We’ve moved from three to four permissions. Four permissions don’t fit in the exiting horizontal layout. This commit makes the permissions stack vertically instead. This approach has some downsides: - makes the permissions less easy to scan vertically - makes them take up a lot more space (and at lives services, most of them have somewhere around 15 team members) But I think for now it’s better than any horizontal alternative that I tried.
2017-08-17 14:30:53 +01:00
position: relative;
Tidy layout of team page The team page was a bit of a mess: - invited and active tables didn’t line up - lots of things were wrapping onto two lines - the empty fields for when a user didn’t have permissions looked broken This commit splits each row of the table (not actually a table any more) onto two lines. First line has the user’s info, second has their permissions and any associated actions.
2016-07-07 09:17:50 +01:00
&-permissions {
Hide ID when only one reply to address is shown Most user will only have one reply to address. Which means they should never have to worry about IDs. And if you only have one then you never need its ID, because the last remaining address will always be the default. So IDs should only be shown when a service has created more than one reply to address. This required a bit of visual tweaking of the _user list_ pattern, because its spacing wasn’t defined in a way that worked when only the name of the thing, and not its details were shown on the page.
2017-09-28 11:35:52 +01:00
margin-top: 5px;
Tidy layout of team page The team page was a bit of a mess: - invited and active tables didn’t line up - lots of things were wrapping onto two lines - the empty fields for when a user didn’t have permissions looked broken This commit splits each row of the table (not actually a table any more) onto two lines. First line has the user’s info, second has their permissions and any associated actions.
2016-07-07 09:17:50 +01:00
li {
Change manage team layout to fit extra option We’ve moved from three to four permissions. Four permissions don’t fit in the exiting horizontal layout. This commit makes the permissions stack vertically instead. This approach has some downsides: - makes the permissions less easy to scan vertically - makes them take up a lot more space (and at lives services, most of them have somewhere around 15 team members) But I think for now it’s better than any horizontal alternative that I tried.
2017-08-17 14:30:53 +01:00
display: block;
Tidy layout of team page The team page was a bit of a mess: - invited and active tables didn’t line up - lots of things were wrapping onto two lines - the empty fields for when a user didn’t have permissions looked broken This commit splits each row of the table (not actually a table any more) onto two lines. First line has the user’s info, second has their permissions and any associated actions.
2016-07-07 09:17:50 +01:00
margin-right: 0.5em;
}
}
Email auth for inviting members and editing permissions
2017-11-01 15:36:27 +00:00
&-hint {
color: #6F777B;
padding-top: 5px;
Change list items on /users page Change the HTML & CSS for user-list-item's to support their content being split into 2 columns of a grid instead of the edit link being positioned absolutely. Also includes: 1. removes `<div>`s from `<ul>` (non-valid HTML) 2. split action link out from permissions list 3. split summary of folder permissions out from permissions list 4. introduces a class for blocks of text that appear when there are no items. 5. fixes tests broken by changes to HTML
2020-08-19 14:52:17 +01:00
margin: 0;
Email auth for inviting members and editing permissions
2017-11-01 15:36:27 +00:00
}
Tidy layout of team page The team page was a bit of a mess: - invited and active tables didn’t line up - lots of things were wrapping onto two lines - the empty fields for when a user didn’t have permissions looked broken This commit splits each row of the table (not actually a table any more) onto two lines. First line has the user’s info, second has their permissions and any associated actions.
2016-07-07 09:17:50 +01:00
}
}
Reference in New Issue Copy Permalink