tandem/camper
tandem
/
camper
2
0
Fork 0
Code Issues 7 Pull Requests Packages Projects Releases Wiki Activity
camper/web/templates/public/surroundings.gohtml

74 lines
3.1 KiB
Plaintext
Raw Normal View History

Add the surroundings static page This page is “highly stylized”, with a masonry-like grid, that i did not know how to generate automatically from data defined in PostgreSQL, therefore with Oriol we agreed to have this one as a static page and we will see what we can do if the customer asks to be able to change it. I was a bit undecided on whether the icons in the bottom part of the page should be defined in the CSS or with style="" and CSS variables, like i do for the campsite type in the home page. At first i thought that it should use CSS variables, mostly for coherence: if another section of the web does it for its background image, why no this one. The difference is that the home page is dynamically created from the database, while this page is static and we know what icons we need, thus it makes more sense to move it to the stylesheet file, because then it will be downloaded by user agents that actually want to use it (e.g., browsers, but not Braille terminals).
2023-09-16 22:11:39 +00:00
<!--
SPDX-FileCopyrightText: 2023 jordi fita mas <jordi@tandem.blog>
Added copyright statement to files modified by Oriol
2024-01-16 16:58:49 +00:00
SPDX-FileCopyrightText: 2023 Oriol Carbonell <info@oriolcarbonell.cat>
Add the surroundings static page This page is “highly stylized”, with a masonry-like grid, that i did not know how to generate automatically from data defined in PostgreSQL, therefore with Oriol we agreed to have this one as a static page and we will see what we can do if the customer asks to be able to change it. I was a bit undecided on whether the icons in the bottom part of the page should be defined in the CSS or with style="" and CSS variables, like i do for the campsite type in the home page. At first i thought that it should use CSS variables, mostly for coherence: if another section of the web does it for its background image, why no this one. The difference is that the home page is dynamically created from the database, while this page is static and we know what icons we need, thus it makes more sense to move it to the stylesheet file, because then it will be downloaded by user agents that actually want to use it (e.g., browsers, but not Braille terminals).
2023-09-16 22:11:39 +00:00
SPDX-License-Identifier: AGPL-3.0-only
-->
{{ define "title" -}}
{{( pgettext "Surroundings" "title" )}}
{{- end }}
{{ define "content" -}}
Add management of surroundings’ highlights (points of interest) Customer does not want the new “masonry-like” design of the surroundings page, and wants the same style they already had: a regular list with text and photo, alternating the photo’s side. And, of course, they want to be able to add and edit them themselves. It is like another carousel, but with an additional rich-text description. The photos that we had in that page are no longer of use.
2024-01-16 00:25:25 +00:00
{{- /*gotype: dev.tandem.ws/tandem/camper/pkg/surroundings.surroundingsPage*/ -}}
Add the surroundings static page This page is “highly stylized”, with a masonry-like grid, that i did not know how to generate automatically from data defined in PostgreSQL, therefore with Oriol we agreed to have this one as a static page and we will see what we can do if the customer asks to be able to change it. I was a bit undecided on whether the icons in the bottom part of the page should be defined in the CSS or with style="" and CSS variables, like i do for the campsite type in the home page. At first i thought that it should use CSS variables, mostly for coherence: if another section of the web does it for its background image, why no this one. The difference is that the home page is dynamically created from the database, while this page is static and we know what icons we need, thus it makes more sense to move it to the stylesheet file, because then it will be downloaded by user agents that actually want to use it (e.g., browsers, but not Braille terminals).
2023-09-16 22:11:39 +00:00
<h2>{{( pgettext "Surroundings" "title" )}}</h2>
Add ad management for surroundings They only want a single ad (for now, i guess).
2024-01-23 13:53:15 +00:00
{{ with .Ad -}}
<div id="surroundings-ad" style="--background-image: url('{{ .MediaURL }}')">
<div>
<h3>{{ .Title }}</h3>
<a href="{{ .HRef }}" rel="nofollow noopener">{{ .Anchor}}
Add management of surroundings’ highlights (points of interest) Customer does not want the new “masonry-like” design of the surroundings page, and wants the same style they already had: a regular list with text and photo, alternating the photo’s side. And, of course, they want to be able to add and edit them themselves. It is like another carousel, but with an additional rich-text description. The photos that we had in that page are no longer of use.
2024-01-16 00:25:25 +00:00
<svg viewBox="0 0 93.69895 67.38545"
Add ad management for surroundings They only want a single ad (for now, i guess).
2024-01-23 13:53:15 +00:00
xmlns="http://www.w3.org/2000/svg">
<path fill="currentColor"
d="m67.38545,67.38545l-13.49997-2.97457c.57203-5.72033,2.74576-10.99256,6.52117-15.8167,3.77542-4.82414,8.04659-7.94172,12.81353-9.35273H0v-11.09743h73.22018c-4.76694-1.41101-9.03812-4.53813-12.81353-9.38134-3.77542-4.84321-5.94914-10.12498-6.52117-15.8453l13.49997-2.91737c.26695,8.38981,2.70762,15.01586,7.32202,19.87813s10.94489,7.61757,18.99148,8.26587v11.09743c-8.04659.6483-14.37709,3.40359-18.99148,8.26587-4.6144,4.86228-7.05507,11.48832-7.32202,19.87813Z"/>
Add management of surroundings’ highlights (points of interest) Customer does not want the new “masonry-like” design of the surroundings page, and wants the same style they already had: a regular list with text and photo, alternating the photo’s side. And, of course, they want to be able to add and edit them themselves. It is like another carousel, but with an additional rich-text description. The photos that we had in that page are no longer of use.
2024-01-16 00:25:25 +00:00
</svg>
</a>
</div>
</div>
Add ad management for surroundings They only want a single ad (for now, i guess).
2024-01-23 13:53:15 +00:00
{{- end }}
Update styles
2023-12-20 12:02:56 +00:00
Add the surroundings static page This page is “highly stylized”, with a masonry-like grid, that i did not know how to generate automatically from data defined in PostgreSQL, therefore with Oriol we agreed to have this one as a static page and we will see what we can do if the customer asks to be able to change it. I was a bit undecided on whether the icons in the bottom part of the page should be defined in the CSS or with style="" and CSS variables, like i do for the campsite type in the home page. At first i thought that it should use CSS variables, mostly for coherence: if another section of the web does it for its background image, why no this one. The difference is that the home page is dynamically created from the database, while this page is static and we know what icons we need, thus it makes more sense to move it to the stylesheet file, because then it will be downloaded by user agents that actually want to use it (e.g., browsers, but not Braille terminals).
2023-09-16 22:11:39 +00:00
<section class="outside_activities">
<h3>{{( pgettext "What to Do Outside the Campsite?" "title" )}}</h3>
Update styles
2023-12-20 12:02:56 +00:00
Add management of surroundings’ highlights (points of interest) Customer does not want the new “masonry-like” design of the surroundings page, and wants the same style they already had: a regular list with text and photo, alternating the photo’s side. And, of course, they want to be able to add and edit them themselves. It is like another carousel, but with an additional rich-text description. The photos that we had in that page are no longer of use.
2024-01-16 00:25:25 +00:00
{{ with .Highlights -}}
<ul>
{{ range . -}}
<li>
<article>
<div>
<h4>{{ .Name }}</h4>
{{ .Description }}
</div>
<img src="{{ .Media }}" alt="">
</article>
</li>
{{- end }}
</ul>
{{- end }}
Add the surroundings static page This page is “highly stylized”, with a masonry-like grid, that i did not know how to generate automatically from data defined in PostgreSQL, therefore with Oriol we agreed to have this one as a static page and we will see what we can do if the customer asks to be able to change it. I was a bit undecided on whether the icons in the bottom part of the page should be defined in the CSS or with style="" and CSS variables, like i do for the campsite type in the home page. At first i thought that it should use CSS variables, mostly for coherence: if another section of the web does it for its background image, why no this one. The difference is that the home page is dynamically created from the database, while this page is static and we know what icons we need, thus it makes more sense to move it to the stylesheet file, because then it will be downloaded by user agents that actually want to use it (e.g., browsers, but not Braille terminals).
2023-09-16 22:11:39 +00:00
</section>
<section class="campsite_activities">
<h3>{{( pgettext "Once at the Campsite, We Can Inform You about What Activities are Available" "title" )}}</h3>
<dl>
<div>
<dt class="icon_bicycle">{{( gettext "Cycle routes" )}}</dt>
<dd>{{( gettext "There are many bicycle rental companies in Olot." )}}</dd>
</div>
<div>
<dt class="icon_route">{{( gettext "Routes" )}}</dt>
<dd>{{( gettext "Routes of all kinds, climbing, mountain passes, for all levels." )}}</dd>
</div>
<div>
<dt class="icon_outing">{{( gettext "Family outing")}}</dt>
<dd>{{( gettext "Many outing possibilities, for all ages." )}}</dd>
</div>
<div>
<dt class="icon_kayak">{{( gettext "Kayak")}}</dt>
<dd>{{( gettext "There are several points where you can go by kayak, from sections of the Ter river as well as on the coast…." )}}</dd>
</div>
</dl>
</section>
{{- end }}