tokite 0.8.1 → 0.9.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 4c2d826563734d2a9367d2edc7bd1944f01699741ab707d064b27c31766eb2ad
-  data.tar.gz: 9f894494013fa308c8191c0e0f048464bfd20f40ff6793c8bf22a29ba8cab15e
+  metadata.gz: dc37cc8504c8f6e99a888c5e95fb615ad501d07a3bbaf7dc5a9cfb79e128a6b9
+  data.tar.gz: a644b121fbc9029c52b5ca1ef262a5f158e87332c4815cfc12a04918002c2690
 SHA512:
-  metadata.gz: 4ceb1262c72d7aee9e4b3abdeee75fcf96e8fc3f2d2aab4fbc76155b72d6cc464ef42c1c9558369607eb1eb058dd072674fa63764d118fd34f167d1d19d8f4b7
-  data.tar.gz: 0c42bd10d19ec9e9affd4004da12924ccab344e5b222aabb717a6ee96b9f692ec505f76953f92ebb43096ac66f3f967b91be602df243350c48d30a3254a68728
+  metadata.gz: ea44fdcafcc8f024ca37f55005016eda1649cd19473a75b70bfe14471f9db776b35e9d029f0f7c0a7d24f3f7c0f9de2c89eb2b5eb1d1f6524ef01b589ed4828a
+  data.tar.gz: 38df2defc91afcb321d083ae35c066bb89670260faa4ec8f3f9ece9bee96e686a64889813b6e484396051f0275f4b09bda5df7321d802b2df81bee7641434556

data/README.md

@@ -28,9 +28,9 @@ $ ./bin/rails app:tokite:ridgepole:apply
 $ RAILS_ENV=test ./bin/rails app:tokite:ridgepole:apply
 ```
 
-### Setup yarn pkg
+### Download CSS files
 ```console
-$ ./bin/rails tokite:yarn:install
+$ ./bin/rails app:tokite:stylesheet:install
 ```
 
 ## Configuration

data/app/assets/stylesheets/tokite/application.scss

@@ -1,23 +1,3 @@
-@import "bulma/sass/utilities/initial-variables";
-
-// Bootstrap-like colors
-$white:  #fff;
-$black:  #000;
-$red:    #d9534f;
-$orange: #f0ad4e;
-$yellow: #ffd500;
-$green:  #5cb85c;
-$blue:   #0275d8;
-$teal:   #5bc0de;
-$pink:   #ff5b77;
-$purple: #613d7c;
-
-$primary: $blue;
-$info: $teal;
-$success: $green;
-$warning: $orange;
-$danger: $red;
-$dark: $grey-darker;
-$text: $grey-dark;
-
-@import "bulma/bulma";
+@use "tokite/bulma/sass" with (
+  $primary: rgb(2 117 216),
+);

data/app/views/layouts/tokite/application.html.haml

@@ -4,8 +4,7 @@
     %title Tokite
     = csrf_meta_tags
 
-    = stylesheet_link_tag    'tokite/application', media: 'all'
-    = javascript_include_tag 'tokite/application'
+    = stylesheet_link_tag 'tokite/application', media: 'all'
 
   %body
     - if current_user

data/lib/tasks/{tokite.rake → ridgepole.rake}

@@ -3,11 +3,11 @@ namespace :tokite do
     def engine_path(file)
       Tokite::Engine.root.join(file).to_s
     end
-  
+
     def app_path(file)
       Rails.root.join(file).to_s
     end
-  
+
     def ridgepole_exec(*args)
       yml = Rails.root.join("config/database.yml").to_s
       sh "bundle", "exec", "ridgepole", "-c", yml, "-E", Rails.env, *args
@@ -17,12 +17,12 @@ namespace :tokite do
     task :apply do
       ridgepole_exec("--file", app_path("schema/Schemafile"), "-a")
     end
-  
+
     desc "Apply Schemafile (dry-run)"
     task :"dry-run" do
       ridgepole_exec("--file", app_path("schema/Schemafile"), "-a", "--dry-run")
     end
-  
+
     desc "Install schema"
     task :install do
       schema_dir = app_path("schema")
@@ -41,11 +41,4 @@ namespace :tokite do
       end
     end
   end
-
-  namespace :yarn do
-    desc "Install yarn packages"
-    task :install do
-      sh "yarn", "add", "bulma"
-    end
-  end
 end

data/lib/tasks/stylesheet.rake

@@ -0,0 +1,23 @@
+namespace :tokite do
+  namespace :stylesheet do
+    desc "Download stylesheets under the vendor directory"
+    task :install do
+      vendor_dir = Tokite::Engine.root.join("vendor", "stylesheets", "tokite")
+      rm_rf(vendor_dir)
+      mkdir_p(vendor_dir)
+
+      tmp_dir = Tokite::Engine.root.join("tmp")
+      mkdir_p(tmp_dir)
+
+      # Bulma
+      version = "1.0.4"
+      bulma_url = "https://github.com/jgthms/bulma/releases/download/#{version}/bulma-#{version}.zip"
+      bulma_zip = tmp_dir.join("bulma.zip")
+      bulma_dir = vendor_dir.join("bulma")
+      mkdir_p(bulma_dir.join("sass"))
+      sh "curl -sSfL -o '#{bulma_zip}' '#{bulma_url}'"
+      sh "tar xf '#{bulma_zip}' --strip-components 2 -C '#{bulma_dir.join("sass")}' 'bulma/sass'"
+      sh "tar xf '#{bulma_zip}' --strip-components 1 -C '#{bulma_dir}' 'bulma/LICENSE'"
+    end
+  end
+end

data/lib/tokite/engine.rb

@@ -3,12 +3,24 @@ module Tokite
     isolate_namespace Tokite
 
     config.before_configuration do
+      require "dartsass-rails"
       require "haml-rails"
+      require "propshaft"
       require "slack-notifier"
     end
 
     initializer "tokite.config" do
       Tokite::Engine.routes.default_url_options = { protocol: "https", host: ENV.fetch("APP_HOST", "example.com") }
     end
+
+    initializer "tokite.assets" do |app|
+      if app.config.respond_to?(:assets)
+        app.config.assets.paths << Engine.root.join("vendor", "stylesheets")
+      end
+
+      app.config.dartsass.builds.merge!({
+        Engine.root.join("app", "assets", "stylesheets", "tokite", "application.scss") => "tokite/application.css",
+      })
+    end
   end
 end

data/lib/tokite/version.rb

@@ -1,3 +1,3 @@
 module Tokite
-  VERSION = '0.8.1'
+  VERSION = '0.9.0'
 end

data/vendor/README.md

@@ -0,0 +1 @@
+Files under this directory is a collection of redistribution of dependencies. Each file is redistributed under its license.

data/vendor/stylesheets/tokite/bulma/LICENSE

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2023 Jeremy Thomas
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

data/vendor/stylesheets/tokite/bulma/sass/_index.scss

@@ -0,0 +1,10 @@
+@forward "utilities";
+@forward "themes";
+@forward "base";
+@forward "elements";
+@forward "form";
+@forward "components";
+@forward "grid";
+@forward "layout";
+@forward "base/skeleton";
+@forward "helpers";

data/vendor/stylesheets/tokite/bulma/sass/base/_index.scss

@@ -0,0 +1,6 @@
+/* Bulma Base */
+@charset "utf-8";
+
+@forward "minireset";
+@forward "generic";
+@forward "animations";

data/vendor/stylesheets/tokite/bulma/sass/base/animations.scss

@@ -0,0 +1,15 @@
+@keyframes spinAround {
+  from {
+    transform: rotate(0deg);
+  }
+
+  to {
+    transform: rotate(359deg);
+  }
+}
+
+@keyframes pulsate {
+  50% {
+    opacity: 0.5;
+  }
+}

data/vendor/stylesheets/tokite/bulma/sass/base/generic.scss

@@ -0,0 +1,240 @@
+@use "../utilities/initial-variables" as iv;
+@use "../utilities/css-variables.scss" as cv;
+@use "../utilities/mixins" as mx;
+
+$body-background-color: cv.getVar("scheme-main") !default;
+$body-size: 1em !default;
+$body-min-width: 300px !default;
+$body-rendering: optimizeLegibility !default;
+$body-family: cv.getVar("family-primary") !default;
+$body-overflow-x: hidden !default;
+$body-overflow-y: scroll !default;
+
+$body-color: cv.getVar("text") !default;
+$body-font-size: 1em !default;
+$body-weight: cv.getVar("weight-normal") !default;
+$body-line-height: 1.5 !default;
+
+$code-family: cv.getVar("family-code") !default;
+$code-padding: 0.25em 0.5em 0.25em !default;
+$code-weight: normal !default;
+$code-size: 0.875em !default;
+
+$small-font-size: 0.875em !default;
+
+$hr-background-color: cv.getVar("background") !default;
+$hr-height: 2px !default;
+$hr-margin: 1.5rem 0 !default;
+
+$strong-color: cv.getVar("text-strong") !default;
+$strong-weight: cv.getVar("weight-semibold") !default;
+
+$pre-font-size: 0.875em !default;
+$pre-padding: 1.25rem 1.5rem !default;
+$pre-code-font-size: 1em !default;
+
+#{iv.$variables-host} {
+  @include cv.register-vars(
+    (
+      "body-background-color": #{$body-background-color},
+      "body-size": #{$body-size},
+      "body-min-width": #{$body-min-width},
+      "body-rendering": #{$body-rendering},
+      "body-family": #{$body-family},
+      "body-overflow-x": #{$body-overflow-x},
+      "body-overflow-y": #{$body-overflow-y},
+      "body-color": #{$body-color},
+      "body-font-size": #{$body-font-size},
+      "body-weight": #{$body-weight},
+      "body-line-height": #{$body-line-height},
+      "code-family": #{$code-family},
+      "code-padding": #{$code-padding},
+      "code-weight": #{$code-weight},
+      "code-size": #{$code-size},
+      "small-font-size": #{$small-font-size},
+      "hr-background-color": #{$hr-background-color},
+      "hr-height": #{$hr-height},
+      "hr-margin": #{$hr-margin},
+      "strong-color": #{$strong-color},
+      "strong-weight": #{$strong-weight},
+      "pre-font-size": #{$pre-font-size},
+      "pre-padding": #{$pre-padding},
+      "pre-code-font-size": #{$pre-code-font-size},
+    )
+  );
+}
+
+html {
+  background-color: cv.getVar("body-background-color");
+  font-size: cv.getVar("body-size");
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  min-width: cv.getVar("body-min-width");
+  overflow-x: cv.getVar("body-overflow-x");
+  overflow-y: cv.getVar("body-overflow-y");
+  text-rendering: cv.getVar("body-rendering");
+  text-size-adjust: 100%;
+}
+
+article,
+aside,
+figure,
+footer,
+header,
+hgroup,
+section {
+  display: block;
+}
+
+body,
+button,
+input,
+optgroup,
+select,
+textarea {
+  font-family: cv.getVar("body-family");
+}
+
+code,
+pre {
+  -moz-osx-font-smoothing: auto;
+  -webkit-font-smoothing: auto;
+  font-family: cv.getVar("code-family");
+}
+
+body {
+  color: cv.getVar("body-color");
+  font-size: cv.getVar("body-font-size");
+  font-weight: cv.getVar("body-weight");
+  line-height: cv.getVar("body-line-height");
+}
+
+// Inline
+
+a,
+button {
+  cursor: pointer;
+
+  &:focus-visible {
+    outline-color: hsl(
+      cv.getVar("focus-h"),
+      cv.getVar("focus-s"),
+      cv.getVar("focus-l")
+    );
+    outline-offset: cv.getVar("focus-offset");
+    outline-style: cv.getVar("focus-style");
+    outline-width: cv.getVar("focus-width");
+
+    &:active {
+      outline-width: 1px;
+    }
+  }
+
+  &:active {
+    outline-width: 1px;
+  }
+}
+
+a {
+  color: cv.getVar("link-text");
+  cursor: pointer;
+  text-decoration: none;
+  transition-duration: cv.getVar("duration");
+  transition-property: background-color, border-color, color;
+
+  strong {
+    color: currentColor;
+  }
+}
+
+button {
+  @include mx.reset;
+  transition-duration: cv.getVar("duration");
+  transition-property: background-color, border-color, color;
+}
+
+code {
+  background-color: cv.getVar("code-background");
+  border-radius: 0.5em;
+  color: cv.getVar("code");
+  font-size: cv.getVar("code-size");
+  font-weight: cv.getVar("code-weight");
+  padding: cv.getVar("code-padding");
+}
+
+hr {
+  background-color: cv.getVar("hr-background-color");
+  border: none;
+  display: block;
+  height: cv.getVar("hr-height");
+  margin: cv.getVar("hr-margin");
+}
+
+img {
+  height: auto;
+  max-width: 100%;
+}
+
+input[type="checkbox"],
+input[type="radio"] {
+  vertical-align: baseline;
+}
+
+small {
+  font-size: cv.getVar("small-font-size");
+}
+
+span {
+  font-style: inherit;
+  font-weight: inherit;
+}
+
+strong {
+  color: cv.getVar("strong-color");
+  font-weight: cv.getVar("strong-weight");
+}
+
+svg {
+  height: auto;
+  width: auto;
+}
+
+// Block
+
+fieldset {
+  border: none;
+}
+
+pre {
+  @include mx.overflow-touch;
+
+  background-color: cv.getVar("pre-background");
+  color: cv.getVar("pre");
+  font-size: cv.getVar("pre-font-size");
+  overflow-x: auto;
+  padding: cv.getVar("pre-padding");
+  white-space: pre;
+  word-wrap: normal;
+
+  code {
+    background-color: transparent;
+    color: currentColor;
+    font-size: cv.getVar("pre-code-font-size");
+    padding: 0;
+  }
+}
+
+table {
+  td,
+  th {
+    vertical-align: top;
+
+    &:not([align]) {
+      text-align: inherit;
+    }
+  }
+
+  th {
+    color: cv.getVar("text-strong");
+  }
+}

data/vendor/stylesheets/tokite/bulma/sass/base/minireset.scss

@@ -0,0 +1,92 @@
+/*! minireset.css v0.0.6 | MIT License | github.com/jgthms/minireset.css */
+// Blocks
+html,
+body,
+p,
+ol,
+ul,
+li,
+dl,
+dt,
+dd,
+blockquote,
+figure,
+fieldset,
+legend,
+textarea,
+pre,
+iframe,
+hr,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+  margin: 0;
+  padding: 0;
+}
+
+// Headings
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+  font-size: 100%;
+  font-weight: normal;
+}
+
+// List
+ul {
+  list-style: none;
+}
+
+// Form
+button,
+input,
+select,
+textarea {
+  margin: 0;
+}
+
+// Box sizing
+html {
+  box-sizing: border-box;
+}
+
+* {
+  &,
+  &::before,
+  &::after {
+    box-sizing: inherit;
+  }
+}
+
+// Media
+img,
+video {
+  height: auto;
+  max-width: 100%;
+}
+
+// Iframe
+iframe {
+  border: 0;
+}
+
+// Table
+table {
+  border-collapse: collapse;
+  border-spacing: 0;
+}
+
+td,
+th {
+  padding: 0;
+
+  &:not([align]) {
+    text-align: inherit;
+  }
+}

data/vendor/stylesheets/tokite/bulma/sass/base/skeleton.scss

@@ -0,0 +1,114 @@
+@use "../utilities/css-variables" as cv;
+@use "../utilities/initial-variables" as iv;
+@use "../utilities/mixins" as mx;
+@use "../utilities/extends";
+
+$skeleton-background: cv.getVar("border") !default;
+$skeleton-radius: cv.getVar("radius-small") !default;
+$skeleton-block-min-height: 4.5em !default;
+$skeleton-lines-gap: 0.75em !default;
+$skeleton-line-height: 0.75em !default;
+
+#{iv.$variables-host} {
+  @include cv.register-vars(
+    (
+      "skeleton-background": #{$skeleton-background},
+      "skeleton-radius": #{$skeleton-radius},
+      "skeleton-block-min-height": #{$skeleton-block-min-height},
+      "skeleton-lines-gap": #{$skeleton-lines-gap},
+      "skeleton-line-height": #{$skeleton-line-height},
+    )
+  );
+}
+
+%skeleton-pulsation {
+  animation-duration: 2s;
+  animation-iteration-count: infinite;
+  animation-name: pulsate;
+  animation-timing-function: cubic-bezier(0.4, 0, 0.6, 1);
+  background-color: cv.getVar("skeleton-background");
+  border-radius: cv.getVar("skeleton-radius");
+  box-shadow: none;
+  pointer-events: none;
+}
+
+.#{iv.$class-prefix}is-skeleton {
+  @extend %skeleton-pulsation;
+  color: transparent !important;
+
+  em,
+  strong {
+    color: inherit;
+  }
+
+  img {
+    visibility: hidden;
+  }
+
+  &.#{iv.$class-prefix}checkbox {
+    input {
+      opacity: 0;
+    }
+  }
+
+  &.#{iv.$class-prefix}delete {
+    border-radius: cv.getVar("radius-rounded");
+
+    &::before,
+    &::after {
+      display: none;
+    }
+  }
+}
+
+input.#{iv.$class-prefix}is-skeleton,
+textarea.#{iv.$class-prefix}is-skeleton {
+  resize: none;
+
+  @include mx.placeholder {
+    color: transparent !important;
+  }
+}
+
+.#{iv.$class-prefix}has-skeleton {
+  color: transparent !important;
+  position: relative;
+
+  &::after {
+    @extend %skeleton-pulsation;
+    content: "";
+    display: block;
+    height: 100%;
+    left: 0;
+    max-width: 100%;
+    min-width: 10%;
+    position: absolute;
+    top: 0;
+    width: 7em;
+  }
+}
+
+.#{iv.$class-prefix}skeleton-block {
+  @extend %block;
+  @extend %skeleton-pulsation;
+  color: transparent !important;
+  min-height: cv.getVar("skeleton-block-min-height");
+}
+
+.#{iv.$class-prefix}skeleton-lines {
+  color: transparent !important;
+  display: flex;
+  flex-direction: column;
+  gap: cv.getVar("skeleton-lines-gap");
+  position: relative;
+
+  > div {
+    @extend %skeleton-pulsation;
+    height: cv.getVar("skeleton-line-height");
+
+    &:last-child {
+      min-width: 4em;
+      width: 30%;
+    }
+  }
+}

data/vendor/stylesheets/tokite/bulma/sass/components/_index.scss

@@ -0,0 +1,13 @@
+/* Bulma Components */
+@charset "utf-8";
+
+@forward "breadcrumb";
+@forward "card";
+@forward "dropdown";
+@forward "menu";
+@forward "message";
+@forward "modal";
+@forward "navbar";
+@forward "pagination";
+@forward "panel";
+@forward "tabs";