Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

HTML Preview Template #61

Open
extratone opened this issue May 17, 2022 · 1 comment
Open

HTML Preview Template #61

extratone opened this issue May 17, 2022 · 1 comment
Assignees
@extratone
Labels
automation big Feature-length, beauty-bitch type shit. configuration dev Development! documentation Improvements or additions to documentation migration Movin'. refinement Making things pretty. style Themes

Comments

@extratone
Copy link
Owner

1.4

<!DOCTYPE html>
<html dir="auto">

<head>
  <title>[[safe_title]]</title>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <style>
    @charset "utf-8";

    :root {
      --main-bg-color: #000056;
      --main-color: #ffe8bd;
      --alternate-bg-color: #1c0021;
      --alternate-color: #fff4e6;
      --main-border-color: #f43f32;
        --link-color: #36fd63;
    }

    @media (prefers-color-scheme: dark) {
      :root {
        --main-bg-color: #fff4e6;
        --main-color: #00006b;
        --alternate-bg-color: #fffdeb;
        --alternate-color: #1c0021;
        --main-border-color: #f43f32;
          --link-color: #ff0000;
      }
    }

    html {
      font-size: 100%;
      font-family: -apple-system, BlinkMacSystemFont, "helvetica neue", helvetica, roboto, noto, "segoe ui", arial, sans-serif;
      line-height: 1.4;
    }

    body {
      margin: 0;
      padding: 1em;
      background-color: var(--main-bg-color);
      color: var(--main-color);
    }

    @media (max-device-width: 480px) {}

    @media (min-device-width: 481px) {
      body {
        margin: auto;
        max-width: 600px;
      }
    }

    blockquote {
      font-style: italic;
      margin: 1.5em 2em;
      padding: 1em;
      background-color: var(--alternate-bg-color);
      color: var(--alternate-color);
    }

    a {
      color: var(--link-color);
    }
    pre {
      display: block;
      overflow: scroll;
      width: 100%;
      background-color: var(--alternate-bg-color);
      padding: .5em 1em;
      margin: 1em 0;
    }

    code {
      background-color: var(--alternate-bg-color);
      color: var(--alternate-color);
      font-family: Menlo, Courier, sans-serif;
      padding: 2px 3px;
    }

    table {
      margin: 1.5em 0;
      border: 1px solid var(--main-border-color);
      border-collapse: collapse;
    }

    th {
      padding: .25em .5em;
      background: var(--alternate-bg-color);
      border: 1px solid var(--main-border-color);
    }

    td {
      padding: .25em .5em;
      border: 1px solid var(--main-border-color);
    }

    img {
      max-width: 90%;
    }
    footer {
      font-size: 9px;
    }
  </style>
</head>

<body>
  %%[[draft]]%%
</body>

<footer>
<p><a href="https://twitter.com/NeoYokel">Twitter</a> - <a href="https://mastodon.social/@DavidBlue">Mastodon</a> - <a href="https://t.me/davidblue">Telegram</a> - <a href="[[draft_open_url]]">Local</a></p><code>[[latitude]]∆[[longitude]]-[[date|%m%d%Y-%H%M%S]]</code>
</footer>
</html>
@extratone extratone added documentation Improvements or additions to documentation configuration style Themes dev Development! big Feature-length, beauty-bitch type shit. refinement Making things pretty. migration Movin'. automation labels May 17, 2022
@extratone extratone self-assigned this May 17, 2022
@extratone extratone pinned this issue May 17, 2022
extratone added a commit that referenced this issue May 17, 2022
@extratone
#61
2556c8a
extratone added a commit that referenced this issue May 17, 2022
@extratone
#61
53587a0
extratone added a commit that referenced this issue Aug 18, 2022
@extratone
#61
b588f53
extratone added a commit that referenced this issue Aug 20, 2022
@extratone
#61
c1bf2b6
extratone added a commit that referenced this issue Sep 8, 2022
@extratone
#61
a91bb54
@extratone extratone changed the title Actions HTML Template HTML Preview Template Sep 9, 2022
@extratone
Copy link
Owner Author

1.7

<!DOCTYPE html>
<html dir="auto">
	<head>
		<title>[[safe_title]]</title>
		<meta charset="UTF-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1" />
		<style>
			@import url("https://use.typekit.net/vxn4qnp.css");
			@charset "utf-8";

			:root {
				--main-bg-color: #fff4e6;
				--main-color: #000000;
				--alternate-bg-color: #fffdeb;
				--alternate-color: #00006b;
				--main-border-color: #f43f32;
				--link-color: #ff0000;
			}

			@media (prefers-color-scheme: dark) {
				:root {
					--main-bg-color: #020003;
					--main-color: #ffe8bd;
					--alternate-bg-color: #000056;
					--alternate-color: #fff4e6;
					--main-border-color: #f43f32;
					--link-color: #36fd63;
				}
			}

			html {
				font-size: 100%;
				/* font-family: adobe-caslon-pro, serif; */
				font-family: aktiv-grotesk, sans-serif;
				font-weight: 400;
				font-weight: 400;
				/* font-style: normal; */
				line-height: 1.4;
			}

			body {
				margin: 0;
				padding: 0.6em;
				background-color: var(--main-bg-color);
				color: var(--main-color);
			}

			@media (max-device-width: 480px) {
			}

			@media (min-device-width: 481px) {
				body {
					margin: auto;
					max-width: 600px;
				}
			}

			blockquote {
				font-family: aktiv-grotesk, sans-serif;
				font-weight: 300;
				font-style: italic;
				margin: 1.5em 1.5em;
				padding: 1em;
				background-color: var(--alternate-bg-color);
				color: var(--alternate-color);
			}

			a {
				color: var(--link-color);
			}
			pre {
				display: block;
				overflow: scroll;
				width: 100%;
				background-color: var(--alternate-bg-color);
				padding: 0.5em 1em;
				margin: 1em 0;
			}

			code {
				background-color: var(--alternate-bg-color);
				color: var(--alternate-color);
				font-family: aktiv-grotesk, sans-serif;
				font-weight: 300;
				padding: 2px 3px;
			}

			table {
				font-family: aktiv-grotesk, sans-serif;
				font-weight: 400;
				margin: 1.5em 0;
				border: 1px solid var(--main-border-color);
				border-collapse: collapse;
			}

			th {
				padding: 0.25em 0.5em;
				background: var(--alternate-bg-color);
				border: 1px solid var(--main-border-color);
			}

			td {
				padding: 0.25em 0.5em;
				border: 1px solid var(--main-border-color);
			}

			img {
				max-width: 96%;
			}
			footer {
				font-family: aktiv-grotesk-condensed, sans-serif;
				font-weight: 700;
				font-size: 9px;
			}
		</style>
		<script note="" src="https://cdn.jsdelivr.net/gh/Blogger-Peer-Review/quotebacks@1/quoteback.js"></script>
	</head>

	<body>
		%%[[draft]]%%
		<footer>
			<p>
				<a href="https://davidblue.wtf/drafts">Index</a> - <a href="https://twitter.com/NeoYokel">Twitter</a> -
				<a href="https://mastodon.social/@DavidBlue">Mastodon</a> -
				<a href="https://t.me/davidblue">Telegram</a> - <a href="tel:+15738234380">Telephone</a> -
				<a href="[[draft_open_url]]">Local</a>
			</p>
			<code>[[latitude]]∆[[longitude]]-[[date|%m%d%Y-%H%M%S]]</code>
		</footer>
	</body>
</html>

extratone added a commit that referenced this issue Oct 5, 2022
@extratone
#61
1e9600b 
Version 1.7 of the HTML template simply adds a `tel:`-formatted link to
my personal phone number to the footer.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@extratone extratone

Labels
automation big Feature-length, beauty-bitch type shit. configuration dev Development! documentation Improvements or additions to documentation migration Movin'. refinement Making things pretty. style Themes
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
1 participant
@extratone