1
0
mirror of https://github.com/Damillora/Yuika synced 2024-12-04 21:53:46 +00:00

Compare commits

...

7 Commits

9 changed files with 46 additions and 262 deletions

View File

@ -61,9 +61,12 @@ a:hover {
@apply flex flex-row transition duration-300 ease-in-out;
}
.site-head {
@apply flex flex-row flex-grow py-2 items-center transition duration-300 ease-in-out pl-4 h-16;
@apply flex flex-row flex-grow transition duration-300 ease-in-out;
}
.site-head:hover {
.site-head a {
@apply flex flex-row py-2 items-center transition duration-300 ease-in-out h-16 inline-block px-4;
}
.site-head a:hover {
@apply bg-yuika-blue-500;
}
.site-background {

View File

@ -1,50 +0,0 @@
{{!< ../default}}
{{#unless @member}}
<script>window.location = '{{@site.url}}';</script>
{{/unless}}
<div class="relative group index-header">
{{> header-background background=@site.cover_image}} {{!--Special header-image.hbs partial to generate the background image--}}
<div class="w-full h-full opacity-50 bg-black">
</div>
</div>
<div class="absolute bottom-0 py-4 left-0 right-0">
<div class="container mx-auto content-full">
<div class="text-white">
<div>
{{#if @member}}
<div class="flex flex-row items-center mb-2">
{{#if @member.avatar_image}}
<img class="author-image" src="{{@member.avatar_image}}" alt="{{@member.email}}" />
{{/if}}
<p class="text-white text-2xl md:text-4xl ml-4">{{@member.email}}</p>
</div>
{{/if}}
</div>
</div>
</div>
</div>
</div>
<article class="post-article">
<main class="content container" id="post">
<div class="content-full">
{{#if @member.paid}}
{{else if @member}}
<h1 class="text-2xl">You are subscribed to updates</h1>
<p>You are currently subscribed to updates from <strong>{{@site.title}}</strong>.</p>
{{else}}
{{/if}}
</div>
</main>
{{#contentFor "scripts"}}
<script>
$(document).ready(function () {
// FitVids - start
var $postContent = $("#post");
$postContent.fitVids();
// FitVids - end
});
</script>
{{/contentFor}}

View File

@ -1,58 +0,0 @@
{{!< ../default}}
{{#if @member}}
<script>window.location = '{{@site.url}}';</script>
{{/if}}
<div class="relative group index-header large">
{{> header-background background=@site.cover_image}} {{!--Special header-image.hbs partial to generate the background image--}}
<div class="w-full h-full opacity-50 bg-black">
</div>
</div>
<div class="absolute left-0 right-0 top-0 bottom-0 flex flex-row items-center justify-center">
<div class="container mx-auto content-full">
<div class="text-white">
<div id="subscribe-form">
<h1 class="text-2xl">Welcome back!</h1>
<p>Sign into your account again for full access</p>
<form id="subscribe-form" data-members-form="signin">
<div class="py-8">
<label class="text-sm">Email address</label>
<input type="email" data-members-email class="appearance-none bg-transparent focus:outline-none text-xl border-b w-full px-2 py-1">
</div>
<button type="submit" class="px-4 py-2 appearance-none focus:outline-none bg-yuika-blue-700 rounded-none hover:bg-yuika-blue-500 transition duration-300 ease-in-out">
Send login link
</button>
<div class="pt-4">
<div class="message-success">
<p>Please check your email inbox to complete sign in.</p>
</div>
<div class="message-error">
<p>Please enter a valid email address!</p>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
<article class="post-article">
<main class="content container" id="post">
<div class="content-full">
{{#post}}
{{content}}
{{/post}}
</div>
</main>
{{#contentFor "scripts"}}
<script>
$(document).ready(function () {
// FitVids - start
var $postContent = $("#post");
$postContent.fitVids();
// FitVids - end
});
</script>
{{/contentFor}}

View File

@ -1,108 +0,0 @@
{{!< ../default}} <div class="relative group index-header large">
{{> header-background background=@site.cover_image}} {{!--Special header-image.hbs partial to generate the background
image--}}
<div class="w-full h-full opacity-50 bg-black">
</div>
</div>
<div class="absolute left-0 right-0 top-4 bottom-0 flex flex-row items-center justify-center">
<div class="container mx-auto content-full">
<div class="text-white">
<div>
{{#if @member.paid}}
{{!-- Logged in, paying member: Redirect home --}}
<script>window.location = '{{@site.url}}';</script>
{{else if @member}}
<h1 class="text-2xl md:text-4xl">
Join The Damillora Network
</h1>
<p class="text-lg md:text-xl">Become an Autonomous System member</p>
<p>By subscribing as an Autonomous System, you can get additional benefits and support me at the same time!
</p>
{{else}}
<h1 class="text-2xl md:text-4xl">Subscribe to {{@site.title}}</h1>
<p>Get the latest posts delivered straight to your inbox.</p>
<form id="subscribe-form" data-members-form="subscribe">
<div class="py-8">
<label class="text-sm">Email address</label>
<input type="email" data-members-email
class="appearance-none bg-transparent focus:outline-none text-xl border-b w-full px-2 py-1">
</div>
<button id="subscribe-submit" type="submit"
class="px-4 py-2 appearance-none focus:outline-none bg-yuika-blue-700 rounded-none hover:bg-yuika-blue-500 transition duration-300 ease-in-out">
Subscribe
</button>
<div class="message-success">
<p>Please check your email inbox to confirm your subscription!</p>
</div>
<div class="message-error">
<p>Please enter a valid email address!</p>
</div>
</form>
{{/if}}
</div>
</div>
</div>
</div>
</div>
<article class="post-article">
<main class="content container" id="post">
<div class="content-full">
{{#if @member}}
<h1 class="text-red-500">Access disabled. Required infrastructure not yet in place.</h1>
<div class="md:flex md:flex-row pointer-events-none opacity-50">
<div class="md:w-1/2 md:pr-4">
<h2 class="text-xl md:text-2xl text-center">Monthly</h2>
<ul class="text-center pt-4 list-disc md:h-64">
<li><strong>Autonomous System</strong> role in <a href="//nanao.moe/discord">The Network Discord
server</a>.</li>
<li><strong>Full access to posts</strong> in <a href="{{@site.url}}">{{@site.title}}</a>, including
members-only posts!</li>
<li><strong>Access to exclusive content</strong> in <a href="//nanao.moe/channel">my YouTube channel</a>.
</li>
<li><strong>Help shape the future</strong> of my content!</li>
<li><strong>More</strong> coming soon!</li>
</ul>
<p class="text-xl md:text-2xl text-center pt-4">
<span class="uppercase">{{@price.currency}}</span> <strong>{{@price.monthly}}</strong>
</p>
<div class="flex justify-center pt-2">
<a class="px-4 py-2 border-yuika-blue-500 border appearance-none focus:outline-none border-yuika-blue-700 rounded-none hover:bg-yuika-blue-500 transition duration-300 ease-in-out text-white"
href="javascript:" data-members-plan="Monthly">Choose this plan</a>
</div>
</div>
<div class="md:w-1/2 md:pl-4">
<h2 class="text-xl md:text-2xl text-center">Yearly</h2>
<ul class="text-center pt-4 list-disc md:h-64">
<li><strong>Everything</strong> in the Monthly plan.</li>
<li><strong>Two months</strong> free!</li>
<li><strong>More</strong> coming soon!</li>
</ul>
<p class="text-xl md:text-2xl text-center pt-4">
<span class="uppercase">{{@price.currency}}</span> <strong>{{@price.yearly}}</strong>
</p>
<div class="flex justify-center pt-2">
<a class="px-4 py-2 border-yuika-blue-500 border appearance-none focus:outline-none border-yuika-blue-700 rounded-none hover:bg-yuika-blue-500 transition duration-300 ease-in-out text-white"
href="javascript:" data-members-plan="Yearly">Choose this plan</a>
</div>
</div>
</div>
{{else}}
{{#page}}
{{content}}
{{/page}}
{{/if}}
</div>
</main>
</article>
{{#contentFor "scripts"}}
<script>
$(document).ready(function () {
// FitVids - start
var $postContent = $("#post");
$postContent.fitVids();
// FitVids - end
});
</script>
{{/contentFor}}

View File

@ -1,7 +1,7 @@
{
"name": "yuika",
"description": "nanao.moe's blog theme",
"version": "2.8.1",
"version": "2.9.2",
"engines": {
"ghost-api": "v3"
},

View File

@ -22,14 +22,14 @@
{{#has visibility="paid"}}
<div class="pr-2">
<a href="/subscribe">
<span class="text-sm text-red-700 hover:underline">Autonomous Systems only</span>
<span class="text-sm text-red-700 hover:underline">Paid content</span>
</a>
</div>
{{/has}}
{{#has visibility="members"}}
<div class="pr-2">
<a href="/subscribe">
<span class="text-sm text-yuika-blue-700 hover:underline">Subscribers only</span>
<span class="text-sm text-yuika-blue-700 hover:underline">Member-exclusive</span>
</a>
</div>
{{/has}}

View File

@ -15,14 +15,14 @@
{{#has visibility="paid"}}
<div class="pr-2">
<a href="/subscribe">
<span class="text-sm text-red-200 hover:underline">Autonomous Systems only</span>
<span class="text-sm text-red-200 hover:underline">Paid content</span>
</a>
</div>
{{/has}}
{{#has visibility="members"}}
<div class="pr-2">
<a href="/subscribe">
<span class="text-sm text-yuika-blue-200 hover:underline">Subscribers only</span>
<span class="text-sm text-yuika-blue-200 hover:underline">Member-exclusive</span>
</a>
</div>
{{/has}}
{{/has}}

View File

@ -9,38 +9,12 @@
<span class="h-12 w-12 px-2 py-3 text-white material-icons" alt="menu">menu</span>
</div>
<div class="site-head">
<a href="{{@site.url}}" class="block flex flex-col flex-grow">
<div class="">
<h1 class="text-lg text-white">{{@site.title}}</h1>
</div>
<a href="{{@site.url}}" class="block flex flex-col flex-grow site-title">
<h1 class="text-lg text-white">{{@site.title}}</h1>
</a>
</div>
</div>
<div class="nav-group">
<ul class="nav">
{{#if @member}}
{{#unless @member.paid}}
<li>
<a href="{{@site.url}}/subscribe/">Join The Damillora Network</a>
</li>
<li class="separator"></li>
{{/unless}}
<li>
<a href="{{@site.url}}/account/">{{@member.email}}</a>
</li>
<li>
<a href="#signout" data-members-signout>Sign out</a>
</li>
{{else}}
<li>
<a href="{{@site.url}}/signin/">Sign in</a>
</li>
<li>
<a href="{{@site.url}}/subscribe/">Subscribe</a>
</li>
{{/if}}
<li class="separator"></li>
</ul>
{{navigation}}
</div>
</header>

View File

@ -95,15 +95,38 @@
{{/next_post}}
</div>
</div>
<div class="my-4 w-full content-full">
<div class="my-4" id="comments">
{{#is "preview"}}
<p>Comments are disabled for post previews</p>
{{else}}
{{!-- Comments --}}
{{/is}}
</div>
</div>
<div class="my-4 w-full content-full">
<div class="my-4" id="comments">
{{#is "preview"}}
<p>Comments are disabled for post previews</p>
{{else}}
{{!-- Comments --}}
<div id="coral_thread"></div>
<script type="text/javascript">
(function() {
var d = document, s = d.createElement('script');
s.src = 'https://comments.nanao.moe/assets/js/embed.js';
s.async = false;
s.defer = true;
s.onload = function() {
Coral.createStreamEmbed({
id: "coral_thread",
autoRender: true,
rootURL: 'https://comments.nanao.moe',
// Uncomment these lines and replace with the ID of the
// story's ID and URL from your CMS to provide the
// tightest integration. Refer to our documentation at
// https://docs.coralproject.net for all the configuration
// options.
// storyID: '${storyID}',
// storyURL: '${storyURL}',
});
};
(d.head || d.body).appendChild(s);
})();
</script>
{{/is}}
</div>
<div class="mx-auto px-4 my-4 w-full">
{{#if primary_tag}}
@ -145,4 +168,4 @@
// FitVids - end
});
</script>
{{/contentFor}}
{{/contentFor}}