Skip to content

Commit

Permalink
css
Browse files Browse the repository at this point in the history
  • Loading branch information
hyperknot committed Jun 13, 2024
1 parent f067882 commit ea11cdb
Show file tree
Hide file tree
Showing 8 changed files with 139 additions and 142 deletions.
83 changes: 0 additions & 83 deletions website/src/components/Donate.astro
Original file line number Diff line number Diff line change
Expand Up @@ -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 changes: 1 addition & 2 deletions website/src/layouts/Layout.astro
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ interface Props {
const { title } = Astro.props
import '../styles/global.css'
import '../styles/_style.css'
---

<!doctype html>
Expand All @@ -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>
Expand Down
3 changes: 0 additions & 3 deletions website/src/pages/index.astro
Original file line number Diff line number Diff line change
Expand Up @@ -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 changes: 3 additions & 0 deletions website/src/pages/quick_start.astro
Original file line number Diff line number Diff line change
Expand Up @@ -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">
Expand All @@ -33,6 +34,8 @@ import Logo from '../components/Logo.astro'
<MobileText />
<CustomStylesText />
<SelfHostingText />

<Donate />
</Layout>

<style>
Expand Down
3 changes: 3 additions & 0 deletions website/src/styles/_style.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
@import "reset.css";
@import "donate.css";
@import "global.css";
80 changes: 80 additions & 0 deletions website/src/styles/donate.css
Original file line number Diff line number Diff line change
@@ -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 changes: 2 additions & 54 deletions website/src/styles/global.css
Original file line number Diff line number Diff line change
@@ -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;
Expand Down Expand Up @@ -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;
}

Expand Down Expand Up @@ -184,3 +131,4 @@ hr {
height: 300px;
}
}

50 changes: 50 additions & 0 deletions website/src/styles/reset.css
Original file line number Diff line number Diff line change
@@ -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;
}

0 comments on commit ea11cdb

Please sign in to comment.