sysadmin/openfreemap
1
0
Fork 0
mirror of https://github.com/hyperknot/openfreemap.git synced 2026-05-21 14:02:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

new css

Browse Source
This commit is contained in:
Zsolt Ero
2024-06-13 19:33:06 +02:00
parent ea11cdbe4b
commit 3f26695b2e
7 changed files with 94 additions and 100 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
website/src/components/Map.astro
View File

@@ -33,6 +33,12 @@ const { showStyleURL } = Astro.props
position: relative;
}
@media (max-width: 550px) {
#map-container {
height: 300px;
}
}
#mapbg-image {
width: 100%;
height: 100%;

16
website/src/layouts/Layout.astro
View File

@@ -1,9 +1,6 @@
---
interface Props {
title: string
}
const { title } = Astro.props
const { frontmatter } = Astro.props || {}
const { title, container } = frontmatter || Astro.props
import '../styles/_style.css'
---
@@ -32,7 +29,14 @@ import '../styles/_style.css'
</head>
<body>
<slot />
{
container && (
<div class="container">
<slot />
</div>
)
}
{!container && <slot />}
<div class="footer">
<a href="/privacy">Privacy Policy</a>

23
website/src/pages/index.astro
View File

@@ -11,16 +11,21 @@ import { Content as RestText } from '../content/index/rest.md'
<Layout title="OpenFreeMap">
<Logo title="OpenFreeMap" />
<WhatisText />
<div class="container">
<WhatisText />
<h2>How can I use it?</h2>
</div>
<h2>How can I use it?</h2>
<Map />
<p>
Have a look at the default styles and read more about how to integrate it to your website or app
here:
</p>
<p style="margin: 20px auto;"><a href="/quick_start">Quick Start Guide</a></p>
<Donate />
<RestText />
<div class="container">
<p>
Have a look at the default styles and read more about how to integrate it to your website or
app here:
</p>
<p style="margin: 20px auto;"><a href="/quick_start">Quick Start Guide</a></p>
<Donate />
<RestText />
</div>
</Layout>

1
website/src/pages/privacy.md
View File

@@ -1,6 +1,7 @@
---
layout: '../layouts/Layout.astro'
title: 'Privacy Policy'
container: true
---
# OpenFreeMap and your data

70
website/src/pages/quick_start.astro
View File

@@ -15,7 +15,7 @@ import Donate from '../components/Donate.astro'
<Layout title="OpenFreeMap Quick Start Guide">
<Logo title="OpenFreeMap Quick Start Guide" />
<div style="margin-top:30px; margin-bottom: 30px;">
<div class="container" style="margin-top:30px; margin-bottom: 30px;">
<p>
This guide provides step-by-step instructions for integrating OpenFreeMap into your website or
mobile application.
@@ -28,44 +28,46 @@ import Donate from '../components/Donate.astro'
<Map showStyleURL={true} />
<MaplibreText />
<MapboxText />
<LeafletText />
<MobileText />
<CustomStylesText />
<SelfHostingText />
<div class="container">
<MaplibreText />
<MapboxText />
<LeafletText />
<MobileText />
<CustomStylesText />
<SelfHostingText />
<Donate />
<Donate />
</div>
</Layout>
<style>
.col-lbl {
display: block;
cursor: pointer;
color: #333;
}
<!--<style>-->
<!-- .col-lbl {-->
<!-- display: block;-->
<!-- cursor: pointer;-->
<!-- color: #333;-->
<!-- }-->
.col-chk {
display: none;
}
<!-- .col-chk {-->
<!-- display: none;-->
<!-- }-->
.col-lbl:before {
content: '►';
margin-right: 1em;
color: #555;
font-size: 0.8em;
}
<!-- .col-lbl:before {-->
<!-- content: '►';-->
<!-- margin-right: 1em;-->
<!-- color: #555;-->
<!-- font-size: 0.8em;-->
<!-- }-->
.col-cnt {
display: none;
margin: 1em 0 2em;
}
<!-- .col-cnt {-->
<!-- display: none;-->
<!-- margin: 1em 0 2em;-->
<!-- }-->
.col-chk:checked ~ .col-cnt {
display: block;
}
<!-- .col-chk:checked ~ .col-cnt {-->
<!-- display: block;-->
<!-- }-->
.col-chk:checked ~ .col-lbl:before {
content: '▼';
}
</style>
<!-- .col-chk:checked ~ .col-lbl:before {-->
<!-- content: '▼';-->
<!-- }-->
<!--</style>-->

1
website/src/pages/tos.md
View File

@@ -1,6 +1,7 @@
---
layout: '../layouts/Layout.astro'
title: 'Terms of Services'
container: true
---
# TERMS OF SERVICES

77
website/src/styles/global.css
View File

@@ -8,24 +8,16 @@ body {
color: #000;
}
.static,
h1,
h2,
h3,
h4,
h5,
h6,
.col-lbl,
p,
.button-container,
#support-plans-slider {
margin-left: 40px;
margin-right: 40px;
@media (max-width: 550px) {
body {
padding-bottom: 40px;
}
}
.static {
.container {
max-width: 600px;
margin: 0 auto;
padding: 20px;
}
h1,
@@ -36,8 +28,8 @@ h5,
h6,
.col-lbl {
color: #333;
max-width: 600px;
margin: 1em auto 0.5em;
margin-top: 1em;
margin-bottom: 0.5em;
line-height: 1.2;
font-family: Seravek, 'Gill Sans Nova', Ubuntu, Calibri, 'DejaVu Sans', source-sans-pro, sans-serif;
font-weight: bold;
@@ -63,16 +55,9 @@ h1 {
text-align: center;
}
/*.subtitle {*/
/* text-align: center;*/
/* font-style: italic;*/
/* color: #333;*/
/* margin-top: 1em;*/
/*}*/
.footer {
max-width: 600px;
margin: 3em auto 0;
margin-top: 3em;
display: flex;
justify-content: space-evenly;
}
@@ -85,12 +70,12 @@ h1 {
p,
ul {
max-width: 600px;
margin: 0 auto 0.6em;
margin-bottom: 0.6em;
}
pre {
max-width: 600px;
margin: 0 auto 0.6em;
margin-bottom: 0.6em;
font-size: 14px;
padding: 7px 14px;
}
@@ -106,29 +91,19 @@ hr {
margin: 2em 0;
}
@media (max-width: 550px) {
body {
padding-bottom: 40px;
}
.static,
h1,
h2,
h3,
h4,
h5,
h6,
.col-lbl,
p,
.button-container,
#support-plans-slider {
max-width: 100%;
margin-left: 20px;
margin-right: 20px;
}
#map-container {
height: 300px;
}
}
/*@media (max-width: 620px) {*/
/* .static,*/
/* h1,*/
/* h2,*/
/* h3,*/
/* h4,*/
/* h5,*/
/* h6,*/
/* p,*/
/* .button-container {*/
/* max-width: 100%;*/
/* margin-left: 20px;*/
/* margin-right: 20px;*/
/* }*/
/*}*/