mirror of
https://github.com/PeWu/topola-viewer.git
synced 2026-02-19 08:16:34 +00:00
Collapsed menu options under an "Open" dropdown.
The dropdown is only shown when a chart is displayed.
This commit is contained in:
@@ -37,7 +37,7 @@ export function Intro() {
|
||||
<FormattedMessage
|
||||
id="intro.instructions"
|
||||
defaultMessage={
|
||||
'Use the LOAD FROM URL or LOAD FROM FILE buttons above to load' +
|
||||
'Use the OPEN FILE or LOAD FROM URL buttons above to load' +
|
||||
' a GEDCOM file. You can export a GEDCOM file from most of the' +
|
||||
' existing genealogy programs and web sites.'
|
||||
}
|
||||
|
||||
@@ -506,6 +506,12 @@ export class TopBar extends React.Component<
|
||||
if (!this.props.standalone) {
|
||||
return null;
|
||||
}
|
||||
const openFileItem = (
|
||||
<>
|
||||
<Icon name="folder open" />
|
||||
<FormattedMessage id="menu.open_file" defaultMessage="Open file" />
|
||||
</>
|
||||
);
|
||||
const loadUrlItem = (
|
||||
<>
|
||||
<Icon name="cloud download" />
|
||||
@@ -515,15 +521,6 @@ export class TopBar extends React.Component<
|
||||
/>
|
||||
</>
|
||||
);
|
||||
const loadFileItem = (
|
||||
<>
|
||||
<Icon name="folder open" />
|
||||
<FormattedMessage
|
||||
id="menu.load_from_file"
|
||||
defaultMessage="Load from file"
|
||||
/>
|
||||
</>
|
||||
);
|
||||
const commonElements = (
|
||||
<>
|
||||
{this.loadFromUrlModal()}
|
||||
@@ -539,14 +536,40 @@ export class TopBar extends React.Component<
|
||||
);
|
||||
switch (screenSize) {
|
||||
case ScreenSize.LARGE:
|
||||
return (
|
||||
// Show dropdown if chart is shown, otherwise show individual menu
|
||||
// items.
|
||||
const menus = this.props.showingChart ? (
|
||||
<Dropdown
|
||||
trigger={
|
||||
<div>
|
||||
<Icon name="folder open" />
|
||||
<FormattedMessage id="menu.open" defaultMessage="Open" />
|
||||
</div>
|
||||
}
|
||||
className="item"
|
||||
>
|
||||
<Dropdown.Menu>
|
||||
<Dropdown.Item as="label" htmlFor="fileInput">
|
||||
{openFileItem}
|
||||
</Dropdown.Item>
|
||||
<Dropdown.Item onClick={() => this.openLoadUrlDialog()}>
|
||||
{loadUrlItem}
|
||||
</Dropdown.Item>
|
||||
</Dropdown.Menu>
|
||||
</Dropdown>
|
||||
) : (
|
||||
<>
|
||||
<label htmlFor="fileInput">
|
||||
<Menu.Item as="a">{openFileItem}</Menu.Item>
|
||||
</label>
|
||||
<Menu.Item onClick={() => this.openLoadUrlDialog()}>
|
||||
{loadUrlItem}
|
||||
</Menu.Item>
|
||||
<label htmlFor="fileInput">
|
||||
<Menu.Item as="a">{loadFileItem}</Menu.Item>
|
||||
</label>
|
||||
</>
|
||||
);
|
||||
return (
|
||||
<>
|
||||
{menus}
|
||||
{commonElements}
|
||||
</>
|
||||
);
|
||||
@@ -554,12 +577,12 @@ export class TopBar extends React.Component<
|
||||
case ScreenSize.SMALL:
|
||||
return (
|
||||
<>
|
||||
<Dropdown.Item as="label" htmlFor="fileInput">
|
||||
{openFileItem}
|
||||
</Dropdown.Item>
|
||||
<Dropdown.Item onClick={() => this.openLoadUrlDialog()}>
|
||||
{loadUrlItem}
|
||||
</Dropdown.Item>
|
||||
<Dropdown.Item as="label" htmlFor="fileInput">
|
||||
{loadFileItem}
|
||||
</Dropdown.Item>
|
||||
<Dropdown.Divider />
|
||||
{commonElements}
|
||||
</>
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
{
|
||||
"menu.open": "Otwórz",
|
||||
"menu.open_file": "Otwórz plik",
|
||||
"menu.load_from_url": "Otwórz URL",
|
||||
"menu.load_from_file": "Otwórz plik",
|
||||
"menu.print": "Drukuj",
|
||||
"menu.download": "Pobierz",
|
||||
"menu.pdf_file": "Plik PDF",
|
||||
@@ -22,7 +23,7 @@
|
||||
"menu.search.no_results": "Brak wyników",
|
||||
"intro.title": "Topola Genealogy",
|
||||
"intro.description": "Topola Genealogy pozwala przeglądać drzewo genealogiczne w interaktywny sposób.",
|
||||
"intro.instructions": "Kliknij OTWÓRZ URL lub OTWÓRZ PLIK, aby załadować plik GEDCOM. Większość programów genealogicznych posiada funkcję eksportu do pliku GEDCOM.",
|
||||
"intro.instructions": "Kliknij OTWÓRZ PLIK lub OTWÓRZ URL, aby załadować plik GEDCOM. Większość programów genealogicznych posiada funkcję eksportu do pliku GEDCOM.",
|
||||
"intro.examples": "Poniżej jest kilka przykładów znalezionych w Internecie:",
|
||||
"intro.from": "źródło:",
|
||||
"intro.privacy": "Prywatność",
|
||||
|
||||
Reference in New Issue
Block a user