Skip to content

Commit 92fa24d

Browse files
rcmtcristianrcmtcristian
authored
Merge branch 'main' into dashboard-web-page
2 parents be0aaea + d1bfd8c commit 92fa24d

File tree

6 files changed

+1170
-96
lines changed

6 files changed

+1170
-96
lines changed

‎data/external/landmarks.csv‎

Lines changed: 12 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,14 @@
1-
campaign,landmark,species,image,longitude,latitude,acreage
2-
"Protect Anza Desert","Anza, San Diego","Diamond Cactus","cholla",-117.21605301,32.79797516,18884
3-
"Save our Herring","Cape Cod","Herring","herring",-70.29624784,41.66878836,45000
4-
"California Rivers","Klamath River","Salmon","salmon",-122.82559,41.861244,2265000
5-
"Tuolomne River Campaign","Yosemite","Rainbow Trout","trout",-119.538329,37.865101,23915
6-
"California Wetlands","Baylands Nature Preserve","Swallowtail Butterfly","swallowtail_butterfly",-122.1075565,37.4575062,100
7-
"Stream Inflow Study","Rattan Landing","Catfish","catfish",-95.48292494,34.19718093,100
8-
"Pueblo Alliance","Greater Chaco","Mountain Lion","mountain_lion",-95.5004168,29.75362647,100
9-
"Save Kaimichi","Kaimichi River","Mussels","mussels",-95.48813653,34.23885624,100
1+
campaign,landmark,species,image,longitude,latitude,acreage,species_type
2+
"Protect Anza Desert","Anza, San Diego","Diamond Cactus","cholla",-117.21605301,32.79797516,18884,plants
3+
"Save our Herring","Cape Cod","Herring","herring",-70.29624784,41.66878836,45000,animals
4+
"California Rivers","Klamath River","Salmon","salmon",-122.82559,41.861244,2265000,animals
5+
"Tuolomne River Campaign","Yosemite","Rainbow Trout","trout",-119.538329,37.865101,23915,animals
6+
"California Wetlands","Baylands Nature Preserve","Swallowtail Butterfly","swallowtail_butterfly",-122.1075565,37.4575062,100,animals
7+
"Stream Inflow Study","Rattan Landing","Catfish","catfish",-95.48292494,34.19718093,100,animals
8+
"Pueblo Alliance","Greater Chaco","Mountain Lion","mountain_lion",-95.5004168,29.75362647,100,animals
9+
"Save Kaimichi","Kaimichi River","Mussels","mussels",-95.48813653,34.23885624,100,animals
1010
"Clean up Jersey","Central Park","","",-73.968285,40.785091,100
1111
"Clean up White Mesa","White Mesa","","",-109.46698,37.465717,597000
12-
"Land regeneration","Duwamish Longhouse","Duck","duck",-122.3520131,47.5609509,11
13-
"Protect Tomales Bay and Tulle Elk","Tomales Bay","Herring","herring",-122.91277387,38.1712709,71000
14-
"Protext HaKamwe Healing Springs","Wikieup","Eagle","eagle",-113.61511351,34.71953628,360
12+
"Land regeneration","Duwamish Longhouse","Duck","duck",-122.3520131,47.5609509,11,animals
13+
"Protect Tomales Bay and Tulle Elk","Tomales Bay","Herring","herring",-122.91277387,38.1712709,71000,animals
14+
"Protect HaKamwe Healing Springs","Wikieup","Eagle","eagle",-113.61511351,34.71953628,360,animals

‎issue-74.vue‎

Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
<template>
2+
<v-footer
3+
color="white"
4+
class="mt-8 mb-8"
5+
>
6+
<v-container fluid>
7+
<v-row>
8+
<!-- Desktop: 6 columns, right-aligned | Mobile: 12 columns, centered -->
9+
<v-col
10+
cols="12"
11+
md="6"
12+
:class="$vuetify.display.mdAndUp ? 'text-right' : 'text-center'"
13+
>
14+
<p class="text-grey-darken-4 mb-0">
15+
This is a
16+
<a
17+
href="https://www.programearth.org"
18+
target="_blank"
19+
class="text-grey-darken-4 text-decoration-none"
20+
>
21+
www.programearth.org
22+
</a> project. Updated 2025.
23+
</p>
24+
</v-col>
25+
</v-row>
26+
</v-container>
27+
</v-footer>
28+
</template>
29+
30+
<script>
31+
export default {
32+
name: 'AppFooter'
33+
}
34+
</script>
35+
36+
<style scoped>
37+
/* Additional styling if needed */
38+
a:hover {
39+
text-decoration: underline !important;
40+
}
41+
</style>

‎map-dashboard-ui/src/App.vue‎

Lines changed: 98 additions & 83 deletions
Original file line numberDiff line numberDiff line change
@@ -1,120 +1,135 @@
11
<template>
22
<v-app>
3-
4-
<!------------ Nav Bar --------------->
5-
<v-toolbar>
6-
Nav bar goes here
7-
</v-toolbar> <!-- /end Nav Bar-->
8-
9-
<!-- Main Content -->
3+
<!-- Navigation Bar -->
4+
<v-container
5+
fluid
6+
class="d-flex align-center"
7+
style="height: 72px; background-color: #FFFFFF"
8+
>
9+
<!-- Logo -->
10+
<v-col :cols="$vuetify.display.mdAndUp ? 6 : 10" class="d-flex align-center">
11+
<v-img
12+
src="@/assets/logo.svg"
13+
alt="PE Logo"
14+
:height="$vuetify.display.mdAndUp ? 36 : 48"
15+
contain
16+
/>
17+
</v-col>
18+
19+
<!-- Desktop Menu -->
20+
<v-col
21+
v-if="$vuetify.display.mdAndUp"
22+
cols="6"
23+
class="d-flex justify-end align-center"
24+
>
25+
<v-btn text>Home</v-btn>
26+
<v-btn text>About</v-btn>
27+
<v-btn text>Contact</v-btn>
28+
</v-col>
29+
30+
<!-- Mobile Hamburger -->
31+
<v-col v-else cols="2" class="d-flex justify-end align-center">
32+
<v-btn
33+
icon
34+
size="36"
35+
style="color: #33691E"
36+
@click="drawer = true"
37+
>
38+
<v-icon>mdi-menu</v-icon>
39+
</v-btn>
40+
</v-col>
41+
</v-container>
42+
43+
<!-- Mobile Drawer -->
44+
<v-navigation-drawer
45+
v-model="drawer"
46+
temporary
47+
location="right"
48+
style="background-color: #fff"
49+
>
50+
<v-list>
51+
<v-list-item @click="drawer = false"><v-list-item-title>Home</v-list-item-title></v-list-item>
52+
<v-list-item @click="drawer = false"><v-list-item-title>About</v-list-item-title></v-list-item>
53+
<v-list-item @click="drawer = false"><v-list-item-title>Contact</v-list-item-title></v-list-item>
54+
</v-list>
55+
</v-navigation-drawer>
56+
57+
<!-- Main Content & Map Layout -->
1058
<v-main>
11-
12-
<!-- Grid layout -->
1359
<v-container>
1460
<v-row>
15-
16-
<!--------- Map Visualization -------->
17-
<v-col cols="12" md="8" style="border: 1px solid black;" class="map-vis-col pa-0">
61+
<!-- Map Visualization -->
62+
<v-col cols="12" md="8" class="map-vis-col pa-0" style="border: 1px solid black;">
1863
<v-sheet>
19-
<!-- Test image just as a placeholder -->
20-
<v-img
21-
cover
22-
src="/images/Map_Screenshot_Vue_Test.jpg">
23-
</v-img>
64+
<v-img cover src="/images/Map_Screenshot_Vue_Test.jpg" />
2465
</v-sheet>
25-
</v-col> <!-- /end Map Visualization -->
26-
27-
<!-------------- Map Information -------------->
66+
</v-col>
67+
68+
<!-- Map Info -->
2869
<v-col cols="12" md="4" class="map-info-col">
29-
30-
<v-sheet class="map-info-reset">
31-
32-
<!-- Title -->
70+
<v-sheet class="map-info-reset">
3371
<h1 class="text-h1 mb-6">Biodiversity Conservation</h1>
3472

35-
<!-- Maps section -->
73+
<!-- Maps Section -->
3674
<v-container class="pa-0 mb-6">
3775
<h2 class="text-h2 mb-4">Maps</h2>
38-
<p class="text-body-1">Select to view map layer:</p>
39-
<!-- Checkboxes to select map layers -->
40-
<v-checkbox label="ProgramEarth Conservation Partners" density="compact" hide-details></v-checkbox>
41-
<v-checkbox label="USGS Watershed Boundary Dataset" density="compact" hide-details></v-checkbox>
42-
<v-checkbox label="Meta's Canopy Heights" density="compact" hide-details></v-checkbox>
43-
</v-container> <!--/end maps section-->
44-
76+
<p>Select to view map layer:</p>
77+
<v-checkbox label="ProgramEarth Conservation Partners" density="compact" hide-details />
78+
<v-checkbox label="USGS Watershed Boundary Dataset" density="compact" hide-details />
79+
<v-checkbox label="Meta's Canopy Heights" density="compact" hide-details />
80+
</v-container>
81+
4582
<!-- Legend -->
4683
<v-container class="pa-0 mb-6">
4784
<h2 class="text-h2 mb-4">Legend</h2>
48-
49-
<!-- Points -->
85+
5086
<div class="points-container">
5187
<h3 class="text-h3 mb-3">Points</h3>
52-
<!-- Landmark -->
5388
<v-container class="points-item mb-3">
54-
<i class="fas fa-circle" style="color: #424242; font-size: 16px;"></i> <p class="text-body-1">Landmark</p> <!-- /end Landmark -->
89+
<i class="fas fa-circle" style="color: #424242; font-size: 16px;"></i>
90+
<p>Landmark</p>
5591
</v-container>
56-
<!-- Animals -->
5792
<v-container class="points-item mb-3">
58-
<i class="fas fa-dove" style="color: #2196F3; font-size: 16px"></i> <p class="text-body-1">Animals</p>
59-
</v-container> <!-- /end Animals -->
60-
<!-- Plants -->
93+
<i class="fas fa-dove" style="color: #2196F3; font-size: 16px;"></i>
94+
<p>Animals</p>
95+
</v-container>
6196
<v-container class="points-item">
62-
<i class="fas fa-seedling" style="color: #43A047; font-size: 16px;"></i> <p class="text-body-1">Plants</p> <!-- /end plants -->
63-
</v-container>
64-
</div> <!-- /end points -->
97+
<i class="fas fa-seedling" style="color: #43A047; font-size: 16px;"></i>
98+
<p>Plants</p>
99+
</v-container>
100+
</div>
65101

66-
<!-- Areas -->
67102
<div class="areas-container">
68-
<h3 class="text-h3 mb-3">Areas</h3>
69-
<!-- Species -->
103+
<h3 class="text-h3 mb-3">Areas</h3>
70104
<v-container class="areas-item mb-3" style="width: fit-content;">
71-
<v-img
72-
:width="30"
73-
:height="30"
74-
src="/images/species_icon.svg"
75-
></v-img>
76-
<p class="text-body-1">Species</p>
77-
</v-container> <!-- /end species -->
78-
<!-- Water -->
105+
<v-img width="30" height="30" src="/images/species_icon.svg" />
106+
<p>Species</p>
107+
</v-container>
79108
<v-container class="areas-item mb-3" style="width: fit-content;">
80-
<v-img
81-
:width="30"
82-
:height="30"
83-
src="/images/water_polygon_icon.svg"
84-
></v-img>
85-
<p class="text-body-1">Water</p>
86-
</v-container> <!-- /end water -->
87-
<!-- Canopy -->
109+
<v-img width="30" height="30" src="/images/water_polygon_icon.svg" />
110+
<p>Water</p>
111+
</v-container>
88112
<v-container class="areas-item" style="width: fit-content;">
89-
<v-img
90-
:width="30"
91-
:height="30"
92-
src="/images/canopy_polygon_icon.svg"
93-
></v-img>
94-
<p class="text-body-1">Canopy</p>
95-
</v-container> <!-- /end canopy -->
96-
</div> <!-- /end Areas -->
97-
98-
</v-container> <!-- /end Legend -->
99-
100-
</v-sheet>
101-
102-
</v-col> <!-- /end Map Information -->
103-
113+
<v-img width="30" height="30" src="/images/canopy_polygon_icon.svg" />
114+
<p>Canopy</p>
115+
</v-container>
116+
</div>
117+
</v-container>
118+
</v-sheet>
119+
</v-col>
104120
</v-row>
105-
</v-container> <!-- /end grid layout -->
106-
121+
</v-container>
107122
</v-main>
108123

109-
<!---------------- Footer ------------------->
124+
<!-- Footer -->
110125
<v-footer>
111126
Footer goes here
112127
</v-footer>
113-
114128
</v-app>
115129
</template>
116130

117131
<script setup>
118-
// Nothing yet
119-
</script>
132+
import { ref } from 'vue'
120133
134+
const drawer = ref(false)
135+
</script>

0 commit comments

Comments
 (0)