diff --git a/.gitignore b/.gitignore index d620cad..0b39cc7 100644 --- a/.gitignore +++ b/.gitignore @@ -1,3 +1,7 @@ +.idea/ +docs/.jekyll-cache +docs/_site +docs/Gemfile.lock nodejs/node_modules nodejs/node*/node_modules nodejs/package*.json diff --git a/README.md b/README.md index 1bd4789..dff80f0 100644 --- a/README.md +++ b/README.md @@ -2,34 +2,34 @@ ![GitHub](https://img.shields.io/github/license/charoitel/lambda-layer-canvas-nodejs) -[lambda-layer-canvas-nodejs](https://github.com/charoitel/lambda-layer-canvas-nodejs) published on [AWS Serverless Application Repository](https://serverlessrepo.aws.amazon.com/applications/arn:aws:serverlessrepo:us-east-1:990551184979:applications~lambda-layer-canvas-nodejs) packages node-canvas and its dependencies as AWS Lambda Layer. +Canvas Layer for AWS Lambda is published and available on [AWS Serverless Application Repository](https://serverlessrepo.aws.amazon.com/applications/arn:aws:serverlessrepo:us-east-1:990551184979:applications~lambda-layer-canvas-nodejs), and GitHub at [charoitel/lambda-layer-canvas-nodejs](https://github.com/charoitel/lambda-layer-canvas-nodejs). The layer aims to provide a Cairo backed Mozilla Web Canvas API implementation layer for AWS Lambda, powered by [node-canvas](https://github.com/Automattic/node-canvas). ## About node-canvas -[node-canvas](https://github.com/Automattic/node-canvas) is a Cairo backed Canvas implementation for Node.js. It implements the [Mozilla Web Canvas API](https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API) as closely as possible. For the current API compliance, please check [Compatibility Status](https://github.com/Automattic/node-canvas/wiki/Compatibility-Status). +[node-canvas](https://github.com/Automattic/node-canvas) is a Cairo backed Canvas implementation for Node.js. It implements the [Mozilla Web Canvas API](https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API) as closely as possible. For the latest API compliance, you may check [Compatibility Status](https://github.com/Automattic/node-canvas/wiki/Compatibility-Status). ## How this layer is built? -The Lambda Layer is built from source of node-canvas npm package on [amazonlinux](https://hub.docker.com/_/amazonlinux) dev container instance, with following native dependencies installed. Please check ``` build-layer.sh ``` for details. +The layer is built from source of node-canvas npm package on [amazonlinux](https://hub.docker.com/_/amazonlinux) dev container instance, with following native dependencies installed. You may check the build layer script, ``` build-layer.sh ```, which is available in repository, for details. ```bash gcc-c++ cairo-devel pango-devel libjpeg-turbo-devel giflib-devel librsvg2-devel pango-devel bzip2-devel jq python3 ``` -Since AWS Lambda is a secure and isolated runtime and execution environment, this layer aims to target AWS Lambda compatible build. As there are canvas libraries and frameworks relying on node-canvas running on Node.js runtime, this layer also tries to include and support these libraries and frameworks. +Since AWS Lambda is a secure and isolated runtime and execution environment, the layer aims to target AWS Lambda compatible and native build. As there are canvas libraries and frameworks relying on node-canvas running on Node.js runtime, this layer may also try to include and support those libraries and frameworks. Currently, following libraries and frameworks are included when building and packaging the layer: -### Fabric.js support - -[Fabric.js](https://github.com/fabricjs/fabric.js) is a framework that makes it easy to work with HTML5 canvas element. It is an interactive object model on top of canvas element. It is also an SVG-to-canvas (and canvas-to-SVG) parser. +- [Chart.js](#chartjs-support) +- [Fabric.js](#fabricjs-support) +- [Konva](#konva-support) -### Konva support +### Chart.js support -[Konva](https://github.com/konvajs/konva) is a framework that enables high performance animations, transitions, node nesting, layering, filtering, caching, event handling for desktop and mobile applications, and much more. +[Chart.js](https://github.com/chartjs/chart.js) provides a set of frequently used chart types, plugins, and customization options. In addition to a reasonable set of built-in chart types, there are also community-maintained chart types. -> **Note:** From Canvas Layer v2.9.3 release, since konva-node package is deprecated, konva package is used directly through build script. +### Fabric.js support -## Getting started +[Fabric.js](https://github.com/fabricjs/fabric.js) provides a missing and interactive object model for canvas, as well as an SVG parser, layer of interactivity, and a whole suite of other indispensable tools. -To get started, please visit https://github.com/charoitel/lambda-layer-canvas-nodejs/wiki/Getting-Started +### Konva support -Made with ❤️ by Charoite Lee and contributors. Available on the [AWS Serverless Application Repository](https://aws.amazon.com/serverless) +[Konva](https://github.com/konvajs/konva) enables high performance animations, transitions, node nesting, layering, filtering, caching, event handling for desktop and mobile applications, and much more. diff --git a/build-layer.sh b/build-layer.sh index eb40c77..e2bdb24 100755 --- a/build-layer.sh +++ b/build-layer.sh @@ -14,12 +14,13 @@ set -e LAYER_NAME=canvas-nodejs LAYER_DESCRIPTION="AWS Lambda Layer with node-canvas and its dependencies packaged, provides a Cairo backed Mozilla Web Canvas API implementation with additional features." -LAYER_VERSION=2.11.2 +LAYER_VERSION=2.11.3 LAYER_AUTHOR="Charoite Lee" DOT_CHAR="." NODE_VERSION=$(node -v) NODE_VERSION=${NODE_VERSION:1} +SEMVER_VERSION=7.5.4 # Remove packaged layer if exists if [ -n "$(find . -name 'canvas-nodejs_v*.zip')" ]; then @@ -36,13 +37,15 @@ npm init -y npm install canvas --build-from-source npm install fabric npm install konva +npm install chart.js npm install mocha --save-dev -jq --arg LAYER_NAME "$LAYER_NAME" --arg LAYER_DESCRIPTION "$LAYER_DESCRIPTION" --arg LAYER_VERSION "$LAYER_VERSION" --arg LAYER_AUTHOR "$LAYER_AUTHOR" '.name = $LAYER_NAME | .description = $LAYER_DESCRIPTION | .version = $LAYER_VERSION | .license = "MIT" | .author = $LAYER_AUTHOR | .scripts.test = "mocha"' package.json > package-tmp.json +jq --arg LAYER_NAME "$LAYER_NAME" --arg LAYER_DESCRIPTION "$LAYER_DESCRIPTION" --arg LAYER_VERSION "$LAYER_VERSION" --arg LAYER_AUTHOR "$LAYER_AUTHOR" --arg SEMVER_VERSION "$SEMVER_VERSION" '.name = $LAYER_NAME | .description = $LAYER_DESCRIPTION | .version = $LAYER_VERSION | .license = "MIT" | .author = $LAYER_AUTHOR | .scripts.test = "mocha" | .overrides.semver = $SEMVER_VERSION ' package.json > package-tmp.json mv -f package-tmp.json package.json # Test if installed modules and dependencies work fine npm test cp package-lock.json .. +npm rm mocha # Prepare and package layer mkdir node${NODE_VERSION%%$DOT_CHAR*} diff --git a/docs/00-setup.md b/docs/00-setup.md new file mode 100644 index 0000000..79b9757 --- /dev/null +++ b/docs/00-setup.md @@ -0,0 +1,99 @@ +--- +layout: page +title: Setup +permalink: /setup/ +--- + +## Prerequisites + +In order to start to use [lambda-layer-canvas-nodejs](https://github.com/charoitel/lambda-layer-canvas-nodejs) published on [AWS Serverless Application Repository](https://serverlessrepo.aws.amazon.com/applications/arn:aws:serverlessrepo:us-east-1:990551184979:applications~lambda-layer-canvas-nodejs), you must have your AWS account with following services available: + +- [AWS Serverless Application Repository](https://aws.amazon.com/serverless/serverlessrepo) +- [AWS Lambda](https://aws.amazon.com/lambda) + +## Serverless application deployment + +Once you have your AWS account ready, there are two ways to deploy [lambda-layer-canvas-nodejs](https://serverlessrepo.aws.amazon.com/applications/arn:aws:serverlessrepo:us-east-1:990551184979:applications~lambda-layer-canvas-nodejs) and make it available in your AWS Lambda console: + +- [Deploy through AWS Serverless Application Repository](#deploy-through-aws-serverless-application-repository) +- [Deploy through AWS Lambda console](#deploy-through-aws-lambda-console) + +### Deploy through AWS Serverless Application Repository + +1. Open https://serverlessrepo.aws.amazon.com/applications/arn:aws:serverlessrepo:us-east-1:990551184979:applications~lambda-layer-canvas-nodejs +2. Click **Deploy** button +3. Login to your AWS account if you haven't login yet +4. Edit **_Name_** (Optional) +5. Click **Deploy** button +6. Deployment is started and in progress +7. Check your AWS Lambda console once the deployment is completed + +### Deploy through AWS Lambda console + +1. Login to your AWS account and open your AWS Lambda console +2. Click **Create application** button +3. Select **_Serverless application_** +4. Input `lambda-layer-canvas-nodejs` into search box and press _Enter_ key +5. Click on the title of `lambda-layer-canvas-nodejs` card +6. Edit **_Name_** (Optional) +7. Click **Deploy** button +8. Deployment is started and in progress +9. Check your AWS Lambda console once the deployment is completed + +### Using canvas layer + +After the deployment is completed, you may refer [usage example](/lambda-layer-canvas-nodejs/{% link 01-use.md %}) and follow the example where a Lambda function uses the canvas layer to generate PNG graphic with colored text and circle rendered. + +## Setup environment to build the layer + +Alternately, you may setup your own environment to build the layer according to your specific needs. When using the layer with nodejs-18.x in Amazon Linux, it requires glibc-2.28, meanwhile, compiling glibc-2.28 requires make-4.x or later[^1]. + +```console +$ wget https://ftp.gnu.org/gnu/make/make-4.3.tar.gz +$ tar -xzvf make-4.3.tar.gz +$ cd make-4.3/ +$ ./configure --prefix=/usr +$ make +$ make install +``` +Once make-4.x or later is ready, we may start to compiling glibc-2.28 on Amazon Linux. However, during `make install` there would be an error due to `cannot found -lnss_test2` which could be ignored[^2]. + +```console +$ wget https://ftp.gnu.org/gnu/glibc/glibc-2.28.tar.gz +$ tar -xzvf glibc-2.28.tar.gz +$ cd glibc-2.28 +$ mkdir build && cd build +$ ../configure --prefix=/usr --enable-add-ons --with-headers=/usr/include --with-binutils=/usr/bin +$ make +$ make install +... +/usr/bin/ld: cannot find -lnss_test2 +collect2: error: ld returned 1 exit status +Execution of gcc -B/usr/bin/ failed! +... +``` + +To test if the installation of the compiled glibc-2.28 is success or not, we may check if `GLIBC_2.28` is enabled[^1] [^2]. + +```console +$ ls -l /lib64/libc.so.6 +lrwxrwxrwx 1 root root 12 Jul 3 15:14 /lib64/libc.so.6 -> libc-2.28.so +$ strings /lib64/libc.so.6 | grep GLIBC +... +GLIBC_2.22 +GLIBC_2.23 +GLIBC_2.24 +GLIBC_2.25 +GLIBC_2.26 +GLIBC_2.27 +GLIBC_2.28 +GLIBC_PRIVATE +... +``` + +Once your environment is ready, you may execute the build layer script, ``` build-layer.sh ```, to build the layer and deploy through the AWS Lambda console. + +--- + +[^1]: [Centos 7 升级 Glibc-2.28](https://cloud.tencent.com/developer/article/2021784) +[^2]: [CentOS 7.6 编译安装最新版本glibc2.30 实录](https://www.jianshu.com/p/1070373a50f6) \ No newline at end of file diff --git a/docs/01-use.md b/docs/01-use.md new file mode 100644 index 0000000..4a432ba --- /dev/null +++ b/docs/01-use.md @@ -0,0 +1,93 @@ +--- +layout: page +title: Use +permalink: /use/ +--- + +## Using canvas layer in function + +Before starting to use the canvas layer, it is required to have the layer deployed through AWS Serverless Application Repository or AWS Lambda console, you may refer [setup information](/lambda-layer-canvas-nodejs/{% link 00-setup.md %}) for details. Then, you may create your Lambda function using: + +* AWS Lambda console editor; or +* Local tool in your machine; or +* Any way you may prefer + +Following is an example where a Lambda function uses the canvas layer to generate PNG graphic with colored text and circle rendered. There is no environment variable setting is required in this example. + +## Function structure + +The setup of the function may look like the following structure. For font file, you may use any supported font file you like, in this example, we are going to use DejaVu Sans[^2] which could be originally found in Amazon Linux 2 EC2 instance. + +``` +/var/task/ + . + ├── fonts/ + ├── DejaVuSans.ttf + ├── fonts.conf + ├── index.js +``` + +## Font configuration using fonts.config + +Since AWS Lambda does not appear to support even the basic fonts on its own, so we create the fonts directory at the root directory for our Lambda function with following font configuration file[^1]. + +```xml + + + + /var/task/fonts + /tmp/fonts-cache/ + + +``` + +## Build function code in index.js + +Once the setup is ready, we may put following function code and test it in AWS Lambda console. + +```javascript +let { registerFont, createCanvas } = require('canvas'); + +exports.handler = async (event) => { + registerFont(__dirname.concat('/fonts/DejaVuSans.ttf'), { family: 'DejaVu Sans' }); + + let canvas = createCanvas(300, 300); + var ctxCircle = canvas.getContext('2d'); + var X = canvas.width / 2; + var Y = canvas.height / 2; + var R = 45; + ctxCircle.beginPath(); + ctxCircle.arc(X, Y, R, 0, 2 * Math.PI, false); + ctxCircle.lineWidth = 3; + ctxCircle.strokeStyle = '#FF9900'; + ctxCircle.stroke(); + + var ctxText = canvas.getContext('2d'); + ctxText.font = '40px "DejaVu Sans"'; + ctxText.fillStyle = '#146EB4'; + ctxText.fillText('DejaVu Sans', 15, 120); + + const response = { + statusCode: 200, + body: JSON.stringify(canvas.toDataURL()), + }; + + return response; +}; +``` +Following is the sample response from the above example function code. + +```JSON +{ + "statusCode": 200, + "body": "\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAASwAAAEsCAYAAAB5fY51AAAABmJLR0QA/wD/AP+gvaeTAAAgAElEQVR4nO3dd3hc5Zn38e99RpI7LhoZTAvhNRBKKAGWloRACsUyNs0hhJqNLZpkU5bsJrtEpJEC2MgBWwYSEjYJmB7JxlSTpSRLaAmBEKqzNBfJDdvYkubc7x8ajc6ojqwyM/Lvc12+POfRc87cmnLrPOc8BUREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREREtkWW7QDyRcnMms+625Mt226cXX9D6X9nMyaBkosWjqRg2OlgR4fGZ8zZARgNJIB1hi9z7K9u/nTBlqIlK+YftzLLIUsvFPTVgXa8vCbe0GiruqnWYPCRwzrwdYYtc3gR54UCgmeXzz2xu/23afHy2qswrm7ZNvjVqqrS83p93Fk1XyC0pZGiv9dVle7T2+P2q8qFRfHVw77t2GXAKADzdrWGObYDcLi5zUgUNYbxitqn3Lh51LoRdy+77ZjNAxy19FIwwM9X5FAM7A52kMPJwPcwapss/DBeXru0ZGbNV6lc2meJdDBJBH4bELZsO5wWv/KBUb09riWC89sU/aK3x+xP2126ZFx8zfCnwb5LMlllKAA+b87tG7bb0OtELwNvoBNWV2IYX3C3O+L1G18qmVnz2WwHlGvW3DD5/wx7NFI0wj6Ond6bY44rX7ydm58aKWoMLHF7b47Zr2Y8V1iUSCzBOSRS6ji/x+3MwIOJ1rRpVN24TUNCD3Yx7ASMOcB72QpZ+k6/nck4LKuvKv1k2/Jx5Yu3o7BhdCwsLHYPD3W3ww2mAuNSlYx93W1pSUXtZauqSuf2V4x5ycJf4PaVlk03zqMXZ0SB+TRgRKRo8cobpqzoRYT9Kj70w3KwQ1MFxjoPOa1+bumjbeuubk5S7wFLmPHclfEhH07D7NtAbjd3pVN9dtG9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xX8m4Kv5fl0n+bvdCRwSKX6dgOPz/XeTzilhDXL+S8bQwK2kLw+2HvgvxnKjTSORpdC2ildSwAQuAa6mdbgNNK96869WxrrsRCYDQQlrG+HVzACqgCGR4r9gXGQzeCZLYfWIz+cQjJuAQyPFWzC+xXSq1M9q8FPC2oYkv/C/AvaJFuP8FvhRcjmxnJO8Hvcdmiffi35mX2ttpg0AAAJ5SURBVCHgXA232XYoYW1jvJpCjItwvg+Miv4IZxHO9+1Cns1WfFE+nwMwLgfOhLRJCjcBP2MsPxosNxAkM0pY2yi/kV0oYDZwagc/fgrj1xRy10D3EE9ec5tG87qBn+2gyl0EXGbTeW8g45LcoIS1jfObOZiQ/wSm0P7zsBmowbmPBEvtYpb3Sww3sgMFHItxMk4pMLRNlRC4H/ihlaVWwJZtkBKWAMnrRDG+jXMaUNhJtVcxHgOeIcE/GMHrdk5qqubMnudGRlLAnjh7YRwJHEv6NbWoRuAujB8lVwySbZwSlqTxX1BCI1+juUl2SHf1gXeBt4E6YAOwAWND88EYCal/cWB3WofOdM54Nrl8/B1a5FSilLCkU34ze5PgVIxjgSNo31TrK5txnsF4jAT32EX8o5+eR/KcEpZkxK9nGMM5EuNonP0w9gImQo/nkW8A3gReo7lbwhMU8IydnxqwLdIpJSzZal5JATuzG86uOGNTTcDm/0k2DZubiMYaQv7JWJblW+96ERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERERER4f8DqOCCaaubKHMAAAAASUVORK5CYII=\"" +} +``` +As a result, the generated PNG graphic with colored text and circle rendered may look like as follow. + +![](/assets/DejaVuSansCircle.png) + +--- + +[^1]: [AWS Lambda Fonts & libfontconfig](https://medium.com/creditorwatch/aws-lambda-fonts-libfontconfig-5e837281a4ce) +[^2]: [DejaVu Fonts](https://dejavu-fonts.github.io/) diff --git a/docs/404.html b/docs/404.html new file mode 100644 index 0000000..086a5c9 --- /dev/null +++ b/docs/404.html @@ -0,0 +1,25 @@ +--- +permalink: /404.html +layout: default +--- + + + +
+

404

+ +

Page not found :(

+

The requested page could not be found.

+
diff --git a/docs/Gemfile b/docs/Gemfile new file mode 100644 index 0000000..4e0684e --- /dev/null +++ b/docs/Gemfile @@ -0,0 +1 @@ +gem "minima" diff --git a/docs/LICENSE.txt b/docs/LICENSE.txt new file mode 100644 index 0000000..0e7ecd8 --- /dev/null +++ b/docs/LICENSE.txt @@ -0,0 +1,21 @@ +The MIT License (MIT) + +Copyright (c) 2016-present Parker Moore and the minima contributors + +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. diff --git a/docs/_config.yml b/docs/_config.yml new file mode 100644 index 0000000..db1c5a2 --- /dev/null +++ b/docs/_config.yml @@ -0,0 +1,8 @@ +title: Canvas Layer for AWS Lambda +description: > + Cairo backed Mozilla Web Canvas API implementation layer for AWS Lambda +theme: minima +minima: + social_links: + - { platform: github, user_url: "https://github.com/charoitel/lambda-layer-canvas-nodejs" } + - { platform: linkedin, user_url: "https://www.linkedin.com/in/charoitel" } diff --git a/docs/_includes/custom-head.html b/docs/_includes/custom-head.html new file mode 100644 index 0000000..61776a1 --- /dev/null +++ b/docs/_includes/custom-head.html @@ -0,0 +1 @@ + diff --git a/docs/_includes/disqus_comments.html b/docs/_includes/disqus_comments.html new file mode 100644 index 0000000..d9400f2 --- /dev/null +++ b/docs/_includes/disqus_comments.html @@ -0,0 +1,20 @@ +{%- if page.comments != false and jekyll.environment == "production" -%} + +
+ + +{%- endif -%} diff --git a/docs/_includes/footer.html b/docs/_includes/footer.html new file mode 100644 index 0000000..96c1f42 --- /dev/null +++ b/docs/_includes/footer.html @@ -0,0 +1,29 @@ + diff --git a/docs/_includes/google-analytics.html b/docs/_includes/google-analytics.html new file mode 100644 index 0000000..b8b4d38 --- /dev/null +++ b/docs/_includes/google-analytics.html @@ -0,0 +1,9 @@ + + diff --git a/docs/_includes/head.html b/docs/_includes/head.html new file mode 100644 index 0000000..9ee139f --- /dev/null +++ b/docs/_includes/head.html @@ -0,0 +1,14 @@ + + + + + {%- seo -%} + + {%- feed_meta -%} + {%- if jekyll.environment == 'production' and site.google_analytics -%} + {%- include google-analytics.html -%} + {%- endif -%} + + {%- include custom-head.html -%} + + diff --git a/docs/_includes/header.html b/docs/_includes/header.html new file mode 100644 index 0000000..ed5a382 --- /dev/null +++ b/docs/_includes/header.html @@ -0,0 +1,31 @@ + diff --git a/docs/_includes/social-icons/devto.svg b/docs/_includes/social-icons/devto.svg new file mode 100644 index 0000000..f595e0e --- /dev/null +++ b/docs/_includes/social-icons/devto.svg @@ -0,0 +1 @@ + diff --git a/docs/_includes/social-icons/dribbble.svg b/docs/_includes/social-icons/dribbble.svg new file mode 100644 index 0000000..1d95de0 --- /dev/null +++ b/docs/_includes/social-icons/dribbble.svg @@ -0,0 +1 @@ + diff --git a/docs/_includes/social-icons/facebook.svg b/docs/_includes/social-icons/facebook.svg new file mode 100644 index 0000000..c022403 --- /dev/null +++ b/docs/_includes/social-icons/facebook.svg @@ -0,0 +1 @@ + diff --git a/docs/_includes/social-icons/flickr.svg b/docs/_includes/social-icons/flickr.svg new file mode 100644 index 0000000..3b38772 --- /dev/null +++ b/docs/_includes/social-icons/flickr.svg @@ -0,0 +1 @@ + diff --git a/docs/_includes/social-icons/github.svg b/docs/_includes/social-icons/github.svg new file mode 100644 index 0000000..9301f84 --- /dev/null +++ b/docs/_includes/social-icons/github.svg @@ -0,0 +1 @@ + diff --git a/docs/_includes/social-icons/gitlab.svg b/docs/_includes/social-icons/gitlab.svg new file mode 100644 index 0000000..a03e5f9 --- /dev/null +++ b/docs/_includes/social-icons/gitlab.svg @@ -0,0 +1 @@ + diff --git a/docs/_includes/social-icons/google_scholar.svg b/docs/_includes/social-icons/google_scholar.svg new file mode 100644 index 0000000..37aab26 --- /dev/null +++ b/docs/_includes/social-icons/google_scholar.svg @@ -0,0 +1 @@ + diff --git a/docs/_includes/social-icons/instagram.svg b/docs/_includes/social-icons/instagram.svg new file mode 100644 index 0000000..d483d14 --- /dev/null +++ b/docs/_includes/social-icons/instagram.svg @@ -0,0 +1 @@ + diff --git a/docs/_includes/social-icons/keybase.svg b/docs/_includes/social-icons/keybase.svg new file mode 100644 index 0000000..0770447 --- /dev/null +++ b/docs/_includes/social-icons/keybase.svg @@ -0,0 +1,4 @@ + + + + diff --git a/docs/_includes/social-icons/linkedin.svg b/docs/_includes/social-icons/linkedin.svg new file mode 100644 index 0000000..8a61bf1 --- /dev/null +++ b/docs/_includes/social-icons/linkedin.svg @@ -0,0 +1 @@ + diff --git a/docs/_includes/social-icons/mastodon.svg b/docs/_includes/social-icons/mastodon.svg new file mode 100644 index 0000000..77d35f4 --- /dev/null +++ b/docs/_includes/social-icons/mastodon.svg @@ -0,0 +1 @@ + diff --git a/docs/_includes/social-icons/microdotblog.svg b/docs/_includes/social-icons/microdotblog.svg new file mode 100644 index 0000000..285a719 --- /dev/null +++ b/docs/_includes/social-icons/microdotblog.svg @@ -0,0 +1 @@ + diff --git a/docs/_includes/social-icons/pinterest.svg b/docs/_includes/social-icons/pinterest.svg new file mode 100644 index 0000000..d3963c6 --- /dev/null +++ b/docs/_includes/social-icons/pinterest.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/docs/_includes/social-icons/rss.svg b/docs/_includes/social-icons/rss.svg new file mode 100644 index 0000000..e531f94 --- /dev/null +++ b/docs/_includes/social-icons/rss.svg @@ -0,0 +1 @@ + diff --git a/docs/_includes/social-icons/stackoverflow.svg b/docs/_includes/social-icons/stackoverflow.svg new file mode 100644 index 0000000..c2c78c4 --- /dev/null +++ b/docs/_includes/social-icons/stackoverflow.svg @@ -0,0 +1 @@ + diff --git a/docs/_includes/social-icons/telegram.svg b/docs/_includes/social-icons/telegram.svg new file mode 100644 index 0000000..40bc43b --- /dev/null +++ b/docs/_includes/social-icons/telegram.svg @@ -0,0 +1 @@ + diff --git a/docs/_includes/social-icons/twitter.svg b/docs/_includes/social-icons/twitter.svg new file mode 100644 index 0000000..0f5322f --- /dev/null +++ b/docs/_includes/social-icons/twitter.svg @@ -0,0 +1 @@ + diff --git a/docs/_includes/social-icons/youtube.svg b/docs/_includes/social-icons/youtube.svg new file mode 100644 index 0000000..dfd5661 --- /dev/null +++ b/docs/_includes/social-icons/youtube.svg @@ -0,0 +1 @@ + diff --git a/docs/_includes/social-item.html b/docs/_includes/social-item.html new file mode 100644 index 0000000..7f2e101 --- /dev/null +++ b/docs/_includes/social-item.html @@ -0,0 +1,7 @@ +
  • {% assign entry = include.item %} + + + + + +
  • diff --git a/docs/_includes/social.html b/docs/_includes/social.html new file mode 100644 index 0000000..8a4af8b --- /dev/null +++ b/docs/_includes/social.html @@ -0,0 +1,5 @@ + diff --git a/docs/_includes/svg_symbol.html b/docs/_includes/svg_symbol.html new file mode 100644 index 0000000..5c9127c --- /dev/null +++ b/docs/_includes/svg_symbol.html @@ -0,0 +1,3 @@ + + {%- include social-icons/{{ include.key }}.svg -%} + diff --git a/docs/_layouts/base.html b/docs/_layouts/base.html new file mode 100644 index 0000000..58e141b --- /dev/null +++ b/docs/_layouts/base.html @@ -0,0 +1,20 @@ + + + + {%- include head.html -%} + + + + {%- include header.html -%} + +
    +
    + {{ content }} +
    +
    + + {%- include footer.html -%} + + + + diff --git a/docs/_layouts/home.html b/docs/_layouts/home.html new file mode 100644 index 0000000..a5aa328 --- /dev/null +++ b/docs/_layouts/home.html @@ -0,0 +1,61 @@ +--- +layout: base +--- + +
    + {%- if page.title -%} +

    {{ page.title }}

    + {%- endif -%} + + {{ content }} + + + {% if site.paginate %} + {% assign posts = paginator.posts %} + {% else %} + {% assign posts = site.posts %} + {% endif %} + + + {%- if posts.size > 0 -%} + {%- if page.list_title -%} +

    {{ page.list_title }}

    + {%- endif -%} +
      + {%- assign date_format = site.minima.date_format | default: "%b %-d, %Y" -%} + {%- for post in posts -%} +
    • + +

      + + {{ post.title | escape }} + +

      + {%- if site.show_excerpts -%} + {{ post.excerpt }} + {%- endif -%} +
    • + {%- endfor -%} +
    + + {% if site.paginate %} +
    + +
    + {%- endif %} + + {%- endif -%} + +
    \ No newline at end of file diff --git a/docs/_layouts/page.html b/docs/_layouts/page.html new file mode 100644 index 0000000..18544b4 --- /dev/null +++ b/docs/_layouts/page.html @@ -0,0 +1,14 @@ +--- +layout: base +--- +
    + +
    +

    {{ page.title | escape }}

    +
    + +
    + {{ content }} +
    + +
    diff --git a/docs/_layouts/post.html b/docs/_layouts/post.html new file mode 100644 index 0000000..dc71866 --- /dev/null +++ b/docs/_layouts/post.html @@ -0,0 +1,38 @@ +--- +layout: base +--- +
    + +
    +

    {{ page.title | escape }}

    + +
    + +
    + {{ content }} +
    + + {%- if site.disqus.shortname -%} + {%- include disqus_comments.html -%} + {%- endif -%} + + +
    diff --git a/docs/_sass/minima/_base.scss b/docs/_sass/minima/_base.scss new file mode 100644 index 0000000..ea8d8f2 --- /dev/null +++ b/docs/_sass/minima/_base.scss @@ -0,0 +1,281 @@ +html { + font-size: $base-font-size; +} + +/** + * Reset some basic elements + */ +body, h1, h2, h3, h4, h5, h6, +p, blockquote, pre, hr, +dl, dd, ol, ul, figure { + margin: 0; + padding: 0; + +} + + + +/** + * Basic styling + */ +body { + font: $base-font-weight #{$base-font-size}/#{$base-line-height} $base-font-family; + color: $text-color; + background-color: $background-color; + -webkit-text-size-adjust: 100%; + -webkit-font-feature-settings: "kern" 1; + -moz-font-feature-settings: "kern" 1; + -o-font-feature-settings: "kern" 1; + font-feature-settings: "kern" 1; + font-kerning: normal; + display: flex; + min-height: 100vh; + flex-direction: column; + overflow-wrap: break-word; +} + + + +/** + * Set `margin-bottom` to maintain vertical rhythm + */ +h1, h2, h3, h4, h5, h6, +p, blockquote, pre, +ul, ol, dl, figure, +%vertical-rhythm { + margin-bottom: $spacing-unit * .5; +} + +hr { + margin-top: $spacing-unit; + margin-bottom: $spacing-unit; +} + +/** + * `main` element + */ +main { + display: block; /* Default value of `display` of `main` element is 'inline' in IE 11. */ +} + + + +/** + * Images + */ +img { + max-width: 100%; + vertical-align: middle; +} + + + +/** + * Figures + */ +figure > img { + display: block; +} + +figcaption { + font-size: $small-font-size; +} + + + +/** + * Lists + */ +ul, ol { + margin-left: $spacing-unit; +} + +li { + > ul, + > ol { + margin-bottom: 0; + } +} + + + +/** + * Headings + */ +h1, h2, h3, h4, h5, h6 { + font-weight: $base-font-weight; +} + + + +/** + * Links + */ +a { + color: $link-base-color; + text-decoration: none; + + &:visited { + color: $link-visited-color; + } + + &:hover { + color: $link-hover-color; + text-decoration: underline; + } + + .social-media-list &:hover { + text-decoration: none; + + .username { + text-decoration: underline; + } + } +} + + +/** + * Blockquotes + */ +blockquote { + color: $brand-color; + border-left: 4px solid $border-color-01; + padding-left: $spacing-unit * .5; + @include relative-font-size(1.125); + font-style: italic; + + > :last-child { + margin-bottom: 0; + } + + i, em { + font-style: normal; + } +} + + + +/** + * Code formatting + */ +pre, +code { + font-family: $code-font-family; + font-size: 0.9375em; + border: 1px solid $border-color-01; + border-radius: 3px; + background-color: $code-background-color; +} + +code { + padding: 1px 5px; +} + +pre { + padding: 8px 12px; + overflow-x: auto; + + > code { + border: 0; + padding-right: 0; + padding-left: 0; + } +} + +.highlight { + border-radius: 3px; + background: $code-background-color; + @extend %vertical-rhythm; + + .highlighter-rouge & { + background: $code-background-color; + } +} + + + +/** + * Wrapper + */ +.wrapper { + max-width: calc(#{$content-width} - (#{$spacing-unit})); + margin-right: auto; + margin-left: auto; + padding-right: $spacing-unit * .5; + padding-left: $spacing-unit * .5; + @extend %clearfix; + + @media screen and (min-width: $on-large) { + max-width: calc(#{$content-width} - (#{$spacing-unit} * 2)); + padding-right: $spacing-unit; + padding-left: $spacing-unit; + } +} + + + +/** + * Clearfix + */ +%clearfix:after { + content: ""; + display: table; + clear: both; +} + + + +/** + * Icons + */ + +.orange { + color: #f66a0a; +} + +.grey { + color: #828282; +} + +.svg-icon { + width: 1.25em; + height: 1.25em; + display: inline-block; + fill: currentColor; + vertical-align: text-bottom; +} + + +/** + * Tables + */ +table { + margin-bottom: $spacing-unit; + width: 100%; + text-align: $table-text-align; + color: $table-text-color; + border-collapse: collapse; + border: 1px solid $table-border-color; + tr { + &:nth-child(even) { + background-color: $table-zebra-color; + } + } + th, td { + padding: ($spacing-unit * 33.3333333333 * .01) ($spacing-unit * .5); + } + th { + background-color: $table-header-bg-color; + border: 1px solid $table-header-border; + } + td { + border: 1px solid $table-border-color; + } + + @include media-query($on-laptop) { + display: block; + overflow-x: auto; + -webkit-overflow-scrolling: touch; + -ms-overflow-style: -ms-autohiding-scrollbar; + } +} diff --git a/docs/_sass/minima/_layout.scss b/docs/_sass/minima/_layout.scss new file mode 100644 index 0000000..4aa8582 --- /dev/null +++ b/docs/_sass/minima/_layout.scss @@ -0,0 +1,341 @@ +/** + * Site header + */ +.site-header { + border-top: 5px solid $border-color-03; + border-bottom: 1px solid $border-color-01; + min-height: $spacing-unit * 1.865; + line-height: $base-line-height * $base-font-size * 2.25; + + // Positioning context for the mobile navigation icon + position: relative; +} + +.site-title { + @include relative-font-size(1.625); + font-weight: 300; + letter-spacing: -1px; + margin-bottom: 0; + float: left; + + @include media-query($on-palm) { + padding-right: 45px; + } + + &, + &:visited { + color: $site-title-color; + } +} + +.site-nav { + position: absolute; + top: 9px; + right: $spacing-unit * .5; + background-color: $background-color; + border: 1px solid $border-color-01; + border-radius: 5px; + text-align: right; + + .nav-trigger { + display: none; + } + + .menu-icon { + float: right; + width: 36px; + height: 26px; + line-height: 0; + padding-top: 10px; + text-align: center; + + > svg path { + fill: $border-color-03; + } + } + + label[for="nav-trigger"] { + display: block; + float: right; + width: 36px; + height: 36px; + z-index: 2; + cursor: pointer; + } + + input ~ .trigger { + clear: both; + display: none; + } + + input:checked ~ .trigger { + display: block; + padding-bottom: 5px; + } + + .page-link { + color: $text-color; + line-height: $base-line-height; + display: block; + padding: 5px 10px; + + // Gaps between nav items, but not on the last one + &:not(:last-child) { + margin-right: 0; + } + margin-left: 20px; + } + + @media screen and (min-width: $on-medium) { + position: static; + float: right; + border: none; + background-color: inherit; + + label[for="nav-trigger"] { + display: none; + } + + .menu-icon { + display: none; + } + + input ~ .trigger { + display: block; + } + + .page-link { + display: inline; + padding: 0; + + &:not(:last-child) { + margin-right: 20px; + } + margin-left: auto; + } + } +} + + + +/** + * Site footer + */ +.site-footer { + border-top: 1px solid $border-color-01; + padding: $spacing-unit 0; +} + +.footer-heading { + @include relative-font-size(1.125); + margin-bottom: $spacing-unit * .5; +} + +.feed-subscribe .svg-icon { + padding: 5px 5px 2px 0 +} + +.contact-list, +.social-media-list { + list-style: none; + margin-left: 0; +} + +.footer-col-wrapper, +.social-links { + @include relative-font-size(0.9375); + color: $brand-color; +} + +.footer-col { + margin-bottom: $spacing-unit * .5; +} + +.footer-col-1, +.footer-col-2 { + width: calc(50% - (#{$spacing-unit} / 2)); +} + +.footer-col-3 { + width: calc(100% - (#{$spacing-unit} / 2)); +} + +@media screen and (min-width: $on-large) { + .footer-col-1 { + width: calc(35% - (#{$spacing-unit} / 2)); + } + + .footer-col-2 { + width: calc(20% - (#{$spacing-unit} / 2)); + } + + .footer-col-3 { + width: calc(45% - (#{$spacing-unit} / 2)); + } +} + +@media screen and (min-width: $on-medium) { + .footer-col-wrapper { + display: flex + } + + .footer-col { + width: calc(100% - (#{$spacing-unit} / 2)); + padding: 0 ($spacing-unit * .5); + + &:first-child { + padding-right: $spacing-unit * .5; + padding-left: 0; + } + + &:last-child { + padding-right: 0; + padding-left: $spacing-unit * .5; + } + } +} + + + +/** + * Page content + */ +.page-content { + padding: $spacing-unit 0; + flex: 1 0 auto; +} + +.page-heading { + @include relative-font-size(2); +} + +.post-list-heading { + @include relative-font-size(1.75); +} + +.post-list { + margin-left: 0; + list-style: none; + + > li { + margin-bottom: $spacing-unit; + } +} + +.post-meta { + font-size: $small-font-size; + color: $brand-color; +} + +.post-link { + display: block; + @include relative-font-size(1.5); +} + + + +/** + * Posts + */ +.post-header { + margin-bottom: $spacing-unit; +} + +.post-title, +.post-content h1 { + @include relative-font-size(2.625); + letter-spacing: -1px; + line-height: 1.15; + + @media screen and (min-width: $on-large) { + @include relative-font-size(2.625); + } +} + +.post-content { + margin-bottom: $spacing-unit; + + h1, h2, h3, h4, h5, h6 { margin-top: $spacing-unit } + + h2 { + @include relative-font-size(1.75); + + @media screen and (min-width: $on-large) { + @include relative-font-size(2); + } + } + + h3 { + @include relative-font-size(1.375); + + @media screen and (min-width: $on-large) { + @include relative-font-size(1.625); + } + } + + h4 { + @include relative-font-size(1.25); + } + + h5 { + @include relative-font-size(1.125); + } + h6 { + @include relative-font-size(1.0625); + } +} + + +.social-media-list { + display: table; + margin: 0 auto; + li { + float: left; + margin: 5px 10px 5px 0; + &:last-of-type { margin-right: 0 } + a { + display: block; + padding: 10px 12px; + border: 1px solid $border-color-01; + &:hover { border-color: $border-color-02 } + } + } +} + + + +/** + * Pagination navbar + */ +.pagination { + margin-bottom: $spacing-unit; + @extend .social-media-list; + li { + a, div { + min-width: 41px; + text-align: center; + box-sizing: border-box; + } + div { + display: block; + padding: $spacing-unit * .25; + border: 1px solid transparent; + + &.pager-edge { + color: $border-color-01; + border: 1px dashed; + } + } + } +} + + + +/** + * Grid helpers + */ +@media screen and (min-width: $on-large) { + .one-half { + width: calc(50% - (#{$spacing-unit} / 2)); + } +} diff --git a/docs/_sass/minima/custom-styles.scss b/docs/_sass/minima/custom-styles.scss new file mode 100644 index 0000000..7c1417f --- /dev/null +++ b/docs/_sass/minima/custom-styles.scss @@ -0,0 +1,2 @@ +// Placeholder to allow defining custom styles that override everything else. +// (Use `_sass/minima/custom-variables.scss` to override variable defaults) diff --git a/docs/_sass/minima/custom-variables.scss b/docs/_sass/minima/custom-variables.scss new file mode 100644 index 0000000..2a2d0fa --- /dev/null +++ b/docs/_sass/minima/custom-variables.scss @@ -0,0 +1 @@ +// Placeholder to allow overriding predefined variables smoothly. diff --git a/docs/_sass/minima/initialize.scss b/docs/_sass/minima/initialize.scss new file mode 100644 index 0000000..76efd77 --- /dev/null +++ b/docs/_sass/minima/initialize.scss @@ -0,0 +1,50 @@ +@charset "utf-8"; + +// Define defaults for each variable. + +$base-font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", "Segoe UI Emoji", "Segoe UI Symbol", "Apple Color Emoji", Roboto, Helvetica, Arial, sans-serif !default; +$code-font-family: "Menlo", "Inconsolata", "Consolas", "Roboto Mono", "Ubuntu Mono", "Liberation Mono", "Courier New", monospace; +$base-font-size: 16px !default; +$base-font-weight: 400 !default; +$small-font-size: $base-font-size * 0.875 !default; +$base-line-height: 1.5 !default; + +$spacing-unit: 30px !default; + +$table-text-align: left !default; + +// Width of the content area +$content-width: 800px !default; + +$on-palm: 600px !default; +$on-laptop: 800px !default; + +$on-medium: $on-palm !default; +$on-large: $on-laptop !default; + +// Use media queries like this: +// @include media-query($on-palm) { +// .wrapper { +// padding-right: $spacing-unit / 2; +// padding-left: $spacing-unit / 2; +// } +// } +// Notice the following mixin uses max-width, in a deprecated, desktop-first +// approach, whereas media queries used elsewhere now use min-width. +@mixin media-query($device) { + @media screen and (max-width: $device) { + @content; + } +} + +@mixin relative-font-size($ratio) { + font-size: #{$ratio}rem; +} + +// Import pre-styling-overrides hook and style-partials. +@import + "minima/custom-variables", // Hook to override predefined variables. + "minima/base", // Defines element resets. + "minima/layout", // Defines structure and style based on CSS selectors. + "minima/custom-styles" // Hook to override existing styles. +; diff --git a/docs/_sass/minima/skins/auto.scss b/docs/_sass/minima/skins/auto.scss new file mode 100644 index 0000000..8902e8c --- /dev/null +++ b/docs/_sass/minima/skins/auto.scss @@ -0,0 +1,361 @@ +@charset "utf-8"; + +// Default color scheme settings +// These are overridden in classic.css and dark.scss + +$color-scheme-auto: true !default; +$color-scheme-dark: false !default; + + +// Light mode +// ---------- + +$lm-brand-color: #828282 !default; +$lm-brand-color-light: lighten($lm-brand-color, 40%) !default; +$lm-brand-color-dark: darken($lm-brand-color, 25%) !default; + +$lm-site-title-color: $lm-brand-color-dark !default; + +$lm-text-color: #111111 !default; +$lm-background-color: #fdfdfd !default; +$lm-code-background-color: #eeeeff !default; + +$lm-link-base-color: #2a7ae2 !default; +$lm-link-visited-color: darken($lm-link-base-color, 15%) !default; +$lm-link-hover-color: $lm-text-color !default; + +$lm-border-color-01: $lm-brand-color-light !default; +$lm-border-color-02: lighten($lm-brand-color, 35%) !default; +$lm-border-color-03: $lm-brand-color-dark !default; + +$lm-table-text-color: lighten($lm-text-color, 18%) !default; +$lm-table-zebra-color: lighten($lm-brand-color, 46%) !default; +$lm-table-header-bg-color: lighten($lm-brand-color, 43%) !default; +$lm-table-header-border: lighten($lm-brand-color, 37%) !default; +$lm-table-border-color: $lm-border-color-01 !default; + + +// Syntax highlighting styles should be adjusted appropriately for every "skin" +// ---------------------------------------------------------------------------- + +@mixin lm-highlight { + .highlight { + .c { color: #998; font-style: italic } // Comment + .err { color: #a61717; background-color: #e3d2d2 } // Error + .k { font-weight: bold } // Keyword + .o { font-weight: bold } // Operator + .cm { color: #998; font-style: italic } // Comment.Multiline + .cp { color: #999; font-weight: bold } // Comment.Preproc + .c1 { color: #998; font-style: italic } // Comment.Single + .cs { color: #999; font-weight: bold; font-style: italic } // Comment.Special + .gd { color: #000; background-color: #fdd } // Generic.Deleted + .gd .x { color: #000; background-color: #faa } // Generic.Deleted.Specific + .ge { font-style: italic } // Generic.Emph + .gr { color: #a00 } // Generic.Error + .gh { color: #999 } // Generic.Heading + .gi { color: #000; background-color: #dfd } // Generic.Inserted + .gi .x { color: #000; background-color: #afa } // Generic.Inserted.Specific + .go { color: #888 } // Generic.Output + .gp { color: #555 } // Generic.Prompt + .gs { font-weight: bold } // Generic.Strong + .gu { color: #aaa } // Generic.Subheading + .gt { color: #a00 } // Generic.Traceback + .kc { font-weight: bold } // Keyword.Constant + .kd { font-weight: bold } // Keyword.Declaration + .kp { font-weight: bold } // Keyword.Pseudo + .kr { font-weight: bold } // Keyword.Reserved + .kt { color: #458; font-weight: bold } // Keyword.Type + .m { color: #099 } // Literal.Number + .s { color: #d14 } // Literal.String + .na { color: #008080 } // Name.Attribute + .nb { color: #0086B3 } // Name.Builtin + .nc { color: #458; font-weight: bold } // Name.Class + .no { color: #008080 } // Name.Constant + .ni { color: #800080 } // Name.Entity + .ne { color: #900; font-weight: bold } // Name.Exception + .nf { color: #900; font-weight: bold } // Name.Function + .nn { color: #555 } // Name.Namespace + .nt { color: #000080 } // Name.Tag + .nv { color: #008080 } // Name.Variable + .ow { font-weight: bold } // Operator.Word + .w { color: #bbb } // Text.Whitespace + .mf { color: #099 } // Literal.Number.Float + .mh { color: #099 } // Literal.Number.Hex + .mi { color: #099 } // Literal.Number.Integer + .mo { color: #099 } // Literal.Number.Oct + .sb { color: #d14 } // Literal.String.Backtick + .sc { color: #d14 } // Literal.String.Char + .sd { color: #d14 } // Literal.String.Doc + .s2 { color: #d14 } // Literal.String.Double + .se { color: #d14 } // Literal.String.Escape + .sh { color: #d14 } // Literal.String.Heredoc + .si { color: #d14 } // Literal.String.Interpol + .sx { color: #d14 } // Literal.String.Other + .sr { color: #009926 } // Literal.String.Regex + .s1 { color: #d14 } // Literal.String.Single + .ss { color: #990073 } // Literal.String.Symbol + .bp { color: #999 } // Name.Builtin.Pseudo + .vc { color: #008080 } // Name.Variable.Class + .vg { color: #008080 } // Name.Variable.Global + .vi { color: #008080 } // Name.Variable.Instance + .il { color: #099 } // Literal.Number.Integer.Long + } +} + + +// Dark mode +// --------- + +$dm-brand-color: #999999 !default; +$dm-brand-color-light: lighten($dm-brand-color, 5%) !default; +$dm-brand-color-dark: darken($dm-brand-color, 35%) !default; + +$dm-site-title-color: $dm-brand-color-light !default; + +$dm-text-color: #bbbbbb !default; +$dm-background-color: #181818 !default; +$dm-code-background-color: #212121 !default; + +$dm-link-base-color: #79b8ff !default; +$dm-link-visited-color: $dm-link-base-color !default; +$dm-link-hover-color: $dm-text-color !default; + +$dm-border-color-01: $dm-brand-color-dark !default; +$dm-border-color-02: $dm-brand-color-light !default; +$dm-border-color-03: $dm-brand-color !default; + +$dm-table-text-color: $dm-text-color !default; +$dm-table-zebra-color: lighten($dm-background-color, 4%) !default; +$dm-table-header-bg-color: lighten($dm-background-color, 10%) !default; +$dm-table-header-border: lighten($dm-background-color, 21%) !default; +$dm-table-border-color: $dm-border-color-01 !default; + + +// Syntax highlighting styles should be adjusted appropriately for every "skin" +// List of tokens: https://github.com/rouge-ruby/rouge/wiki/List-of-tokens +// Some colors come from Material Theme Darker: +// https://github.com/material-theme/vsc-material-theme/blob/master/scripts/generator/settings/specific/darker-hc.ts +// https://github.com/material-theme/vsc-material-theme/blob/master/scripts/generator/color-set.ts +// ---------------------------------------------------------------------------- + +@mixin dm-highlight { + .highlight { + .c { color: #545454; font-style: italic } // Comment + .err { color: #f07178; background-color: #e3d2d2 } // Error + .k { color: #89DDFF; font-weight: bold } // Keyword + .o { font-weight: bold } // Operator + .cm { color: #545454; font-style: italic } // Comment.Multiline + .cp { color: #545454; font-weight: bold } // Comment.Preproc + .c1 { color: #545454; font-style: italic } // Comment.Single + .cs { color: #545454; font-weight: bold; font-style: italic } // Comment.Special + .gd { color: #000; background-color: #fdd } // Generic.Deleted + .gd .x { color: #000; background-color: #faa } // Generic.Deleted.Specific + .ge { font-style: italic } // Generic.Emph + .gr { color: #f07178 } // Generic.Error + .gh { color: #999 } // Generic.Heading + .gi { color: #000; background-color: #dfd } // Generic.Inserted + .gi .x { color: #000; background-color: #afa } // Generic.Inserted.Specific + .go { color: #888 } // Generic.Output + .gp { color: #555 } // Generic.Prompt + .gs { font-weight: bold } // Generic.Strong + .gu { color: #aaa } // Generic.Subheading + .gt { color: #f07178 } // Generic.Traceback + .kc { font-weight: bold } // Keyword.Constant + .kd { font-weight: bold } // Keyword.Declaration + .kp { font-weight: bold } // Keyword.Pseudo + .kr { font-weight: bold } // Keyword.Reserved + .kt { color: #FFCB6B; font-weight: bold } // Keyword.Type + .m { color: #F78C6C } // Literal.Number + .s { color: #C3E88D } // Literal.String + .na { color: #008080 } // Name.Attribute + .nb { color: #EEFFFF } // Name.Builtin + .nc { color: #FFCB6B; font-weight: bold } // Name.Class + .no { color: #008080 } // Name.Constant + .ni { color: #800080 } // Name.Entity + .ne { color: #900; font-weight: bold } // Name.Exception + .nf { color: #82AAFF; font-weight: bold } // Name.Function + .nn { color: #555 } // Name.Namespace + .nt { color: #FFCB6B } // Name.Tag + .nv { color: #EEFFFF } // Name.Variable + .ow { font-weight: bold } // Operator.Word + .w { color: #EEFFFF } // Text.Whitespace + .mf { color: #F78C6C } // Literal.Number.Float + .mh { color: #F78C6C } // Literal.Number.Hex + .mi { color: #F78C6C } // Literal.Number.Integer + .mo { color: #F78C6C } // Literal.Number.Oct + .sb { color: #C3E88D } // Literal.String.Backtick + .sc { color: #C3E88D } // Literal.String.Char + .sd { color: #C3E88D } // Literal.String.Doc + .s2 { color: #C3E88D } // Literal.String.Double + .se { color: #EEFFFF } // Literal.String.Escape + .sh { color: #C3E88D } // Literal.String.Heredoc + .si { color: #C3E88D } // Literal.String.Interpol + .sx { color: #C3E88D } // Literal.String.Other + .sr { color: #C3E88D } // Literal.String.Regex + .s1 { color: #C3E88D } // Literal.String.Single + .ss { color: #C3E88D } // Literal.String.Symbol + .bp { color: #999 } // Name.Builtin.Pseudo + .vc { color: #FFCB6B } // Name.Variable.Class + .vg { color: #EEFFFF } // Name.Variable.Global + .vi { color: #EEFFFF } // Name.Variable.Instance + .il { color: #F78C6C } // Literal.Number.Integer.Long + } +} + + +// Mode selection +// -------------- + + +// Classic skin (always light mode) +// Assign outside of the if construct to establish global variable scope + +$brand-color: $lm-brand-color; +$brand-color-light: $lm-brand-color-light; +$brand-color-dark: $lm-brand-color-dark; + +$site-title-color: $lm-site-title-color; + +$text-color: $lm-text-color; +$background-color: $lm-background-color; +$code-background-color: $lm-code-background-color; + +$link-base-color: $lm-link-base-color; +$link-visited-color: $lm-link-visited-color; +$link-hover-color: $lm-link-hover-color; + +$border-color-01: $lm-border-color-01; +$border-color-02: $lm-border-color-02; +$border-color-03: $lm-border-color-03; + +$table-text-color: $lm-table-text-color; +$table-zebra-color: $lm-table-zebra-color; +$table-header-bg-color: $lm-table-header-bg-color; +$table-header-border: $lm-table-header-border; +$table-border-color: $lm-table-border-color; + + +@if $color-scheme-auto { + + // Auto mode + + :root { + --minima-brand-color: #{$lm-brand-color}; + --minima-brand-color-light: #{$lm-brand-color-light}; + --minima-brand-color-dark: #{$lm-brand-color-dark}; + + --minima-site-title-color: #{$lm-site-title-color}; + + --minima-text-color: #{$lm-text-color}; + --minima-background-color: #{$lm-background-color}; + --minima-code-background-color: #{$lm-code-background-color}; + + --minima-link-base-color: #{$lm-link-base-color}; + --minima-link-visited-color: #{$lm-link-visited-color}; + --minima-link-hover-color: #{$lm-link-hover-color}; + + --minima-border-color-01: #{$lm-border-color-01}; + --minima-border-color-02: #{$lm-border-color-02}; + --minima-border-color-03: #{$lm-border-color-03}; + + --minima-table-text-color: #{$lm-table-text-color}; + --minima-table-zebra-color: #{$lm-table-zebra-color}; + --minima-table-header-bg-color: #{$lm-table-header-bg-color}; + --minima-table-header-border: #{$lm-table-header-border}; + --minima-table-border-color: #{$lm-table-border-color}; + } + + @include lm-highlight; + + @media (prefers-color-scheme: dark) { + :root { + --minima-brand-color: #{$dm-brand-color}; + --minima-brand-color-light: #{$dm-brand-color-light}; + --minima-brand-color-dark: #{$dm-brand-color-dark}; + + --minima-site-title-color: #{$dm-site-title-color}; + + --minima-text-color: #{$dm-text-color}; + --minima-background-color: #{$dm-background-color}; + --minima-code-background-color: #{$dm-code-background-color}; + + --minima-link-base-color: #{$dm-link-base-color}; + --minima-link-visited-color: #{$dm-link-visited-color}; + --minima-link-hover-color: #{$dm-link-hover-color}; + + --minima-border-color-01: #{$dm-border-color-01}; + --minima-border-color-02: #{$dm-border-color-02}; + --minima-border-color-03: #{$dm-border-color-03}; + + --minima-table-text-color: #{$dm-table-text-color}; + --minima-table-zebra-color: #{$dm-table-zebra-color}; + --minima-table-header-bg-color: #{$dm-table-header-bg-color}; + --minima-table-header-border: #{$dm-table-header-border}; + --minima-table-border-color: #{$dm-table-border-color}; + } + + @include dm-highlight; + } + + $brand-color: var(--minima-brand-color); + $brand-color-light: var(--minima-brand-color-light); + $brand-color-dark: var(--minima-brand-color-dark); + + $site-title-color: var(--minima-site-title-color); + + $text-color: var(--minima-text-color); + $background-color: var(--minima-background-color); + $code-background-color: var(--minima-code-background-color); + + $link-base-color: var(--minima-link-base-color); + $link-visited-color: var(--minima-link-visited-color); + $link-hover-color: var(--minima-link-hover-color); + + $border-color-01: var(--minima-border-color-01); + $border-color-02: var(--minima-border-color-02); + $border-color-03: var(--minima-border-color-03); + + $table-text-color: var(--minima-table-text-color); + $table-zebra-color: var(--minima-table-zebra-color); + $table-header-bg-color: var(--minima-table-header-bg-color); + $table-header-border: var(--minima-table-header-border); + $table-border-color: var(--minima-table-border-color); + + +} @else if $color-scheme-dark { + + // Dark skin (always dark mode) + + $brand-color: $dm-brand-color; + $brand-color-light: $dm-brand-color-light; + $brand-color-dark: $dm-brand-color-dark; + + $site-title-color: $dm-site-title-color; + + $text-color: $dm-text-color; + $background-color: $dm-background-color; + $code-background-color: $dm-code-background-color; + + $link-base-color: $dm-link-base-color; + $link-visited-color: $dm-link-visited-color; + $link-hover-color: $dm-link-hover-color; + + $border-color-01: $dm-border-color-01; + $border-color-02: $dm-border-color-02; + $border-color-03: $dm-border-color-03; + + $table-text-color: $dm-table-text-color; + $table-zebra-color: $dm-table-zebra-color; + $table-header-bg-color: $dm-table-header-bg-color; + $table-header-border: $dm-table-header-border; + $table-border-color: $dm-table-border-color; + + @include dm-highlight; + + +} @else { + + // Classic skin syntax highlighting + @include lm-highlight; + +} diff --git a/docs/_sass/minima/skins/classic.scss b/docs/_sass/minima/skins/classic.scss new file mode 100644 index 0000000..e61b078 --- /dev/null +++ b/docs/_sass/minima/skins/classic.scss @@ -0,0 +1,5 @@ +@charset "utf-8"; + +$color-scheme-auto: false; +$color-scheme-dark: false; +@import "minima/skins/auto"; diff --git a/docs/_sass/minima/skins/dark.scss b/docs/_sass/minima/skins/dark.scss new file mode 100644 index 0000000..159226e --- /dev/null +++ b/docs/_sass/minima/skins/dark.scss @@ -0,0 +1,5 @@ +@charset "utf-8"; + +$color-scheme-auto: false; +$color-scheme-dark: true; +@import "minima/skins/auto"; diff --git a/docs/_sass/minima/skins/solarized-dark.scss b/docs/_sass/minima/skins/solarized-dark.scss new file mode 100644 index 0000000..500dceb --- /dev/null +++ b/docs/_sass/minima/skins/solarized-dark.scss @@ -0,0 +1,5 @@ +@charset "utf-8"; + +$sol-is-auto: false; +$sol-is-dark: true; +@import "minima/skins/solarized"; diff --git a/docs/_sass/minima/skins/solarized-light.scss b/docs/_sass/minima/skins/solarized-light.scss new file mode 100644 index 0000000..d2fc065 --- /dev/null +++ b/docs/_sass/minima/skins/solarized-light.scss @@ -0,0 +1,4 @@ +@charset "utf-8"; + +$sol-is-auto: false; +@import "minima/skins/solarized"; diff --git a/docs/_sass/minima/skins/solarized.scss b/docs/_sass/minima/skins/solarized.scss new file mode 100644 index 0000000..7ac1f5a --- /dev/null +++ b/docs/_sass/minima/skins/solarized.scss @@ -0,0 +1,201 @@ +@charset "utf-8"; + +// Solarized skin +// ============== +// Created by Sander Voerman using the Solarized +// color scheme by Ethan Schoonover . + +// This style sheet implements three options for the minima.skin setting: +// "solarized-light" for light mode, "solarized-dark" for dark mode, and +// "solarized" for light or dark mode depending on user preference. +$sol-is-auto: true !default; +$sol-is-dark: false !default; + + +// Color scheme +// ------------ +// The inline comments show the canonical L*a*b values for each color. + +$sol-base03: #002b36; // 15 -12 -12 +$sol-base02: #073642; // 20 -12 -12 +$sol-base01: #586e75; // 45 -07 -07 +$sol-base00: #657b83; // 50 -07 -07 +$sol-base0: #839496; // 60 -06 -03 +$sol-base1: #93a1a1; // 65 -05 -02 +$sol-base2: #eee8d5; // 92 -00 10 +$sol-base3: #fdf6e3; // 97 00 10 +$sol-yellow: #b58900; // 60 10 65 +$sol-orange: #cb4b16; // 50 50 55 +$sol-red: #dc322f; // 50 65 45 +$sol-magenta: #d33682; // 50 65 -05 +$sol-violet: #6c71c4; // 50 15 -45 +$sol-blue: #268bd2; // 55 -10 -45 +$sol-cyan: #2aa198; // 60 -35 -05 +$sol-green: #859900; // 60 -20 65 + + +// Mixed colors +// ------------ +// While not part of the original Solarized base tones, these derived tones +// are meant to replicate the visual style of the classic skin. They should +// not be used in cases where sufficiently contrasting colors are needed. + +$sol-light-mix1: mix($sol-base1, $sol-base3); +$sol-light-mix2: mix($sol-blue, $sol-base00); +$sol-light-mix3: mix($sol-base2, $sol-base3); +$sol-dark-mix1: mix($sol-base01, $sol-base03); +$sol-dark-mix2: mix($sol-blue, $sol-base0); +$sol-dark-mix3: mix($sol-base02, $sol-base03); + + +// Mode selection +// -------------- + +$sol-mono3: $sol-base3; +$sol-mono2: $sol-base2; +$sol-mono1: $sol-base1; +$sol-mono00: $sol-base00; +$sol-mono01: $sol-base01; +$sol-mix1: $sol-light-mix1; +$sol-mix2: $sol-light-mix2; +$sol-mix3: $sol-light-mix3; + +@if $sol-is-dark { + $sol-mono3: $sol-base03; + $sol-mono2: $sol-base02; + $sol-mono1: $sol-base01; + $sol-mono00: $sol-base0; + $sol-mono01: $sol-base1; + $sol-mix1: $sol-dark-mix1; + $sol-mix2: $sol-dark-mix2; + $sol-mix3: $sol-dark-mix3; +} + +@if $sol-is-auto { + :root { + --solarized-mono3: #{$sol-base3}; + --solarized-mono2: #{$sol-base2}; + --solarized-mono1: #{$sol-base1}; + --solarized-mono00: #{$sol-base00}; + --solarized-mono01: #{$sol-base01}; + --solarized-mix1: #{$sol-light-mix1}; + --solarized-mix2: #{$sol-light-mix2}; + --solarized-mix3: #{$sol-light-mix3}; + } + + @media (prefers-color-scheme: dark) { + :root { + --solarized-mono3: #{$sol-base03}; + --solarized-mono2: #{$sol-base02}; + --solarized-mono1: #{$sol-base01}; + --solarized-mono00: #{$sol-base0}; + --solarized-mono01: #{$sol-base1}; + --solarized-mix1: #{$sol-dark-mix1}; + --solarized-mix2: #{$sol-dark-mix2}; + --solarized-mix3: #{$sol-dark-mix3}; + } + } + + $sol-mono3: var(--solarized-mono3); + $sol-mono2: var(--solarized-mono2); + $sol-mono1: var(--solarized-mono1); + $sol-mono00: var(--solarized-mono00); + $sol-mono01: var(--solarized-mono01); + $sol-mix1: var(--solarized-mix1); + $sol-mix2: var(--solarized-mix2); + $sol-mix3: var(--solarized-mix3); +} + + +// Minima color variables +// ---------------------- + +$brand-color: $sol-mono1 !default; +$brand-color-light: $sol-mix1 !default; +$brand-color-dark: $sol-mono00 !default; + +$site-title-color: $sol-mono00 !default; + +$text-color: $sol-mono01 !default; +$background-color: $sol-mono3 !default; +$code-background-color: $sol-mono2 !default; + +$link-base-color: $sol-blue !default; +$link-visited-color: $sol-mix2 !default; +$link-hover-color: $sol-mono00 !default; + +$border-color-01: $brand-color-light !default; +$border-color-02: $sol-mono1 !default; +$border-color-03: $sol-mono00 !default; + +$table-text-color: $sol-mono00 !default; +$table-zebra-color: $sol-mix3 !default; +$table-header-bg-color: $sol-mono2 !default; +$table-header-border: $sol-mono1 !default; +$table-border-color: $sol-mono1 !default; + + +// Syntax highlighting styles +// -------------------------- + +.highlight { + .c { color: $sol-mono1; font-style: italic } // Comment + .err { color: $sol-red } // Error + .k { color: $sol-mono01; font-weight: bold } // Keyword + .o { color: $sol-mono01; font-weight: bold } // Operator + .cm { color: $sol-mono1; font-style: italic } // Comment.Multiline + .cp { color: $sol-mono1; font-weight: bold } // Comment.Preproc + .c1 { color: $sol-mono1; font-style: italic } // Comment.Single + .cs { color: $sol-mono1; font-weight: bold; font-style: italic } // Comment.Special + .gd { color: $sol-red } // Generic.Deleted + .gd .x { color: $sol-red } // Generic.Deleted.Specific + .ge { color: $sol-mono00; font-style: italic } // Generic.Emph + .gr { color: $sol-red } // Generic.Error + .gh { color: $sol-mono1 } // Generic.Heading + .gi { color: $sol-green } // Generic.Inserted + .gi .x { color: $sol-green } // Generic.Inserted.Specific + .go { color: $sol-mono00 } // Generic.Output + .gp { color: $sol-mono00 } // Generic.Prompt + .gs { color: $sol-mono01; font-weight: bold } // Generic.Strong + .gu { color: $sol-mono1 } // Generic.Subheading + .gt { color: $sol-red } // Generic.Traceback + .kc { color: $sol-mono01; font-weight: bold } // Keyword.Constant + .kd { color: $sol-mono01; font-weight: bold } // Keyword.Declaration + .kp { color: $sol-mono01; font-weight: bold } // Keyword.Pseudo + .kr { color: $sol-mono01; font-weight: bold } // Keyword.Reserved + .kt { color: $sol-violet; font-weight: bold } // Keyword.Type + .m { color: $sol-cyan } // Literal.Number + .s { color: $sol-magenta } // Literal.String + .na { color: $sol-cyan } // Name.Attribute + .nb { color: $sol-blue } // Name.Builtin + .nc { color: $sol-violet; font-weight: bold } // Name.Class + .no { color: $sol-cyan } // Name.Constant + .ni { color: $sol-violet } // Name.Entity + .ne { color: $sol-violet; font-weight: bold } // Name.Exception + .nf { color: $sol-blue; font-weight: bold } // Name.Function + .nn { color: $sol-mono00 } // Name.Namespace + .nt { color: $sol-blue } // Name.Tag + .nv { color: $sol-cyan } // Name.Variable + .ow { color: $sol-mono01; font-weight: bold } // Operator.Word + .w { color: $sol-mono1 } // Text.Whitespace + .mf { color: $sol-cyan } // Literal.Number.Float + .mh { color: $sol-cyan } // Literal.Number.Hex + .mi { color: $sol-cyan } // Literal.Number.Integer + .mo { color: $sol-cyan } // Literal.Number.Oct + .sb { color: $sol-magenta } // Literal.String.Backtick + .sc { color: $sol-magenta } // Literal.String.Char + .sd { color: $sol-magenta } // Literal.String.Doc + .s2 { color: $sol-magenta } // Literal.String.Double + .se { color: $sol-magenta } // Literal.String.Escape + .sh { color: $sol-magenta } // Literal.String.Heredoc + .si { color: $sol-magenta } // Literal.String.Interpol + .sx { color: $sol-magenta } // Literal.String.Other + .sr { color: $sol-green } // Literal.String.Regex + .s1 { color: $sol-magenta } // Literal.String.Single + .ss { color: $sol-magenta } // Literal.String.Symbol + .bp { color: $sol-mono1 } // Name.Builtin.Pseudo + .vc { color: $sol-cyan } // Name.Variable.Class + .vg { color: $sol-cyan } // Name.Variable.Global + .vi { color: $sol-cyan } // Name.Variable.Instance + .il { color: $sol-cyan } // Literal.Number.Integer.Long +} diff --git a/docs/assets/DejaVuSansCircle.png b/docs/assets/DejaVuSansCircle.png new file mode 100644 index 0000000..174e16f Binary files /dev/null and b/docs/assets/DejaVuSansCircle.png differ diff --git a/docs/assets/css/style.scss b/docs/assets/css/style.scss new file mode 100644 index 0000000..0d1fce9 --- /dev/null +++ b/docs/assets/css/style.scss @@ -0,0 +1,7 @@ +--- +# Only the main Sass file needs front matter (the dashes are enough) +--- + +@import + "minima/skins/{{ site.minima.skin | default: 'classic' }}", + "minima/initialize"; diff --git a/docs/assets/favicon.ico b/docs/assets/favicon.ico new file mode 100644 index 0000000..a174c5c Binary files /dev/null and b/docs/assets/favicon.ico differ diff --git a/docs/index.md b/docs/index.md new file mode 100644 index 0000000..0e25978 --- /dev/null +++ b/docs/index.md @@ -0,0 +1,37 @@ +--- +layout: home +--- + +![GitHub](https://img.shields.io/github/license/charoitel/lambda-layer-canvas-nodejs)  ![Watch on GitHub](https://img.shields.io/github/watchers/charoitel/lambda-node-canvas.svg?style=social)  ![Fork on GitHub](https://img.shields.io/github/forks/charoitel/lambda-node-canvas.svg?style=social)  ![Star on GitHub](https://img.shields.io/github/stars/charoitel/lambda-node-canvas.svg?style=social) + +Canvas Layer for AWS Lambda is published and available on [AWS Serverless Application Repository](https://serverlessrepo.aws.amazon.com/applications/arn:aws:serverlessrepo:us-east-1:990551184979:applications~lambda-layer-canvas-nodejs), and GitHub at [charoitel/lambda-layer-canvas-nodejs](https://github.com/charoitel/lambda-layer-canvas-nodejs). The layer aims to provide a Cairo backed Mozilla Web Canvas API implementation layer for AWS Lambda, powered by [node-canvas](https://github.com/Automattic/node-canvas). + +## About node-canvas + +[node-canvas](https://github.com/Automattic/node-canvas) is a Cairo backed Canvas implementation for Node.js. It implements the [Mozilla Web Canvas API](https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API) as closely as possible. For the latest API compliance, you may check [Compatibility Status](https://github.com/Automattic/node-canvas/wiki/Compatibility-Status). + +## How this layer is built? + +The layer is built from source of node-canvas npm package on [amazonlinux](https://hub.docker.com/_/amazonlinux) dev container instance, with following native dependencies installed. You may check the build layer script, ``` build-layer.sh ```, which is available in repository, for details. + +```bash +gcc-c++ cairo-devel pango-devel libjpeg-turbo-devel giflib-devel librsvg2-devel pango-devel bzip2-devel jq python3 +``` + +Since AWS Lambda is a secure and isolated runtime and execution environment, the layer aims to target AWS Lambda compatible and native build. As there are canvas libraries and frameworks relying on node-canvas running on Node.js runtime, this layer may also try to include and support those libraries and frameworks. Currently, following libraries and frameworks are included when building and packaging the layer: + +- [Chart.js](#chartjs-support) +- [Fabric.js](#fabricjs-support) +- [Konva](#konva-support) + +### Chart.js support + +[Chart.js](https://github.com/chartjs/chart.js) provides a set of frequently used chart types, plugins, and customization options. In addition to a reasonable set of built-in chart types, there are also community-maintained chart types. + +### Fabric.js support + +[Fabric.js](https://github.com/fabricjs/fabric.js) provides a missing and interactive object model for canvas, as well as an SVG parser, layer of interactivity, and a whole suite of other indispensable tools. + +### Konva support + +[Konva](https://github.com/konvajs/konva) enables high performance animations, transitions, node nesting, layering, filtering, caching, event handling for desktop and mobile applications, and much more. diff --git a/docs/minima.gemspec b/docs/minima.gemspec new file mode 100644 index 0000000..0877069 --- /dev/null +++ b/docs/minima.gemspec @@ -0,0 +1,24 @@ +# frozen_string_literal: true + +Gem::Specification.new do |spec| + spec.name = "minima" + spec.version = "3.0.0.dev" + spec.authors = ["Joel Glovier"] + spec.email = ["jglovier@github.com"] + + spec.summary = "A beautiful, minimal theme for Jekyll." + spec.homepage = "https://github.com/jekyll/minima" + spec.license = "MIT" + + spec.metadata["plugin_type"] = "theme" + + spec.files = `git ls-files -z`.split("\x0").select do |f| + f.match(%r!^(assets|_(includes|layouts|sass)/|(LICENSE|README)((\.(txt|md|markdown)|$)))!i) + end + + spec.add_runtime_dependency "jekyll", ">= 3.5", "< 5.0" + spec.add_runtime_dependency "jekyll-feed", "~> 0.9" + spec.add_runtime_dependency "jekyll-seo-tag", "~> 2.1" + + spec.add_development_dependency "bundler" +end diff --git a/docs/script/bootstrap b/docs/script/bootstrap new file mode 100755 index 0000000..492e553 --- /dev/null +++ b/docs/script/bootstrap @@ -0,0 +1,6 @@ +#!/bin/sh + +set -e + +gem install bundler +bundle install diff --git a/docs/script/build b/docs/script/build new file mode 100755 index 0000000..c4ac84f --- /dev/null +++ b/docs/script/build @@ -0,0 +1,6 @@ +#!/bin/sh + +set -e + +echo "Building the example site..." +bundle exec jekyll build diff --git a/docs/script/cibuild b/docs/script/cibuild new file mode 100755 index 0000000..c3c0e99 --- /dev/null +++ b/docs/script/cibuild @@ -0,0 +1,15 @@ +#!/bin/sh + +set -e + +script/build + +if test -e "./_site/index.html";then + echo "It builds!" + rm -Rf _site +else + echo "Huh. That's odd. The example site doesn't seem to build." + exit 1 +fi + +gem build minima.gemspec diff --git a/docs/script/server b/docs/script/server new file mode 100755 index 0000000..d8c3e15 --- /dev/null +++ b/docs/script/server @@ -0,0 +1,3 @@ +#!/bin/sh + +bundle exec jekyll serve diff --git a/lib/libX11.so.6 b/lib/libX11.so.6 index badc93a..9a506f4 100755 Binary files a/lib/libX11.so.6 and b/lib/libX11.so.6 differ diff --git a/lib/libfribidi.so.0 b/lib/libfribidi.so.0 index d040fed..397d25a 100755 Binary files a/lib/libfribidi.so.0 and b/lib/libfribidi.so.0 differ