Skip to content

Commit

Permalink
Merge pull request #715 from AlexRogalskiy/feature/themes
Browse files Browse the repository at this point in the history
Feature/themes
  • Loading branch information
AlexRogalskiy committed Mar 27, 2021
2 parents 8b876ea + 67d279d commit 5e01ac4
Show file tree
Hide file tree
Showing 109 changed files with 8,776 additions and 7,402 deletions.
8 changes: 5 additions & 3 deletions .env-cmdrc.json
@@ -1,12 +1,14 @@
{
"dev": {
"DEBUG": "true"
"DEBUG": "true",
"NODE_ENV": "dev"
},
"prod": {
"DEBUG": "false",
"AWS_LAMBDA_FUNCTION_VERSION": "1.0"
"NODE_ENV": "prod"
},
"test": {
"TZ": "utc"
"TZ": "utc",
"NODE_ENV": "test"
}
}
17 changes: 14 additions & 3 deletions .github/workflows/CI.yml
Expand Up @@ -36,8 +36,19 @@ jobs:
- name: Install
run: yarn install

- name: Lint
run: yarn all

- name: Jest
run: yarn test
run: yarn test:all

- name: Lint
run: yarn lint
- name: Check
run: yarn check:all

- name: coverage
uses: codecov/codecov-action@v1
with:
name: actions ${{ matrix.node }}
file: ./coverage/coverage-final.json
fail_ci_if_error: true
verbose: true
12 changes: 6 additions & 6 deletions .github/workflows/changelog.yml
Expand Up @@ -3,11 +3,11 @@ name: Changelog

on:
workflow_dispatch:
release:
types: [ created ]
push:
branches:
- master
# release:
# types: [ created ]
# push:
# branches:
# - master

jobs:
build:
Expand Down Expand Up @@ -38,4 +38,4 @@ jobs:
uses: ad-m/github-push-action@master
with:
github_token: ${{ secrets.GITHUB_TOKEN }}
branch: ${{ github.ref }}
branch: ${{ github.ref }}
2 changes: 1 addition & 1 deletion .github/workflows/linter.yml
Expand Up @@ -40,4 +40,4 @@ jobs:
JAVASCRIPT_DEFAULT_STYLE: prettier
DEFAULT_BRANCH: master
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
FILTER_REGEX_INCLUDE: .*(api/|utils/).*
FILTER_REGEX_INCLUDE: .*(api/|typings/).*
7 changes: 4 additions & 3 deletions .github/workflows/toc.yml
@@ -1,9 +1,10 @@
name: Table of contents

on:
push:
branches: [ main, master ]
paths: [ 'README.md' ]
workflow_dispatch:
# push:
# branches: [ main, master ]
# paths: [ 'README.md' ]

jobs:
build:
Expand Down
3 changes: 3 additions & 0 deletions .gitignore
Expand Up @@ -18,6 +18,9 @@ lunr-index.json
*.rar
**/.DS_Store

# License files
licenses.json

# virtual machine crash logs, see http://www.java.com/en/download/help/error_hotspot.xml
hs_err_pid*

Expand Down
10 changes: 10 additions & 0 deletions .husky/pre-commit
@@ -1,4 +1,14 @@
#!/bin/sh
. "$(dirname "$0")/_/husky.sh"

npm run all
npm run test:all
npm run changelog

git add docs/
git add api/
git add tests/
git add typings/

git add CHANGELOG.md
git add package-lock.json
4 changes: 4 additions & 0 deletions .husky/pre-push
@@ -0,0 +1,4 @@
#!/bin/sh
. "$(dirname "$0")/_/husky.sh"

npm run check:all
12 changes: 12 additions & 0 deletions CHANGELOG.md
@@ -0,0 +1,12 @@
# [0.0.0-dev](https://github.com/AlexRogalskiy/quotes/compare/v2.0.1...v0.0.0-dev) (2021-03-27)



## [2.0.1](https://github.com/AlexRogalskiy/quotes/compare/2.0.1...v2.0.1) (2021-03-05)



## 1.0.1 (2021-02-16)



109 changes: 93 additions & 16 deletions README.md
Expand Up @@ -36,7 +36,7 @@
[![NewReleases](https://newreleases.io/badge.svg)](https://newreleases.io/github/AlexRogalskiy/quotes)
[![Hits-of-Code](https://hitsofcode.com/github/AlexRogalskiy/quotes)](https://hitsofcode.com/github/AlexRogalskiy/quotes/view)
[![ComVer](https://img.shields.io/badge/ComVer-compliant-brightgreen.svg)][tags]
![Website](https://img.shields.io/website?url=https://img.shields.io/website?url=https://styled-quotes.vercel.app/api?backgroundColor=%23FFFFFF\&opacity=0.3\&colorPattern=%23FFE0E9\&fontColor=%230A83DC)
![Website](https://img.shields.io/website?url=https://img.shields.io/website?url=https://styled-quotes.vercel.app/api?theme=default_repocard\&layout=churchill)

[![CI](https://github.com/AlexRogalskiy/proverbs/workflows/test/badge.svg)](https://github.com/AlexRogalskiy/proverbs/workflows/test)
[![GitHub Super-Linter](https://github.com/AlexRogalskiy/quotes/workflows/Lint%20Code%20Base/badge.svg)](https://github.com/marketplace/actions/super-linter)
Expand All @@ -48,6 +48,11 @@
[![Open questions](https://img.shields.io/badge/Open-questions-blue.svg?style=flat-curved)](https://github.com/AlexRogalskiy/quotes/labels/question)
[![Open bugs](https://img.shields.io/badge/Open-bugs-red.svg?style=flat-curved)](https://github.com/AlexRogalskiy/quotes/labels/bug)

[![Gitpod Ready-to-Code](https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod)](https://gitpod.io/#https://github.com/AlexRogalskiy/quotes)
[![Chat](https://img.shields.io/badge/chat-discussions-success.svg)](https://github.com/AlexRogalskiy/quotes/discussions)
[![Open questions](https://img.shields.io/badge/Open-questions-blue.svg?style=flat-curved)](https://github.com/AlexRogalskiy/quotes/labels/question)
[![Open bugs](https://img.shields.io/badge/Open-bugs-red.svg?style=flat-curved)](https://github.com/AlexRogalskiy/quotes/labels/bug)

## *Table of contents*

- [*Description*](#description)
Expand Down Expand Up @@ -90,24 +95,96 @@ For the tech stack, ***Styled Quotes*** using Typescript and serverless function
It's simple, you can copy paste this markdown content, like this one:

```
![Styled Quotes](https://styled-quotes.vercel.app/api?backgroundColor=[value]&opacity=[value]&colorPattern=[value]&fontColor=[value]&pattern=[pattern]&category=[value]&width=[width]&height=[height]&keywords=[keywords])
![Styled Quotes](https://styled-quotes.vercel.app/api?theme=[value]&layout=[value]&animation=[value]&bgColor=[value]&opacity=[value]&colorPattern=[value]&quoteColor=[value]&authorColor=[value]&pattern=[pattern]&category=[value]&width=[width]&height=[height]&keywords=[keywords])
```

There are several options you can use from the list:

| **Options** | **Description** | **Type** | **Example** | **Query Params** |
| ---------------------- | -------------------------------------- | ------------------------------ | ------------- | ------------------------------ |
| **\[Background Color]** | Background color for the quote image | <code>Hex color code</code> | %23ffffff | `?backgroundColor=[value]` |
| **\[Opacity Pattern]** | Background opacity of the pattern | <code>Float number</code> | 0 - 1 | `&opacity=[value]` |
| **\[Color Pattern]** | Color pattern for the signage | <code>Hex color code</code> | %231abc9c | `&colorPattern=[value]` |
| **\[Font Color]** | Font color for the quote text | <code>Hex color code</code> | %23000000 | `&fontColor=[value]` |
| **\[Pattern]** | Pattern for the background | <code>String constant</code> | plus | `&pattern=[value]` |
| **\[Category]** | Quote category | <code>String constant</code> | programming | `&category=[value]` |
| **\[Width]** | Quote image width | <code>String</code> | 100% | `&width=[value]` |
| **\[Height]** | Quote image height | <code>String</code> | 100% | `&height=[value]` |
| **\[Keywords]** | Quote keywords | <code>String/String\[]</code> | love | `&keywords=[value]` |
| **Options** | **Description** | **Type** | **Example** | **Query Params** |
| ------------------------- | ---------------------------------- | --------------------------------- | ------------------ | ------------------------ |
| **\[Theme]** | Theme of the image | <code>String</code> | default_repocard | `?theme=[value]` |
| **\[Layout]** | Layout of the image | <code>String</code> | churchill | `&layout=[value]` |
| **\[Animation]** | Animation of the image | <code>String</code> | grow_out_in | `&animation=[value]` |
| **\[Background Color]** | Background color of the image | <code>Hex color code</code> | ffffff | `&bgColor=[value]` |
| **\[Opacity Pattern]** | Opacity of the background pattern | <code>Float number</code> | 0 - 1 | `&opacity=[value]` |
| **\[Color Pattern]** | Color of the background pattern | <code>Hex color code</code> | 1abc9c | `&colorPattern=[value]` |
| **\[Quote Font Color]** | Font color of the quote text | <code>Hex color code</code> | 000000 | `&quoteColor=[value]` |
| **\[Author Font Color]** | Font color of the author text | <code>Hex color code</code> | 000000 | `&authorColor=[value]` |
| **\[Pattern]** | Background pattern | <code>String constant</code> | plus | `&pattern=[value]` |
| **\[Category]** | Quote category | <code>String constant</code> | programming | `&category=[value]` |
| **\[Width]** | Image width | <code>String</code> | 100% | `&width=[value]` |
| **\[Height]** | Image height | <code>String</code> | 100% | `&height=[value]` |
| **\[Keywords]** | Quote keywords | <code>String/String Array</code> | love | `&keywords=[value]` |

Here is a list of supported image themes:

| **Name** | **Value** |
| --------------------------------- | ----------------------------- |
| **Default** | default |
| **Default repocard** | default_repocard |
| **Dark** | dark |
| **Radical** | radical |
| **Merko** | merko |
| **Gruvbox** | gruvbox |
| **Tokyo night** | tokyonight |
| **One dark** | onedark |
| **Cobalt** | cobalt |
| **Synth wave** | synthwave |
| **High contrast** | highcontrast |
| **Dracula** | dracula |
| **Prussian** | prussian |
| **Monokai** | monokai |
| **Vue** | vue |
| **Vue dark** | vue_dark |
| **Shades of purple** | shades_of_purple |
| **Night owl** | nightowl |
| **Buefy** | buefy |
| **Blue green** | blue_green |
| **Algolia** | algolia |
| **Great Gatsby** | great_gatsby |
| **Darcula** | darcula |
| **Bear** | bear |
| **Solarized dark** | solarized_dark |
| **Solarized light** | solarized_light |
| **Chartreuse dark** | chartreuse_dark |
| **Nord** | nord |
| **Gotham** | gotham |
| **Material pale night** | material_palenight |
| **Gray white** | graywhite |
| **Vision friendly dark** | vision_friendly_dark |
| **Ayu mirage** | ayu_mirage |
| **Midnight purple** | midnight_purple |
| **Calm** | calm |
| **Flag India** | flag_india |
| **Omni** | omni |
| **React** | react |
| **Jolly** | jolly |
| **Maroongold** | maroongold |
| **Yeblu** | yeblu |
| **Blueberry** | blueberry |
| **State orange** | slateorange |
| **Kacho ga** | kacho_ga |
| **Arabesque** | arabesque |

List of supported image layouts:

| **Name** | **Value** |
| --------------------------------- | ----------------------------- |
| **Default** | default |
| **Churchill** | churchill |
| **Pluto** | pluto |
| **Samuel** | samuel |
| **Socrates** | socrates |
| **Zues** | zues |

List of supported image animations:

| **Name** | **Value** |
| --------------------------------- | ----------------------------- |
| **Default** | default |
| **Grow-out-in** | grow_out_in |

Here is a list of categories supported by Quotes API:
List of categories supported by Quotes API:

| **Name** | **Value** |
| --------------------------------- | ----------------------------- |
Expand Down Expand Up @@ -249,13 +326,13 @@ Patterns in Quotes are provided by [Hero Pattern](https://github.com/lowmess/her
This is example of using ***Styled Quotes***:

```
![Styled Quotes](https://styled-quotes.vercel.app/api?backgroundColor=%23FFFFFF&opacity=0.3&colorPattern=%23FFE0E9&fontColor=%230A83DC)
![Styled Quotes](https://styled-quotes.vercel.app/api?theme=default_repocard&layout=churchill)
```

Result:

<div align="center" style="align-content: center">
<img width="100%" height="300px" style="min-height: 250px" src="https://styled-quotes.vercel.app/api?backgroundColor=%23FFFFFF&opacity=0.3&colorPattern=%23FFE0E9&fontColor=%230A83DC" alt="Quotes" />
<img width="100%" height="300px" style="min-height: 250px" src="https://styled-quotes.vercel.app/?theme=default_repocard&layout=churchill" alt="Quotes" />
</div>

## *Visitor stats*
Expand Down
41 changes: 41 additions & 0 deletions api/animations/animations.ts
@@ -0,0 +1,41 @@
import { Optional } from '../../typings/standard-types'
import { AnimationPattern } from '../../typings/enum-types'
import { AnimationOptions } from '../../typings/domain-types'

/**
* AnimationRecord
* @desc Type representing animation config options
*/
export type AnimationRecord = Record<AnimationPattern, AnimationOptions>

/**
* Animation mappings
* @desc Type representing supported animation mappings
*/
const animations: Readonly<AnimationRecord> = {
'default': {
animation: '',
keyframes: '',
},
'grow-out-in': {
animation: 'animation:grow-out-in 2s linear infinite alternate;',
keyframes: `@keyframes grow-out-in{
0% {
box-shadow:0 2px 4px -2px rgba(0,0,0,.25);
transform:scale(.95);
}
100% {
box-shadow:0 0 4px 2px rgba(0,0,0,.25);
transform:scale(1);
}
}`,
},
}

/**
* Returns {@link AnimationOptions} by input {@link AnimationPattern} value
* @param value initial input {@link AnimationPattern} to fetch by
*/
export const getAnimation = (value: Optional<AnimationPattern>): AnimationOptions => {
return value ? animations[value] : animations[AnimationPattern.default]
}
33 changes: 33 additions & 0 deletions api/configs/config.ts
@@ -0,0 +1,33 @@
import { Profile } from '../../typings/enum-types'
import { ProfileOptions } from '../../typings/domain-types'

import { IMAGE_OPTIONS, INDEX_OPTIONS, OUTPUT_OPTIONS } from '../constants/constants'

import { mergeProps } from '../utils/commons'

/**
* ConfigRecord
* @desc Type representing profile config options
*/
export type ConfigRecord = Record<Profile, ProfileOptions>

/**
* Configuration options
*/
export const CONFIG: Readonly<ConfigRecord> = {
dev: {
imageOptions: IMAGE_OPTIONS,
indexOptions: INDEX_OPTIONS,
outputOptions: OUTPUT_OPTIONS,
},
prod: {
imageOptions: IMAGE_OPTIONS,
indexOptions: mergeProps(INDEX_OPTIONS, { delimiter: '__' }),
outputOptions: OUTPUT_OPTIONS,
},
test: {
imageOptions: IMAGE_OPTIONS,
indexOptions: INDEX_OPTIONS,
outputOptions: OUTPUT_OPTIONS,
},
}
30 changes: 30 additions & 0 deletions api/constants/constants.ts
@@ -0,0 +1,30 @@
import boxen from 'boxen'

import { ImageOptions, IndexOptions } from '../../typings/domain-types'

/**
* Output configuration options
*/
export const OUTPUT_OPTIONS: Readonly<boxen.Options> = {
padding: 1,
margin: 1,
borderStyle: 'single',
borderColor: 'yellow',
}

/**
* Image configuration options
*/
export const IMAGE_OPTIONS: Readonly<ImageOptions> = {
width: '100%',
height: '100%',
}

/**
* Index configuration options
*/
export const INDEX_OPTIONS: Readonly<IndexOptions> = {
delimiter: '_',
path: '.cache',
name: 'lunr-index.json',
}

0 comments on commit 5e01ac4

Please sign in to comment.