Skip to content

Commit

Permalink
Update button style and text formating
Browse files Browse the repository at this point in the history
Slight changes to the button style made.
Formatting of the text updated.
  • Loading branch information
surelybassy authored and 01100100 committed Aug 6, 2024
1 parent c5c140a commit 8e9bfba
Show file tree
Hide file tree
Showing 2 changed files with 26 additions and 13 deletions.
34 changes: 22 additions & 12 deletions app/src/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -167,19 +167,24 @@
width: 50%;
text-align: center;
z-index: 1;
background-image: linear-gradient(to right, #DA22FF 0%, #9733EE 51%, #DA22FF 100%);
background-size: 200% auto;
background-image: linear-gradient(45deg, #DA22FF, #9733EE, #DA22FF);
background-size: 400% 400%;
color: white;
box-shadow: 0 0 5px 3px #eee;
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
margin: 0;
border: none;
border-radius: 3px;
padding: 5px 5px;
border-radius: 25px;
padding: 10px 20px;
font-size: 16px;
font-weight: bold;
cursor: pointer;
transition: all 0.4s ease;
}

.spin-button:hover {
background-position: right center;
background-position: 100% 0;
box-shadow: 0 6px 20px rgba(0, 0, 0, 0.4);
transform: translate(-50%) scale(1.05);
color: #fff;
text-decoration: none;
}
Expand All @@ -194,19 +199,24 @@
width: 50%;
text-align: center;
z-index: 1;
background-image: linear-gradient(to right, #DA22FF 0%, #9733EE 51%, #DA22FF 100%);
background-size: 200% auto;
background-image: linear-gradient(45deg, #DA22FF, #9733EE, #DA22FF);
background-size: 400% 400%;
color: white;
box-shadow: 0 0 5px 3px #eee;
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
margin: 0;
border: none;
border-radius: 3px;
padding: 5px 5px;
border-radius: 25px;
padding: 10px 20px;
font-size: 16px;
font-weight: bold;
cursor: pointer;
transition: all 0.4s ease;
}

.reveal-button:hover {
background-position: right center;
background-position: 100% 0;
box-shadow: 0 6px 20px rgba(0, 0, 0, 0.4);
transform: translate(-50%) scale(1.05);
color: #fff;
text-decoration: none;
}
Expand Down
5 changes: 4 additions & 1 deletion app/src/ui.ts
Original file line number Diff line number Diff line change
Expand Up @@ -307,6 +307,9 @@ export function showResults(feature: Feature<Geometry, GeoJsonProperties>) {
}
if (featureType) {
featureEmoji = emojiMap[featureType];
featureType = featureType.split('_')
.map(word => word.charAt(0).toUpperCase() + word.slice(1))
.join(' ');
}
console.log(featureProperties)
const featureWebsite = featureProperties.website;
Expand All @@ -321,7 +324,7 @@ export function showResults(feature: Feature<Geometry, GeoJsonProperties>) {
+ (featureOpeningHours ? `<p>${icon({ prefix: 'fas', iconName: 'clock' }).html} ${featureOpeningHours}</p>` : "")
+ (featureWebsite ? `<p>${icon({ prefix: 'fas', iconName: 'globe' }).html} <a href="${featureWebsite}" target="_blank">${featureWebsite}</a></p>` : "")
+ `
<p>${icon({ prefix: 'fas', iconName: 'link' }).html} <a href="https://www.openstreetmap.org/${featureId}" target="_blank">https://www.openstreetmap.org/${featureId}</a></p>
<p>${icon({ prefix: 'fas', iconName: 'link' }).html} <a href="https://www.openstreetmap.org/${featureId}" target="_blank">Open with OpenStreetMap</a></p>
`;
resultsContainer.appendChild(featureDetails);

Expand Down

0 comments on commit 8e9bfba

Please sign in to comment.