mirror of
https://github.com/jackyzha0/quartz.git
synced 2025-12-27 14:54:05 -06:00
Merge pull request #19 from fleetingnotes/john-ui-improvements
John UI improvements
This commit is contained in:
Matthew Wong
GitHub
commit
c4be465c9e
@ -7,7 +7,7 @@
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6, ol, ul, thead {
|
||||
font-family: Inter;
|
||||
font-family: Poppins;
|
||||
color: var(--dark);
|
||||
font-weight: revert;
|
||||
margin: revert;
|
||||
@ -228,7 +228,7 @@ a {
|
||||
color: var(--secondary);
|
||||
|
||||
&:hover {
|
||||
color: var(--tertiary) !important;
|
||||
color: var(--secondary-active) !important;
|
||||
}
|
||||
}
|
||||
|
||||
@ -292,6 +292,16 @@ hr {
|
||||
}
|
||||
|
||||
.singlePage {
|
||||
|
||||
.index-container {
|
||||
width: 160%;
|
||||
margin-left: -30%;
|
||||
@media all and (max-width: 1200px) {
|
||||
width: 100%;
|
||||
margin-left: 0;
|
||||
}
|
||||
padding: 0 16px;
|
||||
}
|
||||
padding: 4em 25vw;
|
||||
|
||||
@media all and (max-width: 1200px) {
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
:root {
|
||||
--light: #faf8f8;
|
||||
--dark: #141021;
|
||||
--secondary: #284b63;
|
||||
// --secondary: #284b63;
|
||||
--tertiary: #84a59d;
|
||||
--visited: #afbfc9;
|
||||
--primary: #f28482;
|
||||
@ -14,11 +14,13 @@
|
||||
[saved-theme="dark"] {
|
||||
--light: #1e1e21 !important;
|
||||
--dark: #fbfffe !important;
|
||||
--secondary: #6b879a !important;
|
||||
// --secondary: #6b879a !important;
|
||||
--secondary: #06b6d4 !important;
|
||||
--secondary-active: #00c7eb;
|
||||
--visited: #4a575e !important;
|
||||
--tertiary: #84a59d !important;
|
||||
--primary: #f58382 !important;
|
||||
--gray: #d4d4d4 !important;
|
||||
--lightgray: #292633 !important;
|
||||
--outlinegray: #343434 !important;
|
||||
}
|
||||
}
|
||||
|
||||
99
assets/styles/index.scss
Normal file
99
assets/styles/index.scss
Normal file
@ -0,0 +1,99 @@
|
||||
.index-container {
|
||||
margin-top: 64px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding-top: 32px;
|
||||
}
|
||||
.hero {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 24px;
|
||||
&-title {
|
||||
text-align: center;
|
||||
font-size: 48px;
|
||||
font-weight: 600;
|
||||
margin: 4px 4px;
|
||||
}
|
||||
&-subtitle {
|
||||
text-align: center;
|
||||
font-size: 32px;
|
||||
font-weight: 600;
|
||||
margin: 4px 4px;
|
||||
}
|
||||
&-text {
|
||||
text-align: center;
|
||||
font-size: 20px;
|
||||
font-weight: 600;
|
||||
margin: 4px 4px;
|
||||
}
|
||||
}
|
||||
|
||||
.embed {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-top: 8px;
|
||||
gap: 32px;
|
||||
}
|
||||
|
||||
.feature {
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
&-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 64px;
|
||||
@media all and (max-width: 780px) {
|
||||
gap: 32px;
|
||||
}
|
||||
}
|
||||
|
||||
&-title {
|
||||
font-size: 48px;
|
||||
font-weight: 600;
|
||||
margin: 12px 4px;
|
||||
@media all and (max-width: 780px) {
|
||||
font-size: 32px;
|
||||
}
|
||||
}
|
||||
|
||||
&-subtitle {
|
||||
font-size: 30px;
|
||||
font-weight: 600;
|
||||
margin: 4px 4px;
|
||||
@media all and (max-width: 780px) {
|
||||
font-size: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
&-image {
|
||||
height: inherit;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
&-list {
|
||||
li {
|
||||
color: white;
|
||||
font-size: 20px;
|
||||
font-weight: 600;
|
||||
margin: 4px 4px;
|
||||
@media all and (max-width: 780px) {
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&-big {
|
||||
//flex grow ratio 1:2
|
||||
flex-grow: 2;
|
||||
}
|
||||
&-small {
|
||||
//flex grow ratio 1:2
|
||||
flex-grow: 1;
|
||||
}
|
||||
}
|
||||
@ -1,65 +1,159 @@
|
||||
$base-color: rgb(20, 20, 20);
|
||||
$base-color-light: rgb(104, 104, 104);
|
||||
$primary-color: rgb(40, 75, 98);
|
||||
$secondary-color: var(--secondary);
|
||||
$secondary-color-active: var(--secondary-active);
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
/* Create three columns of equal width */
|
||||
.pricing-columns {
|
||||
float: left;
|
||||
width: 50%;
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
/* Style the list */
|
||||
.price {
|
||||
list-style-type: none;
|
||||
border: 1px solid #eee;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
-webkit-transition: 0.3s;
|
||||
transition: 0.3s;
|
||||
}
|
||||
|
||||
/* Add shadows on hover */
|
||||
.price:hover {
|
||||
box-shadow: 0 8px 12px 0 rgba(0,0,0,0.2)
|
||||
}
|
||||
|
||||
/* Pricing header */
|
||||
.price .header {
|
||||
background-color: #111;
|
||||
color: white;
|
||||
font-size: 25px;
|
||||
}
|
||||
|
||||
/* List items */
|
||||
.price li {
|
||||
border-bottom: 1px solid #eee;
|
||||
padding: 20px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.plan-page {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
&-text {
|
||||
text-align: center;
|
||||
margin: 4px 0;
|
||||
}
|
||||
|
||||
/* Grey list item */
|
||||
.price .grey {
|
||||
background-color: #eee;
|
||||
}
|
||||
|
||||
.plan-title {
|
||||
font-size: 48px;
|
||||
font-weight: 600;
|
||||
margin: 4px 4px;
|
||||
}
|
||||
|
||||
/* Style the list */
|
||||
.plan-list {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
-webkit-transition: 0.3s;
|
||||
transition: 0.3s;
|
||||
}
|
||||
|
||||
.plan-container {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
gap: 40px;
|
||||
//flex-direction colunn for mobile
|
||||
@media (max-width: 600px) {
|
||||
flex-direction: column;
|
||||
gap: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
/* Pricing header */
|
||||
.plan {
|
||||
height: 560px;
|
||||
width: 400px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
border-radius: 24px;
|
||||
padding: 0 0 40px 0;
|
||||
gap: 32px;
|
||||
margin-top: 32px;
|
||||
background-color: $base-color;
|
||||
transition: filter 0.5s;
|
||||
|
||||
&-header {
|
||||
width: 100%;
|
||||
border-radius: 24px 24px 0px 0px;
|
||||
background-color: $primary-color;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
// border-bottom: solid white;
|
||||
// border-width: 4px;
|
||||
}
|
||||
&-label {
|
||||
margin-bottom: 0px;
|
||||
color: white;
|
||||
filter: drop-shadow(0 0 2px black);
|
||||
font-size: 28px;
|
||||
}
|
||||
&-price {
|
||||
font-size: 20px;
|
||||
color: black;
|
||||
}
|
||||
|
||||
/* The "Sign Up" button */
|
||||
.button {
|
||||
background-color: #284b63;
|
||||
border: none;
|
||||
color: white;
|
||||
padding: 10px 25px;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
font-size: 18px;
|
||||
filter: drop-shadow(0 0 2px black);
|
||||
}
|
||||
|
||||
&-body {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 16px;
|
||||
width: 100%;
|
||||
padding: 0 24px;
|
||||
}
|
||||
|
||||
&-list {
|
||||
width: 100%;
|
||||
background-color: $base-color;
|
||||
display: flex;
|
||||
list-style-type: none;
|
||||
flex-direction: column;
|
||||
gap: 12px;
|
||||
font-size: 1em;
|
||||
li {
|
||||
margin: 0px 24px;
|
||||
}
|
||||
li:before {
|
||||
content: "\2713";
|
||||
display: inline-block;
|
||||
color: green;
|
||||
padding: 0 6px 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
/* Change the width of the three columns to 100%
|
||||
&:hover {
|
||||
|
||||
filter: drop-shadow(0 0 8px black);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* Grey list item */
|
||||
.price .grey {
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
/* The "Sign Up" button */
|
||||
.button {
|
||||
background-color: #284b63;
|
||||
border-radius: 8px;
|
||||
color: white;
|
||||
padding: 10px 25px;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
font-size: 18px;
|
||||
&:hover{
|
||||
background-color: #356483;
|
||||
color: white !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* Change the width of the three columns to 100%
|
||||
(to stack horizontally on small screens) */
|
||||
@media only screen and (max-width: 600px) {
|
||||
.pricing-columns {
|
||||
width: 100%;
|
||||
@media only screen and (max-width: 600px) {
|
||||
.pricing-columns {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.premium {
|
||||
background-color: $secondary-color;
|
||||
&-btn {
|
||||
background-color: $secondary-color;
|
||||
&:hover{
|
||||
background-color: $secondary-color-active;
|
||||
color: white !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -2,41 +2,126 @@
|
||||
id: home
|
||||
title: Home
|
||||
---
|
||||
<div class="row" style="margin-top: 2em; margin-bottom: 2em">
|
||||
<article class="col-6">
|
||||
<h1 id="quick-notes-arent-quick-in-obsidian" style="margin: 0">Quick Notes aren't "[[posts/put-quick-notes-into-obsidian-from-anywhere|quick]]" in Obsidian</h1>
|
||||
<p>Take speedy notes in a browser extension, a mobile app, or a web app and [[posts/sync-fleeting-notes-with-obsidian|sync the notes with Obsidian]].</p>
|
||||
<div style="display: flex; justify-content: center; margin-bottom: 16px">
|
||||
<a href="/download" class="button">Try it free</a>
|
||||
</div>
|
||||
</article>
|
||||
<div class="col-6">
|
||||
{{< youtube iXLyEvTZp9I >}}
|
||||
|
||||
<article class="index-container">
|
||||
<div class="hero">
|
||||
<h1 class="hero-title" >Quick Notes Aren't "[[posts/put-quick-notes-into-obsidian-from-anywhere|Quick]]" Enough in Obsidian</h1>
|
||||
<p style="width: 80%" class="hero-subtitle">Take [[posts/writing-connected-and-personalized-blogs/|linked]] and speedy notes in a browser extension, a mobile app, or a web app and [[posts/sync-fleeting-notes-with-obsidian|sync the notes with Obsidian]].</p>
|
||||
<p class="hero-subtitle">How speedy? Try it yourself:</p>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="embed">
|
||||
<style scoped>
|
||||
.embed-size {
|
||||
width: 1000px;
|
||||
height: 600px;
|
||||
}
|
||||
@media (max-width: 1024px) {
|
||||
.embed-size {
|
||||
width: 600px;
|
||||
height: 400px;
|
||||
}
|
||||
}
|
||||
@media (max-width: 768px) {
|
||||
.embed-size {
|
||||
width: 600px;
|
||||
height: 400px;
|
||||
}
|
||||
}
|
||||
@media (max-width: 640px) {
|
||||
.embed-size {
|
||||
width: 320px;
|
||||
height: 400px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<iframe id=flutter-container class="embed-size" width=800 height=500 src="https://my.fleetingnotes.app/" ></iframe>
|
||||
<div style="display: flex; justify-content: center; margin-bottom: 16px">
|
||||
<a href="/download" class="button premium-btn">Try the webapp instead</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row" style="margin-top: 2em; margin-bottom: 2em;">
|
||||
</div>
|
||||
</div>
|
||||
<div class="feature-container">
|
||||
<div class="feature">
|
||||
<div class="row">
|
||||
<div class="col-7">
|
||||
<h2 class="feature-title">Capture Ideas Anytime, Anywhere</h2>
|
||||
<p class="feature-subtitle">Create and sync your fleeting notes on different platforms:</p>
|
||||
<ul class="feature-list">
|
||||
<li>Highlight and save using the <a href="https://chrome.google.com/webstore/detail/fleeting-notes/gcplhmogdjioeaenmehmapbdonklmdnc">Chrome</a> or <a href="https://addons.mozilla.org/en-CA/firefox/addon/fleeting-notes/">Firefox</a> extension</li>
|
||||
<li>Take notes on the go with the <a href="https://apps.apple.com/gb/app/fleeting-notes/id1615226800">iOS</a> or <a href="https://play.google.com/store/apps/details?id=com.fleetingnotes">Android</a> app</li>
|
||||
<li>Access your notes on any device using the <a href="https://my.fleetingnotes.app/">web app</a> or <a href="https://youtu.be/jausylB4Pzw">pop-out window</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-5">
|
||||
<img height="300" class="feature-img" src="svg/sync.svg"></img>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="feature">
|
||||
<div class="row">
|
||||
<div class="col-5">
|
||||
<img height="300" class="feature-img" src="svg/links.svg"></img>
|
||||
</div>
|
||||
<div class="col-7">
|
||||
<h2 class="feature-title">Keep track of any source</h2>
|
||||
<p class="feature-subtitle">From links to images to files</p>
|
||||
<ul class="feature-list">
|
||||
<li>Cloud hosting for attachments</li>
|
||||
<li>Take notes side by side</li>
|
||||
<li>Automatically [[posts/best-in-browser-note-taking-and-web-clipping-app-for-obsidian|include URLs]] upon note creation</li>
|
||||
<li>Include [[posts/best-way-to-take-youtube-notes-for-obsidian|YouTube timestamps]] when watching on the web</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="feature">
|
||||
<div class="row feature-row">
|
||||
<div class="col-7">
|
||||
<h2 class="feature-title">Made for Obsidian MD</h2>
|
||||
<p class="feature-subtitle">Use the [[posts/sync-fleeting-notes-with-obsidian|Fleeting Notes plugin]] to sync and process notes</p>
|
||||
<ul class="feature-list">
|
||||
<li>[[notes/How to copy Obsidian links to Fleeting Notes|Import your wikilinks]] and start connecting your notes</li>
|
||||
<li>Choose your syncing type (delete after sync, two-way)</li>
|
||||
<li>Run commmands to show unprocessed or same-source notes</li>
|
||||
<li>Customize your own import note template with metadata</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-5">
|
||||
{{< youtube iXLyEvTZp9I >}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="feature">
|
||||
<div class="row">
|
||||
<div class="col-5">
|
||||
<img height="300" class="feature-img" src="svg/secure_file.svg"></img>
|
||||
</div>
|
||||
<div class="col-7">
|
||||
<h2 class="feature-title">Control Your Notes</h2>
|
||||
<p class="feature-subtitle">We value your privacy and security :)</p>
|
||||
<ul class="feature-list">
|
||||
<li>[[/posts/end-to-end-encryption-in-fleeting-notes|Enable end-to-end encryption]]</a></li>
|
||||
<li>100% of your notes are stored locally with optional sync</li>
|
||||
<li>[[posts/shared-connected-notes|Share links]] to your notes with anyone</li>
|
||||
<li>Export all notes into Markdown or JSON</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<div class="">
|
||||
<h1>What our users say:</h1>
|
||||
<script type="text/javascript" src="https://testimonial.to/js/iframeResizer.min.js"></script>
|
||||
<iframe id="testimonialto-carousel-all-fleeting-notes-testimonial-light" src="https://embed.testimonial.to/carousel/all/fleeting-notes-testimonial?theme=light&autoplay=off&showmore=off&one-row=off&same-height=off" frameborder="0" scrolling="no" width="100%"></iframe>
|
||||
<script type="text/javascript">iFrameResize({log: false, checkOrigin: false}, "#testimonialto-carousel-all-fleeting-notes-testimonial-light");</script>
|
||||
</div>
|
||||
|
||||
## Features:
|
||||
### Quick capture. Anywhere.
|
||||
Capture notes anywhere with an array of supported platforms and built-in sync between all platforms.
|
||||
- Chrome & Firefox extension
|
||||
- Android & iOS app
|
||||
- Web app
|
||||
- Desktop app (coming soon)
|
||||
- Safari extension (coming soon)
|
||||
|
||||
### Full control of your notes
|
||||
Keep a backup of your notes or sync with other note-taking applications
|
||||
- 100% of your notes are stored locally with optional sync
|
||||
- [[posts/end-to-end-encryption-in-fleeting-notes|Support for end-to-end encryption]]
|
||||
- [[posts/sync-fleeting-notes-with-obsidian|Sync notes with Obsidian]]
|
||||
- Export all notes in Markdown or JSON
|
||||
|
||||
### Find notes easily
|
||||
The combination of full-text search and linking makes it easy to find any note. Either search for the note or [[notes/following a train of thought|follow a trail of linked notes]].
|
||||
- Links and backlinks
|
||||
- Full-text search
|
||||
- History of traversed notes
|
||||
|
||||
## Questions? Contact Me.
|
||||
- Email me at: ithinkwong@gmail.com
|
||||
- Join the [discord channel](https://discord.gg/xrj6yuGNmx)
|
||||
<div>
|
||||
<h1>Got any questions? We're here to help.</h1>
|
||||
<p>Email us at fleetingnotesapp@gmail.com</p>
|
||||
<p>Join the <a href="https://discord.gg/xrj6yuGNmx">Discord channel</a> to get in touch with the team and other users.</p>
|
||||
|
||||
@ -1,6 +1,3 @@
|
||||
---
|
||||
title: Pricing
|
||||
---
|
||||
Fleeting Notes will always be **100% free offline**. If you're interested in accessing insider builds, [donating](https://ko-fi.com/fleetingnotes) will give you access to those.
|
||||
|
||||
{{< pricing-tables >}}
|
||||
1
content/svg/links.svg
Normal file
1
content/svg/links.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" width="761" height="700.71023" viewBox="0 0 761 700.71023" xmlns:xlink="http://www.w3.org/1999/xlink"><title>link</title><path d="M261.134,348.56808c12.42842,23.049,38.806,32.94351,38.806,32.94351s6.22712-27.47543-6.2013-50.52448-38.806-32.94351-38.806-32.94351S248.70559,325.519,261.134,348.56808Z" transform="translate(-219.5 -99.64489)" fill="#2f2e41"/><path d="M269.67653,340.98511c22.43841,13.49969,31.08016,40.3138,31.08016,40.3138s-27.73812,4.92678-50.17653-8.57291S219.5,332.4122,219.5,332.4122,247.23811,327.48541,269.67653,340.98511Z" transform="translate(-219.5 -99.64489)" fill="#06b6d4"/><path d="M980.5,723.35511c0,24.30053-57.75527,77-129,77s-129-52.69947-129-77,57.75527-11,129-11S980.5,699.05458,980.5,723.35511Z" transform="translate(-219.5 -99.64489)" fill="#3f3d56"/><path d="M980.5,723.35511c0,24.30053-57.75527,77-129,77s-129-52.69947-129-77,57.75527-11,129-11S980.5,699.05458,980.5,723.35511Z" transform="translate(-219.5 -99.64489)" opacity="0.1"/><ellipse cx="632" cy="623.71023" rx="129" ry="44" fill="#3f3d56"/><rect x="76" y="301.71023" width="410" height="234" fill="#f1f1f1"/><ellipse cx="677.5" cy="40.71023" rx="39.5" ry="37" fill="#2f2e41"/><path d="M782,370.85511l-10,14s-48,10-30,25,44-14,44-14l14-18Z" transform="translate(-219.5 -99.64489)" fill="#ffb8b8"/><path d="M834,211.85511s-13,0-16,18-6,78-6,78-42,55-35,62,15,20,20,18,48-61,48-61Z" transform="translate(-219.5 -99.64489)" fill="#06b6d4"/><path d="M834,211.85511s-13,0-16,18-6,78-6,78-42,55-35,62,15,20,20,18,48-61,48-61Z" transform="translate(-219.5 -99.64489)" opacity="0.1"/><path d="M874,160.85511s-1,39-13,41-8,15-8,15,39,23,65,0l5-12s-18-13-10-31Z" transform="translate(-219.5 -99.64489)" fill="#ffb8b8"/><path d="M807,400.85511s-59,110-37,144,55,104,60,104,33-14,31-23-32-76-40-82-4-22-3-23,34-54,34-54-1,84,3,97-1,106,4,110,28,11,32,5,16-97,8-118l15-144Z" transform="translate(-219.5 -99.64489)" fill="#2f2e41"/><path d="M861,667.85511l-25,46s-36,26-11,30,40-6,40-6l22-16v-46Z" transform="translate(-219.5 -99.64489)" fill="#2f2e41"/><path d="M827,641.85511l13,31s5,13,0,16-19,21-10,23a29.29892,29.29892,0,0,0,5.49537.5463,55.56588,55.56588,0,0,0,40.39769-16.43935L884,687.85511s-27.77007-63.94827-27.385-63.47413S827,641.85511,827,641.85511Z" transform="translate(-219.5 -99.64489)" fill="#2f2e41"/><circle cx="679.5" cy="51.21023" r="34" fill="#ffb8b8"/><path d="M918.5,198.35511l-10.5,10.5s-32,12-47,0c0,0,5.5-11.5,5.5-10.5s-43.5,7.5-47.5,25.5,3,49,3,49-28,132-17,135,114,28,113,9,8-97,8-97l35-67s-5-22-17-29S918.5,198.35511,918.5,198.35511Z" transform="translate(-219.5 -99.64489)" fill="#06b6d4"/><path d="M874,393.85511l-13,8s-50,34-24,40,41-24,41-24l10-12Z" transform="translate(-219.5 -99.64489)" fill="#ffb8b8"/><path d="M948,246.85511l9,9s6,84-6,101-67,63-70,60-22-18-18-20,57.18287-57.56942,57.18287-57.56942L916,261.85511Z" transform="translate(-219.5 -99.64489)" opacity="0.1"/><path d="M952,243.85511l9,9s6,84-6,101-67,63-70,60-22-18-18-20,57.18287-57.56942,57.18287-57.56942L920,258.85511Z" transform="translate(-219.5 -99.64489)" fill="#06b6d4"/><path d="M884.93835,102.56024s-11.55751-4.20273-27.31774,4.72807l8.40545,2.10136s-12.60818,1.05069-14.18421,17.8616h5.77876s-3.67739,14.70955,0,18.91228l2.364-4.4654,6.82944,13.65887,1.576-6.82943,3.15205,1.05068,2.10136-11.03216s5.25341,7.88011,9.45614,8.40545v-6.82943s11.55751,13.13353,15.23489,12.60819l-5.25341-7.35478,7.35478,1.576-3.15205-5.25341,18.91228,5.25341-4.20273-5.25341,13.13353,4.20273,6.30409,2.62671s8.9308-20.48831-3.67738-34.67252S896.75852,96.51882,884.93835,102.56024Z" transform="translate(-219.5 -99.64489)" fill="#2f2e41"/><path d="M554.59811,528.43759q-1.25967.794-2.60744,1.47382a30.87649,30.87649,0,0,1-41.42627-13.64933l-6.65209-13.19072,4.465-2.251,6.65209,13.19073a25.84163,25.84163,0,1,0,46.14646-23.27365l-27.93638-55.39357A25.84162,25.84162,0,1,0,487.093,458.61749l9.89088,19.612-4.465,2.251L482.628,460.86852a30.84193,30.84193,0,0,1,55.07639-27.7757l27.93637,55.39356a30.84665,30.84665,0,0,1-11.04267,39.95121Z" transform="translate(-219.5 -99.64489)" fill="#3f3d56"/><path d="M557.3,596.80949q-1.24231.783-2.57748,1.45725a30.87615,30.87615,0,0,1-41.42627-13.64933l-27.93638-55.39356a30.84193,30.84193,0,0,1,55.07639-27.77571L547.77488,516l-4.465,2.251-7.33863-14.55188a25.84162,25.84162,0,1,0-46.14645,23.27365l27.93637,55.39356a25.84163,25.84163,0,1,0,46.14646-23.27365l-9.61614-19.0671,4.465-2.251,9.61614,19.0671A30.88584,30.88584,0,0,1,557.3,596.80949Z" transform="translate(-219.5 -99.64489)" fill="#3f3d56"/><path d="M756.5,637.35511h-462v-257h462Zm-460-2h458v-253h-458Z" transform="translate(-219.5 -99.64489)" fill="#2f2e41"/></svg>
|
||||
|
After Width: | Height: | Size: 4.6 KiB |
1
content/svg/secure_file.svg
Normal file
1
content/svg/secure_file.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 7.3 KiB |
1
content/svg/sync.svg
Normal file
1
content/svg/sync.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 20 KiB |
@ -1,5 +1,5 @@
|
||||
name: Matthew Wong
|
||||
enableToc: true
|
||||
enableToc: false
|
||||
openToc: false
|
||||
enableLinkPreview: true
|
||||
enableLatex: true
|
||||
|
||||
@ -9,9 +9,9 @@
|
||||
{{partial "header.html" .}}
|
||||
<article>
|
||||
{{if .Title}}<h1>{{ .Title }}</h1>{{end}}
|
||||
<p class="meta">
|
||||
<!-- <p class="meta">
|
||||
Last updated {{if ne .Date .Lastmod}}{{ .Lastmod.Format "January 2, 2006" }}{{else}}Unknown{{end}}
|
||||
</p>
|
||||
</p> -->
|
||||
<ul class="tags">
|
||||
{{ range (.GetTerms "tags") }}
|
||||
<li><a href="{{ .Permalink }}">{{ .LinkTitle | humanize }}</a></li>
|
||||
|
||||
@ -28,6 +28,9 @@
|
||||
|
||||
<!-- CSS Stylesheets and Fonts -->
|
||||
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&family=Source+Sans+Pro:wght@400;600;700&family=Fira+Code:wght@400;700&display=swap" rel="stylesheet">
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;600&display=swap" rel="stylesheet">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
|
||||
{{$sass := resources.Match "styles/[!_]*.scss" }}
|
||||
{{$css := slice }}
|
||||
|
||||
@ -1,25 +1,74 @@
|
||||
<div class="row">
|
||||
<div class="col-6">
|
||||
<ul class="price">
|
||||
<li class="header">Free</li>
|
||||
<li class="grey">$ 0 / month<br><br><a href="https://my.fleetingnotes.app/" class="button">Get started</a></li>
|
||||
<li>Unlimited Notes</li>
|
||||
<li>Only 1 device logged in at a time</li>
|
||||
<li><a class="internal-link" href="/posts/end-to-end-encryption-in-fleeting-notes/">End-to-end encryption</a></li>
|
||||
<li>10 GB attachment upload limit</li>
|
||||
<li>Blazing fast full-text search</li>
|
||||
<li>Access to Chrome / Firefox Extension, iOS, Android & Web App</li>
|
||||
<li>Access to <a href="https://github.com/fleetingnotes/fleeting-notes-obsidian">plugin</a> for Obsidian MD sync</li>
|
||||
<div class="plan-page">
|
||||
<h1 class="plan-title">Pricing</h1>
|
||||
<div>
|
||||
<p class="plan-page-text">
|
||||
Fleeting Notes will always be <b>100% free offline.</b>
|
||||
</p>
|
||||
<p class="plan-page-text">
|
||||
If you're interested in accessing insider builds,
|
||||
<a href="https://ko-fi.com/fleetingnotes">donating</a> will give you
|
||||
access to those.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="plan-container">
|
||||
<div class="plan">
|
||||
<div class="plan-header">
|
||||
<h1 class="plan-label">Free</h1>
|
||||
<p class="plan-price">$0/month</p>
|
||||
</div>
|
||||
<div class="plan-body">
|
||||
<ul class="plan-list">
|
||||
<li>Unlimited Notes</li>
|
||||
<li>Only 1 device logged in at a time</li>
|
||||
<li>
|
||||
<a
|
||||
class="internal-link"
|
||||
href="/posts/end-to-end-encryption-in-fleeting-notes/"
|
||||
>End-to-end encryption</a
|
||||
>
|
||||
</li>
|
||||
<li>10 GB attachment upload limit</li>
|
||||
<li>Blazing fast full-text search</li>
|
||||
<li>Browser Extension (Chrome, Firefox)</li>
|
||||
<li>Android & iOS App</li>
|
||||
<li>
|
||||
Access to
|
||||
<a href="https://github.com/fleetingnotes/fleeting-notes-obsidian"
|
||||
>plugin</a
|
||||
>
|
||||
for Obsidian MD sync
|
||||
</li>
|
||||
</ul>
|
||||
<a href="https://my.fleetingnotes.app/" class="button button-cta"
|
||||
>Get started</a
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<ul class="price">
|
||||
<li class="header">Premium</li>
|
||||
<li class="grey">$6 / month<br><br><a href="https://payments.fleetingnotes.app" class="button">Try it free</a></li>
|
||||
<li><b>Everything on the Free plan, plus</b></li>
|
||||
<li>Unlimited logged in devices</li>
|
||||
<li>25 GB attachment upload limit</li>
|
||||
<li><a class="internal-link" href="/posts/how-ai-powered-links-supercharge-notetaking/">AI powered link suggestions</a></li>
|
||||
<div class="plan">
|
||||
<div class="plan-header premium">
|
||||
<h1 class="plan-label">Premium</h1>
|
||||
<p class="plan-price">$6/month</p>
|
||||
</div>
|
||||
<div class="plan-body">
|
||||
<ul class="plan-list">
|
||||
<li><b>Everything on the Free plan</b></li>
|
||||
<li>Unlimited logged in devices</li>
|
||||
<li>25 GB attachment upload limit</li>
|
||||
<li>
|
||||
<a
|
||||
class="internal-link"
|
||||
href="/posts/how-ai-powered-links-supercharge-notetaking/"
|
||||
>AI powered link suggestions</a
|
||||
>
|
||||
</li>
|
||||
</ul>
|
||||
<a
|
||||
href="https://payments.fleetingnotes.app"
|
||||
class="button button-cta premium-btn"
|
||||
>Try it for free</a
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user