Skip to content

Commit

Permalink
playground fix
Browse files Browse the repository at this point in the history
  • Loading branch information
@avi278
avi278 committed May 1, 2024
1 parent 9c20df0 commit c8ab7b4
Show file tree
Hide file tree
Showing 5 changed files with 57 additions and 57 deletions.
26 changes: 10 additions & 16 deletions src/geovisto_demos/components/PlaygroundBarConfig.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,8 +1,6 @@
import React, {useState, useEffect} from "react";
import {files, file} from "../api";
import Select from "react-select";
import Dropdown from 'react-dropdown';
import FontAwesomeIcon from '@fortawesome/react-fontawesome'

/* example of screen component with grid layout and card wrapper usage */

Expand Down Expand Up @@ -82,21 +80,17 @@ const PlaygroundBarConfig = (props) => {
onChange={handleChange}
className="select"
/>
<div className="plagroundbar__buttons">
<div className="choose-file">
<label title="Import your config" className="custom-file-upload btn btn-default">
<input type="file"
id={C_ID_input_config}
accept=".json"
size={3}
className="btn btn-default"
/>
Import
</label>
</div>

<input id={C_ID_input_config_export} title="Export current config" type="submit" value="Export" className="btn btn-default btn-export"/>
<div className="choose-file">
<label title="Import your config" className="custom-file-upload btn btn-default">
<input type="file"
id={C_ID_input_config}
accept=".json"
size={3}
/>
Import
</label>
</div>
<input id={C_ID_input_config_export} title="Export current config" type="submit" value="Export" className="btn btn-default btn-export"/>
</div>
</div>
);
Expand Down
26 changes: 12 additions & 14 deletions src/geovisto_demos/components/PlaygroundBarData.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -81,21 +81,19 @@ const PlaygroundBarData = (props) => {
className="select"
/>

<div className="plagroundbar__buttons">
<div className="choose-file">
<label title="Import your data" className="custom-file-upload btn btn-default">
<input type="file"
id={C_ID_input_data}
accept=".json"
size={3}
className="btn btn-default"
/>
Import
</label>
</div>

<input id={C_ID_input_data_export} title="Export current data" type="submit" value="Export" className="btn btn-default btn-export"/>
<div className="choose-file">
<label title="Import your data" className="custom-file-upload btn btn-default">
<input type="file"
id={C_ID_input_data}
accept=".json"
size={3}
className="btn btn-default"
/>
Import
</label>
</div>

<input id={C_ID_input_data_export} title="Export current data" type="submit" value="Export" className="btn btn-default btn-export"/>
</div>
</div>
);
Expand Down
26 changes: 12 additions & 14 deletions src/geovisto_demos/components/PlaygroundBarGeojson.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -82,21 +82,19 @@ const PlaygroundBarGeojson = (props) => {
onChange={handleChange}
className="select"
/>
<div className="plagroundbar__buttons">
<div className="choose-file">
<label title="Import your geojson" className="custom-file-upload btn btn-default">
<input type="file"
id={C_ID_input_geojson}
accept=".json"
size={3}
className="btn btn-default"
/>
Import
</label>
</div>

<input id={C_ID_input_geojson_export} title="Export current geojson" type="submit" value="Export" className="btn btn-default btn-export"/>
<div className="choose-file">
<label title="Import your geojson" className="custom-file-upload btn btn-default">
<input type="file"
id={C_ID_input_geojson}
accept=".json"
size={3}
className="btn btn-default"
/>
Import
</label>
</div>

<input id={C_ID_input_geojson_export} title="Export current geojson" type="submit" value="Export" className="btn btn-default btn-export"/>
</div>
</div>
);
Expand Down
3 changes: 1 addition & 2 deletions src/geovisto_demos/components/PlaygroundBarSearchDatasets.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -65,15 +65,14 @@ const PlaygroundBarSearchDatasets = (props) => {
return (
<div className="demo-toolbar">
<div className="data-container">
<span>Search dataset: </span>
<form onSubmit={handleSearchSubmit} className="search-form" title="Download dataset from ArcGIS HUB">
<Select
id={"C_ID_select_geojson"}
value={choosen}
isLoading={isLoading}
options={search.options}
onInputChange={handleInputChange}
placeholder="Search..."
placeholder="Search and download dataset on ArcGIS HUB..."
onChange={handleChoose}
isClearable={true}
noOptionsMessage={() => 'No Datasets Found'}
Expand Down
33 changes: 22 additions & 11 deletions src/geovisto_demos/playground.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,8 +15,8 @@
.demo-toolbar {
width: 100%;
font-size: 1rem;
padding-left: 0.5rem;
padding-right: 0.5rem;
padding-left: 3px;
padding-right: 3px;
background-color: var(--ifm-color-primary-lightest);
color: var(--text-color);
}
Expand All @@ -28,16 +28,30 @@
.data-container {
text-align: left;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
flex-direction: row;
gap: 10px;
transition: all .5s ease;
height: min-content;

}

.data-container.hidden {
display: none;
}


.data-container .btn-export {
padding: 8px !important;
height: max-content;
}

.data-container .custom-file-upload {
padding: 8px !important;
}


.leaflet-tooltip-pane {
z-index: 500;
}
Expand All @@ -51,9 +65,7 @@
padding-top: 10px;
}

.editors label {
font-size: 20px;
}


.editor {
display: flex;
Expand All @@ -69,11 +81,6 @@
margin-top: 2px;
}

.choose-file {
display: flex;
flex-direction: row;
flex-wrap: wrap;
}

.file{
flex-shrink: 2;
Expand All @@ -97,6 +104,7 @@ select {
input[type="file"] {
display: none;
}

.custom-file-upload {
cursor: pointer;
}
Expand All @@ -111,6 +119,9 @@ input[type="file"] {

.select {
color: black;
flex-grow: 2;
height: max-content;

}


Expand Down

0 comments on commit c8ab7b4

Please sign in to comment.