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

Jump to bottom

Header buttons and icons alignments #1712

Merged
merged 7 commits into from
Nov 10, 2021
Merged

Header buttons and icons alignments #1712

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
56dbd23
word wraps added
tanmoyAtb Nov 6, 2021
ca0479c
Merge branch 'dev' into fix/new-folder-icon-1663
Tbaut Nov 8, 2021
eb85f85
lingui extract
actions-user Nov 8, 2021
60b46d8
shared folder button icon
tanmoyAtb Nov 8, 2021
c09e27d
Merge branch 'dev' into fix/new-folder-icon-1663
tanmoyAtb Nov 9, 2021
e159e91
new folder text
tanmoyAtb Nov 9, 2021
c72d598
lingui extract
actions-user Nov 9, 2021
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 packages/files-ui/src/Components/Elements/SharedUsers.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,11 +3,15 @@ import { makeStyles, createStyles, useThemeSwitcher } from "@chainsafe/common-th
import UserBubble from "./UserBubble"
import { BucketKeyPermission, RichUserInfo } from "../../Contexts/FilesContext"
import { getUserDisplayName } from "../../Utils/getUserDisplayName"
import { CSFTheme } from "../../Themes/types"

const useStyles = makeStyles(() => {
const useStyles = makeStyles(({ constants }: CSFTheme) => {
return createStyles({
root: {
display: "flex"
},
bubble: {
marginRight: constants.generalUnit
}
})
})
Expand Down Expand Up @@ -55,6 +59,7 @@ const SharedUsers = ({ bucket }: Props) => {
<div className={classes.root}>
<UserBubble
tooltip={userLabels[0]}
className={userLabels.length > 1 ? classes.bubble : undefined}
/>
{userLabels.length > 2 && (
<UserBubble
Expand Down
8 changes: 3 additions & 5 deletions packages/files-ui/src/Components/Elements/UserBubble.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,9 +19,6 @@ const useStyles = makeStyles(({ zIndex, animation, constants, palette }: CSFThem
justifyContent: "center",
"& svg": {
fill: palette.common.white.main
},
"&:first-child": {
marginRight: constants.generalUnit
}
},
text : {
Expand Down Expand Up @@ -66,9 +63,10 @@ const useStyles = makeStyles(({ zIndex, animation, constants, palette }: CSFThem
interface Props {
text?: string
tooltip: string | string[]
className?: string
}

const UserBubble = ({ text, tooltip }: Props) => {
const UserBubble = ({ text, tooltip, className }: Props) => {
const classes = useStyles()
const [showTooltip, setShowTooltip] = useState(false)

Expand All @@ -80,7 +78,7 @@ const UserBubble = ({ text, tooltip }: Props) => {
<div
onMouseEnter={() => setShowTooltip(true)}
onMouseLeave={() => setShowTooltip(false)}
className={classes.bubble}
className={clsx(classes.bubble, className)}
onClick={toggleTooltip}
>
<div className={clsx(classes.tooltip, { "active": showTooltip })}>
Expand Down
2 changes: 1 addition & 1 deletion packages/files-ui/src/Components/Modules/FileBrowsers/CreateFolderModal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -144,7 +144,7 @@ const CreateFolderModal = ({ modalOpen, close }: ICreateFolderModalProps) => {
variant="h5"
component="h5"
>
<Trans>Create Folder</Trans>
<Trans>New folder</Trans>
</Typography>
</Grid>
)}
Expand Down
10 changes: 7 additions & 3 deletions packages/files-ui/src/Components/Modules/FileBrowsers/SharedFoldersOverview.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,12 +27,11 @@ import SharingExplainerModal from "../../SharingExplainerModal"
import { useSharingExplainerModalFlag } from "./hooks/useSharingExplainerModalFlag"
import { usePageTrack } from "../../../Contexts/PosthogContext"

export const desktopSharedGridSettings = "69px 3fr 120px 190px 150px 45px !important"
export const desktopSharedGridSettings = "50px 3fr 90px 140px 140px 45px !important"
export const mobileSharedGridSettings = "3fr 80px 45px !important"

const useStyles = makeStyles(
({ animation, breakpoints, constants, palette }: CSFTheme) => {

return createStyles({
root: {
position: "relative",
Expand Down Expand Up @@ -99,6 +98,9 @@ const useStyles = makeStyles(
},
confirmDeletionDialog: {
top: "50%"
},
buttonWrap: {
whiteSpace: "nowrap"
}
})
}
Expand Down Expand Up @@ -188,7 +190,9 @@ const SharedFolderOverview = () => {
data-cy="button-create-a-shared-folder"
>
<PlusIcon />
<Trans>Create a Shared Folder</Trans>
<span className={classes.buttonWrap}>
<Trans>Create a Shared Folder</Trans>
</span>
</Button>
</div>
</header>
Expand Down
16 changes: 13 additions & 3 deletions packages/files-ui/src/Components/Modules/FileBrowsers/views/FilesList.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -293,6 +293,15 @@ const useStyles = makeStyles(
width: 20,
marginRight: constants.generalUnit * 1.5,
fill: constants.previewModal.menuItemIconColor
},
fileNameHeader: {
whiteSpace: "nowrap",
overflow: "hidden",
textOverflow: "ellipsis",
marginRight: constants.generalUnit * 2
},
buttonWrap: {
whiteSpace: "nowrap"
}
})
}
Expand Down Expand Up @@ -628,7 +637,7 @@ const FilesList = ({ isShared = false }: Props) => {
<>
<PlusCircleSvg className={classes.menuIcon} />
<span>
<Trans>Create folder</Trans>
<Trans>New folder</Trans>
</span>
</>
),
Expand Down Expand Up @@ -691,6 +700,7 @@ const FilesList = ({ isShared = false }: Props) => {
variant="h1"
component="h1"
data-cy="files-app-header"
className={classes.fileNameHeader}
>
{heading}
</Typography>
Expand Down Expand Up @@ -722,7 +732,7 @@ const FilesList = ({ isShared = false }: Props) => {
size="large"
>
<PlusCircleIcon />
<span>
<span className={classes.buttonWrap}>
<Trans>New folder</Trans>
</span>
</Button>
Expand All @@ -733,7 +743,7 @@ const FilesList = ({ isShared = false }: Props) => {
size="large"
>
<UploadIcon />
<span>
<span className={classes.buttonWrap}>
<Trans>Upload</Trans>
</span>
</Button>
Expand Down
6 changes: 0 additions & 6 deletions packages/files-ui/src/locales/de/messages.po
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -154,9 +154,6 @@ msgstr ""
msgid "Create"
msgstr "Erstellen"

msgid "Create Folder"
msgstr ""

msgid "Create Shared Folder"
msgstr ""

Expand All @@ -166,9 +163,6 @@ msgstr ""
msgid "Create a new shared folder"
msgstr ""

msgid "Create folder"
msgstr "Ordner erstellen"

msgid "Create new link"
msgstr ""

Expand Down
6 changes: 0 additions & 6 deletions packages/files-ui/src/locales/en/messages.po
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -154,9 +154,6 @@ msgstr "Copying files"
msgid "Create"
msgstr "Create"

msgid "Create Folder"
msgstr "Create Folder"

msgid "Create Shared Folder"
msgstr "Create Shared Folder"

Expand All @@ -166,9 +163,6 @@ msgstr "Create a Shared Folder"
msgid "Create a new shared folder"
msgstr "Create a new shared folder"

msgid "Create folder"
msgstr "Create folder"

msgid "Create new link"
msgstr "Create new link"

Expand Down
6 changes: 0 additions & 6 deletions packages/files-ui/src/locales/es/messages.po
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -155,9 +155,6 @@ msgstr ""
msgid "Create"
msgstr "Crear"

msgid "Create Folder"
msgstr ""

msgid "Create Shared Folder"
msgstr ""

Expand All @@ -167,9 +164,6 @@ msgstr ""
msgid "Create a new shared folder"
msgstr ""

msgid "Create folder"
msgstr "Crear Carpeta"

msgid "Create new link"
msgstr ""

Expand Down
6 changes: 0 additions & 6 deletions packages/files-ui/src/locales/fr/messages.po
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -155,9 +155,6 @@ msgstr "Copie de fichiers"
msgid "Create"
msgstr "Créer"

msgid "Create Folder"
msgstr "Créer un dossier"

msgid "Create Shared Folder"
msgstr "Créer un dossier partagé"

Expand All @@ -167,9 +164,6 @@ msgstr "Créer un dossier partagé"
msgid "Create a new shared folder"
msgstr "Créer un nouveau dossier partagé"

msgid "Create folder"
msgstr "Créer un dossier"

msgid "Create new link"
msgstr "Créer un nouveau lien"

Expand Down
6 changes: 0 additions & 6 deletions packages/files-ui/src/locales/no/messages.po
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -154,9 +154,6 @@ msgstr ""
msgid "Create"
msgstr "Opprett"

msgid "Create Folder"
msgstr ""

msgid "Create Shared Folder"
msgstr ""

Expand All @@ -166,9 +163,6 @@ msgstr ""
msgid "Create a new shared folder"
msgstr ""

msgid "Create folder"
msgstr "Opprett mappe"

msgid "Create new link"
msgstr ""

Expand Down