jekyll-page-asset 0.1.0

data/_sass/_page-asset.scss

@@ -0,0 +1,309 @@
+@use "variables" as *;
+
+.page-asset-container {
+    width: 100%;
+    margin: $spacing-xl 0;
+    position: relative;
+}
+
+// ── fountain ──────────────────────────────────────────────────────
+
+.script-container {
+    max-width: 800px;
+    margin: 2rem auto;
+    height: 600px;
+    overflow-y: scroll;
+    border: double #000 2px;
+    border-radius: 8px;
+    background-color: #fff;
+    color: #000;
+    padding: 2rem;
+}
+
+.screenplay {
+    font-family: "Courier New", Courier, monospace;
+    font-size: 12pt;
+    line-height: 1;
+    -webkit-text-size-adjust: none;
+
+
+    h1,
+    h2,
+    h3,
+    h4,
+    h5,
+    h6 {
+        font-weight: bold;
+        font-size: inherit;
+        color: #000;
+    }
+
+    a {
+        color: inherit;
+        text-decoration: underline;
+    }
+
+    p {
+        color: #000;
+        text-decoration: none;
+    }
+
+    .underline {
+        text-decoration: underline;
+    }
+
+    .title-page {
+        margin: 0 auto 1em;
+    }
+
+    .title-page .title {
+        text-align: center;
+    }
+
+    .title-page .title h1 {
+        text-transform: uppercase;
+        text-decoration: underline;
+    }
+
+    .section-heading {
+        text-align: center;
+    }
+
+    .section-heading:hover {
+        background-color: lightyellow;
+    }
+
+    .scene {
+        margin-top: 2em;
+    }
+
+    .scene-heading {
+        margin-bottom: 0;
+    }
+
+    .scene-heading:hover {
+        background-color: lightyellow;
+    }
+
+    .action {
+        margin: 1em 0;
+    }
+
+    .dialog {
+        width: 75%;
+        max-width: 4in;
+        margin-top: 1em;
+        margin-bottom: 1em;
+        margin-left: 17%;
+    }
+
+    .dialog .character {
+        margin-top: 0;
+        margin-bottom: 0;
+        margin-left: 25%;
+    }
+
+    .dialog .lines {
+        max-width: 3.5in;
+        margin-top: 0;
+        margin-bottom: 0;
+    }
+
+    .dialog .paren {
+        max-width: 2in;
+        margin-top: 0;
+        margin-bottom: 0;
+        margin-left: 15%;
+        text-indent: -0.6em;
+        page-break-inside: avoid;
+        page-break-after: avoid;
+    }
+
+    .dual-dialog {
+        width: 100%;
+        margin: 1em 0;
+    }
+
+    .dual-dialog .dialog {
+        max-width: 50%;
+        margin-top: 0;
+        margin-left: 0;
+        margin-right: 0;
+        float: left;
+        clear: none;
+    }
+
+    .dual-dialog .dialog .lines {
+        width: 95%;
+    }
+
+    .trans {
+        max-width: 2in;
+        margin-left: 63%;
+        clear: both;
+        page-break-before: avoid;
+    }
+
+    .note {
+        display: block;
+        font-size: 11pt;
+        font-family: "Comic Sans MS", "Marker Felt", "sans-serif";
+        line-height: 1.5;
+        background-color: lightgoldenrodyellow;
+        padding: 1em;
+    }
+
+    .synopsis {
+        margin-top: 0;
+        color: grey;
+        font-style: italic;
+    }
+
+    .center {
+        text-align: center;
+        white-space: pre-wrap;
+    }
+}
+
+// ── Gallery ───────────────────────────────────────────────────────
+
+#page-asset-gallery-lightbox {
+    width: 100%;
+    height: 100%;
+    position: absolute;
+}
+
+#page-asset-gallery-controls {
+    width: 100%;
+    height: 100%;
+    position: relative;
+    display: flex;
+    align-items: center;
+}
+
+.gallery-controls {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: $spacing-sm;
+    width: 100%;
+}
+
+.gallery-controls[hidden] {
+    display: none;
+}
+
+.gallery-control-button {
+    &:hover {
+        color: $accent-teal;
+    }
+}
+
+.project-gallery-grid {
+    column-count: 3;
+    column-gap: $spacing-md;
+}
+
+@media (max-width: 1280px) {
+    .project-gallery-grid {
+        column-count: 2;
+    }
+}
+
+@media (max-width: 1000px) {
+    .project-gallery-grid {
+        column-count: 1;
+    }
+}
+
+.gallery-thumb {
+    width: 100%;
+    display: block;
+    break-inside: avoid;
+    margin: 0 0 $spacing-md;
+    padding: 0;
+    border: 1px solid $border-color;
+    border-radius: $radius-md;
+    overflow: hidden;
+    cursor: pointer;
+    background: transparent;
+    box-shadow: $shadow-card;
+    transition: transform $transition-fast, border-color $transition-fast;
+
+    &:hover {
+        border-color: $accent-teal;
+        transform: translateY(-2px);
+    }
+
+    picture,
+    img {
+        width: 100%;
+        display: block;
+        height: auto;
+    }
+}
+
+.project-gallery-empty {
+    color: $text-muted;
+    font-style: italic;
+}
+
+.gallery-lightbox {
+    position: fixed;
+    inset: 0;
+    z-index: 220;
+    background: $bg-deep;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: $spacing-md;
+    padding: $spacing-md;
+    width: 100%;
+    min-height: 100%;
+    box-sizing: border-box;
+}
+
+.gallery-lightbox[hidden] {
+    display: none;
+}
+
+.gallery-lightbox-inner {
+    max-width: 100%;
+    max-height: 100%;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+}
+
+.gallery-lightbox-image {
+    width: auto;
+    max-width: 100%;
+    max-height: calc(100vh - #{$spacing-2xl});
+    border-radius: $radius-md;
+    border: 1px solid rgba(255, 255, 255, 0.2);
+    box-shadow: 0 20px 48px rgba(0, 0, 0, 0.4);
+}
+
+.gallery-lightbox-button {
+    position: absolute;
+    top: $spacing-md;
+    z-index: 1;
+}
+
+body.gallery-lightbox-open {
+    overflow: hidden;
+}
+
+@media (max-width: 800px) {
+    .gallery-lightbox {
+        padding: $spacing-sm;
+    }
+
+    .gallery-lightbox-image {
+        max-height: calc(100vh - #{$spacing-xl});
+    }
+
+    .gallery-lightbox-button {
+        top: $spacing-sm;
+    }
+}

data/lib/jekyll-page-asset/version.rb

@@ -0,0 +1,5 @@
+# frozen_string_literal: true
+
+module JekyllPageAsset
+  VERSION = "0.1.0"
+end

data/lib/jekyll-page-asset.rb

@@ -0,0 +1,12 @@
+# frozen_string_literal: true
+
+require_relative "jekyll-page-asset/version"
+begin
+	require "jekyll_picture_tag"
+rescue LoadError => e
+	warn "[jekyll-page-asset] Missing dependency: jekyll_picture_tag (#{e.message})"
+end
+require_relative "../_plugins/page_asset"
+
+module JekyllPageAsset
+end

metadata

@@ -0,0 +1,98 @@
+--- !ruby/object:Gem::Specification
+name: jekyll-page-asset
+version: !ruby/object:Gem::Version
+  version: 0.1.0
+platform: ruby
+authors:
+- Alastair King
+bindir: bin
+cert_chain: []
+date: 1980-01-02 00:00:00.000000000 Z
+dependencies:
+- !ruby/object:Gem::Dependency
+  name: jekyll
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '4.0'
+    - - "<"
+      - !ruby/object:Gem::Version
+        version: '5.0'
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '4.0'
+    - - "<"
+      - !ruby/object:Gem::Version
+        version: '5.0'
+- !ruby/object:Gem::Dependency
+  name: jekyll_picture_tag
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '2.0'
+    - - "<"
+      - !ruby/object:Gem::Version
+        version: '3.0'
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '2.0'
+    - - "<"
+      - !ruby/object:Gem::Version
+        version: '3.0'
+description: Provides the page_asset Liquid tag and renderers for image, gallery,
+  video, fountain, and scroll-scrub assets.
+email:
+- ali@kinginterweb.com
+executables: []
+extensions: []
+extra_rdoc_files: []
+files:
+- LICENSE
+- README.md
+- _includes/page_asset/fountain.html
+- _includes/page_asset/gallery.html
+- _includes/page_asset/scroll_scrub_video.html
+- _lib/page_asset/fountain_renderer.rb
+- _lib/page_asset/gallery_renderer.rb
+- _lib/page_asset/image_renderer.rb
+- _lib/page_asset/renderer.rb
+- _lib/page_asset/scroll_scrub_video_renderer.rb
+- _lib/page_asset/video_renderer.rb
+- _plugins/page_asset.rb
+- _sass/_page-asset.scss
+- lib/jekyll-page-asset.rb
+- lib/jekyll-page-asset/version.rb
+homepage: https://example.com
+licenses:
+- GPL-3.0
+metadata:
+  homepage_uri: https://example.com
+  source_code_uri: https://example.com
+rdoc_options: []
+require_paths:
+- lib
+required_ruby_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ">="
+    - !ruby/object:Gem::Version
+      version: '2.7'
+required_rubygems_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ">="
+    - !ruby/object:Gem::Version
+      version: '0'
+requirements: []
+rubygems_version: 3.6.9
+specification_version: 4
+summary: Liquid tag plugin for project page assets in Jekyll
+test_files: []