frame9-jekyll-theme 1.0.0

data/_sass/theme/colors.scss

@@ -0,0 +1,108 @@
+
+// Site Color Config
+
+$colors: (
+  'white-a': #fff,
+  'white-b': #dcdcdc,
+  'white-c': #ddd,
+
+  'red-a': rgb(117, 45, 45),
+  'red-b': rgb(139, 49, 49),
+  'red-c': rgb(223, 79, 79),
+  'red-d': rgb(175, 63, 63),
+  'red-e': #b75251,
+
+  'gray-a': #555,
+
+  'black-a': #000000,
+  'black-c': #101010,
+  'black-d': #2b2b2b,
+  'black-e': #222,
+  'black-b': rgb(75, 75, 75)
+);
+
+// Light theme colors
+
+$light-theme: (
+  'fill-main': map-get( $colors, 'white-a' ),
+  'fill-main-a': map-get( $colors, 'white-a' ),
+  'fill-main-b': map-get( $colors, 'white-b' ),
+  'fill-mute': map-get($colors, 'white-c' ),
+  'fill-gallery': map-get( $colors, 'gray-a' ),
+  'fill-banner': map-get( $colors, 'red-e' ),
+  
+  'fill-overlay': #0002,
+
+  'scribe-action': map-get( $colors, 'red-a'),
+  'scribe-action-hover': map-get( $colors, 'red-b'),
+
+
+  'fill-code': map-get($colors, 'black-d'),
+  'scribe-code': map-get($colors, 'white-b'),
+
+  'scribe-white': map-get( $colors, 'white-a'),
+  'scribe-main': map-get( $colors, 'black-a'),
+  'scribe-main-a': map-get( $colors, 'black-a'),
+  'scribe-main-b': map-get( $colors, 'black-b'),
+  'scribe-mute': map-get( $colors, 'gray-a'),
+  'scribe-invert': map-get( $colors, 'white-a')
+);
+
+
+// Dark theme colors
+
+$dark-theme: (
+  'fill-main': map-get( $colors, 'black-d'),
+  'fill-main-a': map-get( $colors, 'black-d'),
+  'fill-main-b': map-get( $colors, 'black-c'),
+  'fill-mute': map-get($colors, 'black-e' ),
+  'fill-gallery': map-get( $colors, 'black-d'),
+  'fill-banner': map-get( $colors, 'red-e'),
+
+  'fill-overlay': #0002,
+
+  'fill-code': map-get($colors, 'black-c'),
+  'scribe-code': map-get($colors, 'white-b'),
+
+  'scribe-action': map-get( $colors, 'red-c'),
+  'scribe-action-hover': map-get( $colors, 'red-d'),
+
+  'scribe-white': map-get( $colors, 'white-a'),
+  'scribe-main': map-get( $colors, 'white-a'),
+  'scribe-main-a': map-get( $colors, 'white-a'),
+  'scribe-main-b': map-get( $colors, 'white-b'),
+  'scribe-mute': map-get( $colors, 'gray-a'),
+  'scribe-invert': map-get( $colors, 'white-a')
+);
+
+
+// Scribe colors are text color, 
+// or any color that takes up a small area of the page
+//
+// this generates css class tokens 
+// ie. `.scribe-main { color: var(--scribe-main-a); } `
+
+$scribe-colors: (
+  'main': 'var(--scribe-main-a)',
+  'main-a': 'var(--scribe-main-a)',
+  'main-b': 'var(--scribe-main-b)',
+  'scribe-mute': 'var(--scribe-mute)',
+  'invert': 'var(--scribe-invert)'
+);
+
+
+// Fill colors are background color, 
+// or any color that takes up a large area of the page
+//
+// this will generate css class tokens as well
+// ie. `.fill-banner { color: var(--fill-banner); } `
+
+$fill-colors: (
+  'banner': 'var(--fill-banner)',
+  'overlay': 'var(--fill-overlay)',
+  'gallery': 'var(--fill-gallery)',
+  'main': 'var(--fill-main-a)',
+  'main-a': 'var(--fill-main-a)',
+  'main-b': 'var(--fill-main-b)'
+);
+

data/_sass/theme/font.scss

@@ -0,0 +1,32 @@
+
+
+
+body {
+  line-height: 1.8em;
+  font-weight: 400;
+  font-family: 'Poppins', sans-serif;
+  @include media-query('md') {
+    font-size: 1.2rem;
+  }
+}
+
+h1, h2, h3, .h1, .h2, .h3 {
+  padding: .2em 0;
+  font-weight: 700;
+  font-family: 'Cinzel', serif;
+  font-size: 1.8em;
+  line-height: 1em;
+}
+
+h1, .h1 {
+  font-size: get-size('900');
+  font-weight: 400;
+  @include media-query('md') {
+    font-size: 2.2*get-size('900')
+  }
+}
+
+.menu {
+  font-family: 'Cinzel', serif;
+}
+

data/_sass/theme/monokai.scss

@@ -0,0 +1,70 @@
+.highlight .hll { background-color: #49483e }
+.highlight  { background: var(--fill-code); color: #f8f8f2 }
+.highlight .c { color: #75715e } /* Comment */
+.highlight .err { color: #960050; background-color: #1e0010 } /* Error */
+.highlight .k { color: #66d9ef } /* Keyword */
+.highlight .l { color: #ae81ff } /* Literal */
+.highlight .n { color: #f8f8f2 } /* Name */
+.highlight .o { color: #f92672 } /* Operator */
+.highlight .p { color: #f8f8f2 } /* Punctuation */
+.highlight .ch { color: #75715e } /* Comment.Hashbang */
+.highlight .cm { color: #75715e } /* Comment.Multiline */
+.highlight .cp { color: #75715e } /* Comment.Preproc */
+.highlight .cpf { color: #75715e } /* Comment.PreprocFile */
+.highlight .c1 { color: #75715e } /* Comment.Single */
+.highlight .cs { color: #75715e } /* Comment.Special */
+.highlight .gd { color: #f92672 } /* Generic.Deleted */
+.highlight .ge { font-style: italic } /* Generic.Emph */
+.highlight .gi { color: #a6e22e } /* Generic.Inserted */
+.highlight .gs { font-weight: bold } /* Generic.Strong */
+.highlight .gu { color: #75715e } /* Generic.Subheading */
+.highlight .kc { color: #66d9ef } /* Keyword.Constant */
+.highlight .kd { color: #66d9ef } /* Keyword.Declaration */
+.highlight .kn { color: #f92672 } /* Keyword.Namespace */
+.highlight .kp { color: #66d9ef } /* Keyword.Pseudo */
+.highlight .kr { color: #66d9ef } /* Keyword.Reserved */
+.highlight .kt { color: #66d9ef } /* Keyword.Type */
+.highlight .ld { color: #e6db74 } /* Literal.Date */
+.highlight .m { color: #ae81ff } /* Literal.Number */
+.highlight .s { color: #e6db74 } /* Literal.String */
+.highlight .na { color: #a6e22e } /* Name.Attribute */
+.highlight .nb { color: #f8f8f2 } /* Name.Builtin */
+.highlight .nc { color: #a6e22e } /* Name.Class */
+.highlight .no { color: #66d9ef } /* Name.Constant */
+.highlight .nd { color: #a6e22e } /* Name.Decorator */
+.highlight .ni { color: #f8f8f2 } /* Name.Entity */
+.highlight .ne { color: #a6e22e } /* Name.Exception */
+.highlight .nf { color: #a6e22e } /* Name.Function */
+.highlight .nl { color: #f8f8f2 } /* Name.Label */
+.highlight .nn { color: #f8f8f2 } /* Name.Namespace */
+.highlight .nx { color: #a6e22e } /* Name.Other */
+.highlight .py { color: #f8f8f2 } /* Name.Property */
+.highlight .nt { color: #f92672 } /* Name.Tag */
+.highlight .nv { color: #f8f8f2 } /* Name.Variable */
+.highlight .ow { color: #f92672 } /* Operator.Word */
+.highlight .w { color: #f8f8f2 } /* Text.Whitespace */
+.highlight .mb { color: #ae81ff } /* Literal.Number.Bin */
+.highlight .mf { color: #ae81ff } /* Literal.Number.Float */
+.highlight .mh { color: #ae81ff } /* Literal.Number.Hex */
+.highlight .mi { color: #ae81ff } /* Literal.Number.Integer */
+.highlight .mo { color: #ae81ff } /* Literal.Number.Oct */
+.highlight .sa { color: #e6db74 } /* Literal.String.Affix */
+.highlight .sb { color: #e6db74 } /* Literal.String.Backtick */
+.highlight .sc { color: #e6db74 } /* Literal.String.Char */
+.highlight .dl { color: #e6db74 } /* Literal.String.Delimiter */
+.highlight .sd { color: #e6db74 } /* Literal.String.Doc */
+.highlight .s2 { color: #e6db74 } /* Literal.String.Double */
+.highlight .se { color: #ae81ff } /* Literal.String.Escape */
+.highlight .sh { color: #e6db74 } /* Literal.String.Heredoc */
+.highlight .si { color: #e6db74 } /* Literal.String.Interpol */
+.highlight .sx { color: #e6db74 } /* Literal.String.Other */
+.highlight .sr { color: #e6db74 } /* Literal.String.Regex */
+.highlight .s1 { color: #e6db74 } /* Literal.String.Single */
+.highlight .ss { color: #e6db74 } /* Literal.String.Symbol */
+.highlight .bp { color: #f8f8f2 } /* Name.Builtin.Pseudo */
+.highlight .fm { color: #a6e22e } /* Name.Function.Magic */
+.highlight .vc { color: #f8f8f2 } /* Name.Variable.Class */
+.highlight .vg { color: #f8f8f2 } /* Name.Variable.Global */
+.highlight .vi { color: #f8f8f2 } /* Name.Variable.Instance */
+.highlight .vm { color: #f8f8f2 } /* Name.Variable.Magic */
+.highlight .il { color: #ae81ff } /* Literal.Number.Integer.Long */

data/_sass/utility/bleed.sass

@@ -0,0 +1,10 @@
+
+.bleed
+
+    width: 100vw
+    margin-left: calc( 50% - 50vw )
+
+    @include media-query('md')
+        width: 120%
+        margin-left: -10%
+

data/_sass/utility/box.sass

@@ -0,0 +1,32 @@
+
+
+.box
+    margin: var(--x) var(--x)
+
+.ml-x
+    margin-left: var(--x)
+.mr-x
+    margin-right: var(--x)
+.mt-x
+    margin-top: var(--x)
+.mb-x
+    margin-bottom: var(--x)
+
+.mx-x
+    margin-right: var(--x)
+    margin-left: var(--x)
+.my-x
+    margin-top: var(--x)
+    margin-bottom: var(--x)
+
+.hbox
+    display: grid
+    grid-auto-flow: column
+    justify-content: start
+    gap: 1em
+
+.vbox
+    display: grid
+    grid-auto-flow: row
+    align-content: start
+    gap: 1em

data/_sass/utility/columns.sass

@@ -0,0 +1,3 @@
+
+.columns
+    columns: 15em auto

data/_sass/utility/shadow.sass

@@ -0,0 +1,13 @@
+
+    
+.box-shadow
+    box-shadow: 0 0 30px -10px black
+
+.box-shadow-sm
+    box-shadow: 0 0 20px -10px black
+
+.text-shadow
+    text-shadow: 0 0 20px black
+
+.drop-shadow
+    filter: drop-shadow( 0 0 20px black )

data/assets/404.html

@@ -0,0 +1,25 @@
+---
+permalink: /404.html
+layout: default
+---
+
+<style type="text/css" media="screen">
+  .container {
+    margin: 10px auto;
+    max-width: 600px;
+    text-align: center;
+  }
+  h1 {
+    margin: 30px 0;
+    font-size: 4em;
+    line-height: 1;
+    letter-spacing: -1px;
+  }
+</style>
+
+<div class="container">
+  <h1>404</h1>
+
+  <p><strong>Page not found :(</strong></p>
+  <p>The requested page could not be found.</p>
+</div>

data/assets/css/style.sass

@@ -0,0 +1,7 @@
+---
+---
+
+$banner-url: "{{site.frame9.banner | relative_url }}"
+
+@import "{{ site.theme }}";
+

data/assets/js/main.js

@@ -0,0 +1,5 @@
+import {OpenGallery} from './openGallery.js';
+
+window.addEventListener('load', function(){
+    OpenGallery.init('viewer', {reset_all: true} );
+}, false);

data/assets/js/openGallery.js

@@ -0,0 +1,50 @@
+
+export var OpenGallery = {
+
+  init: function(node_tag, options = {}) {
+
+    OpenGallery.options = options
+    OpenGallery.tag = node_tag
+
+    
+    OpenGallery.nodes = document.querySelectorAll(`[${node_tag}]`);
+    OpenGallery.addMenuEventListeners()
+  },
+  
+
+  setOpenAttr: function(obj, val) {
+    if( val ){
+      obj.setAttribute(OpenGallery.tag, 'open')
+    }else{
+      obj.setAttribute(OpenGallery.tag, 'closed')
+    }
+  },
+
+
+  onToggle: function(toggle_node) {
+    if( toggle_node.getAttribute(OpenGallery.tag) == 'open' ){
+    
+      OpenGallery.setOpenAttr(toggle_node, false)
+    
+    } else {
+      
+      if( OpenGallery.options.reset_all ){
+        OpenGallery.nodes.forEach( function(n){
+          OpenGallery.setOpenAttr(n,false)
+        },false);
+      }
+    
+      OpenGallery.setOpenAttr(toggle_node, true)
+    }
+  },
+
+  addMenuEventListeners: function() {
+    OpenGallery.nodes.forEach( function(n){
+
+      n.addEventListener("click",function(){
+        OpenGallery.onToggle(n)
+      },false);
+      
+    })  
+  },
+}

data/package.json

@@ -0,0 +1,22 @@
+{
+  "name": "framedpaneswebsite",
+  "version": "1.0.0",
+  "description": "",
+  "main": "index.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/CodeKarmaDev/FramedPanesWebsite.git"
+  },
+  "author": "",
+  "license": "ISC",
+  "bugs": {
+    "url": "https://github.com/CodeKarmaDev/FramedPanesWebsite/issues"
+  },
+  "homepage": "https://github.com/CodeKarmaDev/FramedPanesWebsite#readme",
+  "dependencies": {
+    "gorko": "^0.2.3"
+  }
+}

metadata

@@ -0,0 +1,180 @@
+--- !ruby/object:Gem::Specification
+name: frame9-jekyll-theme
+version: !ruby/object:Gem::Version
+  version: 1.0.0
+platform: ruby
+authors:
+- opsaaaaa
+autorequire: 
+bindir: bin
+cert_chain: []
+date: 2021-08-12 00:00:00.000000000 Z
+dependencies:
+- !ruby/object:Gem::Dependency
+  name: bundler
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '2.1'
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: 2.1.4
+  type: :development
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '2.1'
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: 2.1.4
+- !ruby/object:Gem::Dependency
+  name: webrick
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '1.6'
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: 1.6.1
+  type: :development
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '1.6'
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: 1.6.1
+- !ruby/object:Gem::Dependency
+  name: jekyll-seo-tag
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '2.7'
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: 2.7.0
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '2.7'
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: 2.7.0
+- !ruby/object:Gem::Dependency
+  name: jekyll
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '4.1'
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '4.1'
+- !ruby/object:Gem::Dependency
+  name: jekyll-feed
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '0.12'
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '0.12'
+description: Frame9's core feature is a 9 pane gallary.
+email:
+- sean@codekarma.dev
+executables: []
+extensions: []
+extra_rdoc_files: []
+files:
+- LICENSE.txt
+- README.md
+- _config.yml
+- _includes/banner.html
+- _includes/custom_head.html
+- _includes/fonts.html
+- _includes/footer.html
+- _includes/gallery.html
+- _includes/gallery_item.html
+- _includes/head.html
+- _includes/header.html
+- _includes/image.html
+- _includes/section.html
+- _includes/siblings.html
+- _layouts/default.html
+- _layouts/post.html
+- _layouts/root.html
+- _layouts/section.html
+- _sass/block/banner.sass
+- _sass/block/footer.sass
+- _sass/block/gallery.sass
+- _sass/block/img-wrap.sass
+- _sass/block/logo.sass
+- _sass/block/menu.sass
+- _sass/block/root-layout.sass
+- _sass/block/sibling-nav.sass
+- _sass/composition/action.sass
+- _sass/composition/code.scss
+- _sass/composition/normalize.sass
+- _sass/composition/size.sass
+- _sass/composition/table.sass
+- _sass/composition/text.sass
+- _sass/composition/theme.sass
+- _sass/exception/img-wrap.sass
+- _sass/frame9-jekyll-theme.sass
+- _sass/gorko-config.scss
+- _sass/theme/colors.scss
+- _sass/theme/font.scss
+- _sass/theme/monokai.scss
+- _sass/utility/bleed.sass
+- _sass/utility/box.sass
+- _sass/utility/columns.sass
+- _sass/utility/shadow.sass
+- assets/404.html
+- assets/css/style.sass
+- assets/img/avatar.png
+- assets/js/main.js
+- assets/js/openGallery.js
+- package.json
+homepage: https://github.com/CodeKarmaDev/frame9-jekyll-theme
+licenses:
+- MIT
+metadata: {}
+post_install_message: 
+rdoc_options: []
+require_paths:
+- lib
+required_ruby_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ">="
+    - !ruby/object:Gem::Version
+      version: 2.4.0
+required_rubygems_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ">="
+    - !ruby/object:Gem::Version
+      version: '0'
+requirements: []
+rubygems_version: 3.2.3
+signing_key: 
+specification_version: 4
+summary: A simple multipurpose gallary focused jekyll template
+test_files: []