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

css

Browse Source
This commit is contained in:
Zsolt Ero
2024-06-13 19:07:28 +02:00
parent f0678822d9
commit ea11cdbe4b
8 changed files with 139 additions and 142 deletions
Download Patch File Download Diff File Expand all files Collapse all files

83
website/src/components/Donate.astro
View File

@@ -14,86 +14,3 @@ import { Content as DonateText } from '../content/index/donate.md'
<script is:inline src="https://unpkg.com/nouislider@15.7.1/dist/nouislider.min.js"></script>
<script is:inline src="/scripts/donate.js"></script>
<style>
#support-plans-slider {
max-width: 600px;
margin: 200px auto 150px;
}
@media (max-width: 550px) {
#support-plans-slider {
max-width: 98%;
margin: 170px auto 120px;
}
}
.noUi-connects {
cursor: pointer;
}
.noUi-value {
line-height: 0;
margin-top: 32px;
font-size: 30px;
transition: font-size 0.3s ease;
cursor: pointer;
}
.noUi-value.active {
font-size: 45px;
}
.noUi-marker-horizontal.noUi-marker-large {
height: 5px;
}
.noUi-marker-horizontal.noUi-marker {
margin-left: 0;
width: 1px;
}
.noUi-tooltip {
border-color: #ccc;
border-radius: 10px;
padding: 10px;
}
.noUi-tooltip.first {
left: 0;
transform: unset;
}
.noUi-tooltip.last {
right: 0;
left: unset;
transform: unset;
}
.plan-name {
font-weight: bold;
margin-bottom: 10px;
}
.plan-link {
display: block;
text-decoration: none;
color: white;
font-weight: bold;
letter-spacing: 0.05rem;
font-size: 15px;
border-radius: 20px;
padding: 6px 16px;
margin-top: 15px;
background: linear-gradient(32deg, #03a9f4, transparent) #f441a5;
transition: background-color 1s;
}
.plan-link:hover,
.plan-link:focus {
background-color: #fdb900;
}
</style>

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

@@ -5,7 +5,7 @@ interface Props {
const { title } = Astro.props
import '../styles/global.css'
import '../styles/_style.css'
---
<!doctype html>
@@ -29,7 +29,6 @@ import '../styles/global.css'
<link href="https://unpkg.com/maplibre-gl/dist/maplibre-gl.css" rel="stylesheet" />
<link href="https://unpkg.com/nouislider@15.7.1/dist/nouislider.min.css" rel="stylesheet" />
<!--<link href="https://unpkg.com/prismjs@1.29.0/themes/prism.min.css" rel="stylesheet" />-->
</head>
<body>

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

@@ -23,7 +23,4 @@ import { Content as RestText } from '../content/index/rest.md'
<Donate />
<RestText />
<!--<script src="https://unpkg.com/prismjs@1.29.0/components/prism-core.min.js"></script>-->
<!--<script src="https://unpkg.com/prismjs@1.29.0/plugins/autoloader/prism-autoloader.min.js"></script>-->
</Layout>

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

@@ -9,6 +9,7 @@ import { Content as MobileText } from '../content/how_to_use/mobile.md'
import { Content as CustomStylesText } from '../content/how_to_use/custom_styles.md'
import { Content as SelfHostingText } from '../content/how_to_use/self_hosting.md'
import Logo from '../components/Logo.astro'
import Donate from '../components/Donate.astro'
---
<Layout title="OpenFreeMap Quick Start Guide">
@@ -33,6 +34,8 @@ import Logo from '../components/Logo.astro'
<MobileText />
<CustomStylesText />
<SelfHostingText />
<Donate />
</Layout>
<style>

3
website/src/styles/_style.css Normal file
View File

@@ -0,0 +1,3 @@
@import "reset.css";
@import "donate.css";
@import "global.css";

80
website/src/styles/donate.css Normal file
View File

@@ -0,0 +1,80 @@
#support-plans-slider {
max-width: 600px;
margin: 200px auto 150px;
}
@media (max-width: 550px) {
#support-plans-slider {
max-width: 98%;
margin: 170px auto 120px;
}
}
.plan-name {
font-weight: bold;
margin-bottom: 10px;
}
.plan-link {
display: block;
text-decoration: none;
color: white;
font-weight: bold;
letter-spacing: 0.05rem;
font-size: 15px;
border-radius: 20px;
padding: 6px 16px;
margin-top: 15px;
background: linear-gradient(32deg, #03a9f4, transparent) #f441a5;
transition: background-color 1s;
}
.plan-link:hover,
.plan-link:focus {
background-color: #fdb900;
}
/* noUI slider customizations */
.noUi-connects {
cursor: pointer;
}
.noUi-value {
line-height: 0;
margin-top: 32px;
font-size: 30px;
transition: font-size 0.3s ease;
cursor: pointer;
}
.noUi-value.active {
font-size: 45px;
}
.noUi-marker-horizontal.noUi-marker-large {
height: 5px;
}
.noUi-marker-horizontal.noUi-marker {
margin-left: 0;
width: 1px;
}
.noUi-tooltip {
border-color: #ccc;
border-radius: 10px;
padding: 10px;
}
.noUi-tooltip.first {
left: 0;
transform: unset;
}
.noUi-tooltip.last {
right: 0;
left: unset;
transform: unset;
}

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

@@ -1,55 +1,3 @@
/*
Josh's Custom CSS Reset
https://www.joshwcomeau.com/css/custom-css-reset/
*/
*,
*::before,
*::after {
box-sizing: border-box;
}
* {
margin: 0;
}
img,
picture,
video,
canvas,
svg {
display: block;
max-width: 100%;
}
input,
button,
textarea,
select {
font: inherit;
}
/* normalize.css */
button {
font-family: inherit;
font-size: 100%;
line-height: 1.15;
overflow: visible;
text-transform: none;
-webkit-appearance: button;
}
button::-moz-focus-inner {
border-style: none;
padding: 0;
}
button:-moz-focusring {
outline: 1px dotted ButtonText;
}
/* --- start --- */
body {
padding-bottom: 100px;
line-height: 1.5;
@@ -91,8 +39,7 @@ h6,
max-width: 600px;
margin: 1em auto 0.5em;
line-height: 1.2;
font-family: Seravek, 'Gill Sans Nova', Ubuntu, Calibri, 'DejaVu Sans', source-sans-pro,
sans-serif;
font-family: Seravek, 'Gill Sans Nova', Ubuntu, Calibri, 'DejaVu Sans', source-sans-pro, sans-serif;
font-weight: bold;
}
@@ -184,3 +131,4 @@ hr {
height: 300px;
}
}

50
website/src/styles/reset.css Normal file
View File

@@ -0,0 +1,50 @@
/*
Josh's Custom CSS Reset
https://www.joshwcomeau.com/css/custom-css-reset/
*/
*,
*::before,
*::after {
box-sizing: border-box;
}
* {
margin: 0;
}
img,
picture,
video,
canvas,
svg {
display: block;
max-width: 100%;
}
input,
button,
textarea,
select {
font: inherit;
}
/* normalize.css */
button {
font-family: inherit;
font-size: 100%;
line-height: 1.15;
overflow: visible;
text-transform: none;
-webkit-appearance: button;
}
button::-moz-focus-inner {
border-style: none;
padding: 0;
}
button:-moz-focusring {
outline: 1px dotted ButtonText;
}