open-index/open-npm huggingface dataset:
npm package: 8-point
Description: 8-point soft-grid classes.
Author: Michael Chan
Latest version: 1.2.1

# 8-point
A set of 8 point grid classes.

## Why

[8-point grid](https://spec.fm/specifics/8-pt-grid) is a thing.
It's a good thing at that.

8 has a lot of advantages as a number.
It's chief adavntage is that it bifurcates evenly.
So devices that do any type of strange scaling don't end up with half-values.

This is good.

This lib just offers a set of classes for using an 8-point soft grid with the css box model. It incluedes classes for `margin`, `padding`, `TRBL`, `width`, `height`, and "size".

## Anatomy

The class names break down like this:

```txt
{acronymized CSS property}-{n × 8px}
```

For example:

```css
.p-1 { padding:  8px }  /* 1 × 8px */
.p-2 { padding: 16px } /* 2 × 8px */
.p-3 { padding: 24px } /* 3 × 8px */
```

You can use side-specific properties as well:

```css
.mt-1 { margin-top: 8px }
.mr-1 { margin-right: 8px }
.mb-1 { margin-bottom: 8px }
.ml-1 { margin-left: 8px }

/* x and y added for convenience */

.my-1 { margin-top: 8px; margin-bottom: 8px }
.mx-1 { margin-right: 8px; margin-left: 8px }
```

## Legend

#### properties

```txt
m  = margin
mt = margin-top
mr = margin-right
mb = margin-bottom
ml = margin-left
my = margin-top; margin-bottom
mx = margin-right; margin-left

p  = padding
pt = padding-top
pr = padding-right
pb = padding-bottom
pl = padding-left
py = padding-top; padding-bottom
px = padding-right; margin-left

t = top
r = right
b = bottom
l = left

lh = line-height

w = width
h = height

s = width; height
```

#### values

```txt
1 = 8px
2 = 16px
3 = 24px
4 = 32px
5 = 40px
6 = 48px
7 = 56px
8 = 64px
```

## Install
NPM:
`npm i -S 8-point`

## Use
```html
<div class="m-1 p-3">
  This has 8px margin and 24px padding.
</div>

<img
  src="./path/img.ext"
  class="s-8"
  alt="this img is 64px high and wide"
/>
```

## License

MIT License

Copyright (c) 2016 Michael Chan
npm package: 8-sliding-puzzle
Description: This is a npm playing 8 sliding puzzle.
Author: paru871
Latest version: 1.0.3

# 8-sliding-puzzle
A simple puzzle of 8 square tiles.
Can you assemble within 50 moves?


## install
```
$ npm install -g 8-sliding-puzzle
```

## rule
- This puzzle is a sliding puzzle having 8 square tiles numbered 1–8 in a frame that is 3 tiles high and 3 tiles wide, leaving one unoccupied tile position.
- Tiles in the same row or column of the open position can be moved by sliding them horizontally or vertically, respectively.
- You can move it 50 times in one puzzle.
- The goal of the puzzle is to place the tiles in numerical order.
- And at the end, be sure to put the blank tile in the lower right corner.

## usage
```
$ 8-sliding-puzzle
```
Select a number and press enter.
```
Let's complete this puzzle within 50 moves.

  ---+---+---
   3   1   2
  ---+---+---
   7   4   5
  ---+---+---
   8   6
  ---+---+---


? [Select a number you want to move:] 1/50 …
❯ 5
  6
```
A solved 8-sliding-puzzle
```
  ---+---+---
   1   2   3
  ---+---+---
   4   5   6
  ---+---+---
   7   8
  ---+---+---
```

## LICENSE
MIT