scratchfoundation/scratch-www
1
0
Fork 0
mirror of https://github.com/scratchfoundation/scratch-www.git synced 2024-11-27 17:45:52 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

Empty state styling

Browse source
This commit is contained in:
Eric Rosenbaum 2021-06-10 10:52:23 -04:00
parent b6a91adf78
commit c7ba97d291
2 changed files with 18 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
src/views/studio/modals/user-projects-modal.jsx
View file

@ -106,11 +106,11 @@ const UserProjectsModal = ({
}
</React.Fragment>
) :
<div>
<div className="studio-projects-empty">
<img
src="/svgs/studio/add-to-studio-empty.svg"
/>
<div>
<div className="studio-projects-empty-text">
{filter === Filters.SHARED &&
<FormattedMessage id="studio.addProjects.noSharedYet" />}
{filter === Filters.FAVORITED &&

19
src/views/studio/modals/user-projects-modal.scss
View file

@ -22,12 +22,10 @@
.user-projects-modal-content {
padding: 0 30px 30px;
background: #E9F1FC;
min-height: 300px;
max-height: calc(100vh - 270px);
min-height: 300px;
overflow-y: auto;
overscroll-behavior: contain;
border-bottom-left-radius: 12px;
border-bottom-right-radius: 12px;
@media #{$intermediate-and-smaller} {
& { max-height: calc(100vh - 175px); }
}
@ -42,6 +40,21 @@
justify-content: flex-end;
padding: 6px 12px;
}
.studio-projects-empty {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
margin: 4rem;
}
.studio-projects-empty-text {
color: hsla(215, 100, 65, .75);
width: 325px;
text-align: center;
margin-top: 1rem;
}
}
.studio-tile-added {