a_adli/colouring-montreal
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

More UI Tweaks

Browse Source 
Mainly to improve consistency and readability across all categories/pages
Discussed in meeting with Polly 16/05
This commit is contained in:
Mike Simpson 2023-05-16 17:08:21 +01:00
parent f43e5f60fe
commit d14dea3d1a
17 changed files with 788 additions and 585 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
app/src/frontend/building/data-components/data-entry-group.css
View File

@ -3,6 +3,8 @@
position: relative;
font-size: 1.1rem;
font-weight: 410;
padding-top: 3px;
padding-bottom: 3px;
}
.data-entry-group-header .data-entry-group-title {
padding-left: 0.6rem;

2
app/src/frontend/building/data-container.css
View File

@ -1,7 +1,7 @@
.edit-bar {
position: sticky;
top: 53px; /* match section-header height */
padding: 12px 0; /* match info-container-inner margin-top*/
padding: 3px 0 0 0; /* match info-container-inner margin-top*/
width: 100%;
background-color: white;
z-index: 1000;

2
app/src/frontend/building/data-container.tsx
View File

@ -413,7 +413,9 @@ const withCopyEdit: (wc: React.ComponentType<CategoryViewProps>) => DataContaine
</button> :
null
}
<hr/>
</div>
}
</div>
: null

10
app/src/frontend/building/data-containers/age.tsx
View File

@ -47,7 +47,7 @@ const AgeView: React.FunctionComponent<CategoryViewProps> = (props) => {
){
return (
<Fragment>
<DataEntryGroup name="Building Age" collapsed={false} >
<DataEntryGroup name="Building Age">
<YearDataEntry
year={props.building.date_year}
upper={props.building.date_upper}
@ -140,7 +140,7 @@ const AgeView: React.FunctionComponent<CategoryViewProps> = (props) => {
<button className={`map-switcher-inline ${historicData}-state btn btn-outline btn-outline-dark ${darkLightTheme}`} onClick={historicDataSwitchOnClick}>
{(historicData === 'enabled')?'Click here to hide historical maps':'Click here to show historical maps'}
</button>
<DataEntryGroup collapsed={false} name="Constructions and demolitions on this site" showCount={false}>
<DataEntryGroup name="Constructions and demolitions on this site" showCount={false}>
<DynamicsBuildingPane>
<label>Current building (age data <Link to={ageLinkUrl}>editable here</Link>)</label>
<FieldRow>
@ -261,7 +261,7 @@ const AgeView: React.FunctionComponent<CategoryViewProps> = (props) => {
};
return (
<Fragment>
<DataEntryGroup name="Building Age" collapsed={true} >
<DataEntryGroup name="Building Age">
<YearDataEntry
year={props.building.date_year}
upper={props.building.date_upper}
@ -411,11 +411,11 @@ const AgeView: React.FunctionComponent<CategoryViewProps> = (props) => {
mode='view'
/>
</DataEntryGroup>
<DataEntryGroup name="Lifespan and Site History" collapsed={true} >
<DataEntryGroup name="Lifespan and Site History">
<button className={`map-switcher-inline ${historicData} btn btn-outline btn-outline-dark ${darkLightTheme}`} onClick={historicDataSwitchOnClick}>
{(historicData === 'enabled')?'Click here to hide historical maps':'Click here to show historical maps'}
</button>
<DataEntryGroup collapsed={false} name="Constructions and demolitions on this site" showCount={false}>
<DataEntryGroup name="Constructions and demolitions on this site" showCount={false}>
<DynamicsBuildingPane>
<label>Current building (age data <Link to={ageLinkUrl}>editable here</Link>)</label>
<FieldRow>

4
app/src/frontend/building/data-containers/community.tsx
View File

@ -40,7 +40,7 @@ const CommunityView: React.FunctionComponent<CategoryViewProps> = (props) => {
const { darkLightTheme } = useDisplayPreferences();
const worthKeepingReasonsNonEmpty = Object.values(props.building.community_type_worth_keeping_reasons ?? {}).some(x => x);
return <>
<DataEntryGroup name="Community views on building types" collapsed={false} >
<DataEntryGroup name="Community views on building types">
<InfoBox>
Note: We are not currently collecting data on domestic/privately owned properties, only on public buildings.
</InfoBox>
@ -151,7 +151,7 @@ const CommunityView: React.FunctionComponent<CategoryViewProps> = (props) => {
</div>
</DataEntryGroup>
<DataEntryGroup name="Building use for community activities" collapsed={false} >
<DataEntryGroup name="Building use for community activities">
<InfoBox>
Here we are collecting information on the location of buildings used for community activities so we can track loss of/additions to community space over time
</InfoBox>

4
app/src/frontend/building/data-containers/construction.tsx
View File

@ -38,7 +38,7 @@ const RoofCoveringOptions = [
const ConstructionView: React.FunctionComponent<CategoryViewProps> = (props) => {
return (
<Fragment>
<DataEntryGroup name="Materials" collapsed={false}>
<DataEntryGroup name="Materials">
<SelectDataEntry
title={dataFields.construction_core_material.title}
slug="construction_core_material"
@ -87,7 +87,7 @@ const ConstructionView: React.FunctionComponent<CategoryViewProps> = (props) =>
verified_count={props.building.verified.construction_roof_covering}
/>
</DataEntryGroup>
<DataEntryGroup name="Construction Sectors" collapsed={false}>
<DataEntryGroup name="Construction Sectors">
<DataEntry
title="Construction system type"
slug=""

22
app/src/frontend/building/data-containers/location.tsx
View File

@ -16,6 +16,8 @@ const locationNumberPattern = "[1-9]\\d*[a-z]?(-([1-9]\\d*))?"; ///[1-9]\d*[a-z]
const LocationView: React.FunctionComponent<CategoryViewProps> = (props) => (
<Fragment>
<DataEntryGroup name="Address Data">
<DataEntry
title={dataFields.location_name.title}
slug="location_name"
@ -40,9 +42,24 @@ const LocationView: React.FunctionComponent<CategoryViewProps> = (props) => (
slug=""
value=""
mode='view'
tooltip="Not yet activated.<br><br>For security reasons, we do not allow the use of free text boxes and are currently looking into alternative ways to collect this data."
/>
<Verification
slug="location_name"
allow_verify={props.user !== undefined && props.building.location_name !== null && !props.edited}
onVerify={props.onVerify}
user_verified={props.user_verified.hasOwnProperty("location_name")}
user_verified_as={props.user_verified.location_name}
verified_count={props.building.verified.location_name}
/>
<DataEntry
title="Building Name Source"
slug=""
value=""
mode='view'
tooltip="Coming Soon"
/>
<DataEntryGroup name="Address" collapsed={false}>
<hr/>
<PatternDataEntry
title={dataFields.location_number.title}
slug="location_number"
@ -138,7 +155,7 @@ const LocationView: React.FunctionComponent<CategoryViewProps> = (props) => (
tooltip="Coming Soon"
/>
</DataEntryGroup>
<DataEntryGroup name="Other Location Data" collapsed={false}>
<DataEntryGroup name="Property/Footprint IDs and Coordinate Data">
<DataEntry
title={dataFields.ref_toid.title}
slug="ref_toid"
@ -147,6 +164,7 @@ const LocationView: React.FunctionComponent<CategoryViewProps> = (props) => (
copy={props.copy}
tooltip={dataFields.ref_toid.tooltip}
onChange={props.onChange}
disabled={true}
/>
<UPRNsDataEntry
title={dataFields.uprns.title}

2
app/src/frontend/building/data-containers/planning.tsx
View File

@ -66,7 +66,7 @@ const PlanningView: React.FunctionComponent<CategoryViewProps> = (props) => {
return (
<Fragment>
<DataEntryGroup name="Planning application information" collapsed={true} >
<DataEntryGroup name="Current/active applications (official data)" collapsed={false} >
<DataEntryGroup name="Current/active applications (official data)">
<InfoBox>
This section provides data on active applications. We define these as applications with any activity in the last year.
<br />

190
app/src/frontend/building/data-containers/size.tsx
View File

@ -16,35 +16,7 @@ import InfoBox from '../../components/info-box';
*/
const SizeView: React.FunctionComponent<CategoryViewProps> = (props) => (
<Fragment>
<DataEntryGroup name="Plot Size">
<NumericDataEntry
title={dataFields.size_plot_area_total.title}
slug="size_plot_area_total"
mode='view'
step={0.1}
min={0}
/>
<NumericDataEntry
title={dataFields.size_far_ratio.title}
slug="size_far_ratio"
mode='view'
step={0.1}
min={0}
/>
<DataEntry
title="Plot dimensions"
slug=""
value=""
mode='view'
/>
<DataEntry
title="Plot geometry link"
slug=""
value=""
mode='view'
/>
</DataEntryGroup>
<DataEntryGroup name="Floors">
<DataEntryGroup name="Number of floors/storeys">
<NumericDataEntry
title={dataFields.size_storeys_core.title}
slug="size_storeys_core"
@ -64,7 +36,6 @@ const SizeView: React.FunctionComponent<CategoryViewProps> = (props) => (
user_verified_as={props.user_verified.size_storeys_core}
verified_count={props.building.verified.size_storeys_core}
/>
<NumericDataEntry
title={dataFields.size_storeys_attic.title}
slug="size_storeys_attic"
@ -84,7 +55,6 @@ const SizeView: React.FunctionComponent<CategoryViewProps> = (props) => (
user_verified_as={props.user_verified.size_storeys_attic}
verified_count={props.building.verified.size_storeys_attic}
/>
<NumericDataEntry
title={dataFields.size_storeys_basement.title}
slug="size_storeys_basement"
@ -104,9 +74,22 @@ const SizeView: React.FunctionComponent<CategoryViewProps> = (props) => (
user_verified_as={props.user_verified.size_storeys_basement}
verified_count={props.building.verified.size_storeys_basement}
/>
<DataEntry
title="Source type"
slug=""
value=""
mode='view'
tooltip="Coming Soon"
/>
<DataEntry
title="Source link"
slug=""
value=""
mode='view'
tooltip="Coming Soon"
/>
</DataEntryGroup>
<DataEntryGroup name="Height" collapsed={false}>
<DataEntryGroup name="Building height data">
<NumericDataEntry
title={dataFields.size_height_apex.title}
slug="size_height_apex"
@ -125,7 +108,21 @@ const SizeView: React.FunctionComponent<CategoryViewProps> = (props) => (
user_verified_as={props.user_verified.size_height_apex}
verified_count={props.building.verified.size_height_apex}
/>
<DataEntry
title="Source type"
slug=""
value=""
mode='view'
tooltip="Coming Soon"
/>
<DataEntry
title="Source link"
slug=""
value=""
mode='view'
tooltip="Coming Soon"
/>
<hr/>
<NumericDataEntry
title={dataFields.size_height_eaves.title}
slug="size_height_eaves"
@ -137,8 +134,22 @@ const SizeView: React.FunctionComponent<CategoryViewProps> = (props) => (
step={0.1}
min={0}
/>
<DataEntry
title="Source type"
slug=""
value=""
mode='view'
tooltip="Coming Soon"
/>
<DataEntry
title="Source link"
slug=""
value=""
mode='view'
tooltip="Coming Soon"
/>
</DataEntryGroup>
<DataEntryGroup name="Floor area">
<DataEntryGroup name="Floor area data">
<NumericDataEntry
title={dataFields.size_floor_area_ground.title}
slug="size_floor_area_ground"
@ -157,7 +168,6 @@ const SizeView: React.FunctionComponent<CategoryViewProps> = (props) => (
user_verified_as={props.user_verified.size_floor_area_ground}
verified_count={props.building.verified.size_floor_area_ground}
/>
<NumericDataEntry
title={dataFields.size_floor_area_total.title}
slug="size_floor_area_total"
@ -176,8 +186,102 @@ const SizeView: React.FunctionComponent<CategoryViewProps> = (props) => (
user_verified_as={props.user_verified.size_floor_area_total}
verified_count={props.building.verified.size_floor_area_total}
/>
<DataEntry
title="Source link"
slug=""
value=""
mode='view'
tooltip="Coming Soon"
/>
</DataEntryGroup>
<DataEntryGroup name="Plot size data">
<NumericDataEntry
title={dataFields.size_plot_area_total.title}
slug="size_plot_area_total"
mode='view'
step={0.1}
min={0}
/>
<DataEntry
title="Source type"
slug=""
value=""
mode='view'
tooltip="Coming Soon"
/>
<DataEntry
title="Source link"
slug=""
value=""
mode='view'
tooltip="Coming Soon"
/>
<hr/>
<NumericDataEntry
title={dataFields.size_far_ratio.title}
slug="size_far_ratio"
mode='view'
step={0.1}
min={0}
/>
<DataEntry
title="Source type"
slug=""
value=""
mode='view'
tooltip="Coming Soon"
/>
<DataEntry
title="Source link"
slug=""
value=""
mode='view'
tooltip="Coming Soon"
/>
<hr/>
<DataEntry
title="Plot dimensions"
slug=""
value=""
mode='view'
/>
<DataEntry
title="Source type"
slug=""
value=""
mode='view'
tooltip="Coming Soon"
/>
<DataEntry
title="Source link"
slug=""
value=""
mode='view'
tooltip="Coming Soon"
/>
<hr/>
<DataEntry
title="Land parcel geometry link"
slug=""
value=""
mode='view'
tooltip='INSPIRE Polygons'
/>
<DataEntry
title="Source type"
slug=""
value=""
mode='view'
tooltip="Coming Soon"
/>
<DataEntry
title="Source link"
slug=""
value=""
mode='view'
tooltip="Coming Soon"
/>
<hr/>
<NumericDataEntry
title={dataFields.size_width_frontage.title}
slug="size_width_frontage"
@ -196,13 +300,21 @@ const SizeView: React.FunctionComponent<CategoryViewProps> = (props) => (
user_verified_as={props.user_verified.size_width_frontage}
verified_count={props.building.verified.size_width_frontage}
/>
<DataEntry
title="Total opening area"
title="Source type"
slug=""
value=""
mode='view'
tooltip="Coming Soon"
/>
<DataEntry
title="Source link"
slug=""
value=""
mode='view'
tooltip="Coming Soon"
/>
</DataEntryGroup>
</Fragment>
);
const SizeContainer = withCopyEdit(SizeView);

9
app/src/frontend/building/data-containers/streetscape.tsx
View File

@ -7,12 +7,14 @@ import NumericDataEntry from '../data-components/numeric-data-entry';
import withCopyEdit from '../data-container';
import { CategoryViewProps } from './category-view-props';
import { DataEntryGroup } from '../data-components/data-entry-group';
/**
* Streetscape view/edit section
*/
const StreetscapeView: React.FunctionComponent<CategoryViewProps> = (props) => (
<Fragment>
<DataEntryGroup name="Does the building have a garden(s)?">
<DataEntry
title="Does the building have a front garden?"
slug=""
@ -25,6 +27,8 @@ const StreetscapeView: React.FunctionComponent<CategoryViewProps> = (props) => (
value=""
mode='view'
/>
</DataEntryGroup>
<DataEntryGroup name="Street/pavement properties">
<DataEntry
title="Street width"
slug=""
@ -43,8 +47,10 @@ const StreetscapeView: React.FunctionComponent<CategoryViewProps> = (props) => (
value=""
mode='view'
/>
</DataEntryGroup>
<DataEntryGroup name="Access to green space">
<DataEntry
title="Distance from Public Green Space"
title="Distance from public green space"
slug=""
value=""
mode='view'
@ -55,6 +61,7 @@ const StreetscapeView: React.FunctionComponent<CategoryViewProps> = (props) => (
value=""
mode='view'
/>
</DataEntryGroup>
</Fragment>
);
const StreetscapeContainer = withCopyEdit(StreetscapeView);

8
app/src/frontend/building/data-containers/sustainability.tsx
View File

@ -9,6 +9,7 @@ import withCopyEdit from '../data-container';
import InfoBox from '../../components/info-box';
import { CategoryViewProps } from './category-view-props';
import { DataEntryGroup } from '../data-components/data-entry-group';
const EnergyCategoryOptions = ["A", "B", "C", "D", "E", "F", "G"];
const BreeamRatingOptions = [
@ -25,6 +26,7 @@ const BreeamRatingOptions = [
const SustainabilityView: React.FunctionComponent<CategoryViewProps> = (props) => {
return (
<Fragment>
<DataEntryGroup name="Energy rating data">
<SelectDataEntry
title={dataFields.sust_breeam_rating.title}
slug="sust_breeam_rating"
@ -74,7 +76,8 @@ const SustainabilityView: React.FunctionComponent<CategoryViewProps> = (props) =
copy={props.copy}
onChange={props.onChange}
/>
</DataEntryGroup>
<DataEntryGroup name="Retrofit Data">
<NumericDataEntry
title={dataFields.sust_retrofit_date.title}
slug="sust_retrofit_date"
@ -115,12 +118,15 @@ const SustainabilityView: React.FunctionComponent<CategoryViewProps> = (props) =
value=""
mode='view'
/>
</DataEntryGroup>
<DataEntryGroup name="Other sustainability features">
<DataEntry
title="Green Walls / Green Roof"
slug=""
value=""
mode='view'
/>
</DataEntryGroup>
</Fragment>
);
};

10
app/src/frontend/building/data-containers/team.tsx
View File

@ -21,6 +21,7 @@ const TeamView: React.FunctionComponent<CategoryViewProps> = (props) => {
const currentBuildingConstructionYear = building.date_year || undefined;
return (
<form>
<DataEntryGroup name="Dates of construction/extension">
<NumericDataEntry
slug='date_year'
title={dataFields.date_year.title}
@ -74,6 +75,8 @@ const TeamView: React.FunctionComponent<CategoryViewProps> = (props) => {
/>
</>
) : (null)}
</DataEntryGroup>
<DataEntryGroup name="Land ownership data">
<MultiDataEntry
title={dataFields.landowner.title}
slug="landowner"
@ -105,6 +108,8 @@ const TeamView: React.FunctionComponent<CategoryViewProps> = (props) => {
editableEntries={true}
isUrl={true}
/>
</DataEntryGroup>
<DataEntryGroup name="Developer data">
<SelectDataEntry
slug='developer_type'
title={dataFields.developer_type.title}
@ -153,6 +158,8 @@ const TeamView: React.FunctionComponent<CategoryViewProps> = (props) => {
editableEntries={true}
isUrl={true}
/>
</DataEntryGroup>
<DataEntryGroup name="Designer data">
<MultiDataEntry
title={dataFields.designers.title}
slug="designers"
@ -243,6 +250,8 @@ const TeamView: React.FunctionComponent<CategoryViewProps> = (props) => {
</>
) : (null)
}
</DataEntryGroup>
<DataEntryGroup name="Builder data">
<MultiDataEntry
title={dataFields.builder.title}
slug="builder"
@ -272,6 +281,7 @@ const TeamView: React.FunctionComponent<CategoryViewProps> = (props) => {
editableEntries={true}
isUrl={true}
/>
</DataEntryGroup>
</form>
);
};

34
app/src/frontend/building/data-containers/type.tsx
View File

@ -9,6 +9,7 @@ import withCopyEdit from '../data-container';
import { CategoryViewProps } from './category-view-props';
import InfoBox from '../../components/info-box';
import { DataEntryGroup } from '../data-components/data-entry-group';
const AttachmentFormOptions = [
"Detached",
@ -23,6 +24,7 @@ const AttachmentFormOptions = [
const TypeView: React.FunctionComponent<CategoryViewProps> = (props) => {
return (
<Fragment>
<DataEntryGroup name="Adjacency and Building Use Data">
<SelectDataEntry
title={dataFields.building_attachment_form.title}
slug="building_attachment_form"
@ -41,6 +43,21 @@ const TypeView: React.FunctionComponent<CategoryViewProps> = (props) => {
user_verified_as={props.user_verified.building_attachment_form}
verified_count={props.building.verified.building_attachment_form}
/>
<DataEntry
title="Source type"
slug=""
value=""
mode='view'
tooltip="Coming Soon"
/>
<DataEntry
title="Source link"
slug=""
value=""
mode='view'
tooltip="Coming Soon"
/>
<hr/>
<DataEntry
title={dataFields.original_building_use.title}
slug="original_building_use" // doesn't exist in database yet
@ -59,6 +76,22 @@ const TypeView: React.FunctionComponent<CategoryViewProps> = (props) => {
user_verified_as={props.user_verified.building_attachment_form}
verified_count={props.building.verified.building_attachment_form}
/>
<DataEntry
title="Source type"
slug=""
value=""
mode='view'
tooltip="Coming Soon"
/>
<DataEntry
title="Source link"
slug=""
value=""
mode='view'
tooltip="Coming Soon"
/>
</DataEntryGroup>
<DataEntryGroup name="Building Typology and Classification Data">
<DataEntry
title="Local typology/architectural style"
slug=""
@ -115,6 +148,7 @@ const TypeView: React.FunctionComponent<CategoryViewProps> = (props) => {
copy={props.copy}
onChange={props.onChange}
/> */}
</DataEntryGroup>
</Fragment>
);
};

32
app/src/frontend/building/data-containers/use.tsx
View File

@ -25,10 +25,14 @@ const UseView: React.FunctionComponent<CategoryViewProps> = (props) => {
const { darkLightTheme } = useDisplayPreferences();
return (
<Fragment>
<DataEntryGroup name="Domestic or non-domestic use" collapsed={false}>
<InfoBox msg="93% of properties in UK are dwellings so we have set 'residential' as the default value. Can you help us identify non-residential and mixed use buildings (and verify residential buildings too)?"></InfoBox>
<DataEntryGroup name="Domestic/non-domestic use data">
<div className={`alert alert-dark`} role="alert" style={{ fontSize: 13, backgroundColor: "#f6f8f9" }}>
<i>
93% of properties in UK are residential dwellings so we have set 'residential' as the default value. Can you help us identify non-residential and mixed use buildings (and verify residential buildings too)?
</i>
</div>
<button className={`map-switcher-inline ${props.mapColourScale == "is_domestic" ? "enabled-state" : "disabled-state"} btn btn-outline btn-outline-dark ${darkLightTheme}`} onClick={switchToIsDomesticMapStyle}>
{(props.mapColourScale == "is_domestic")? 'Showing domestic status for specific buildings' : 'Click to see domestic, non-domestic and mixed-use buildings'}
{(props.mapColourScale == "is_domestic")? 'Showing domestic, non-domestic and mixed-use buildings (click to hide)' : 'Click to see domestic, non-domestic and mixed-use buildings on the map.'}
</button>
<SelectDataEntry
title={dataFields.is_domestic.title}
@ -48,17 +52,18 @@ const UseView: React.FunctionComponent<CategoryViewProps> = (props) => {
user_verified_as={props.user_verified.is_domestic}
verified_count={props.building.verified.is_domestic}
/>
<InfoBox type='warning'>Note: Work from home does not count as office and does not make building non-domestic.</InfoBox>
<SelectDataEntry
title={dataFields.is_domestic_source.title}
slug="is_domestic_source"
value={props.building.is_domestic}
options={
[
"Citizen/passerby",
"Expert knowledge",
"Observed from the street",
"Google or other photograph/satellite imagery",
"Government Record",
"Other Record"
"Government/public record/database",
"Independently managed record/database",
"Other type of record/database"
]
}
mode={props.mode}
@ -67,14 +72,14 @@ const UseView: React.FunctionComponent<CategoryViewProps> = (props) => {
tooltip={dataFields.is_domestic_source.tooltip}
/>
<DataEntry
title="Please provide a link to the data source"
title="Source link"
slug=""
value=""
mode='view'
tooltip="Coming Soon"
/>
</DataEntryGroup>
<DataEntryGroup name="Specific Land Use" collapsed={false}>
<DataEntryGroup name="Specific land use data">
<MultiDataEntry
title={dataFields.current_landuse_group.title}
slug="current_landuse_group"
@ -127,7 +132,14 @@ const UseView: React.FunctionComponent<CategoryViewProps> = (props) => {
}
{
props.mode != 'view' &&
<InfoBox msg="A more general classification for the land use of this building is automatically derived and shown below."></InfoBox>
<div>
<hr/>
<div className={`alert alert-dark`} role="alert" style={{ fontSize: 13, backgroundColor: "#f6f8f9" }}>
<i>
Below is a more general classification for the land use of this building, automatically derived from the information above.
</i>
</div>
</div>
}
<DataEntry
title={dataFields.current_landuse_order.title}

4
app/src/frontend/config/categories-config.ts
View File

@ -80,7 +80,7 @@ export const categoriesConfig: {[key in Category]: CategoryDefinition} = {
slug: 'community',
name: 'Community',
aboutUrl: 'https://pages.colouring.london/community',
intro: 'This section collects data on how well citizens think specific *types* of building work (rather than individual buildings). This will help us save and reuse as many useful buildings as possible, and to help improve urban design quality in future.',
intro: 'This section collects data on how well citizens think specific *types* of building work. This will help us save/reuse as many useful buildings as possible, and help improve urban design quality in future.',
},
[Category.Planning]: {
slug: 'planning',
@ -98,7 +98,7 @@ export const categoriesConfig: {[key in Category]: CategoryDefinition} = {
slug: 'type',
name: 'Typology',
aboutUrl: 'https://pages.colouring.london/buildingtypology',
intro: 'This section provides open data on the type of activities being carried out within buildings.',
intro: 'Note: This section is currently under development, we are working to activate it as soon as possible. This section provides open data on the typology of the building.',
},
[Category.LandUse]: {
slug: 'use',

18
app/src/frontend/config/data-fields-config.ts
View File

@ -177,7 +177,7 @@ export const dataFields = { /* eslint-disable @typescript-eslint/camelcase */
uprns: {
category: Category.Location,
title: "Unique Property Reference Number(s) (UPRN)",
tooltip: "Unique Property Reference Numbers (to be filled automatically)",
tooltip: "Unique Property Reference Numbers (to be filled automatically) [<a href='https://beta.ordnancesurvey.co.uk/products/os-open-uprn'>LINK</a>]",
example: [{uprn: "", parent_uprn: "" }, {uprn: "", parent_uprn: "" }],
},
@ -211,13 +211,13 @@ export const dataFields = { /* eslint-disable @typescript-eslint/camelcase */
},
current_landuse_group: {
category: Category.LandUse,
title: "Current Land Use",
title: "Current land use(s)",
tooltip: "Land use Groups as classified by [NLUD](https://www.gov.uk/government/statistics/national-land-use-database-land-use-and-land-cover-classification)",
example: ["", ""],
},
current_landuse_order: {
category: Category.LandUse,
title: "Current Land Use (Order)",
title: "Current land use (order)",
tooltip: "Land use Order as classified by [NLUD](https://www.gov.uk/government/statistics/national-land-use-database-land-use-and-land-cover-classification)",
example: "",
},
@ -272,7 +272,7 @@ export const dataFields = { /* eslint-disable @typescript-eslint/camelcase */
original_building_use: {
category: Category.Type,
title: "Original building use",
tooltip: "What was the building originally used for when it was built? I.e. If it was Victorian warehouse which is now an office this would be warehouse",
tooltip: "What was the building <u><i>originally</i></u> used for when it was built?",
example: "",
},
size_roof_shape: {
@ -290,7 +290,7 @@ export const dataFields = { /* eslint-disable @typescript-eslint/camelcase */
date_lower : {
category: Category.Age,
title: "Earliest possible start year",
tooltip: "This should be the earliest year in which building could have started.",
tooltip: "This should be the earliest year in which construction could have started.",
example: 1900,
},
date_upper: {
@ -362,13 +362,13 @@ export const dataFields = { /* eslint-disable @typescript-eslint/camelcase */
category: Category.Size,
title: "Height to apex (m)",
example: 100.5,
//tooltip: ,
tooltip: "i.e. the highest part of the roof.",
},
size_height_eaves: {
category: Category.Size,
title: "Height to eaves (m)",
example: 20.33,
//tooltip: ,
tooltip: "i.e. to where the top of the wall meets the roof",
},
size_floor_area_ground: {
category: Category.Size,
@ -601,12 +601,12 @@ export const dataFields = { /* eslint-disable @typescript-eslint/camelcase */
is_domestic: {
category: Category.Team,
title: "Is the building a home/domestic building?",
tooltip: "",
tooltip: "Note: Homes used as offices for working from home should be classified as domestic.",
example: "mixed domestic/non-domestic"
},
is_domestic_source: {
category: Category.Team,
title: "Domestic/non-domestic data source?",
title: "Source type",
tooltip: "",
example: ""
},

6
app/src/frontend/styles/layout.css
View File

@ -50,9 +50,9 @@ article .color-block {
hr {
display: block;
height: 1px;
border: 0;
background: #000;
border: none;
background-color: #ccc;
width: 100%;
margin: 2em 0;
margin: 1.2em 0 1em 0;
padding: 0;
}