nikon/docsearch
1
0
Fork 0
Code Activity Actions

Merge branch 'master' into doc/update_content

Browse source
This commit is contained in:
Sylvain Pace 2018-08-21 11:50:00 +02:00
commit b2b6eedd87
527 changed files with 5028 additions and 39748 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
.babelrc
View file

@ -1,15 +1,18 @@
{
"presets": [
["env", {
"targets": {
"browsers": ["last 2 versions", "ie >= 9"]
[
"env",
{
"targets": {
"browsers": ["last 2 versions", "ie >= 9"]
}
}
}],
],
"stage-3"
],
"env": {
"test": {
"plugins": ["babel-plugin-rewire"]
},
}
}
}

2
.eslintignore
View file

@ -1,4 +1,4 @@
coverage/
dist/
docs/
docs/dist
dist-es5-module/

12
.eslintrc.js
View file

@ -1,3 +1,13 @@
/* eslint-disable import/no-commonjs */
module.exports = {
extends: ['algolia/jest'],
extends: ['algolia', 'algolia/jest'],
globals: {
docsearch: true,
Glide: true,
Popper: true
},
rules: {
'no-console': 0,
'no-unused-vars': ['error', { argsIgnorePattern: '^_' }],
},
};

0
docs/source/assets/images/bootstrap-docsearch.gif → .github/demo.gif vendored
View file

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 484 KiB

After

Width:  |  Height:  |  Size: 484 KiB

33
.github/docsearch-logo.svg vendored Normal file
View file

@ -0,0 +1,33 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="476px" height="78px" viewBox="0 0 476 78" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 51.2 (57519) - http://www.bohemiancoding.com/sketch -->
<title>docsearch-logo</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="Docsearch-V3" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="DocSearch_V3" transform="translate(-482.000000, -120.000000)" fill-rule="nonzero">
<g id="Section---Hero" transform="translate(365.000000, 120.000000)">
<g id="docsearch-logo" transform="translate(117.000000, 0.000000)">
<path d="M36.4933333,77.2891139 L3.07416667,77.2891139 C1.3763513,77.2891139 6.2397743e-15,75.9187652 0,74.2283544 L36.5230833,74.2283544 C49.2916366,74.2900848 61.1233434,67.5648923 67.561314,56.586092 C73.9992847,45.6072916 74.0654385,32.0428244 67.7348557,21.002294 C61.404273,9.96176365 49.6387199,3.12248929 36.8701667,3.06075949 L0,3.06075949 C4.73181133e-15,1.3703487 1.3763513,-1.03507808e-16 3.07416667,0 L36.8701667,0 C47.1799191,0.0104632345 57.0627976,4.10020304 64.3426603,11.3686868 C71.622523,18.6371705 75.702425,28.4883865 75.684,38.7531646 C75.6245,60.1192405 57.9430833,77.2891139 36.4933333,77.2891139 Z" id="Shape" fill="#5468FF"></path>
<path d="M0,69.0448101 L23.71075,69.0448101 C26.6423682,69.0550684 29.4719692,67.9739447 31.6440833,66.0136709 L0,66.0136709 L0,69.0448101 Z" id="Shape" fill="#21243D"></path>
<path d="M0,60.8005063 L36.3743333,60.8005063 C37.1081667,59.8131646 37.7924167,58.8258228 38.4270833,57.7298734 L0,57.7298734 L0,60.8005063 Z" id="Shape" fill="#21243D"></path>
<path d="M0,52.5463291 L41.02525,52.5463291 C41.4318333,51.5589873 41.79875,50.5716456 42.1160833,49.4855696 L0,49.4855696 L0,52.5463291 Z" id="Shape" fill="#21243D"></path>
<path d="M0,44.3020253 L43.3060833,44.3020253 C43.4548333,43.3146835 43.5738333,42.2681013 43.64325,41.2412658 L0,41.2412658 L0,44.3020253 Z" id="Shape" fill="#21243D"></path>
<path d="M0,36.0577215 L43.6333333,36.0577215 C43.5639167,35.0210127 43.4449167,33.9941772 43.2961667,32.9870886 L0,32.9870886 L0,36.0577215 Z" id="Shape" fill="#21243D"></path>
<path d="M0,27.8035443 L42.1160833,27.8035443 C41.79875,26.7668354 41.4318333,25.74 41.02525,24.7427848 L0,24.7427848 L0,27.8035443 Z" id="Shape" fill="#21243D"></path>
<path d="M0,19.5592405 L38.4270833,19.5592405 C37.7959036,18.5046771 37.1107515,17.4830788 36.3743333,16.498481 L0,16.498481 L0,19.5592405 Z" id="Shape" fill="#21243D"></path>
<path d="M0,8.2443038 L0,11.3149367 L31.6738333,11.3149367 C29.502744,9.35300436 26.6724708,8.27162384 23.7405,8.28379747 L0,8.2443038 Z" id="Shape" fill="#21243D"></path>
<path d="M135.679833,50.0779747 C133.857467,53.3813109 131.098201,56.077032 127.7465,57.8286076 C123.979171,59.7595077 119.784913,60.7169242 115.549,60.6129114 L98.9683333,60.6129114 L98.9683333,16.923038 L115.539083,16.923038 C119.778245,16.8128696 123.978892,17.7490595 127.766333,19.6481013 C131.117724,21.3589797 133.880042,24.0267425 135.699667,27.3098734 C137.592163,30.796513 138.545364,34.711748 138.466417,38.6741772 C138.536692,42.6506388 137.576998,46.5780839 135.679833,50.0779747 Z M124.26575,47.8860759 C126.559806,45.7073418 127.706833,42.6367089 127.706833,38.6741772 C127.706833,34.7116456 126.559806,31.6443038 124.26575,29.4721519 C121.965083,27.2868354 118.745472,26.1941772 114.606917,26.1941772 L109.589083,26.1941772 L109.589083,51.1541772 L114.606917,51.1541772 C118.752083,51.1541772 121.971694,50.0648101 124.26575,47.8860759 Z" id="Shape" fill="#21243D"></path>
<path d="M175.455583,19.1248101 C178.778997,21.0125003 181.521982,23.7674194 183.388917,27.0926582 C185.363981,30.6103542 186.369802,34.5854361 186.304417,38.6149367 C186.357881,42.6599502 185.331208,46.6465125 183.329417,50.1668354 C181.438453,53.5109093 178.668441,56.2790801 175.31675,58.1741772 C168.344929,62.004212 159.886821,62.004212 152.915,58.1741772 C149.564192,56.2812621 146.796866,53.5123487 144.91225,50.1668354 C142.904645,46.6488476 141.877561,42.6606882 141.93725,38.6149367 C141.876602,34.5784542 142.903926,30.599591 144.91225,27.0926582 C146.806618,23.7647079 149.572472,21.0109162 152.915,19.1248101 C159.911199,15.2936429 168.389968,15.2936429 175.386167,19.1248101 L175.455583,19.1248101 Z M155.899917,29.4425316 C153.857083,31.6870886 152.832361,34.744557 152.82575,38.6149367 C152.819139,42.4853165 153.843861,45.5329114 155.899917,47.7577215 C160.475574,52.286235 167.865259,52.286235 172.440917,47.7577215 C174.496972,45.5 175.525,42.4524051 175.525,38.6149367 C175.525,34.7774684 174.500278,31.7298734 172.450833,29.4721519 C167.856159,24.9616095 160.474758,24.9616095 155.880083,29.4721519 L155.899917,29.4425316 Z" id="Shape" fill="#21243D"></path>
<path d="M225.108333,20.8822785 C228.807888,23.8729765 231.326363,28.0696152 232.218583,32.7303797 L220.992917,32.7303797 C220.23117,30.8024314 218.899911,29.1499189 217.175,27.9911392 C215.363487,26.8072206 213.232616,26.2010555 211.066333,26.2534177 C208.171408,26.151896 205.393594,27.3960957 203.5495,29.6202532 C201.6455,31.8779747 200.6935,34.9058228 200.6935,38.7037975 C200.6935,42.5017722 201.6455,45.5164557 203.5495,47.7478481 C205.39548,49.9695422 208.172008,51.2131656 211.066333,51.1146835 C213.22748,51.1823181 215.358116,50.5934386 217.175,49.4263291 C218.88921,48.2774286 220.218887,46.6440734 220.992917,44.7364557 L232.2285,44.7364557 C231.327412,49.393857 228.810628,53.5876774 225.11825,56.584557 C221.462306,59.5268354 216.834528,61.0012658 211.234917,61.0078481 C207.306799,61.0934167 203.428376,60.121217 200.00925,58.1939241 C196.799336,56.3367169 194.19876,53.5931576 192.522167,50.2951899 C190.71746,46.7136362 189.812301,42.7496616 189.884333,38.7432911 C189.811087,34.7336358 190.716268,30.7661764 192.522167,27.181519 C194.19876,23.8835513 196.799336,21.1399919 200.00925,19.2827848 C203.428395,17.367541 207.302981,16.4056772 211.225,16.498481 C216.831222,16.498481 221.459,17.9597468 225.108333,20.8822785 Z" id="Shape" fill="#21243D"></path>
<path d="M267.00625,54.6789873 C265.746742,56.6887326 263.937095,58.2986652 261.790083,59.3194937 C259.180122,60.5355687 256.320749,61.1272646 253.44025,61.0473418 C248.521583,61.0473418 244.468972,59.8526582 241.282417,57.4632911 C238.100352,55.0934231 236.179436,51.4065135 236.06625,47.4516456 L247.361333,47.4516456 C247.443743,48.9216964 248.07302,50.3085152 249.1265,51.3417722 C250.181667,52.3036655 251.574181,52.8142727 253.003917,52.7635443 C254.185488,52.8313439 255.34651,52.4342049 256.23675,51.6577215 C257.030471,50.8792089 257.458747,49.8042318 257.416833,48.6956962 C257.444121,47.6622237 257.050719,46.6616423 256.326,45.9212658 C255.556923,45.1409586 254.640152,44.5201389 253.628667,44.0946835 C252.557667,43.6207595 251.06025,43.1073418 249.15625,42.3964557 C246.832355,41.631224 244.562906,40.7109104 242.363333,39.6417722 C240.553223,38.7109244 238.997831,37.3554683 237.831417,35.6924051 C236.492213,33.6707801 235.829259,31.2793484 235.937333,28.86 C235.875197,26.4642059 236.568818,24.1092735 237.920667,22.1263291 C239.30137,20.182733 241.210816,18.6721146 243.424417,17.7721519 C245.969,16.7236969 248.703542,16.2094249 251.456917,16.261519 C256.335917,16.261519 260.213333,17.4134177 263.089167,19.7172152 C265.987262,22.0657533 267.758273,25.5206486 267.968167,29.2351899 L256.484667,29.2351899 C256.347009,27.9480419 255.789713,26.7412086 254.898,25.7992405 C253.972651,24.9274498 252.729216,24.4707768 251.456917,24.535443 C250.378453,24.4989504 249.322696,24.8493344 248.481917,25.5227848 C247.683067,26.2706544 247.264317,27.3365284 247.3415,28.4255696 C247.309951,29.3971776 247.666556,30.3416121 248.333167,31.0518987 C249.063733,31.8085442 249.940863,32.4097806 250.9115,32.8192405 C251.942833,33.2734177 253.430333,33.8493671 255.374,34.5470886 C257.740146,35.3085002 260.044246,36.2492259 262.266083,37.3610127 C264.095844,38.3308959 265.669168,39.7180446 266.8575,41.4091139 C268.217114,43.4522079 268.8907,45.8720704 268.781333,48.3205063 C268.79676,50.5633392 268.181911,52.7657739 267.00625,54.6789873 Z" id="Shape" fill="#21243D"></path>
<polygon id="Shape" fill="#21243D" points="285.262833 25.3253165 285.262833 34.4779747 300.137833 34.4779747 300.137833 42.4556962 285.262833 42.4556962 285.262833 52.1612658 301.952583 52.1612658 301.952583 60.6227848 274.691667 60.6227848 274.691667 16.923038 301.99225 16.923038 301.99225 25.3253165"></polygon>
<path d="M335.01475,52.6450633 L318.572917,52.6450633 L315.835917,60.6129114 L304.66975,60.6129114 L320.744667,17.2389873 L332.971917,17.2389873 L349.066667,60.6129114 L337.75175,60.6129114 L335.01475,52.6450633 Z M332.287667,44.6081013 L326.823583,28.5440506 L321.3,44.6081013 L332.287667,44.6081013 Z" id="Shape" fill="#21243D"></path>
<path d="M374.85,60.6129114 L365.349833,44.1144304 L362.95,44.1144304 L362.95,60.6129114 L352.339167,60.6129114 L352.339167,16.923038 L370.466833,16.923038 C373.508993,16.8435316 376.527773,17.4723779 379.28275,18.7594937 C381.540412,19.828704 383.423335,21.5486228 384.687333,23.6962025 C385.910213,25.8753713 386.529647,28.3388933 386.48225,30.8346835 C386.570466,33.7560242 385.638202,36.6173857 383.844417,38.9308861 C381.877062,41.2568908 379.174009,42.8479748 376.178833,43.443038 L386.611167,60.6227848 L374.85,60.6129114 Z M362.95,36.9167089 L369.534667,36.9167089 C371.207011,37.0657381 372.873584,36.5750076 374.1955,35.5443038 C375.253092,34.4466552 375.79366,32.9540184 375.683,31.436962 C375.767371,29.9270053 375.217814,28.4500295 374.16575,27.3592405 C372.881752,26.2782142 371.22085,25.7459206 369.544583,25.8782278 L362.95,25.8782278 L362.95,36.9167089 Z" id="Shape" fill="#21243D"></path>
<path d="M424.810167,20.8822785 C428.51301,23.8701397 431.032264,28.0680759 431.920417,32.7303797 L420.684833,32.7303797 C419.929851,30.793271 418.59756,29.1325854 416.866917,27.9713924 C415.055936,26.7863192 412.924694,26.1800488 410.75825,26.2336709 C407.862179,26.1339379 405.085496,27.3865779 403.251333,29.6202532 C401.347333,31.8779747 400.395333,34.9058228 400.395333,38.7037975 C400.395333,42.5017722 401.347333,45.5164557 403.251333,47.7478481 C405.092331,49.9704329 407.86646,51.2146235 410.75825,51.1146835 C412.923728,51.1718617 415.055069,50.5690076 416.866917,49.3868354 C418.583624,48.2406543 419.913992,46.606449 420.684833,44.696962 L431.920417,44.696962 C431.023346,49.3558882 428.505797,53.5509834 424.810167,56.5450633 C421.154222,59.4873418 416.526444,60.9617722 410.926833,60.9683544 C406.995369,61.0557096 403.113284,60.0834509 399.69125,58.1544304 C396.482141,56.2993186 393.884239,53.554945 392.214083,50.2556962 C390.405993,46.6753512 389.500641,42.7105345 389.57625,38.7037975 C389.499025,34.6937353 390.40442,30.7253384 392.214083,27.1420253 C393.884239,23.8427766 396.482141,21.0984029 399.69125,19.2432911 C403.114262,17.3177122 406.996288,16.3488797 410.926833,16.4392405 C416.526444,16.4787342 421.154222,17.9597468 424.810167,20.8822785 Z" id="Shape" fill="#21243D"></path>
<polygon id="Shape" fill="#21243D" points="475.167 16.923038 475.167 60.6129114 464.48675 60.6129114 464.48675 42.3865823 447.8565 42.3865823 447.8565 60.6129114 437.245667 60.6129114 437.245667 16.923038 447.8565 16.923038 447.8565 33.8559494 464.48675 33.8559494 464.48675 16.923038"></polygon>
</g>
</g>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 12 KiB

4
.gitignore vendored
View file

@ -5,8 +5,6 @@ dist/
.idea/
npm-debug.log*
yarn-error.log
docs/_site
docs/build
docs/.sass-cache/
dist-es5-module/
yarn.lock
tmp

1
.ruby-version
View file

@ -1 +0,0 @@
2.3.1

14
.travis.yml
View file

@ -1,18 +1,6 @@
language: node_js
before_install:
- git config --global user.email "algobot@users.noreply.github.com"
- git config --global user.name "algobot"
- rvm install 2.4.2
- rvm use 2.4.2
script: "./scripts/test-ci"
script: "./scripts/test"
sudo: false
branches:
only:
- master
cache:
bundler: true
# before_cache:
# - rm -f ./node_modules/.bin/which
env:
global:
secure: TDLpvycpMbbXpwSKLLeDBZdpi05rbZEbPcII9LSglUG9teF/zrqxRMl+Eivvho8IkeJRDQVwdc8EbYCzZ9cAwRHOyqzDNwRFhlpKVwz+fl5uHfxDo5DANsut6F+l/RrBf4n2MWKkJlbo4kq8mUqL89vcPqfRTLpx62FawywDgiJc2s+ixR1lkm5GNlF74ovoUkeOXiLi605LE0sN7H/1TRdD6WOJTBT2yoiuDU3U/RUKJxka6Sz4u9kqUQpn+kJUIPiBiasbz65qglnrxpBL/mYgAEZfRcbVyC5zd+CeFSIlIiGdhMFoVInNMqshq7gl/UWcJyxdnGIIfhO3l/Y/lyEXQQknEZS4M2h7UKeCuu0E1hh7eT7kVVyXDW+nCUNVYPTuupvLwcpnXw02Flef72OpDy6bl19NEdH79lNK4l440GJb+Lhda2M2mMZJmRkg31j9HFjl0wCYqRopzNTKNBFJAPTB4rG6H/y7NgPFjrATphEDLZgq73eNDxtRNBQHtLqGl8IsaFHU4+8vAQ2iEbi5+R/D5Rua2BXSbYAdQjxnvmPojQ7voZgj+w5GHx2573plCvqO4pZvV/u5/Z18tEYIV+4LFC7KR+30Snbk0JAbRogQr6P4mkVrKG/7pAcGS5tpxhMY3OUNaJWdDP8NE1c3/0Q2pKqdB0RauGoUO2w=

150
CONTRIBUTING.md
View file

@ -4,25 +4,27 @@ Hi (future) collaborator!
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
**Table of Contents**
- [Where to start?](#where-to-start)
- [Development workflow](#development-workflow)
- [Requirements](#requirements)
- [Launch](#launch)
- [Local build](#local-build)
- [Commit message guidelines](#commit-message-guidelines)
- [Revert](#revert)
- [Type](#type)
- [Scope](#scope)
- [Subject](#subject)
- [Body](#body)
- [Footer](#footer)
- [Releasing](#releasing)
- [Where to start?][1]
- [Development workflow][2]
- [Requirements][3]
- [Launch][4]
- [Local build][5]
- [Commit message guidelines][6]
- [Revert][7]
- [Type][8]
- [Scope][9]
- [Subject][10]
- [Body][11]
- [Footer][12]
- [Releasing][13]
<!-- END doctoc generated TOC please keep comment here to allow auto update -->
# Where to start?
Have a fix or a new feature? [Search for corresponding issues](https://github.com/algolia/docsearch/issues) first then create a new one.
Have a fix or a new feature? [Search for corresponding
issues][14] first then create a new
one.
# Development workflow
@ -30,101 +32,51 @@ Have a fix or a new feature? [Search for corresponding issues](https://github.co
To run this project, you will need:
- Node.js >= v8.7.0, use nvm - [install instructions](https://github.com/creationix/nvm#install-script)
- [Ruby](https://www.ruby-lang.org/en/)
- [Bundler](http://bundler.io/)
- Node.js >= v8.7.0, use nvm - [install
instructions][15]
## Launch
## Build
```sh
npm install
npm run dev:docs
```
`yarn run build` will build all files in `./dist`. This includes regular and
minified files for `<script>` inclusion, as well as classes for `import`ing.
Then go to:
- http://localhost:4000/docsearch/ documentation website with autoreload
- http://localhost:8080 local DocSearch example for easy hacking/additions/fixes
The command itself is split into `yarn run build:js` and `yarn run build:css` if
you want to build a subset.
## Local build
## Serve
You might want to expose a local build to the outside to test things on real
websites. To do so:
You can have all this files served on localhost, along with live-reload, with
the `yarn run serve` command.
```sh
npm run serve
```
## Test
Then files will be available at http://localhost:8080. Use [ngrok](https://ngrok.com/download) to
then expose your build to the web.
You can run all tests with `yarn run test`, and `yarn run test:watch` will run
them with auto-reload.
# Commit message guidelines
## Docs
We use [conventional changelog](https://github.com/ajoslin/conventional-changelog) to generate our changelog from our git commit messages.
- `yarn docs:build` will build the docs website in `./docs/dist`.
- `yarn docs:serve` will do the same, but with live-reload enabled
- `yarn docs:deploy` will deploy the doc website
Here are the rules to write commit messages, they are the same than [angular/angular.js](https://github.com/angular/angular.js/blob/7c792f4cc99515ac27ed317e0e35e40940b3a400/CONTRIBUTING.md#commit-message-format).
## Release
Each commit message consists of a **header**, a **body** and a **footer**. The header has a special
format that includes a **type**, a **scope** and a **subject**:
`npm run release` will guide you through the release process. Note that you have
to use `npm` and not `yarn` for this one otherwise it won't deploy to npm.
```text
<type>(<scope>): <subject>
<BLANK LINE>
<body>
<BLANK LINE>
<footer>
```
The **header** is mandatory and the **scope** of the header is optional.
Any line of the commit message cannot be longer 100 characters! This allows the message to be easier
to read on GitHub as well as in various git tools.
## Revert
If the commit reverts a previous commit, it should begin with `revert: `, followed by the header of the reverted commit. In the body it should say: `This reverts commit <hash>.`, where the hash is the SHA of the commit being reverted.
## Type
Must be one of the following:
* **feat**: A new feature
* **fix**: A bug fix
* **docs**: Documentation only changes
* **style**: Changes that do not affect the meaning of the code (white-space, formatting, missing
semi-colons, etc)
* **refactor**: A code change that neither fixes a bug nor adds a feature
* **perf**: A code change that improves performance
* **test**: Adding missing tests
* **chore**: Changes to the build process or auxiliary tools and libraries such as documentation
generation
## Scope
The scope could be anything specifying place of the commit change. For example `RefinementList`,
`refinementList`, `rangeSlider`, `CI`, `url`, `build` etc...
## Subject
The subject contains succinct description of the change:
* use the imperative, present tense: "change" not "changed" nor "changes"
* don't capitalize first letter
* no dot (.) at the end
## Body
Just as in the **subject**, use the imperative, present tense: "change" not "changed" nor "changes".
The body should include the motivation for the change and contrast this with previous behavior.
## Footer
The footer should contain any information about **Breaking Changes** and is also the place to
reference GitHub issues that this commit **Closes**.
**Breaking Changes** should start with the word `BREAKING CHANGE:` with a space or two newlines. The rest of the commit message is then used for this.
# Releasing
If you are a maintainer, you can release.
We use [semver](http://semver-ftw.org/).
You must be on the master branch.
```sh
npm run release
```
[1]: #where-to-start
[2]: #development-workflow
[3]: #requirements
[4]: #launch
[5]: #local-build
[6]: #commit-message-guidelines
[7]: #revert
[8]: #type
[9]: #scope
[10]: #subject
[11]: #body
[12]: #footer
[13]: #releasing
[14]: https://github.com/algolia/docsearch/issues
[15]: https://github.com/creationix/nvm#install-script

324
README.md
View file

@ -1,309 +1,43 @@
![DocSearch](https://cdn.rawgit.com/algolia/docsearch/master/docs/source/assets/images/docsearch-logo-horizontal_dark.svg)
[![DocSearch][1]][8]
The easiest way to add search to your documentation. For free.
Check out our [website][1] to add an outstanding search to your documentation.
[![npm version][2]](https://npmjs.org/package/docsearch.js)
[![build][3]](https://travis-ci.org/algolia/docsearch)
[![coverage][4]](https://coveralls.io/github/algolia/docsearch)
[![License][5]](./LICENSE)
[![Downloads][6]](https://npm-stat.com/charts.html?package=docsearch.js)
[![jsDelivr Hits][7]](https://www.jsdelivr.com/package/npm/docsearch.js)
[![Version][version-svg]][package-url] [![Build Status][travis-svg]][travis-url] [![Coverage Status][coveralls-svg]][coveralls-url] [![License][license-image]][license-url] [![Downloads][downloads-image]][downloads-url] [![jsDelivr Hits][jsdelivr-badge]][jsdelivr-url]
DocSearch will crawl your documentation website, push its content to an Algolia
index, and allow you to add a dropdown search menu for your users to find
relevant content in no time.
[version-svg]: https://img.shields.io/npm/v/docsearch.js.svg?style=flat-square
[package-url]: https://npmjs.org/package/docsearch.js
[travis-svg]: https://img.shields.io/travis/algolia/docsearch/master.svg?style=flat-square
[travis-url]: https://travis-ci.org/algolia/docsearch.svg?branch=master
[coveralls-svg]: https://img.shields.io/coveralls/algolia/docsearch/master.svg?style=flat-square
[coveralls-url]: https://coveralls.io/github/algolia/docsearch?branch=docs%2Fbadges
[license-image]: http://img.shields.io/badge/license-MIT-green.svg?style=flat-square
[license-url]: LICENSE
[downloads-image]: https://img.shields.io/npm/dm/docsearch.js.svg?style=flat-square
[downloads-url]: http://npm-stat.com/charts.html?package=docsearch.js
[docsearch-website]: https://community.algolia.com/docsearch/?utm_medium=social-owned&utm_source=GitHub&utm_campaign=docsearch%20repository
[docsearch-website-docs]: https://community.algolia.com/docsearch/documentation/?utm_medium=social-owned&utm_source=GitHub&utm_campaign=docsearch%20repository
[jsdelivr-badge]: https://data.jsdelivr.com/v1/package/npm/docsearch.js/badge
[jsdelivr-url]: https://www.jsdelivr.com/package/npm/docsearch.js
Check out our [website][8] for a complete explanation and documentation.
![Bootstrap][7]
[![Bootstrap demo][9]][8]
<!-- START doctoc generated TOC please keep comment here to allow auto update -->
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
## Table of Contents
## Related projects
- [Introduction](#introduction)
- [Setup](#setup)
- [Customization](#customization)
- [Attribution](#attribution)
- [Default styling](#default-styling)
- [Advanced styling](#advanced-styling)
- [Custom options](#custom-options)
- [Autocomplete options](#autocomplete-options)
- [Docsearch Options](#docsearch-options)
- [Algolia options](#algolia-options)
- [Contributions and development workflow](#contributions-and-development-workflow)
DocSearch is made of 3 repositories:
<!-- END doctoc generated TOC please keep comment here to allow auto update -->
- [algolia/docsearch][10] contains the `docsearch.js` code source and the
documentation website.
- [algolia/docsearch-configs][11] contains the JSON files representing all the
configs for all the documentations DocSearch is powering
- [algolia/docsearch-scraper][12] contains the crawler we use to extract data
from your documentation. The code is open-source and you can run it from
a Docker image
<!-- START documentation -->
## Introduction
We're scratching our own itch here. As developers, we spend a lot of time
reading documentation, and it isn't always easy to find the information we need.
Not blaming anyone here. Building a good search for a documentation is a complex
challenge. We happen to have a lot of experience doing that, and we want to
share it with the world. For free.
Just submit the form on the [website][16] and we'll get back to you with what
you need to integrate your new search into your website.
1. We'll crawl your documentation pages,
2. We'll configure your search experience,
3. You'll need to add a bit of JavaScript and CSS code to your website.
If you prefer to DIY, you can run the [scraper][28] in your own infra.
**Update** You can check [the DocSearch dedicated documentation website][29]
## Setup
Once we've crawled your documentation website we'll send you the credentials you
need to add the following code snippet to your website:
```html
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.css" />
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.js"></script>
<script type="text/javascript">
docsearch({
apiKey: '<API_KEY>',
indexName: '<INDEX_NAME>',
inputSelector: '<YOUR_INPUT_DOM_SELECTOR>'
});
</script>
```
You can also install docsearch via `npm`:
```sh
npm install --save docsearch.js
```
## Customization
### Attribution
We're happy to provide DocSearch free of charge for your site, and you're
welcome to customise that experience in a way that works for you; all we ask is
that Algolia be attributed within the search context. For example, in the
default implementation, we place a small "Search by Algolia" logo in the
corner. If you prefer to roll your own UX, you'll need to make sure that this
logo is included in your implementation as well.
### Default styling
The default colorscheme is white and gray:
![Default colorscheme][17]
To update the colors to suit your website, you just need to override a few
colors. Here is an example of a CSS file that you can use as a basis to
set white and purple colors.
```css
/* Bottom border of each suggestion */
.algolia-docsearch-suggestion {
border-bottom-color: #3A3DD1;
}
/* Main category headers */
.algolia-docsearch-suggestion--category-header {
background-color: #4B54DE;
}
/* Highlighted search terms */
.algolia-docsearch-suggestion--highlight {
color: #3A33D1;
}
/* Highlighted search terms in the main category headers */
.algolia-docsearch-suggestion--category-header .algolia-docsearch-suggestion--highlight {
background-color: #4D47D5;
}
/* Currently selected suggestion */
.aa-cursor .algolia-docsearch-suggestion--content {
color: #272296;
}
.aa-cursor .algolia-docsearch-suggestion {
background: #EBEBFB;
}
/* For bigger screens, when displaying results in two columns */
@media (min-width: 768px) {
/* Bottom border of each suggestion */
.algolia-docsearch-suggestion {
border-bottom-color: #7671df;
}
/* Left column, with secondary category header */
.algolia-docsearch-suggestion--subcategory-column {
border-right-color: #7671df;
background-color: #F2F2FF;
color: #4E4726;
}
}
```
### Advanced styling
If you want to do heavy changes to the way results are displayed, you might find
it easier to directly edit the `scss` files in this repository.
[`_variables.scss`][18]
contains all the color, breakpoints and size definitions while
[`main.scss`][19]
holds the structure of the display.
You can regenerate the whole final `css` file from those `scss` files by running
`npm run build:css`. The resulting files will be found in `./dist/cdn/`.
All you have to do now is change the `link` tag that was loading the default
styling from our CDN, to one that is loading your newly compiled file.
## Custom options
DocSearch is a wrapper around the [autocomplete.js][20] library that gets its
results from the Algolia API. As such, you can use any options provided by
[autocomplete.js][21] and by the Algolia API.
### Autocomplete options
You can pass any options to the underlying `autocomplete` instance through
the`autocompleteOptions` parameter. You will find all `autocomplete` options in
its [own documentation][22].
You can also listen to `autocomplete` events through the `.autocomplete`
property of the `docsearch` instance.
```javascript
var search = docsearch({
apiKey: '<API_KEY>',
indexName: '<INDEX_NAME>',
inputSelector: '<YOUR_INPUT_DOM_SELECTOR>',
debug: true,
autocompleteOptions: {
// See https://github.com/algolia/autocomplete.js#options
// For full list of options
}
});
// See https://github.com/algolia/autocomplete.js#custom-events
// For full list of events
search.autocomplete.on('autocomplete:opened', function(e) {
// Do something when the dropdown menu is opened
});
```
### Docsearch Options
#### handleSelected
We already bind the autocomplete:selected event inside the docsearch.
If you want to replace the default behavior you can pass the `handleSelected` option.
```javascript
var search = docsearch({
apiKey: '<API_KEY>',
indexName: '<INDEX_NAME>',
inputSelector: '<YOUR_INPUT_DOM_SELECTOR>',
handleSelected: function (input, event, suggestion) {
}
});
```
#### queryHook
If you want modify the query before it is send to Algolia you can pass the `queryHook` option.
```javascript
var search = docsearch({
apiKey: '<API_KEY>',
indexName: '<INDEX_NAME>',
inputSelector: '<YOUR_INPUT_DOM_SELECTOR>',
queryHook: function (query) {
return query + "_modified";
}
});
```
#### transformData
If you want to modify the hits before displaying them you can make use of the
`transformData` option
```
var search = docsearch({
apiKey: '<API_KEY>',
indexName: '<INDEX_NAME>',
inputSelector: '<YOUR_INPUT_DOM_SELECTOR>',
transformData: function (hits) {
// modify hits
return hits;
}
});
```
### Algolia options
You can also pass any specific option to the Algolia API to change the way
records are returned. You can pass any options to the Algolia API through
the `algoliaOptions` parameter.
```javascript
docsearch({
appId: '<APP_ID>', // if you are running the crawler yourself
apiKey: '<API_KEY>',
indexName: '<INDEX_NAME>',
inputSelector: '<YOUR_INPUT_DOM_SELECTOR>',
algoliaOptions: {
hitsPerPage: 10
}
});
```
You will find all Algolia API options in its [own documentation][23].
<!-- END documentation -->
## Contributions and development workflow
See [CONTRIBUTING](./CONTRIBUTING.md)
<!-- START links -->
[1]: https://community.algolia.com/docsearch/
[1]: ./.github/docsearch-logo.svg
[2]: https://img.shields.io/npm/v/docsearch.js.svg?style=flat-square
[3]: https://img.shields.io/travis/algolia/docsearch/master.svg?style=flat-square
[4]: https://img.shields.io/coveralls/algolia/docsearch/master.svg?style=flat-square
[5]: http://img.shields.io/badge/license-MIT-green.svg?style=flat-square
[5]: https://img.shields.io/badge/license-MIT-green.svg?style=flat-square
[6]: https://img.shields.io/npm/dm/docsearch.js.svg?style=flat-square
[7]: ./docs/source/assets/images/bootstrap-docsearch.gif
[8]: #introduction
[9]: #setup
[10]: #customization
[11]: #development-workflow
[12]: #local-example
[13]: #local-build
[14]: #documentation-website
[15]: #macos
[16]: https://community.algolia.com/docsearch/
[17]: https://community.algolia.com/docsearch/assets/images/default-colorscheme.png
[18]: https://github.com/algolia/docsearch/blob/master/src/styles/_variables.scss
[19]: https://github.com/algolia/docsearch/blob/master/src/styles/main.scss
[20]: https://github.com/algolia/autocomplete.js
[21]: https://github.com/algolia/autocomplete.js
[22]: https://github.com/algolia/autocomplete.js#options
[23]: https://www.algolia.com/doc/api-reference/api-parameters/
[24]: https://nodejs.org/en/
[25]: https://jekyllrb.com/
[26]: https://www.ruby-lang.org/en/
[27]: http://bundler.io/
[28]: https://github.com/algolia/docsearch-scraper
[29]: https://community.algolia.com/docsearch/documentation/docsearch/introduction/
<!-- END links -->
[7]: https://data.jsdelivr.com/v1/package/npm/docsearch.js/badge
[8]: https://community.algolia.com/docsearch/
[9]: ./.github/demo.gif
[10]: https://github.com/algolia/docsearch
[11]: https://github.com/algolia/docsearch-configs
[12]: https://github.com/algolia/docsearch-scraper

11
dev/app.js
View file

@ -1,11 +0,0 @@
// eslint-disable-next-line import/no-commonjs
const docsearch = require('../index.js');
docsearch({
apiKey: 'e3d767b736584dbe6d4c35f7cf7d4633',
indexName: 'react-native',
inputSelector: '#search-input',
debug: true,
});
document.getElementById('search-input').focus();

1
dev/docsearch.css
View file

@ -1 +0,0 @@
../dist/cdn/docsearch.css

1
dev/docsearch.min.css vendored
View file

@ -1 +0,0 @@
../dist/cdn/docsearch.min.css

227
dev/index.html
View file

@ -1,227 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Documentation</title>
<link rel="stylesheet" type="text/css" href="/stripe.css" media="screen" />
<link rel="stylesheet" type="text/css" href="/docsearch.css" media="screen" />
<link rel="shortcut icon" href="favicon.ico">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body id="documentation">
<div id="header">
<h1><a href="index.html">Stripe</a></h1>
<div class="navigation">
<div class="signin"><a id='signin' href="https://dashboard.stripe.com/login"><span>Sign In</span></a></div>
<ul class="global">
<li><input type="text" id="search-input" /></li>
<li><a href="country%3Fcountry=CH&amp;redirect=%252Fdocs.html" class="selected">Documentation</a></li>
<li><a href="https://support.stripe.com">Help &amp; Support</a></li>
</ul>
</div>
</div>
<!-- #header -->
<section id="doc">
<nav>
<h1 class="references">Development</h1>
<ul>
<li class="selected"><a href="country%3Fcountry=CH&amp;redirect=%252Fdocs.html">Getting Started</a></li>
<li class="unselected sub"><a href="docs/tutorials/checkout.html">Embedded Form</a></li>
<li class="unselected sub"><a href="docs/tutorials/forms.html">Custom Forms</a></li>
<li class="unselected sub"><a href="docs/mobile.html">Mobile Apps</a></li>
<li class="unselected"><a href="docs/tutorials/charges.html">Charging Cards</a></li>
<li class="unselected"><a href="docs/testing.html">Testing</a></li>
<li class="unselected"><a href="help/security.html">Security</a></li>
<li class="unselected"><a href="docs/fraud.html">Fraud Protection</a></li>
<li class="unselected"><a href="docs/webhooks.html">Webhooks</a></li>
<li class="unselected"><a href="docs/guides/bitcoin.html">Bitcoin Guide</a></li>
<li class="unselected"><a href="docs/guides/alipay.html">Alipay Guide</a></li>
<li class="unselected"><a href="docs/guides/file-upload.html">File Upload Guide</a></li>
</ul>
<h1 class="getting-started">Account</h1>
<ul>
<li class="unselected"><a href="docs/tutorials/dashboard.html">Your Account</a></li>
<li class="unselected"><a href="help/transfers.html">Getting Paid</a></li>
<li class="unselected"><a href="help/disputes-overview.html">Disputes</a></li>
<li class="unselected sub"><a href="docs/guides/dispute-evidence.html">Submitting Evidence</a></li>
<li class="unselected sub"><a href="help/dispute-types.html">Dispute Types</a></li>
<li class="unselected sub"><a href="help/disputes.html">Disputes FAQ</a></li>
<li class="unselected"><a href="docs/integrations.html">Integrations</a></li>
</ul>
<h1 class="faq">References</h1>
<ul>
<li class="unselected"><a href="docs/examples.html">Examples</a></li>
<li class="unselected"><a href="docs/stripe.js.html">Stripe.js</a></li>
<li class="unselected"><a href="docs/checkout.html">Checkout</a></li>
<li class="unselected"><a href="docs/libraries.html">API Libraries</a></li>
<li class="unselected"><a href="docs/upgrades.html">API Upgrades</a></li>
<li class="unselected">
<a href="docs/api.html" class="external" target="_blank">Full API Reference</a>
</li>
</ul>
<h1 class="subscriptions">Subscriptions</h1>
<ul>
<li class="unselected"><a href="docs/subscriptions.html">Overview</a></li>
<li class="unselected"><a href="docs/tutorials/subscriptions.html">Getting Started</a></li>
<li class="unselected"><a href="docs/guides/subscriptions.html">Integration Guide</a></li>
</ul>
<h1 class="orders">Relay</h1>
<ul>
<li class="unselected"><a href="docs/relay.html">Overview</a></li>
<li class="unselected"><a href="docs/relay/apps-guide.html">Apps Guide</a></li>
</ul>
<h1 class="connect">Connect</h1>
<ul>
<li class="unselected"><a href="docs/connect.html">Overview</a></li>
<li class="unselected"><a href="docs/connect/connecting-to-accounts.html">Connecting to Accounts</a></li>
<li class="unselected sub"><a href="docs/connect/standalone-accounts.html">Standalone Accounts</a></li>
<li class="unselected sub"><a href="docs/connect/authentication.html">Authentication</a></li>
<li class="unselected sub"><a href="docs/connect/reference.html">OAuth Reference</a></li>
<li class="unselected"><a href="docs/connect/payments-fees.html">Payments and Fees</a></li>
<li class="unselected"><a href="docs/connect/special-case-transfers.html">Special-case Transfers</a></li>
<li class="unselected"><a href="docs/connect/managed-accounts.html">Managed Accounts</a></li>
<li class="unselected sub"><a href="docs/connect/updating-accounts.html">Updating Accounts</a></li>
<li class="unselected sub"><a href="docs/connect/identity-verification.html">Identity Verification</a></li>
<li class="unselected sub"><a href="docs/connect/bank-transfers.html">Bank Transfers</a></li>
<li class="unselected sub"><a href="docs/connect/migrating.html">Migrating Recipients</a></li>
<li class="unselected"><a href="docs/connect/testing.html">Testing</a></li>
</ul>
<h1 class="more">About Stripe</h1>
<ul>
<li class="unselected"><a href="help/contact.html">Contact</a></li>
<li class="unselected"><a href="global.html">Global Users</a></li>
<li class="unselected last"><a href="gallery.html">Gallery</a></li>
</ul>
</nav>
<section id="content">
<section id="start">
<header>
<h1>Getting Started</h1>
<p>
Below you'll find tutorials that will teach you how to use Stripe, and reference documentation for all the moving&nbsp;parts.
</p>
</header>
<section class="getting-started">
<div class="implementation-options">
<div class="guides">
<a class="web" href="docs/tutorials/checkout.html">
<h2>On your website</h2>
<p>
Start accepting payments on your website with our JavaScript libraries. <span class="arrow">Learn more</span>
</p>
</a>
<a class="mobile" href="docs/mobile.html">
<h2>In your mobile app</h2>
<p>
We have toolkits for native iPhone and Android applications. <span class="arrow">Learn more</span>
</p>
</a>
</div>
<div class="payment-types">
<h3>Accept different payment types</h3>
<p>
In addition to charging <a href="docs/tutorials/charges.html">credit and debit cards</a>, Stripe's APIs let you accept payments on <a href="docs/mobile/android.html">Android</a> and <a href="docs/mobile/ios.html">iOS</a>. You can also support <a href="docs/guides/bitcoin.html">Bitcoin</a>, <a href="docs/guides/alipay.html">Alipay</a>, or <a href="docs/guides/amex-express-checkout.html">Amex Express Checkout</a>.
</p>
<hr>
</div>
<div class="non-developer">
<a class="platforms" href="docs/libraries.html#third-party-plugins">
<h3>Stripe plugins for 3rd party software</h3>
<p>
As well as the official API libraries listed above, there are a number of third-party plugins and libraries built by our community, such as for WordPress and Drupal.
<span class="arrow">Learn more</span>
</p>
</a>
<a class="services" href="docs/integrations.html">
<h3>Use Stripe with other services</h3>
<p>
Stripe has lots of third-party integrations which require no programming, hosting or complicated setup on your behalf, such as Shopify and Wufoo.
<span class="arrow">Learn more</span>
</p>
</a>
</div>
</div>
<section id="details">
<article>
<hr>
<h2>Need help?</h2>
<p>We're always happy to help out with code or any other questions you might have. <a href="https://support.stripe.com" class="arrow">Learn more</a></p>
<h2>API mailing list</h2>
<p>Join our mailing list to be notified of API changes and stay up to&nbsp;date. <a href="https://groups.google.com/a/lists.stripe.com/forum/#!forum/api-discuss" class="arrow">View mailing list</a></p>
<h2>Resources</h2>
<ul>
<li><a href="docs/libraries.html">API libraries</a></li>
<li><a href="docs/examples.html">Example projects</a></li>
</ul>
</article>
</section>
</section>
</section>
<footer class="clearfix">
<section class="questions">
<h1>Questions?</h1>
<p>We're always happy to help with code or other questions you might have! Check out our answers to <a href="https://support.stripe.com">common questions</a> or chat live with other developers in <a href="irc://irc.freenode.net/stripe">#stripe</a> on freenode.</p>
</section>
</footer>
</section>
</section>
<!-- #documentation -->
<div id="footer">
<p><a href="index.html">&copy; Stripe</a></p>
<ul>
<li><a href="https://status.stripe.com"><span>System Status</span></a></li>
<li><a href="about.html">About</a></li>
<li><a href="blog.html"><span>Blog</span></a></li>
<li><a href="jobs.html"><span>Jobs</span></a></li>
<li><a href="http://twitter.com/stripe">Twitter</a></li>
</ul>
<ul class="lesser">
<li><a href="terms.html">Terms of Service</a></li>
<li><a href="privacy.html">Privacy Policy</a></li>
</ul>
</div>
<div class="country-dropdown-overlay"></div>
<script src="/bundle.js"></script>
</body>
</html>

1
dev/stripe.css
View file

File diff suppressed because one or more lines are too long

5
docs/.babelrc Normal file
View file

@ -0,0 +1,5 @@
{
"presets": [["@babel/preset-env", { "targets": { "node": 6 } }]],
"plugins": ["@babel/plugin-proposal-object-rest-spread"],
"comments": false
}

57
docs/.stylelintrc.js Normal file
View file

@ -0,0 +1,57 @@
/* eslint-disable import/no-commonjs */
// Initially exported from
// https://github.com/stylelint/stylelint-config-recommended/blob/master/index.js
module.exports = {
plugins: ['stylelint-csstree-validator'],
rules: {
// Prettier
'selector-list-comma-newline-after': 'always',
'declaration-block-semicolon-newline-after': 'always',
'declaration-block-semicolon-space-before': 'never',
'declaration-colon-space-after': 'always',
'declaration-colon-space-before': 'never',
'color-hex-case': 'lower',
'string-quotes': 'double',
'no-extra-semicolons': true,
indentation: 2,
// Tailwind
'at-rule-no-unknown': [
true,
{
ignoreAtRules: ['tailwind', 'screen'],
},
],
// Stylelint
'block-no-empty': true,
'color-no-invalid-hex': true,
'comment-no-empty': true,
'declaration-block-no-duplicate-properties': [
true,
{
ignore: ['consecutive-duplicates-with-different-values'],
},
],
'font-family-no-duplicate-names': true,
'selector-pseudo-class-no-unknown': true,
// Plugins
'csstree/validator': true,
//
//
//
// 'selector-pseudo-element-no-unknown': true,
// 'selector-type-no-unknown': true,
// 'declaration-block-no-redundant-longhand-properties': true,
// 'declaration-block-no-shorthand-property-overrides': true,
// 'function-calc-no-unspaced-operator': true,
// 'function-linear-gradient-no-nonstandard-direction': true,
// 'keyframe-declaration-no-important': true,
// 'media-feature-name-no-unknown': true,
// 'no-empty-source': true,
// 'no-invalid-double-slash-comments': true,
// 'property-no-unknown': true,
// 'shorthand-property-no-redundant-values': true,
// 'string-no-newline': true,
// 'unit-no-unknown': true,
},
};

39
docs/Gemfile
View file

@ -1,39 +0,0 @@
# If you do not have OpenSSL installed, change
# the following line to use 'http://'
source 'https://rubygems.org'
# For faster file watcher updates on Windows:
gem 'wdm', '~> 0.1.0', platforms: [:mswin, :mingw]
# Windows does not come with time zone data
gem 'tzinfo-data', platforms: [:mswin, :mingw, :jruby]
gem 'rake'
# Middleman Gems
gem 'middleman', '>= 4.0.0'
gem 'middleman-livereload'
gem 'middleman-syntax'
gem 'middleman-autoprefixer'
gem 'middleman-s3_sync', github: 'fredjean/middleman-s3_sync', ref: '8c4e57a'
gem 'middleman-minify-html'
gem 'sprockets', '4.0.0.beta4'
gem 'middleman-sprockets'
gem 'sprockets-es6'
gem 'redcarpet', '>= 3.3.4'
gem 'nokogiri'
gem 'sassc'
gem 'kramdown', '>= 1.12.0'
gem 'pry-byebug'
gem 'rb-readline'
gem 'mime-types'
gem 'highlight', :require => 'simplabs/highlight' # TODO: Replace with rouge
gem 'htmlentities'
gem 'better_errors'
gem 'binding_of_caller'
gem 'octokit'
gem 'google-api-client', '0.8.6'
gem 'algoliasearch'
gem 'middleman-vcs-time'
gem 'hashie', '3.4.6'
gem 'haml', '4.0.7'

293
docs/Gemfile.lock
View file

@ -1,293 +0,0 @@
GIT
remote: git://github.com/fredjean/middleman-s3_sync.git
revision: 8c4e57a67048a3bafa4529c8f46184d33996e52b
ref: 8c4e57a
specs:
middleman-s3_sync (4.0.3)
ansi (~> 1.5.0)
fog-aws (>= 0.1.1)
map
middleman-cli
middleman-core (>= 4.0.0)
mime-types (~> 3.1)
parallel
ruby-progressbar
unf
GEM
remote: https://rubygems.org/
specs:
activesupport (5.0.6)
concurrent-ruby (~> 1.0, >= 1.0.2)
i18n (~> 0.7)
minitest (~> 5.1)
tzinfo (~> 1.1)
addressable (2.5.2)
public_suffix (>= 2.0.2, < 4.0)
algoliasearch (1.16.0)
httpclient (~> 2.8.3)
json (>= 1.5.1)
ansi (1.5.0)
autoparse (0.3.3)
addressable (>= 2.3.1)
extlib (>= 0.9.15)
multi_json (>= 1.0.0)
autoprefixer-rails (7.1.5)
execjs
babel-source (5.8.35)
babel-transpiler (0.7.0)
babel-source (>= 4.0, < 6)
execjs (~> 2.0)
backports (3.9.1)
better_errors (2.3.0)
coderay (>= 1.0.0)
erubi (>= 1.0.0)
rack (>= 0.9.0)
binding_of_caller (0.7.2)
debug_inspector (>= 0.0.1)
builder (3.2.3)
byebug (9.1.0)
coderay (1.1.2)
coffee-script (2.4.1)
coffee-script-source
execjs
coffee-script-source (1.12.2)
compass-import-once (1.0.5)
sass (>= 3.2, < 3.5)
concurrent-ruby (1.0.5)
contracts (0.13.0)
debug_inspector (0.0.3)
dotenv (2.2.1)
em-websocket (0.5.1)
eventmachine (>= 0.12.9)
http_parser.rb (~> 0.6.0)
erubi (1.6.1)
erubis (2.7.0)
eventmachine (1.2.5)
excon (0.59.0)
execjs (2.7.0)
extlib (0.9.16)
faraday (0.13.1)
multipart-post (>= 1.2, < 3)
fast_blank (1.0.0)
fastimage (2.1.0)
ffi (1.9.18)
fog-aws (1.4.1)
fog-core (~> 1.38)
fog-json (~> 1.0)
fog-xml (~> 0.1)
ipaddress (~> 0.8)
fog-core (1.45.0)
builder
excon (~> 0.58)
formatador (~> 0.2)
fog-json (1.0.2)
fog-core (~> 1.0)
multi_json (~> 1.10)
fog-xml (0.1.3)
fog-core
nokogiri (>= 1.5.11, < 2.0.0)
formatador (0.2.5)
google-api-client (0.8.6)
activesupport (>= 3.2)
addressable (~> 2.3)
autoparse (~> 0.3)
extlib (~> 0.9)
faraday (~> 0.9)
googleauth (~> 0.3)
launchy (~> 2.4)
multi_json (~> 1.10)
retriable (~> 1.4)
signet (~> 0.6)
googleauth (0.5.3)
faraday (~> 0.12)
jwt (~> 1.4)
logging (~> 2.0)
memoist (~> 0.12)
multi_json (~> 1.11)
os (~> 0.9)
signet (~> 0.7)
haml (4.0.7)
tilt
hamster (3.0.0)
concurrent-ruby (~> 1.0)
hashie (3.4.6)
highlight (2.0.0)
htmlcompressor (0.2.0)
htmlentities (4.3.4)
http_parser.rb (0.6.0)
httpclient (2.8.3)
i18n (0.7.0)
ipaddress (0.8.3)
json (2.1.0)
jwt (1.5.6)
kramdown (1.15.0)
launchy (2.4.3)
addressable (~> 2.3)
listen (3.0.8)
rb-fsevent (~> 0.9, >= 0.9.4)
rb-inotify (~> 0.9, >= 0.9.7)
little-plugger (1.1.4)
logging (2.2.2)
little-plugger (~> 1.1)
multi_json (~> 1.10)
map (6.6.0)
memoist (0.16.0)
method_source (0.9.0)
middleman (4.2.1)
coffee-script (~> 2.2)
compass-import-once (= 1.0.5)
haml (>= 4.0.5)
kramdown (~> 1.2)
middleman-cli (= 4.2.1)
middleman-core (= 4.2.1)
sass (>= 3.4.0, < 4.0)
middleman-autoprefixer (2.8.0)
autoprefixer-rails (>= 7.0.1, < 8.0.0)
middleman-core (>= 3.3.3)
middleman-cli (4.2.1)
thor (>= 0.17.0, < 2.0)
middleman-core (4.2.1)
activesupport (>= 4.2, < 5.1)
addressable (~> 2.3)
backports (~> 3.6)
bundler (~> 1.1)
contracts (~> 0.13.0)
dotenv
erubis
execjs (~> 2.0)
fast_blank
fastimage (~> 2.0)
hamster (~> 3.0)
hashie (~> 3.4)
i18n (~> 0.7.0)
listen (~> 3.0.0)
memoist (~> 0.14)
padrino-helpers (~> 0.13.0)
parallel
rack (>= 1.4.5, < 3)
sass (>= 3.4)
servolux
tilt (~> 2.0)
uglifier (~> 3.0)
middleman-livereload (3.4.6)
em-websocket (~> 0.5.1)
middleman-core (>= 3.3)
rack-livereload (~> 0.3.15)
middleman-minify-html (3.4.1)
htmlcompressor (~> 0.2.0)
middleman-core (>= 3.2)
middleman-sprockets (4.1.1)
middleman-core (~> 4.0)
sprockets (>= 3.0)
middleman-syntax (3.0.0)
middleman-core (>= 3.2)
rouge (~> 2.0)
middleman-vcs-time (0.0.5)
middleman-core (~> 4.0)
mime-types (3.1)
mime-types-data (~> 3.2015)
mime-types-data (3.2016.0521)
mini_portile2 (2.3.0)
minitest (5.10.3)
multi_json (1.12.2)
multipart-post (2.0.0)
nokogiri (1.8.1)
mini_portile2 (~> 2.3.0)
octokit (4.7.0)
sawyer (~> 0.8.0, >= 0.5.3)
os (0.9.6)
padrino-helpers (0.13.3.4)
i18n (~> 0.6, >= 0.6.7)
padrino-support (= 0.13.3.4)
tilt (>= 1.4.1, < 3)
padrino-support (0.13.3.4)
activesupport (>= 3.1)
parallel (1.12.0)
pry (0.11.1)
coderay (~> 1.1.0)
method_source (~> 0.9.0)
pry-byebug (3.5.0)
byebug (~> 9.1)
pry (~> 0.10)
public_suffix (3.0.0)
rack (2.0.3)
rack-livereload (0.3.16)
rack
rake (12.1.0)
rb-fsevent (0.10.2)
rb-inotify (0.9.10)
ffi (>= 0.5.0, < 2)
rb-readline (0.5.5)
redcarpet (3.4.0)
retriable (1.4.1)
rouge (2.2.1)
ruby-progressbar (1.9.0)
sass (3.4.25)
sassc (1.11.4)
bundler
ffi (~> 1.9.6)
sass (>= 3.3.0)
sawyer (0.8.1)
addressable (>= 2.3.5, < 2.6)
faraday (~> 0.8, < 1.0)
servolux (0.13.0)
signet (0.7.3)
addressable (~> 2.3)
faraday (~> 0.9)
jwt (~> 1.5)
multi_json (~> 1.10)
sprockets (4.0.0.beta4)
concurrent-ruby (~> 1.0)
rack (> 1, < 3)
sprockets-es6 (0.9.2)
babel-source (>= 5.8.11)
babel-transpiler
sprockets (>= 3.0.0)
thor (0.20.0)
thread_safe (0.3.6)
tilt (2.0.8)
tzinfo (1.2.3)
thread_safe (~> 0.1)
uglifier (3.2.0)
execjs (>= 0.3.0, < 3)
unf (0.1.4)
unf_ext
unf_ext (0.0.7.4)
PLATFORMS
ruby
DEPENDENCIES
algoliasearch
better_errors
binding_of_caller
google-api-client (= 0.8.6)
haml (= 4.0.7)
hashie (= 3.4.6)
highlight
htmlentities
kramdown (>= 1.12.0)
middleman (>= 4.0.0)
middleman-autoprefixer
middleman-livereload
middleman-minify-html
middleman-s3_sync!
middleman-sprockets
middleman-syntax
middleman-vcs-time
mime-types
nokogiri
octokit
pry-byebug
rake
rb-readline
redcarpet (>= 3.3.4)
sassc
sprockets (= 4.0.0.beta4)
sprockets-es6
tzinfo-data
wdm (~> 0.1.0)
BUNDLED WITH
1.15.1

12
docs/Makefile
View file

@ -1,12 +0,0 @@
all: install
bundle exec middleman server
install:
bundle install
build:
npm install
rm -rf build
bundle exec middleman build
.PHONY: build

135
docs/README.md Normal file
View file

@ -0,0 +1,135 @@
# Documentation website
This subdirectory holds the documentation website content as well as scripts to
generate it.
# Main commands
## Building the website
You can build a new version of the website by running `yarn run build` in this
directory or `yarn run docs:build` at the repository root.
It will read all source files in `./src` and build the final static website in
`./dist`.
## Local development
You can run a local copy of the documentation website by running `yarn run
serve` in this directory or `yarn run docs:serve` at the repository root.
This will build the website in `./dist` and expose it on `localhost`, along with
live-reload.
## Deploying the website
You can deploy the website by running `yarn run deploy` in this directory or
`yarn run docs:deploy` at the repository root.
This will build the website and then commit the content of the `./dist` folder
to the `gh-pages` branch and push it to GitHub.
# Internals
The documentation generation is not using any existing static websites
generators, but custom javascript scripts.
The main two entry points are `./scripts/build.js` and `./scripts/serve.js`. The
second one adds a webserver with live-reload on top of the first one.
## HTML
All markdown files situated in `./src` will be transformed into `.html` files in
`./dist`. They will be wrapped into the layout defined in their front-matter.
All the headers will be converted to their respective `<hX>` tag, along with
a unique `#id` to allow for easy anchoring.
You can also use plain HTML inside those markdown files if you need more
advanced styling.
## Layouts
All layouts are saved in the `./src/_layouts` folder.
All config options defined into `config.json` are passed to the layouts and can
be used there.
You can also use mixins or include other files from the layouts.
_Note that the current layout logic is simple and might not handle complex
recursive cases, but should be enough for simple cases._
## CSS
CSS is processed through PostCSS. It expects an entry file in
`./src/style.css`.
We are using `postcss-import`, allowing you to `@import` files from the
`./src/_styles/` directory to better split your CSS code in logical chunks.
Most of the styling based on tailwind.css, with the config file behing
`tailwind.config.js`. It contains default sizing and coloring to follow the
Algolia brand guidelines.
The final CSS files is then compressed through PurgeCSS (to keep CSS
classes that are actually used) and CleanCSS (to minify it).
## JavaScript
JavaScript code is processed through Babel. It will compile all files situated
in `./src/js`.
_Note that it compiles JS, and does not bundle it. We might add Webpack/Parcel
support later._
## Assets
Any file with the following extensions found in the `./src` folder will be
automatically copied to the `./dist` folder with the same folder structure:
`gif`, `jpg`, `png`, `ico`, `html`, `svg` and `woff`.
## Placeholders
Values defined in the `placeholders` key of the `config.json` file can be used
in JavaScript and Markdown files by using the `{{key}}` syntax.
For example if you have:
```json
// config.json
{
"placeholders": {
"projectVersion": "1.4.2"
}
}
```
Every occurrence of `{{projectVersion}}` in any `.md` or `.js` file will be
replaced with `1.4.2`.
## Sidebar
The left sidebar of the documentation is generated based on the `sidebar` key of
the `config.json`. The key should contain an array where each key is a part of
the sidebar, with a `title` and a list of `pages`. Each of those pages in turn
is an object with a `title` and `url` value.
The layout will then automatically create all the links and color the active
page. Subsections inside the current page will also be added for every `h2`
element extracted from the markup of the current page.
## Redirects
The `config.json` file can hold a `redirects` array, with object containing both
a `from` and a `to` key. For each `from`, it will create a plain html page at
this location, that will redirect anyone visiting it to the page defined in
`to`.
_Note that both those links must be defined as relative to the `site.url`
value._

50
docs/Rakefile
View file

@ -1,50 +0,0 @@
require 'dotenv'
require 'yaml'
require_relative './lib/google_analytics_downloader.rb'
Dotenv.load('.env')
task :build do
sh "STAGE=#{ENV['STAGE'] || 'beta'} bundle exec middleman build"
end
task :s3_sync do
sh "STAGE=#{ENV['STAGE'] || 'beta'} bundle exec middleman s3_sync"
end
task :purge_cache do
stage = ENV['STAGE'] || 'beta'
# if stage == 'production'
sh <<-SHELL
curl -X DELETE "https://api.cloudflare.com/client/v4/zones/#{ENV['CLOUDFLARE_ZONE']}/purge_cache" \
-H "X-Auth-Email: #{ENV['CLOUDFLARE_AUTH_EMAIL']}" \
-H "X-Auth-Key: #{ENV['CLOUDFLARE_AUTH_KEY']}" \
-H "Content-Type: application/json" \
--data '{"tags":["algoliaweb-doc--#{stage}"]}'
SHELL
# else
# puts "Not in production, not purging cache"
# end
end
task :deploy do
Rake::Task[:build].invoke
Rake::Task[:s3_sync].invoke
Rake::Task[:purge_cache].invoke
end
task :production do
ENV['STAGE'] = 'production'
end
task :beta do
ENV['STAGE'] = 'beta'
end
task :download_google_analytics_data do
file = File.expand_path(File.join(__FILE__, '..', 'app_data', 'google_analytics.yml'))
File.open(file, 'w') do |f|
f << GoogleAnalyticsDownloader.fetch.to_yaml
end
end

20
docs/algolia-aerial/README.md
View file

@ -1,20 +0,0 @@
# algolia-aerial
Aerial.css package
## Definition
This project aims to provide a coherent and unified design system for algolia employees.
This design system is also known as Aerial.
## Documentation
Go to https://aerialcss.algolia.com to read the full documentation
## Usage
To start using aerial.css, simply do `npm install algolia-aerial` or `yarn add algolia-aerial`
then go to your main css / sass file, and add :
```css
@import './node_modules/algolia-aerial/dist/aerial.css';
```

34
docs/algolia-aerial/package.json
View file

@ -1,34 +0,0 @@
{
"scripts": {
"start": "webpack --config webpack.config.js && yarn optimize",
"optimize": "cleancss dist/aerial-source.css -o dist/aerial.css && yarn done",
"done": "echo '✨ Bundle done ✅' && du -h dist/aerial-source.css && du -h dist/aerial.css && yarn pj-version",
"pj-version": "npm --loglevel silent run vars",
"vars": "env | grep npm_package_version"
},
"devDependencies": {
"extract-text-webpack-plugin": "3.0.2",
"node-sass": "4.9.2",
"sass-loader": "7.1.0",
"webpack": "3.12.0",
"webpack-auto-inject-version": "1.1.0",
"webpack-livereload-plugin": "2.1.1"
},
"name": "algolia-aerial",
"version": "1.2.6",
"description": "algolia-aerial package",
"main": "webpack.config.js",
"author": "Lucas Bonomi <@LukyVj> (http://lucasbonomi.com)",
"license": "ISC",
"repository": {
"type": "git",
"url": "git+ssh://github.com/algolia/algolia-aerial.git"
},
"dependencies": {
"clean-css-cli": "^4.1.6",
"css-loader": "^1.0.0",
"file-loader": "^1.0.0",
"style-loader": "^0.21.0",
"url-loader": "^1.0.0"
}
}

24
docs/algolia-aerial/src/stylesheet/aerial.sass
View file

@ -1,24 +0,0 @@
/*! Aerial.css [AIV]v{version} - {date}[/AIV] */
*
box-sizing: border-box
@import 'modules/base'
@import 'modules/mixins'
// AERIAL.CSS
@import 'partials/bootstrap'
@import 'partials/fonts'
@import 'components/scaffolding'
@import 'components/buttons'
@import 'components/cards'
@import 'components/code'
@import 'components/type'
@import 'components/tables'
@import 'components/forms'
@import 'components/input-groups'
@import 'components/alerts'
@import 'partials/colors'
@import 'partials/helpers'

30
docs/algolia-aerial/src/stylesheet/components/_alerts.sass
View file

@ -1,30 +0,0 @@
.alert
border-radius: 6px
padding: 16px 24px
.alert.alert-danger
background-color: rgba(255,79,129,0.1)
border: solid 1px rgba(255,79,129,0.2)
color: #ff4f81 !important
.alert.alert-danger p
color: #ff4f81 !important
.alert.alert-info
background-color: rgba(0,174,255,0.1)
border: solid 1px rgba(0,174,255,0.2)
color: #00aeff !important
.alert.alert-info a
color: #007ab3 !important
text-decoration: underline
.alert.alert-warning
background-color: rgba(255,193,104,0.25)
border: solid 1px rgba(255,193,104,0.4)
color: #c57c14 !important
.alert.alert-success
background-color: rgba($shamrock,0.1)
border: solid 1px rgba($shamrock, 0.4)
color: $shamrock !important

219
docs/algolia-aerial/src/stylesheet/components/_buttons.sass
View file

@ -1,219 +0,0 @@
.btn
display: inline-block
// For input.btn
font-weight: $btn-font-weight
text-align: center
vertical-align: middle
touch-action: manipulation
cursor: pointer
background-image: none
// Reset unusual Firefox-on-Android default style; see https://github.com/necolas/normalize.css/issues/214
border: 1px solid transparent
white-space: nowrap
+user-select(none)
padding: 0 20px
display: inline-block
border-radius: 50px
font-size: 16px
font-weight: 400
height: 40px
line-height: 40px
border: none
box-sizing: border-box
position: relative
transition: background .2s, box-shadow .2s
&:active,
&.active
outline: 0
background-image: none
+box-shadow(inset 0 3px 5px rgba(0, 0, 0, 0.125))
&:focus,
&.focus
+tab-focus
&:hover,
&:focus,
&.focus
color: $btn-default-color
&:hover, &:focus, &:active, &.active
outline: 0 !important
box-shadow: none
text-decoration: none
&.disabled,
&[disabled],
fieldset[disabled] &
cursor: $cursor-disabled
pointer-events: none
// Future-proof disabling of clicks
+opacity(0.65)
+box-shadow(none)
@media (max-width: $screen-sm)
font-size: 14px
.icon:before
position: relative
top: 2px
.btn-static-default
border: 2px solid $tertiary-color
color: $text-color
background-color: transparent
line-height: 36px
&:hover, &:focus
color: $text-color
background-color: rgba($tertiary-color,.3)
.btn-static-primary
border: none
color: #fff
background-image: linear-gradient(284deg, $java, $shamrock)
&:hover, &:focus
color: white
background-image: linear-gradient(284deg, $java, $shamrock)
&:active, &.active
background-image: linear-gradient(284deg, darken($java, 4%), darken($shamrock, 4%))
&.btn-shadow
box-shadow: 0 2px 6px 0 rgba($shamrock, 0.4)
&:hover, &:focus
box-shadow: 0 4px 12px rgba($shamrock, 0.4)
.btn-static-secondary
border: none
color: #fff
background-image: linear-gradient(80deg, $algolia-blue, $royal-blue)
&:hover, &:focus
color: white
background-image: linear-gradient(80deg, $algolia-blue, $royal-blue)
&:active, &.active
background-image: linear-gradient(80deg, darken($algolia-blue, 4%), darken($royal-blue, 4%))
&.btn-shadow
box-shadow: 0 2px 6px 0 rgba($royal-blue, 0.4)
&:hover, &:focus
box-shadow: 0 4px 12px rgba($royal-blue, 0.4)
.btn-static-tertiary
border: none
color: #fff
background-image: linear-gradient(112deg, $radical-red, $bittersweet)
&:hover, &:focus
color: white
background-image: linear-gradient(112deg, $radical-red, $bittersweet)
&:active, &.active
background-image: linear-gradient(112deg, darken($radical-red, 4%), darken($bittersweet, 4%))
&.btn-shadow
box-shadow: 0 2px 6px 0 rgba($bittersweet, 0.4)
&:hover, &:focus
box-shadow: 0 4px 12px rgba($bittersweet, 0.4)
/*! This button is generated on build and colored with $theme-color.
Think about changing the color of it to fit to your needs.*/
.btn-static-theme
border: none
color: $bunting
background-color: $theme-color
&:hover, &:focus
color: $deep-cove
background-color: darken($theme-color, 10%)
&:active, &.active
background-image: darken($theme-color, 10%)
&.btn-shadow
box-shadow: 0 2px 6px 0 rgba($koromiko, 0.4)
&:hover, &:focus
box-shadow: 0 4px 12px rgba($koromiko, 0.4)
svg
width: 16px
height: 16px
vertical-align: middle
margin-left: 0.5em
use
fill: $bunting
.btn-static-inverse
color: white
&:hover, &:focus, &:active, &.active
color: white
.btn-static-dark
color: $white
background-color: $deep-cove
background-image: linear-gradient(283deg, $deep-cove, $bunting)
border-color: $deep-cove
&:hover, &:focus
color: $white
background-color: $bunting
border-color: $bunting
&.btn-shadow
box-shadow: 0 2px 6px 0 rgba($bunting, 0.4)
&:hover, &:focus
box-shadow: 0 4px 12px rgba($bunting, 0.4)
&:active, &.active
background-image: linear-gradient(283deg, darken($deep-cove, 10%), darken($bunting, 10%))
.btn-static-white
color: $bunting
background-color: $white
border-color: $white
&:hover, &:focus
color: $bunting
.btn-static-enterprise
color: $white
background-color: $deep-cove
border: solid 2px $shamrock
line-height: 36px
&:hover, &:focus
color: white
background-color: $shamrock
border-color: $shamrock
// Circles
.btn-circle
width: 42px
height: 42px
padding: 0
line-height: 42px
// Shadows
.btn-static-shadow-dark
box-shadow: 0 2px 6px 0 rgba($deep-cove, 0.5)
&:hover, &:focus
box-shadow: 0 4px 12px rgba($deep-cove, 0.5)
.btn-static-default,
.btn-static-primary,
.btn-static-secondary,
.btn-static-tertiary,
.btn-static-inverse,
.btn-static-dark,
.btn-static-enterprise
&:active, &.active,
&.btn-shadow:active, .btn-shadow.active,
&.btn-static-shadow-dark:active, .btn-static-shadow-dark.active
box-shadow: inset 0 0 4px 2px rgba(#050f2c, 0.3)
// Sizes
.btn-lg
min-width: 210px

184
docs/algolia-aerial/src/stylesheet/components/_cards.sass
View file

@ -1,184 +0,0 @@
.al-card
background-color: $white
box-shadow: 0 2px 6px 0 rgba($deep-cove, 0.4)
padding: 40px 24px
position: relative
border-radius: 4px
&.small-card
.card-title,
.card-icon,
.card-text
vertical-align: middle
.card-title
color: $bunting
font-size: 16px
font-weight: 800
padding: 0
margin: 0
opacity: 0.8
margin-bottom: 8px
text-transform: none
.card-icon svg
width: 72px
.card-text
font-size: 16px
line-height: 24px
color: $bunting
opacity: 0.7
&.cover-card
height: 240px
margin: 0 auto 24px
width: 240px
border-radius: 5px
overflow: hidden
.card-background
width: 100%
height: 100%
position: absolute
transition: transform 0.3s ease
top: 50%
left: 50%
transform: translate(-50%, -50%)
&:after
position: absolute
display: block
content: ''
width: 100%
height: 100%
top: 0
left: 0
background: rgba($deep-cove, 0.5)
transition: opacity 0.3s ease
.card-icon
position: absolute
z-index: 12
top: 50%
left: 50%
transform: translate(-50%, -50%)
transition: transform 0.3s ease
// Card border
.card-border,
.card-border-quote
position: relative
.card-border-line
position: absolute
top: 0
left: 0
height: 5px
width: 100%
border-top-left-radius: 6px
border-top-right-radius: 6px
.card-border
height: 100%
// Card border with media ( img, videos )
.card-border-media
overflow: hidden
min-height: 200px
.card-header
width: 100%
height: 100%
height: 228px
overflow: hidden
position: relative
img
width: 100%
height: 100%
opacity: 0.8
will-change: opacity, mix-blend-mode
border-top-left-radius: 6px
border-top-right-radius: 6px
@supports (mix-blend-mode: soft-light)
mix-blend-mode: soft-light
transition: opacity 0.2s ease, mix-blend-mode 0.2s ease
@supports (not (mix-blend-mode: soft-light))
opacity: 0.6
@supports (not (object-fit: cover))
height: auto
position: absolute
top: 50%
transform: translateY(-50%)
@supports (object-fit: cover)
object-fit: cover
object-position: center center
.card-separator
height: 5px
width: 100%
&.card-border-media-effect
.card-header img
filter: grayscale(100%)
&:hover .card-header img
filter: grayscale(0)
@supports (mix-blend-mode: soft-light)
mix-blend-mode: unset
opacity: 1
// Card border quotes
.card-border-quote
.card-container
&:before
content: ''
display: block
width: 14px
height: 14px
background: transparent
position: absolute
left: 0
right: 0
margin: auto
bottom: -10px
border-radius: 100px
box-shadow: 0 4px 20px rgba($bunting,0.08), 0 2px 9px 0 rgba($bunting,0.07), 0 4px 18px rgba($bunting,0.07)
z-index: -1
&:after
content: ''
display: block
width: 18px
height: 18px
background: #fff
position: absolute
left: 0
right: 0
margin: auto
bottom: -9px
transform: rotate(-45deg)
.quote-author
.avatar
position: relative
width: 42px
height: 42px
border-radius: 100px
float: left
margin-right: 8px
.author-infos
width: calc(100% - 42px - 8px)
float: left
> span

45
docs/algolia-aerial/src/stylesheet/components/_code.sass
View file

@ -1,45 +0,0 @@
code,
kbd,
pre,
samp
font-family: $font-family-monospace
code
padding: 2px 4px
font-size: 90%
color: $code-color
background-color: $code-bg
border-radius: $border-radius-base
kbd
padding: 2px 4px
font-size: 90%
color: $kbd-color
background-color: $kbd-bg
border-radius: $border-radius-small
box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.25)
kbd
padding: 0
font-size: 100%
font-weight: bold
box-shadow: none
pre
display: block
padding: ($line-height-computed - 1) / 2
margin: 0 0 $line-height-computed / 2
font-size: $font-size-base - 1
line-height: $line-height-base
word-break: break-all
word-wrap: break-word
color: $pre-color
background-color: $pre-bg
border: 1px solid $pre-border-color
border-radius: $border-radius-base
code
padding: 0
font-size: inherit
color: inherit
white-space: pre-wrap
background-color: transparent
border-radius: 0

110
docs/algolia-aerial/src/stylesheet/components/_forms.sass
View file

@ -1,110 +0,0 @@
fieldset
padding: 0
margin: 0
border: 0
min-width: 0
legend
display: block
width: 100%
padding: 0
margin-bottom: $line-height-computed
font-size: $font-size-base * 1.5
line-height: inherit
color: $legend-color
border: 0
border-bottom: 1px solid $legend-border-color
label
display: inline-block
max-width: 100%
margin-bottom: 5px
font-weight: bold
input[type="search"]
+box-sizing(border-box)
input[type="radio"],
input[type="checkbox"]
margin: 4px 0 0
margin-top: 1px \9
line-height: normal
input[type="file"]
display: block
input[type="range"]
display: block
width: 100%
select[multiple],
select[size]
height: auto
input[type="file"]:focus,
input[type="radio"]:focus,
input[type="checkbox"]:focus
+tab-focus
output
display: block
padding-top: $padding-base-vertical + 1
font-size: $font-size-base
line-height: $line-height-base
color: $input-color
.form-control
display: block
width: 100%
height: $input-height-base
padding: $padding-base-vertical $padding-base-horizontal
font-size: $font-size-base
line-height: $line-height-base
color: $input-color
background-color: $input-bg
background-image: none
border: 1px solid $input-border
border-radius: $input-border-radius
+box-shadow(inset 0 1px 1px rgba(0, 0, 0, 0.075))
+transition(border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s)
+form-control-focus
+placeholder
&[disabled],
&[readonly],
fieldset[disabled] &
cursor: $cursor-disabled
background-color: $input-bg-disabled
opacity: 1
textarea.form-control
height: auto
input[type="search"]
-webkit-appearance: none
@media screen and (-webkit-min-device-pixel-ratio: 0)
input[type="date"],
input[type="time"],
input[type="datetime-local"],
input[type="month"]
line-height: $input-height-base
input[type="date"].input-sm,
input[type="time"].input-sm,
input[type="datetime-local"].input-sm,
input[type="month"].input-sm
line-height: $input-height-small
input[type="date"].input-lg,
input[type="time"].input-lg,
input[type="datetime-local"].input-lg,
input[type="month"].input-lg
line-height: $input-height-large
.form-group
margin-bottom: 15px

144
docs/algolia-aerial/src/stylesheet/components/_input-groups.scss
View file

@ -1,144 +0,0 @@
.input-group .form-control {
height: 40px;
border-radius: 20px;
}
.input-group {
display: table;
&[class*="col-"] {
float: none;
padding-left: 0;
padding-right: 0;
}
.form-control {
position: relative;
z-index: 2;
float: left;
width: 100%;
margin-bottom: 0;
&:focus {
z-index: 3;
}
}
}
.input-group-lg > .form-control,
.input-group-lg > .input-group-addon,
.input-group-lg > .input-group-btn > .btn {
@extend .input-lg;
}
.input-group-sm > .form-control,
.input-group-sm > .input-group-addon,
.input-group-sm > .input-group-btn > .btn {
@extend .input-sm;
}
.input-group-addon,
.input-group-btn,
.input-group .form-control {
display: table-cell;
&:not(:first-child):not(:last-child) {
border-radius: 0;
}
}
.input-group-addon,
.input-group-btn {
width: 1%;
white-space: nowrap;
}
.input-group-addon {
padding: $padding-base-vertical $padding-base-horizontal;
font-size: $font-size-base;
font-weight: normal;
line-height: 1;
color: $input-color;
text-align: center;
background-color: $input-group-addon-bg;
border: 1px solid $input-group-addon-border-color;
border-radius: $input-border-radius;
&.input-sm {
padding: $padding-small-vertical $padding-small-horizontal;
font-size: $font-size-small;
border-radius: $input-border-radius-small;
}
&.input-lg {
padding: $padding-large-vertical $padding-large-horizontal;
font-size: $font-size-large;
border-radius: $input-border-radius-large;
}
input[type="radio"],
input[type="checkbox"] {
margin-top: 0;
}
}
.input-group .form-control:first-child,
.input-group-addon:first-child,
.input-group-btn:first-child > .btn,
.input-group-btn:first-child > .btn-group > .btn,
.input-group-btn:first-child > .dropdown-toggle,
.input-group-btn:last-child > .btn:not(:last-child):not(.dropdown-toggle),
.input-group-btn:last-child > .btn-group:not(:last-child) > .btn {
@include border-right-radius(0);
}
.input-group-addon:first-child {
border-right: 0;
}
.input-group .form-control:last-child,
.input-group-addon:last-child,
.input-group-btn:last-child > .btn,
.input-group-btn:last-child > .btn-group > .btn,
.input-group-btn:last-child > .dropdown-toggle,
.input-group-btn:first-child > .btn:not(:first-child),
.input-group-btn:first-child > .btn-group:not(:first-child) > .btn {
@include border-left-radius(0);
}
.input-group-addon:last-child {
border-left: 0;
}
.input-group-btn {
position: relative;
font-size: 0;
white-space: nowrap;
display: block;
> .btn {
position: relative;
+ .btn {
margin-left: -1px;
}
&:hover,
&:focus,
&:active {
z-index: 2;
}
}
&:first-child {
> .btn,
> .btn-group {
margin-right: -1px;
}
}
&:last-child {
> .btn,
> .btn-group {
z-index: 2;
margin-left: -1px;
}
}
}

50
docs/algolia-aerial/src/stylesheet/components/_scaffolding.sass
View file

@ -1,50 +0,0 @@
*
+box-sizing(border-box)
*:before,
*:after
+box-sizing(border-box)
html
font-size: 10px
-webkit-tap-highlight-color: rgba(0, 0, 0, 0)
body
font-family: $font-family-base
font-size: $font-size-base
line-height: $line-height-base
color: $text-color
background-color: $body-bg
input,
button,
select,
textarea
font-family: inherit
font-size: inherit
line-height: inherit
a
color: $link-color
text-decoration: none
&:hover,
&:focus
color: $link-hover-color
text-decoration: $link-hover-decoration
&:focus
+tab-focus
figure
margin: 0
img
vertical-align: middle
hr
margin-top: $line-height-computed
margin-bottom: $line-height-computed
border: 0
border-top: 1px solid $hr-border

46
docs/algolia-aerial/src/stylesheet/components/_tables.sass
View file

@ -1,46 +0,0 @@
table
background-color: $table-bg
caption
padding-top: $table-cell-padding
padding-bottom: $table-cell-padding
color: $text-muted
text-align: left
th
text-align: left
.table
width: 100%
max-width: 100%
margin-bottom: $line-height-computed
> thead,
> tbody,
> tfoot
> tr
> th,
> td
padding: $table-cell-padding
line-height: $line-height-base
vertical-align: top
border-top: 1px solid $table-border-color
> thead > tr > th
vertical-align: bottom
border-bottom: 2px solid $table-border-color
> caption + thead,
> colgroup + thead,
> thead:first-child
> tr:first-child
> th,
> td
border-top: 0
> tbody + tbody
border-top: 2px solid $table-border-color
.table
background-color: $body-bg

118
docs/algolia-aerial/src/stylesheet/components/_type.sass
View file

@ -1,118 +0,0 @@
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6
font-family: $headings-font-family
font-weight: $headings-font-weight
line-height: $headings-line-height
color: $headings-color
small,
.small
font-weight: normal
line-height: 1
color: $headings-small-color
h1, .h1,
h2, .h2,
h3, .h3
margin-top: $line-height-computed
margin-bottom: $line-height-computed / 2
small,
.small
font-size: 65%
h4, .h4,
h5, .h5,
h6, .h6
margin-top: $line-height-computed / 2
margin-bottom: $line-height-computed / 2
small,
.small
font-size: 75%
h1, .h1
font-size: $font-size-h1
h2, .h2
font-size: $font-size-h2
h3, .h3
font-size: $font-size-h3
h4, .h4
font-size: $font-size-h4
h5, .h5
font-size: $font-size-h5
h6, .h6
font-size: $font-size-h6
p
margin: 0 0 10px
small,
.small
font-size: floor(100% * $font-size-small / $font-size-base)
mark,
.mark
background-color: $state-warning-bg
padding: .2em
ul,
ol
margin-top: 0
margin-bottom: $line-height-computed / 2
ul,
ol
margin-bottom: 0
dl
margin-top: 0
margin-bottom: $line-height-computed
dt,
dd
line-height: $line-height-base
dt
font-weight: bold
dd
margin-left: 0
abbr[title],
abbr[data-original-title]
cursor: help
border-bottom: 1px dotted $abbr-border-color
blockquote
padding: $line-height-computed / 2 $line-height-computed
margin: 0 0 $line-height-computed
font-size: $blockquote-font-size
border-left: 5px solid $blockquote-border-color
p,
ul,
ol
&:last-child
margin-bottom: 0
footer,
small,
.small
display: block
font-size: 80%
line-height: $line-height-base
color: $blockquote-small-color
&:before
content: '\2014 \00A0'
address
margin-bottom: $line-height-computed
font-style: normal
line-height: $line-height-base

151
docs/algolia-aerial/src/stylesheet/modules/_base.sass
View file

@ -1,151 +0,0 @@
//fonts
$light: 300
$regular: 400
$medium: 500
$bold: 600
//colors
$white: white
$black: black
//V2
$purple-heart: rgb(142,67,231)
$mulberry: rgb(184,69,146)
$radical-red: rgb(255,79,129)
$bittersweet: rgb(255,108,95)
$koromiko: rgb(255,193,104)
$shamrock: rgb(45,222,152)
$java: rgb(28,199,208)
$algolia-blue: rgb(0,174,255)
$royal-blue: rgb(51,105,231)
$bunting: rgb(62,57,107)
$titan-white: rgb(248,250,255)
$logan: rgb(157,157,189)
$deep-cove: rgb(5,15,44)
$port-gore: rgb(58, 69, 112)
$east-bay: rgb(73, 85, 136)
$portage: rgb(137, 148, 198)
$blue-bell: rgb(166, 176, 216)
$ghost: rgb(196, 200, 216)
$athens-gray: rgb(238, 240, 247)
$theme-color: #fecf50
$primary-color: $bunting
$secondary-color: $titan-white
$tertiary-color: $portage
// BOOTSTRAP
$gray-darker: lighten(#000, 13.5%)
$gray-dark: lighten(#000, 20%)
$gray: lighten(#000, 33.5%)
$gray-light: lighten(#000, 46.7%)
$gray-lighter: lighten(#000, 93.5%)
$brand-primary: $algolia-blue
$brand-secondary: #FA3870
$brand-success: $shamrock
$brand-info: $algolia-blue
$brand-warning: $koromiko
$brand-danger: $radical-red
$font-size-base: 15px
$font-size-h1: 36px
$font-size-h2: 30px
$font-size-h3: 18px
$font-size-h4: 12px
$font-size-h5: 1em
$font-size-h6: 1em
$line-height-base: 1.6
$body-bg: $white
$text-color: $bunting
$text-muted: $portage
$border-radius-base: 3px
$border-radius-large: 3px
$border-radius-small: 3px
$link-color: $brand-primary
$link-hover-color: darken($link-color, 15%)
//fonts
$font-family-base: 'Montserrat', Helvetica, Arial, sans-serif
$headings-font-family: $font-family-base
$font-stack: $font-family-base
$paragraphs-font-family: 'Open Sans', helvetica, sans-serif
$headings-small-color: darken($tertiary-color,10%)
//Buttons
$btn-font-weight: normal
//default
$btn-default-color: #777
$btn-default-bg: $white
$btn-default-border: #ccc
//primary
$btn-primary-color: $white
$btn-primary-bg: $brand-primary
$btn-primary-border: darken($btn-primary-bg, 5%)
//success
$btn-success-color: $white
$btn-success-bg: $brand-success
$btn-success-border: darken($btn-success-bg, 5%)
//info
$btn-info-color: $white
$btn-info-bg: $brand-info
$btn-info-border: darken($btn-info-bg, 5%)
//warning
$btn-warning-color: $white
$btn-warning-bg: $brand-warning
$btn-warning-border: darken($btn-warning-bg, 5%)
//danger
$btn-danger-color: $white
$btn-danger-bg: $brand-danger
$btn-danger-border: darken($btn-danger-bg, 5%)
//link
$btn-link-disabled-color: $gray-light
$input-bg-disabled: $gray-lighter
//Panels
$panel-bg: $white
//** Border color for elements within panels
$panel-inner-border: lighten($tertiary-color,20%)
$panel-footer-bg: lighten($secondary-color, 10%)
$panel-default-text: $gray-dark
$panel-default-border: $white
$panel-default-heading-bg: $white
//forms
$input-group-addon-bg: lighten($secondary-color,3%)
$input-border: lighten($gray,30%)
//tables
$table-border-color: $secondary-color
$table-bg-accent: lighten($secondary-color,5%)
//tooltip
$tooltip-bg: $primary-color
$tooltip-opacity: 1
//popover
$popover-max-width: 300px
//Cards
$card-border-transition: all 240ms ease-in-out
//code
$pre-bg: $bunting
$pre-color: #C2CCCC
// Searchboxes
$searchbox-landing: (input-width: 300px, input-height: 50px, border-width: 2px, border-radius: 25px, input-border-color: #cccccc, input-focus-border-color: #ff2e83, input-background: white, input-focus-background: white, font-size: 14px, placeholder-color: #bbbbbb, icon: sbx-icon-search-18, icon-size: 30px, icon-position: left, icon-color: #ff2e83, icon-background: white, icon-background-opacity: 0, icon-clear: sbx-icon-clear-5, icon-clear-size: 18px)

230
docs/algolia-aerial/src/stylesheet/modules/_mixins.sass
View file

@ -1,230 +0,0 @@
//illus retina
@mixin at2x($path, $ext: "png", $w: auto, $h: auto)
background-image: url(image_path($path + "." + $ext))
background-repeat: no-repeat
$at2x_path: $path + "@2x" + "." + $ext
@media all and (-webkit-min-device-pixel-ratio: 1.5), all and (-o-min-device-pixel-ratio: 3 / 2), all and (min--moz-device-pixel-ratio: 1.5), all and (min-device-pixel-ratio: 1.5)
background-image: url(image_path($at2x_path))
background-size: $w $h
@mixin text-truncate
overflow: hidden
text-overflow: ellipsis
white-space: nowrap
//vertical alignment
@mixin vertical-align($position: relative)
transform: translateY(-50%)
position: $position
top: 50%
@mixin horizontal-align($position)
position: $position
left: 50%
transform: translateX(-50%)
@mixin center($position)
position: $position
left: 50%
top: 50%
transform: translate(-50%, -50%)
// Responsive
// Responsive Breakpoints
@mixin big-min-mq
@media (min-width: $screen-lg)
@content
@mixin big-mq
@media (max-width: $screen-lg)
@content
@mixin medium-mq
@media (max-width: $screen-md)
@content
@mixin small-mq
@media (max-width: $screen-sm)
@content
@mixin mobile-mq
@media (max-width: $screen-xs)
@content
// Placeholder
@mixin placeholder
&::-webkit-input-placeholder
@content
&:-moz-placeholder
@content
&::-moz-placeholder
@content
&:-ms-input-placeholder
@content
//BEM helpers
@mixin block($block)
#{$block}
@content
@mixin element($element)
&__#{$element}
@content
@mixin modifier($modifier)
&--#{$modifier}
@content
@mixin diagonal($rotation, $background, $height, $pos: after)
&:#{$pos}
content: ''
display: block
position: absolute
width: 100%
height: $height
background: #{$background}
transform: skewY($rotation)
z-index: 0
@media (min-width: $screen-lg)
transform: skewY($rotation/2)
@content
@mixin clearfix()
&:before,
&:after
content: " "
display: table
&:after
clear: both
@function even-px($value)
@if type-of($value) == "number"
@if unitless($value)
$value: $value * 1px
@else if unit($value) == "em"
$value: $value / 1em * 16px
@else if unit($value) == "pts"
$value: $value * 1.3333 * 1px
@else if unit($value) == "%"
$value: $value * 16 / 100% * 1px
$value: round($value)
@if $value % 2 != 0
$value: $value + 1
@return $value
=searchbox($font-size: 90%, $input-width: 350px, $input-height: $font-size * 2.4, $border-width: 1px, $border-radius: $input-height / 2, $input-border-color: #cccccc, $input-focus-border-color: #1ec9ea, $input-background: #f8f8f8, $input-focus-background: white, $placeholder-color: #aaaaaa, $icon: "sbx-icon-search-1", $icon-size: $input-height / 1.6, $icon-position: left, $icon-color: #888888, $icon-background: $input-focus-border-color, $icon-background-opacity: 0.1, $icon-clear: "sbx-icon-clear-1", $icon-clear-size: $font-size / 1.1)
display: inline-block
position: relative
width: $input-width
height: even-px($input-height)
white-space: nowrap
box-sizing: border-box
font-size: $font-size
&__wrapper
width: 100%
height: 100%
&__input
display: inline-block
transition: box-shadow .4s ease, background .4s ease
border: 0
border-radius: even-px($border-radius)
box-shadow: inset 0 0 0 $border-width $input-border-color
background: $input-background
padding: 0
padding-right: if($icon-position == "right", even-px($input-height) + even-px($icon-clear-size) + 8px, even-px($input-height * 0.8)) + if($icon-background-opacity == 0, 0, even-px($font-size))
padding-left: if($icon-position == "right", even-px($font-size / 2) + even-px($border-radius / 2), even-px($input-height) + if($icon-background-opacity == 0, 0, even-px($font-size * 1.2)))
width: 100%
height: 100%
vertical-align: middle
white-space: normal
font-size: inherit
appearance: none
&::-webkit-search-decoration,
&::-webkit-search-cancel-button,
&::-webkit-search-results-button,
&::-webkit-search-results-decoration
display: none
&:hover
box-shadow: inset 0 0 0 $border-width darken($input-border-color, 10%)
&:focus,
&:active
outline: 0
box-shadow: inset 0 0 0 $border-width $input-focus-border-color
background: $input-focus-background
&::placeholder
color: $placeholder-color
&__submit
position: absolute
top: 0
@if $icon-position == "right"
right: 0
left: inherit
@else
right: inherit
left: 0
margin: 0
border: 0
border-radius: if($icon-position == "right", 0 $border-radius $border-radius 0, $border-radius 0 0 $border-radius)
background-color: rgba($icon-background, $icon-background-opacity)
padding: 0
width: even-px($input-height) + if($icon-background-opacity == 0, 0, even-px($font-size / 2))
height: 100%
vertical-align: middle
text-align: center
font-size: inherit
user-select: none
// Helper for vertical alignement of the icon
&::before
display: inline-block
margin-right: -4px
height: 100%
vertical-align: middle
content: ''
&:hover,
&:active
cursor: pointer
&:focus
outline: 0
svg
width: even-px($icon-size)
height: even-px($icon-size)
vertical-align: middle
fill: $icon-color
&__reset
display: none
position: absolute
top: (even-px($input-height) - even-px($icon-clear-size)) / 2 - 4px
right: if($icon-position == "right", even-px($input-height) + if($icon-background-opacity == 0, 0, even-px($font-size)), (even-px($input-height) - even-px($icon-clear-size)) / 2 - 4px)
margin: 0
border: 0
background: none
cursor: pointer
padding: 0
font-size: inherit
user-select: none
fill: rgba(black, 0.5)
&:focus
outline: 0
svg
display: block
margin: 4px
width: even-px($icon-clear-size)
height: even-px($icon-clear-size)
&__input:valid ~ &__reset
display: block
animation-name: sbx-reset-in
animation-duration: .15s
@at-root
@keyframes sbx-reset-in
0%
transform: translate3d(-20%, 0, 0)
opacity: 0
100%
transform: none
opacity: 1

11
docs/algolia-aerial/src/stylesheet/partials/_bootstrap.sass
View file

@ -1,11 +0,0 @@
@import "../modules/_base"
// Core variables and mixins
@import "../vendors/bootstrap/variables"
@import "../vendors/bootstrap/mixins"
// Reset and dependencies
@import "../vendors/bootstrap/normalize"
// Core CSS
@import "../vendors/bootstrap/grid"
// Utility classes
@import "../vendors/bootstrap/responsive-utilities"

124
docs/algolia-aerial/src/stylesheet/partials/_colors.sass
View file

@ -1,124 +0,0 @@
/* foreground colors */
.color-white
color: $white !important
.color-titan
color: $titan-white !important
.color-primary
color: $brand-primary !important
.color-secondary
color: $brand-secondary !important
.color-purple-heart
color: $purple-heart !important
.color-mulberry
color: $mulberry !important
.color-radical-red
color: $radical-red !important
.color-bittersweet
color: $bittersweet !important
.color-koromiko
color: $koromiko !important
.color-shamrock
color: $shamrock !important
.color-java
color: $java !important
.color-algolia-blue
color: $algolia-blue !important
.color-royal-blue
color: $royal-blue !important
.color-bunting
color: $bunting !important
.color-deep-cove
color: $deep-cove !important
.color-port-gore
color: $port-gore !important
.color-east-bay
color: $east-bay !important
.color-portage
color: $portage !important
.color-blue-bell
color: $blue-bell !important
.color-ghost
color: $ghost !important
.color-athens-gray
color: $athens-gray !important
.color-logan
color: $logan !important
.color-current
color: currentColor !important
.fill-dark
background-color: $primary-color !important
.fill-white
background-color: $white !important
.fill-titan
background-color: $titan-white !important
.fill-purple-heart
background-color: $purple-heart !important
.fill-mulberry
background-color: $mulberry !important
.fill-radical-red
background-color: $radical-red !important
.fill-bittersweet
background-color: $bittersweet !important
.fill-koromiko
background-color: $koromiko !important
.fill-shamrock
background-color: $shamrock !important
.fill-java
background-color: $java !important
.fill-algolia-blue
background-color: $algolia-blue !important
.fill-royal-blue
background-color: $royal-blue !important
.fill-deep-cove
background-color: $deep-cove !important
.fill-bunting
background-color: $bunting !important
.fill-port-gore
background-color: $port-gore !important
.fill-east-bay
background-color: $east-bay !important
.fill-portage
background-color: $portage !important
.fill-blue-bell
background-color: $blue-bell !important
.fill-ghost
background-color: $ghost !important
.fill-athens-gray
background-color: $athens-gray !important
.fill-logan
background-color: $logan !important
.gradient-primary,
.gradient-green
background-image: linear-gradient(320deg, $shamrock, mix($shamrock,$java)) !important
.gradient-secondary,
.gradient-blue
background-image: linear-gradient(256deg, $algolia-blue, $royal-blue) !important
.gradient-tertiary,
.gradient-pink
background-image: linear-gradient(256deg, $bittersweet, $radical-red) !important
.gradient-orange
background-image: linear-gradient(256deg, $koromiko, $bittersweet)
.gradient-purple
background-image: linear-gradient(269deg, #8e43e6, #b84592)
.gradient-light-blue
background-image: linear-gradient(269deg, $algolia-blue, $java)
.gradient-blue-purple
background-image: linear-gradient(103deg, $royal-blue, $purple-heart)
.gradient-dark
background-image: linear-gradient(283deg, $deep-cove, $bunting)
.gradient-white
background-image: linear-gradient(0deg, $titan-white, #ffffff)

15
docs/algolia-aerial/src/stylesheet/partials/_fonts.sass
View file

@ -1,15 +0,0 @@
@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800')
@import url('https://fonts.googleapis.com/css?family=Montserrat:300,400,500,700,900')
h1, h2, h3, h4
font-family: $headings-font-family
/*! The paragraphs also use Montserrat on the website, except on the documentation and other exceptions */
p
font-size: 15px
font-family: $headings-font-family
strong
font-family: $headings-font-family

698
docs/algolia-aerial/src/stylesheet/partials/_helpers.sass
View file

@ -1,698 +0,0 @@
/**
*spacer
*/
@mixin spacer
width: 100%
font-size: 0
margin: 0
padding: 0
border: 0
display: block
.spacer8
+spacer
height: 8px
.spacer16
+spacer
height: 16px
.spacer24
+spacer
height: 24px
.spacer32
+spacer
height: 32px
.spacer40
+spacer
height: 40px
.spacer48
+spacer
height: 48px
.spacer56
+spacer
height: 56px
.spacer64
+spacer
height: 64px
.spacer80
+spacer
height: 80px
.spacer120
+spacer
height: 120px
/**
*width
*/
.w100
width: 100px
.w150
width: 150px
.w200
width: 200px
.w100p
width: 100%
.m100
max-width: 100px
.m200
max-width: 200px
.m300
max-width: 300px
.m400
max-width: 400px
.m500
max-width: 500px
.m600
max-width: 600px
.m700
max-width: 700px
.m800
max-width: 800px
.m900
max-width: 900px
.m1000
max-width: 1000px
.m1200
max-width: 1200px
.m100p
max-width: 100%
/**
*height
*/
.h80
height: 80px
.h100
height: 100px
.h200
height: 200px
.h300
height: 300px
.h400
height: 400px
.h500
height: 500px
.h600
height: 600px
.h700
height: 700px
.h800
height: 800px
.hfull
height: 100%
/**
* positions
*/
.pos-rel
position: relative
.pos-stc
position: static
.pos-abt
position: absolute
.pos-fix
position: fixed
/**
* Indexing
*/
.z-1
z-index: 1
.z-2
z-index: 2
.z-3
z-index: 3
.z-4
z-index: 4
.z-5
z-index: 5
.z-10
z-index: 10
.z-20
z-index: 20
.z-100
z-index: 100
/**
*font size
*/
.text-heading
font-size: 56px
.text-xxl
font-size: 40px
.text-xl
font-size: 32px
.text-lg
font-size: 24px
.text-bg
font-size: 20px
.text-regular
font-size: 15px
.text-sm
font-size: 12px
.text-xsm
font-size: 10px
.text-xs
font-size: 8px
/**
*font weight
*/
.text-thin
font-weight: 300
.text-normal
font-weight: 400
.text-demi
font-weight: 500
p.text-demi
font-weight: 600
.text-bold
font-weight: 700
.text-bolder
font-weight: 900
p.text-bolder
font-weight: 800
/**
*borders
*/
.b-t
border-top: 1px solid $secondary-color
.b-r
border-right: 1px solid $secondary-color
.b-b
border-bottom: 1px solid $secondary-color
.b-l
border-left: 1px solid $secondary-color
.b-n
border: none !important
/**
* Radius
*/
.radius6
border-radius: 6px
.radius100p
border-radius: 100%
/**
*padding
*/
.padder
padding: 0 15px
.p-mini
padding: 5px
.p-small
padding: 10px
.p-large
padding: 20px
.p-xlarge
padding: 30px
.p-t-mini
padding-top: 5px
.p-t-small
padding-top: 10px
.p-t-large
padding-top: 20px
.p-t-xlarge
padding-top: 30px
.p-b-mini
padding-bottom: 5px
.p-b-small
padding-bottom: 10px
.p-b-large
padding-bottom: 20px
.p-b-xlarge
padding-bottom: 30px
.p-l-small
padding-left: 10px
.p-l-large
padding-left: 20px
.p-l-xlarge
padding-left: 30px
.p-r-small
padding-right: 10px
.p-r-large
padding-right: 20px
.p-r-xlarge
padding-right: 30px
.p-l-xxlarge
padding-left: 60px
.p-r-xxlarge
padding-right: 60px
.no-padding
padding: 0 !important
.no-p-l
padding-left: 0
.no-p-r
padding-right: 0
.no-p-t
padding-top: 0 !important
.no-p-b
padding-bottom: 0
/**
*margin
*/
.m-l-r-auto
margin-left: auto
margin-right: auto
.m-l
margin-left: 15px
.m-l-none
margin-left: 0
.m-l-mini
margin-left: 5px
.m-l-small
margin-left: 10px
.m-l-large
margin-left: 20px
.m-l-n
margin-left: -15px
.m-l-n-mini
margin-left: -5px
.m-l-n-small
margin-left: -10px
.m-l-n-large
margin-left: -20px
.m-t
margin-top: 15px
.m-t-none
margin-top: 0
.m-t-mini
margin-top: 5px
.m-t-small
margin-top: 10px
.m-t-large
margin-top: 20px
.m-t-n
margin-top: -15px
.m-t-n-xmini
margin-top: -1px
.m-t-n-mini
margin-top: -5px
.m-t-n-small
margin-top: -10px
.m-t-n-large
margin-top: -20px
.m-r
margin-right: 15px
.m-r-none
margin-right: 0
.m-r-mini
margin-right: 5px
.m-r-small
margin-right: 10px
.m-r-large
margin-right: 20px
.m-r-n
margin-right: -15px
.m-r-n-mini
margin-right: -5px
.m-r-n-small
margin-right: -10px
.m-r-n-large
margin-right: -20px
.m-b
margin-bottom: 15px
.m-b-none
margin-bottom: 0
.m-b-mini
margin-bottom: 5px
.m-b-small
margin-bottom: 10px
.m-b-large
margin-bottom: 20px
.m-b-xlarge
margin-bottom: 30px
.m-b-n
margin-bottom: -15px
.m-b-n-mini
margin-bottom: -5px
.m-b-n-small
margin-bottom: -10px
.m-b-n-large
margin-bottom: -20px
.no-margin
margin: 0 !important
/**
* text
*/
// Alignment
.text-left
text-align: left
.text-right
text-align: right
.text-center
text-align: center
.text-justify
text-align: justify
// Contextual colors
.text-muted
color: $text-muted
.vertical-align-middle
display: inline-block !important
vertical-align: middle !important
.vertical-align-bottom
display: inline-block !important
vertical-align: bottom !important
.text-ellipsis
white-space: nowrap
overflow: hidden
max-width: 100%
text-overflow: ellipsis
.text-break-word
word-wrap: break-word
.nowrap
word-wrap: nowrap
white-space: nowrap
.lower-case
text-transform: lowercase
.upper-case
text-transform: uppercase
.capital-case
text-transform: capitalize
.hidden-text
text-indent: -9999px
color: transparent
/**
* Line height
*/
.line-h-regular
line-height: 1.5
.line-h-small
line-height: 1.2
/**
*line
*/
.line
width: 100%
height: 1px
margin: 10px 0
font-size: 0
overflow: hidden
border-width: 0
background-color: $secondary-color
.line-dashed
border-style: dashed
background: transparent
.headline
border-bottom: 5px solid $black
margin-top: 0
line-height: 45px
.no-line
border-width: 0
.no-border
border-color: transparent !important
.no-radius
border-radius: 0
.block
display: block
.inline
display: inline-block
.pull-left
float: left
.pull-right
float: right
.pull-none
float: none
.pull-in
margin-right: -15px
margin-left: -15px
.line-v
border-left: 1px solid #dddddd
padding-left: 20px
.line-v-right
border-right: 1px solid #dddddd
padding-right: 20px
/**
* Flexbox
*/
.flex-container
display: flex
.flex-dir-col
flex-flow: column wrap
&-reverse
flex-flow: column-reverse wrap
.flex-dir-row
flex-flow: row wrap
&-reverse
flex-flow: row-reverse wrap
/**
* Flex space setting
*/
.flex-space-around
justify-content: space-around
.flex-space-between
justify-content: space-between
.flex-align-center
align-items: center
/**
* Flex item size
*/
.flex-it-4
flex: 0 1 25%
_:-ms-input-placeholder, :root .flex-it-4
-ms-flex-preferred-size: 21% !important
.flex-it-3
flex: 0 1 33.33%
_:-ms-input-placeholder, :root .flex-it-3
-ms-flex-preferred-size: 29% !important
.flex-it-2
flex: 0 1 50%
_:-ms-input-placeholder, :root .flex-it-2
-ms-flex-preferred-size: 48% !important
@supports ( not ( mix-blend-mode: luminosity))
flex: 0 1 49.95%
.flex-it-1
flex: 0 1 100%
// Responsive flex classes
@media (min-width: 1200px)
.flex-it-1-lg
flex: 0 1 100%
.flex-it-2-lg
flex: 0 1 50%
_:-ms-input-placeholder, :root .flex-it-2-lg
-ms-flex-preferred-size: 48% !important
@supports ( not ( mix-blend-mode: luminosity))
flex: 0 1 49.95%
.flex-it-3-lg
flex: 0 1 33.33%
_:-ms-input-placeholder, :root .flex-it-3-lg
-ms-flex-preferred-size: 29% !important
.flex-it-4-lg
flex: 0 1 25%
_:-ms-input-placeholder, :root .flex-it-4-lg
-ms-flex-preferred-size: 21% !important
@media (max-width: 768px)
.flex-it-1-sm
flex: 0 1 100%
.flex-it-2-sm
flex: 0 1 50%
_:-ms-input-placeholder, :root .flex-it-2-sm
-ms-flex-preferred-size: 48% !important
@supports ( not ( mix-blend-mode: luminosity))
flex: 0 1 49.95%
.flex-it-3-sm
flex: 0 1 33.33%
_:-ms-input-placeholder, :root .flex-it-3-sm
-ms-flex-preferred-size: 29% !important
.flex-it-4-sm
flex: 0 1 25%
_:-ms-input-placeholder, :root .flex-it-4-sm
-ms-flex-preferred-size: 21% !important
/**
* others
*/
.unscroll
overflow: hidden !important
.clickable
cursor: pointer
.rotate-45
transform: rotate(45deg)
.content-box
box-sizing: content-box
.faded
opacity: .3
.op0
opacity: 0
.line-through
text-decoration: line-through
.no-decoration
text-decoration: none
/**
* Centering
*/
.v-center
position: absolute
top: 50%
transform: translateY(-50%)
.h-center
position: absolute
left: 50%
transform: translateX(-50%)
.vh-center
position: absolute
top: 50%
left: 50%
transform: translate(-50%,-50%)
/**
* Hidden utilities
*/
.hidden-sm
@media (max-width: $screen-sm)
display: none !important
.visible-sm
@media (max-width: $screen-sm)
display: block !important
.hidden
display: none !important
visibility: hidden !important
/**
* CSS for <sub> and <sup>
*/
sub, sup
font-size: 50%
line-height: 0
position: relative
vertical-align: baseline
sup
top: -0.7em
sub
bottom: -0.25em
[ng\:cloak], [ng-cloak], .ng-cloak
display: none !important
/**
* Lists
*/
.list-none
list-style: none
/**
* Clearfix
*/
.cf:before,
.cf:after
content: " "
display: table
.cf:after
clear: both
/**
* For IE 6/7 only
* Include this rule to trigger hasLayout and contain floats.
*/
.cf
*zoom: 1
/**
* Shadows
*/
.elevation0
box-shadow: 0 5px 15px 0 rgba(112, 128, 175, 0.2)
.elevation1
box-shadow: 0 10px 40px 0 rgba($bunting,0.07), 0 2px 9px 0 rgba($bunting,0.06)
.elevation2
box-shadow: 0 16px 32px 0 rgba($bunting, 0.2)
// Placeholders
%elevation1
box-shadow: 0 10px 40px 0 rgba($bunting,0.07), 0 2px 9px 0 rgba($bunting,0.06)
/**
* For inputs
*/
.apn
-webkit-appearance: none
-moz-appearance: none
appearance: none
.otn
outline: none
/**
* To use with gradient for text
*/
.gradient-text
-webkit-background-clip: text
-webkit-text-fill-color: transparent

84
docs/algolia-aerial/src/stylesheet/vendors/bootstrap/_grid.scss vendored
View file

@ -1,84 +0,0 @@
//
// Grid system
// --------------------------------------------------
// Container widths
//
// Set the container width, and override it for fixed navbars in media queries.
.container {
@include container-fixed;
@media (min-width: $screen-sm-min) {
width: $container-sm;
}
@media (min-width: $screen-md-min) {
width: $container-md;
}
@media (min-width: $screen-lg-min) {
width: $container-lg;
}
}
// Fluid container
//
// Utilizes the mixin meant for fixed width containers, but without any defined
// width for fluid, full width layouts.
.container-fluid {
@include container-fixed;
}
// Row
//
// Rows contain and clear the floats of your columns.
.row {
@include make-row;
}
// Columns
//
// Common styles for small and large grid columns
@include make-grid-columns;
// Extra small grid
//
// Columns, offsets, pushes, and pulls for extra small devices like
// smartphones.
@include make-grid(xs);
// Small grid
//
// Columns, offsets, pushes, and pulls for the small device range, from phones
// to tablets.
@media (min-width: $screen-sm-min) {
@include make-grid(sm);
}
// Medium grid
//
// Columns, offsets, pushes, and pulls for the desktop device range.
@media (min-width: $screen-md-min) {
@include make-grid(md);
}
// Large grid
//
// Columns, offsets, pushes, and pulls for the large desktop device range.
@media (min-width: $screen-lg-min) {
@include make-grid(lg);
}

39
docs/algolia-aerial/src/stylesheet/vendors/bootstrap/_mixins.scss vendored
View file

@ -1,39 +0,0 @@
// Mixins
// --------------------------------------------------
// Utilities
@import "mixins/hide-text";
@import "mixins/opacity";
@import "mixins/image";
@import "mixins/labels";
@import "mixins/reset-filter";
@import "mixins/resize";
@import "mixins/responsive-visibility";
@import "mixins/size";
@import "mixins/tab-focus";
@import "mixins/text-emphasis";
@import "mixins/text-overflow";
@import "mixins/vendor-prefixes";
// Components
@import "mixins/alerts";
@import "mixins/buttons";
@import "mixins/panels";
@import "mixins/pagination";
@import "mixins/list-group";
@import "mixins/nav-divider";
@import "mixins/forms";
@import "mixins/progress-bar";
@import "mixins/table-row";
// Skins
@import "mixins/background-variant";
@import "mixins/border-radius";
@import "mixins/gradients";
// Layout
@import "mixins/clearfix";
@import "mixins/center-block";
@import "mixins/nav-vertical-align";
@import "mixins/grid-framework";
@import "mixins/grid";

427
docs/algolia-aerial/src/stylesheet/vendors/bootstrap/_normalize.scss vendored
View file

@ -1,427 +0,0 @@
/*! normalize.css v3.0.2 | MIT License | git.io/normalize */
//
// 1. Set default font family to sans-serif.
// 2. Prevent iOS text size adjust after orientation change, without disabling
// user zoom.
//
html {
font-family: sans-serif; // 1
-ms-text-size-adjust: 100%; // 2
-webkit-text-size-adjust: 100%; // 2
}
//
// Remove default margin.
//
body {
margin: 0;
}
// HTML5 display definitions
// ==========================================================================
//
// Correct `block` display not defined for any HTML5 element in IE 8/9.
// Correct `block` display not defined for `details` or `summary` in IE 10/11
// and Firefox.
// Correct `block` display not defined for `main` in IE 11.
//
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
display: block;
}
//
// 1. Correct `inline-block` display not defined in IE 8/9.
// 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
//
audio,
canvas,
progress,
video {
display: inline-block; // 1
vertical-align: baseline; // 2
}
//
// Prevent modern browsers from displaying `audio` without controls.
// Remove excess height in iOS 5 devices.
//
audio:not([controls]) {
display: none;
height: 0;
}
//
// Address `[hidden]` styling not present in IE 8/9/10.
// Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22.
//
[hidden],
template {
display: none;
}
// Links
// ==========================================================================
//
// Remove the gray background color from active links in IE 10.
//
a {
background-color: transparent;
}
//
// Improve readability when focused and also mouse hovered in all browsers.
//
a:active,
a:hover {
outline: 0;
}
// Text-level semantics
// ==========================================================================
//
// Address styling not present in IE 8/9/10/11, Safari, and Chrome.
//
abbr[title] {
border-bottom: 1px dotted;
}
//
// Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
//
b,
strong {
font-weight: bold;
}
//
// Address styling not present in Safari and Chrome.
//
dfn {
font-style: italic;
}
//
// Address variable `h1` font-size and margin within `section` and `article`
// contexts in Firefox 4+, Safari, and Chrome.
//
h1 {
font-size: 2em;
margin: 0.67em 0;
}
//
// Address styling not present in IE 8/9.
//
mark {
background: #ff0;
color: #000;
}
//
// Address inconsistent and variable font size in all browsers.
//
small {
font-size: 80%;
}
//
// Prevent `sub` and `sup` affecting `line-height` in all browsers.
//
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sup {
top: -0.5em;
}
sub {
bottom: -0.25em;
}
// Embedded content
// ==========================================================================
//
// Remove border when inside `a` element in IE 8/9/10.
//
img {
border: 0;
}
//
// Correct overflow not hidden in IE 9/10/11.
//
svg:not(:root) {
overflow: hidden;
}
// Grouping content
// ==========================================================================
//
// Address margin not present in IE 8/9 and Safari.
//
figure {
margin: 1em 40px;
}
//
// Address differences between Firefox and other browsers.
//
hr {
-moz-box-sizing: content-box;
box-sizing: content-box;
height: 0;
}
//
// Contain overflow in all browsers.
//
pre {
overflow: auto;
}
//
// Address odd `em`-unit font size rendering in all browsers.
//
code,
kbd,
pre,
samp {
font-family: monospace, monospace;
font-size: 1em;
}
// Forms
// ==========================================================================
//
// Known limitation: by default, Chrome and Safari on OS X allow very limited
// styling of `select`, unless a `border` property is set.
//
//
// 1. Correct color not being inherited.
// Known issue: affects color of disabled elements.
// 2. Correct font properties not being inherited.
// 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
//
button,
input,
optgroup,
select,
textarea {
color: inherit; // 1
font: inherit; // 2
margin: 0; // 3
}
//
// Address `overflow` set to `hidden` in IE 8/9/10/11.
//
button {
overflow: visible;
}
//
// Address inconsistent `text-transform` inheritance for `button` and `select`.
// All other form control elements do not inherit `text-transform` values.
// Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
// Correct `select` style inheritance in Firefox.
//
button,
select {
text-transform: none;
}
//
// 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
// and `video` controls.
// 2. Correct inability to style clickable `input` types in iOS.
// 3. Improve usability and consistency of cursor style between image-type
// `input` and others.
//
button,
html input[type="button"], // 1
input[type="reset"],
input[type="submit"] {
-webkit-appearance: button; // 2
cursor: pointer; // 3
}
//
// Re-set default cursor for disabled elements.
//
button[disabled],
html input[disabled] {
cursor: default;
}
//
// Remove inner padding and border in Firefox 4+.
//
button::-moz-focus-inner,
input::-moz-focus-inner {
border: 0;
padding: 0;
}
//
// Address Firefox 4+ setting `line-height` on `input` using `!important` in
// the UA stylesheet.
//
input {
line-height: normal;
}
//
// It's recommended that you don't attempt to style these elements.
// Firefox's implementation doesn't respect box-sizing, padding, or width.
//
// 1. Address box sizing set to `content-box` in IE 8/9/10.
// 2. Remove excess padding in IE 8/9/10.
//
input[type="checkbox"],
input[type="radio"] {
box-sizing: border-box; // 1
padding: 0; // 2
}
//
// Fix the cursor style for Chrome's increment/decrement buttons. For certain
// `font-size` values of the `input`, it causes the cursor style of the
// decrement button to change from `default` to `text`.
//
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
height: auto;
}
//
// 1. Address `appearance` set to `searchfield` in Safari and Chrome.
// 2. Address `box-sizing` set to `border-box` in Safari and Chrome
// (include `-moz` to future-proof).
//
input[type="search"] {
-webkit-appearance: textfield; // 1
-moz-box-sizing: content-box;
-webkit-box-sizing: content-box; // 2
box-sizing: content-box;
}
//
// Remove inner padding and search cancel button in Safari and Chrome on OS X.
// Safari (but not Chrome) clips the cancel button when the search input has
// padding (and `textfield` appearance).
//
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
}
//
// Define consistent border, margin, and padding.
//
fieldset {
border: 1px solid #c0c0c0;
margin: 0 2px;
padding: 0.35em 0.625em 0.75em;
}
//
// 1. Correct `color` not being inherited in IE 8/9/10/11.
// 2. Remove padding so people aren't caught out if they zero out fieldsets.
//
legend {
border: 0; // 1
padding: 0; // 2
}
//
// Remove default vertical scrollbar in IE 8/9/10/11.
//
textarea {
overflow: auto;
}
//
// Don't inherit the `font-weight` (applied by a rule above).
// NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
//
optgroup {
font-weight: bold;
}
// Tables
// ==========================================================================
//
// Remove most spacing between table cells.
//
table {
border-collapse: collapse;
border-spacing: 0;
}
td,
th {
padding: 0;
}

177
docs/algolia-aerial/src/stylesheet/vendors/bootstrap/_responsive-utilities.scss vendored
View file

@ -1,177 +0,0 @@
//
// Responsive: Utility classes
// --------------------------------------------------
// IE10 in Windows (Phone) 8
//
// Support for responsive views via media queries is kind of borked in IE10, for
// Surface/desktop in split view and for Windows Phone 8. This particular fix
// must be accompanied by a snippet of JavaScript to sniff the user agent and
// apply some conditional CSS to *only* the Surface/desktop Windows 8. Look at
// our Getting Started page for more information on this bug.
//
// For more information, see the following:
//
// Issue: https://github.com/twbs/bootstrap/issues/10497
// Docs: http://getbootstrap.com/getting-started/#support-ie10-width
// Source: http://timkadlec.com/2013/01/windows-phone-8-and-device-width/
// Source: http://timkadlec.com/2012/10/ie10-snap-mode-and-responsive-design/
@-ms-viewport {
width: device-width;
}
// Visibility utilities
// Note: Deprecated .visible-xs, .visible-sm, .visible-md, and .visible-lg as of v3.2.0
@include responsive-invisibility('.visible-xs');
@include responsive-invisibility('.visible-sm');
@include responsive-invisibility('.visible-md');
@include responsive-invisibility('.visible-lg');
.visible-xs-block,
.visible-xs-inline,
.visible-xs-inline-block,
.visible-sm-block,
.visible-sm-inline,
.visible-sm-inline-block,
.visible-md-block,
.visible-md-inline,
.visible-md-inline-block,
.visible-lg-block,
.visible-lg-inline,
.visible-lg-inline-block {
display: none !important;
}
@media (max-width: $screen-xs-max) {
@include responsive-visibility('.visible-xs');
}
.visible-xs-block {
@media (max-width: $screen-xs-max) {
display: block !important;
}
}
.visible-xs-inline {
@media (max-width: $screen-xs-max) {
display: inline !important;
}
}
.visible-xs-inline-block {
@media (max-width: $screen-xs-max) {
display: inline-block !important;
}
}
@media (min-width: $screen-sm-min) and (max-width: $screen-sm-max) {
@include responsive-visibility('.visible-sm');
}
.visible-sm-block {
@media (min-width: $screen-sm-min) and (max-width: $screen-sm-max) {
display: block !important;
}
}
.visible-sm-inline {
@media (min-width: $screen-sm-min) and (max-width: $screen-sm-max) {
display: inline !important;
}
}
.visible-sm-inline-block {
@media (min-width: $screen-sm-min) and (max-width: $screen-sm-max) {
display: inline-block !important;
}
}
@media (min-width: $screen-md-min) and (max-width: $screen-md-max) {
@include responsive-visibility('.visible-md');
}
.visible-md-block {
@media (min-width: $screen-md-min) and (max-width: $screen-md-max) {
display: block !important;
}
}
.visible-md-inline {
@media (min-width: $screen-md-min) and (max-width: $screen-md-max) {
display: inline !important;
}
}
.visible-md-inline-block {
@media (min-width: $screen-md-min) and (max-width: $screen-md-max) {
display: inline-block !important;
}
}
@media (min-width: $screen-lg-min) {
@include responsive-visibility('.visible-lg');
}
.visible-lg-block {
@media (min-width: $screen-lg-min) {
display: block !important;
}
}
.visible-lg-inline {
@media (min-width: $screen-lg-min) {
display: inline !important;
}
}
.visible-lg-inline-block {
@media (min-width: $screen-lg-min) {
display: inline-block !important;
}
}
@media (max-width: $screen-xs-max) {
@include responsive-invisibility('.hidden-xs');
}
@media (min-width: $screen-sm-min) and (max-width: $screen-sm-max) {
@include responsive-invisibility('.hidden-sm');
}
@media (min-width: $screen-md-min) and (max-width: $screen-md-max) {
@include responsive-invisibility('.hidden-md');
}
@media (min-width: $screen-lg-min) {
@include responsive-invisibility('.hidden-lg');
}
// Print utilities
//
// Media queries are placed on the inside to be mixin-friendly.
// Note: Deprecated .visible-print as of v3.2.0
@include responsive-invisibility('.visible-print');
@media print {
@include responsive-visibility('.visible-print');
}
.visible-print-block {
display: none !important;
@media print {
display: block !important;
}
}
.visible-print-inline {
display: none !important;
@media print {
display: inline !important;
}
}
.visible-print-inline-block {
display: none !important;
@media print {
display: inline-block !important;
}
}
@media print {
@include responsive-invisibility('.hidden-print');
}

864
docs/algolia-aerial/src/stylesheet/vendors/bootstrap/_variables.scss vendored
View file

@ -1,864 +0,0 @@
// When true, asset path helpers are used, otherwise the regular CSS `url()` is used.
// When there no function is defined, `fn('')` is parsed as string that equals the right hand side
// NB: in Sass 3.3 there is a native function: function-exists(twbs-font-path)
$bootstrap-sass-asset-helper: (twbs-font-path("") != unquote('twbs-font-path("")')) !default;
//
// Variables
// --------------------------------------------------
//== Colors
//
//## Gray and brand colors for use across Bootstrap.
$gray-base: #000 !default;
$gray-darker: lighten($gray-base, 13.5%) !default; // #222
$gray-dark: lighten($gray-base, 20%) !default; // #333
$gray: lighten($gray-base, 33.5%) !default; // #555
$gray-light: lighten($gray-base, 46.7%) !default; // #777
$gray-lighter: lighten($gray-base, 93.5%) !default; // #eee
$brand-primary: darken(#428bca, 6.5%) !default;
$brand-success: #5cb85c !default;
$brand-info: #5bc0de !default;
$brand-warning: #f0ad4e !default;
$brand-danger: #d9534f !default;
//== Scaffolding
//
//## Settings for some of the most global styles.
//** Background color for `<body>`.
$body-bg: #fff !default;
//** Global text color on `<body>`.
$text-color: $gray-dark !default;
//** Global textual link color.
$link-color: $brand-primary !default;
//** Link hover color set via `darken()` function.
$link-hover-color: darken($link-color, 15%) !default;
//** Link hover decoration.
$link-hover-decoration: underline !default;
//== Typography
//
//## Font, line-height, and color for body text, headings, and more.
$font-family-sans-serif: "Helvetica Neue", Helvetica, Arial, sans-serif !default;
$font-family-serif: Georgia, "Times New Roman", Times, serif !default;
//** Default monospace fonts for `<code>`, `<kbd>`, and `<pre>`.
$font-family-monospace: Menlo, Monaco, Consolas, "Courier New", monospace !default;
$font-family-base: $font-family-sans-serif !default;
$font-size-base: 14px !default;
$font-size-large: ceil(($font-size-base * 1.25)) !default; // ~18px
$font-size-small: ceil(($font-size-base * 0.85)) !default; // ~12px
$font-size-h1: floor(($font-size-base * 2.6)) !default; // ~36px
$font-size-h2: floor(($font-size-base * 2.15)) !default; // ~30px
$font-size-h3: ceil(($font-size-base * 1.7)) !default; // ~24px
$font-size-h4: ceil(($font-size-base * 1.25)) !default; // ~18px
$font-size-h5: $font-size-base !default;
$font-size-h6: ceil(($font-size-base * 0.85)) !default; // ~12px
//** Unit-less `line-height` for use in components like buttons.
$line-height-base: 1.428571429 !default; // 20/14
//** Computed "line-height" (`font-size` * `line-height`) for use with `margin`, `padding`, etc.
$line-height-computed: floor(($font-size-base * $line-height-base)) !default; // ~20px
//** By default, this inherits from the `<body>`.
$headings-font-family: inherit !default;
$headings-font-weight: 500 !default;
$headings-line-height: 1.1 !default;
$headings-color: inherit !default;
//== Iconography
//
//## Specify custom location and filename of the included Glyphicons icon font. Useful for those including Bootstrap via Bower.
//** Load fonts from this directory.
// [converter] Asset helpers such as Sprockets and Node.js Mincer do not resolve relative paths
$icon-font-path: if($bootstrap-sass-asset-helper, "bootstrap/", "../fonts/bootstrap/") !default;
//** File name for all font files.
$icon-font-name: "glyphicons-halflings-regular" !default;
//** Element ID within SVG icon file.
$icon-font-svg-id: "glyphicons_halflingsregular" !default;
//== Components
//
//## Define common padding and border radius sizes and more. Values based on 14px text and 1.428 line-height (~20px to start).
$padding-base-vertical: 6px !default;
$padding-base-horizontal: 12px !default;
$padding-large-vertical: 10px !default;
$padding-large-horizontal: 16px !default;
$padding-small-vertical: 5px !default;
$padding-small-horizontal: 10px !default;
$padding-xs-vertical: 1px !default;
$padding-xs-horizontal: 5px !default;
$line-height-large: 1.33 !default;
$line-height-small: 1.5 !default;
$border-radius-base: 4px !default;
$border-radius-large: 6px !default;
$border-radius-small: 3px !default;
//** Global color for active items (e.g., navs or dropdowns).
$component-active-color: #fff !default;
//** Global background color for active items (e.g., navs or dropdowns).
$component-active-bg: $brand-primary !default;
//** Width of the `border` for generating carets that indicator dropdowns.
$caret-width-base: 4px !default;
//** Carets increase slightly in size for larger components.
$caret-width-large: 5px !default;
//== Tables
//
//## Customizes the `.table` component with basic values, each used across all table variations.
//** Padding for `<th>`s and `<td>`s.
$table-cell-padding: 8px !default;
//** Padding for cells in `.table-condensed`.
$table-condensed-cell-padding: 5px !default;
//** Default background color used for all tables.
$table-bg: transparent !default;
//** Background color used for `.table-striped`.
$table-bg-accent: #f9f9f9 !default;
//** Background color used for `.table-hover`.
$table-bg-hover: #f5f5f5 !default;
$table-bg-active: $table-bg-hover !default;
//** Border color for table and cell borders.
$table-border-color: #ddd !default;
//== Buttons
//
//## For each of Bootstrap's buttons, define text, background and border color.
$btn-font-weight: normal !default;
$btn-default-color: #333 !default;
$btn-default-bg: #fff !default;
$btn-default-border: #ccc !default;
$btn-primary-color: #fff !default;
$btn-primary-bg: $brand-primary !default;
$btn-primary-border: darken($btn-primary-bg, 5%) !default;
$btn-success-color: #fff !default;
$btn-success-bg: $brand-success !default;
$btn-success-border: darken($btn-success-bg, 5%) !default;
$btn-info-color: #fff !default;
$btn-info-bg: $brand-info !default;
$btn-info-border: darken($btn-info-bg, 5%) !default;
$btn-warning-color: #fff !default;
$btn-warning-bg: $brand-warning !default;
$btn-warning-border: darken($btn-warning-bg, 5%) !default;
$btn-danger-color: #fff !default;
$btn-danger-bg: $brand-danger !default;
$btn-danger-border: darken($btn-danger-bg, 5%) !default;
$btn-link-disabled-color: $gray-light !default;
//== Forms
//
//##
//** `<input>` background color
$input-bg: #fff !default;
//** `<input disabled>` background color
$input-bg-disabled: $gray-lighter !default;
//** Text color for `<input>`s
$input-color: $gray !default;
//** `<input>` border color
$input-border: #ccc !default;
// TODO: Rename `$input-border-radius` to `$input-border-radius-base` in v4
//** Default `.form-control` border radius
$input-border-radius: $border-radius-base !default;
//** Large `.form-control` border radius
$input-border-radius-large: $border-radius-large !default;
//** Small `.form-control` border radius
$input-border-radius-small: $border-radius-small !default;
//** Border color for inputs on focus
$input-border-focus: #66afe9 !default;
//** Placeholder text color
$input-color-placeholder: #999 !default;
//** Default `.form-control` height
$input-height-base: ($line-height-computed + ($padding-base-vertical * 2) + 2) !default;
//** Large `.form-control` height
$input-height-large: (ceil($font-size-large * $line-height-large) + ($padding-large-vertical * 2) + 2) !default;
//** Small `.form-control` height
$input-height-small: (floor($font-size-small * $line-height-small) + ($padding-small-vertical * 2) + 2) !default;
$legend-color: $gray-dark !default;
$legend-border-color: #e5e5e5 !default;
//** Background color for textual input addons
$input-group-addon-bg: $gray-lighter !default;
//** Border color for textual input addons
$input-group-addon-border-color: $input-border !default;
//** Disabled cursor for form controls and buttons.
$cursor-disabled: not-allowed !default;
//== Dropdowns
//
//## Dropdown menu container and contents.
//** Background for the dropdown menu.
$dropdown-bg: #fff !default;
//** Dropdown menu `border-color`.
$dropdown-border: rgba(0,0,0,.15) !default;
//** Dropdown menu `border-color` **for IE8**.
$dropdown-fallback-border: #ccc !default;
//** Divider color for between dropdown items.
$dropdown-divider-bg: #e5e5e5 !default;
//** Dropdown link text color.
$dropdown-link-color: $gray-dark !default;
//** Hover color for dropdown links.
$dropdown-link-hover-color: darken($gray-dark, 5%) !default;
//** Hover background for dropdown links.
$dropdown-link-hover-bg: #f5f5f5 !default;
//** Active dropdown menu item text color.
$dropdown-link-active-color: $component-active-color !default;
//** Active dropdown menu item background color.
$dropdown-link-active-bg: $component-active-bg !default;
//** Disabled dropdown menu item background color.
$dropdown-link-disabled-color: $gray-light !default;
//** Text color for headers within dropdown menus.
$dropdown-header-color: $gray-light !default;
//** Deprecated `$dropdown-caret-color` as of v3.1.0
$dropdown-caret-color: #000 !default;
//-- Z-index master list
//
// Warning: Avoid customizing these values. They're used for a bird's eye view
// of components dependent on the z-axis and are designed to all work together.
//
// Note: These variables are not generated into the Customizer.
$zindex-navbar: 1000 !default;
$zindex-dropdown: 1000 !default;
$zindex-popover: 1060 !default;
$zindex-tooltip: 1070 !default;
$zindex-navbar-fixed: 1030 !default;
$zindex-modal: 1040 !default;
//== Media queries breakpoints
//
//## Define the breakpoints at which your layout will change, adapting to different screen sizes.
// Extra small screen / phone
//** Deprecated `$screen-xs` as of v3.0.1
$screen-xs: 480px !default;
//** Deprecated `$screen-xs-min` as of v3.2.0
$screen-xs-min: $screen-xs !default;
//** Deprecated `$screen-phone` as of v3.0.1
$screen-phone: $screen-xs-min !default;
// Small screen / tablet
//** Deprecated `$screen-sm` as of v3.0.1
$screen-sm: 768px !default;
$screen-sm-min: $screen-sm !default;
//** Deprecated `$screen-tablet` as of v3.0.1
$screen-tablet: $screen-sm-min !default;
// Medium screen / desktop
//** Deprecated `$screen-md` as of v3.0.1
$screen-md: 992px !default;
$screen-md-min: $screen-md !default;
//** Deprecated `$screen-desktop` as of v3.0.1
$screen-desktop: $screen-md-min !default;
// Large screen / wide desktop
//** Deprecated `$screen-lg` as of v3.0.1
$screen-lg: 1200px !default;
$screen-lg-min: $screen-lg !default;
//** Deprecated `$screen-lg-desktop` as of v3.0.1
$screen-lg-desktop: $screen-lg-min !default;
// So media queries don't overlap when required, provide a maximum
$screen-xs-max: ($screen-sm-min - 1) !default;
$screen-sm-max: ($screen-md-min - 1) !default;
$screen-md-max: ($screen-lg-min - 1) !default;
//== Grid system
//
//## Define your custom responsive grid.
//** Number of columns in the grid.
$grid-columns: 12 !default;
//** Padding between columns. Gets divided in half for the left and right.
$grid-gutter-width: 30px !default;
// Navbar collapse
//** Point at which the navbar becomes uncollapsed.
$grid-float-breakpoint: $screen-sm-min !default;
//** Point at which the navbar begins collapsing.
$grid-float-breakpoint-max: ($grid-float-breakpoint - 1) !default;
//== Container sizes
//
//## Define the maximum width of `.container` for different screen sizes.
// Small screen / tablet
$container-tablet: (720px + $grid-gutter-width) !default;
//** For `$screen-sm-min` and up.
$container-sm: $container-tablet !default;
// Medium screen / desktop
$container-desktop: (940px + $grid-gutter-width) !default;
//** For `$screen-md-min` and up.
$container-md: $container-desktop !default;
// Large screen / wide desktop
$container-large-desktop: (1140px + $grid-gutter-width) !default;
//** For `$screen-lg-min` and up.
$container-lg: $container-large-desktop !default;
//== Navbar
//
//##
// Basics of a navbar
$navbar-height: 50px !default;
$navbar-margin-bottom: $line-height-computed !default;
$navbar-border-radius: $border-radius-base !default;
$navbar-padding-horizontal: floor(($grid-gutter-width / 2)) !default;
$navbar-padding-vertical: (($navbar-height - $line-height-computed) / 2) !default;
$navbar-collapse-max-height: 340px !default;
$navbar-default-color: #777 !default;
$navbar-default-bg: #f8f8f8 !default;
$navbar-default-border: darken($navbar-default-bg, 6.5%) !default;
// Navbar links
$navbar-default-link-color: #777 !default;
$navbar-default-link-hover-color: #333 !default;
$navbar-default-link-hover-bg: transparent !default;
$navbar-default-link-active-color: #555 !default;
$navbar-default-link-active-bg: darken($navbar-default-bg, 6.5%) !default;
$navbar-default-link-disabled-color: #ccc !default;
$navbar-default-link-disabled-bg: transparent !default;
// Navbar brand label
$navbar-default-brand-color: $navbar-default-link-color !default;
$navbar-default-brand-hover-color: darken($navbar-default-brand-color, 10%) !default;
$navbar-default-brand-hover-bg: transparent !default;
// Navbar toggle
$navbar-default-toggle-hover-bg: #ddd !default;
$navbar-default-toggle-icon-bar-bg: #888 !default;
$navbar-default-toggle-border-color: #ddd !default;
// Inverted navbar
// Reset inverted navbar basics
$navbar-inverse-color: lighten($gray-light, 15%) !default;
$navbar-inverse-bg: #222 !default;
$navbar-inverse-border: darken($navbar-inverse-bg, 10%) !default;
// Inverted navbar links
$navbar-inverse-link-color: lighten($gray-light, 15%) !default;
$navbar-inverse-link-hover-color: #fff !default;
$navbar-inverse-link-hover-bg: transparent !default;
$navbar-inverse-link-active-color: $navbar-inverse-link-hover-color !default;
$navbar-inverse-link-active-bg: darken($navbar-inverse-bg, 10%) !default;
$navbar-inverse-link-disabled-color: #444 !default;
$navbar-inverse-link-disabled-bg: transparent !default;
// Inverted navbar brand label
$navbar-inverse-brand-color: $navbar-inverse-link-color !default;
$navbar-inverse-brand-hover-color: #fff !default;
$navbar-inverse-brand-hover-bg: transparent !default;
// Inverted navbar toggle
$navbar-inverse-toggle-hover-bg: #333 !default;
$navbar-inverse-toggle-icon-bar-bg: #fff !default;
$navbar-inverse-toggle-border-color: #333 !default;
//== Navs
//
//##
//=== Shared nav styles
$nav-link-padding: 10px 15px !default;
$nav-link-hover-bg: $gray-lighter !default;
$nav-disabled-link-color: $gray-light !default;
$nav-disabled-link-hover-color: $gray-light !default;
//== Tabs
$nav-tabs-border-color: #ddd !default;
$nav-tabs-link-hover-border-color: $gray-lighter !default;
$nav-tabs-active-link-hover-bg: $body-bg !default;
$nav-tabs-active-link-hover-color: $gray !default;
$nav-tabs-active-link-hover-border-color: #ddd !default;
$nav-tabs-justified-link-border-color: #ddd !default;
$nav-tabs-justified-active-link-border-color: $body-bg !default;
//== Pills
$nav-pills-border-radius: $border-radius-base !default;
$nav-pills-active-link-hover-bg: $component-active-bg !default;
$nav-pills-active-link-hover-color: $component-active-color !default;
//== Pagination
//
//##
$pagination-color: $link-color !default;
$pagination-bg: #fff !default;
$pagination-border: #ddd !default;
$pagination-hover-color: $link-hover-color !default;
$pagination-hover-bg: $gray-lighter !default;
$pagination-hover-border: #ddd !default;
$pagination-active-color: #fff !default;
$pagination-active-bg: $brand-primary !default;
$pagination-active-border: $brand-primary !default;
$pagination-disabled-color: $gray-light !default;
$pagination-disabled-bg: #fff !default;
$pagination-disabled-border: #ddd !default;
//== Pager
//
//##
$pager-bg: $pagination-bg !default;
$pager-border: $pagination-border !default;
$pager-border-radius: 15px !default;
$pager-hover-bg: $pagination-hover-bg !default;
$pager-active-bg: $pagination-active-bg !default;
$pager-active-color: $pagination-active-color !default;
$pager-disabled-color: $pagination-disabled-color !default;
//== Jumbotron
//
//##
$jumbotron-padding: 30px !default;
$jumbotron-color: inherit !default;
$jumbotron-bg: $gray-lighter !default;
$jumbotron-heading-color: inherit !default;
$jumbotron-font-size: ceil(($font-size-base * 1.5)) !default;
//== Form states and alerts
//
//## Define colors for form feedback states and, by default, alerts.
$state-success-text: #3c763d !default;
$state-success-bg: #dff0d8 !default;
$state-success-border: darken(adjust-hue($state-success-bg, -10), 5%) !default;
$state-info-text: #31708f !default;
$state-info-bg: #d9edf7 !default;
$state-info-border: darken(adjust-hue($state-info-bg, -10), 7%) !default;
$state-warning-text: #8a6d3b !default;
$state-warning-bg: #fcf8e3 !default;
$state-warning-border: darken(adjust-hue($state-warning-bg, -10), 5%) !default;
$state-danger-text: #a94442 !default;
$state-danger-bg: #f2dede !default;
$state-danger-border: darken(adjust-hue($state-danger-bg, -10), 5%) !default;
//== Tooltips
//
//##
//** Tooltip max width
$tooltip-max-width: 200px !default;
//** Tooltip text color
$tooltip-color: #fff !default;
//** Tooltip background color
$tooltip-bg: #000 !default;
$tooltip-opacity: .9 !default;
//** Tooltip arrow width
$tooltip-arrow-width: 5px !default;
//** Tooltip arrow color
$tooltip-arrow-color: $tooltip-bg !default;
//== Popovers
//
//##
//** Popover body background color
$popover-bg: #fff !default;
//** Popover maximum width
$popover-max-width: 276px !default;
//** Popover border color
$popover-border-color: rgba(0,0,0,.2) !default;
//** Popover fallback border color
$popover-fallback-border-color: #ccc !default;
//** Popover title background color
$popover-title-bg: darken($popover-bg, 3%) !default;
//** Popover arrow width
$popover-arrow-width: 10px !default;
//** Popover arrow color
$popover-arrow-color: $popover-bg !default;
//** Popover outer arrow width
$popover-arrow-outer-width: ($popover-arrow-width + 1) !default;
//** Popover outer arrow color
$popover-arrow-outer-color: fade_in($popover-border-color, 0.05) !default;
//** Popover outer arrow fallback color
$popover-arrow-outer-fallback-color: darken($popover-fallback-border-color, 20%) !default;
//== Labels
//
//##
//** Default label background color
$label-default-bg: $gray-light !default;
//** Primary label background color
$label-primary-bg: $brand-primary !default;
//** Success label background color
$label-success-bg: $brand-success !default;
//** Info label background color
$label-info-bg: $brand-info !default;
//** Warning label background color
$label-warning-bg: $brand-warning !default;
//** Danger label background color
$label-danger-bg: $brand-danger !default;
//** Default label text color
$label-color: #fff !default;
//** Default text color of a linked label
$label-link-hover-color: #fff !default;
//== Modals
//
//##
//** Padding applied to the modal body
$modal-inner-padding: 15px !default;
//** Padding applied to the modal title
$modal-title-padding: 15px !default;
//** Modal title line-height
$modal-title-line-height: $line-height-base !default;
//** Background color of modal content area
$modal-content-bg: #fff !default;
//** Modal content border color
$modal-content-border-color: rgba(0,0,0,.2) !default;
//** Modal content border color **for IE8**
$modal-content-fallback-border-color: #999 !default;
//** Modal backdrop background color
$modal-backdrop-bg: #000 !default;
//** Modal backdrop opacity
$modal-backdrop-opacity: .5 !default;
//** Modal header border color
$modal-header-border-color: #e5e5e5 !default;
//** Modal footer border color
$modal-footer-border-color: $modal-header-border-color !default;
$modal-lg: 900px !default;
$modal-md: 600px !default;
$modal-sm: 300px !default;
//== Alerts
//
//## Define alert colors, border radius, and padding.
$alert-padding: 15px !default;
$alert-border-radius: $border-radius-base !default;
$alert-link-font-weight: bold !default;
$alert-success-bg: $state-success-bg !default;
$alert-success-text: $state-success-text !default;
$alert-success-border: $state-success-border !default;
$alert-info-bg: $state-info-bg !default;
$alert-info-text: $state-info-text !default;
$alert-info-border: $state-info-border !default;
$alert-warning-bg: $state-warning-bg !default;
$alert-warning-text: $state-warning-text !default;
$alert-warning-border: $state-warning-border !default;
$alert-danger-bg: $state-danger-bg !default;
$alert-danger-text: $state-danger-text !default;
$alert-danger-border: $state-danger-border !default;
//== Progress bars
//
//##
//** Background color of the whole progress component
$progress-bg: #f5f5f5 !default;
//** Progress bar text color
$progress-bar-color: #fff !default;
//** Variable for setting rounded corners on progress bar.
$progress-border-radius: $border-radius-base !default;
//** Default progress bar color
$progress-bar-bg: $brand-primary !default;
//** Success progress bar color
$progress-bar-success-bg: $brand-success !default;
//** Warning progress bar color
$progress-bar-warning-bg: $brand-warning !default;
//** Danger progress bar color
$progress-bar-danger-bg: $brand-danger !default;
//** Info progress bar color
$progress-bar-info-bg: $brand-info !default;
//== List group
//
//##
//** Background color on `.list-group-item`
$list-group-bg: #fff !default;
//** `.list-group-item` border color
$list-group-border: #ddd !default;
//** List group border radius
$list-group-border-radius: $border-radius-base !default;
//** Background color of single list items on hover
$list-group-hover-bg: #f5f5f5 !default;
//** Text color of active list items
$list-group-active-color: $component-active-color !default;
//** Background color of active list items
$list-group-active-bg: $component-active-bg !default;
//** Border color of active list elements
$list-group-active-border: $list-group-active-bg !default;
//** Text color for content within active list items
$list-group-active-text-color: lighten($list-group-active-bg, 40%) !default;
//** Text color of disabled list items
$list-group-disabled-color: $gray-light !default;
//** Background color of disabled list items
$list-group-disabled-bg: $gray-lighter !default;
//** Text color for content within disabled list items
$list-group-disabled-text-color: $list-group-disabled-color !default;
$list-group-link-color: #555 !default;
$list-group-link-hover-color: $list-group-link-color !default;
$list-group-link-heading-color: #333 !default;
//== Panels
//
//##
$panel-bg: #fff !default;
$panel-body-padding: 15px !default;
$panel-heading-padding: 10px 15px !default;
$panel-footer-padding: $panel-heading-padding !default;
$panel-border-radius: $border-radius-base !default;
//** Border color for elements within panels
$panel-inner-border: #ddd !default;
$panel-footer-bg: #f5f5f5 !default;
$panel-default-text: $gray-dark !default;
$panel-default-border: #ddd !default;
$panel-default-heading-bg: #f5f5f5 !default;
$panel-primary-text: #fff !default;
$panel-primary-border: $brand-primary !default;
$panel-primary-heading-bg: $brand-primary !default;
$panel-success-text: $state-success-text !default;
$panel-success-border: $state-success-border !default;
$panel-success-heading-bg: $state-success-bg !default;
$panel-info-text: $state-info-text !default;
$panel-info-border: $state-info-border !default;
$panel-info-heading-bg: $state-info-bg !default;
$panel-warning-text: $state-warning-text !default;
$panel-warning-border: $state-warning-border !default;
$panel-warning-heading-bg: $state-warning-bg !default;
$panel-danger-text: $state-danger-text !default;
$panel-danger-border: $state-danger-border !default;
$panel-danger-heading-bg: $state-danger-bg !default;
//== Thumbnails
//
//##
//** Padding around the thumbnail image
$thumbnail-padding: 4px !default;
//** Thumbnail background color
$thumbnail-bg: $body-bg !default;
//** Thumbnail border color
$thumbnail-border: #ddd !default;
//** Thumbnail border radius
$thumbnail-border-radius: $border-radius-base !default;
//** Custom text color for thumbnail captions
$thumbnail-caption-color: $text-color !default;
//** Padding around the thumbnail caption
$thumbnail-caption-padding: 9px !default;
//== Wells
//
//##
$well-bg: #f5f5f5 !default;
$well-border: darken($well-bg, 7%) !default;
//== Badges
//
//##
$badge-color: #fff !default;
//** Linked badge text color on hover
$badge-link-hover-color: #fff !default;
$badge-bg: $gray-light !default;
//** Badge text color in active nav link
$badge-active-color: $link-color !default;
//** Badge background color in active nav link
$badge-active-bg: #fff !default;
$badge-font-weight: bold !default;
$badge-line-height: 1 !default;
$badge-border-radius: 10px !default;
//== Breadcrumbs
//
//##
$breadcrumb-padding-vertical: 8px !default;
$breadcrumb-padding-horizontal: 15px !default;
//** Breadcrumb background color
$breadcrumb-bg: #f5f5f5 !default;
//** Breadcrumb text color
$breadcrumb-color: #ccc !default;
//** Text color of current page in the breadcrumb
$breadcrumb-active-color: $gray-light !default;
//** Textual separator for between breadcrumb elements
$breadcrumb-separator: "/" !default;
//== Carousel
//
//##
$carousel-text-shadow: 0 1px 2px rgba(0,0,0,.6) !default;
$carousel-control-color: #fff !default;
$carousel-control-width: 15% !default;
$carousel-control-opacity: .5 !default;
$carousel-control-font-size: 20px !default;
$carousel-indicator-active-bg: #fff !default;
$carousel-indicator-border-color: #fff !default;
$carousel-caption-color: #fff !default;
//== Close
//
//##
$close-font-weight: bold !default;
$close-color: #000 !default;
$close-text-shadow: 0 1px 0 #fff !default;
//== Code
//
//##
$code-color: #c7254e !default;
$code-bg: #f9f2f4 !default;
$kbd-color: #fff !default;
$kbd-bg: #333 !default;
$pre-bg: #f5f5f5 !default;
$pre-color: $gray-dark !default;
$pre-border-color: #ccc !default;
$pre-scrollable-max-height: 340px !default;
//== Type
//
//##
//** Horizontal offset for forms and lists.
$component-offset-horizontal: 180px !default;
//** Text muted color
$text-muted: $gray-light !default;
//** Abbreviations and acronyms border color
$abbr-border-color: $gray-light !default;
//** Headings small color
$headings-small-color: $gray-light !default;
//** Blockquote small color
$blockquote-small-color: $gray-light !default;
//** Blockquote font size
$blockquote-font-size: ($font-size-base * 1.25) !default;
//** Blockquote border color
$blockquote-border-color: $gray-lighter !default;
//** Page header border color
$page-header-border-color: $gray-lighter !default;
//** Width of horizontal description list titles
$dl-horizontal-offset: $component-offset-horizontal !default;
//** Horizontal line color.
$hr-border: $gray-lighter !default;

14
docs/algolia-aerial/src/stylesheet/vendors/bootstrap/mixins/_alerts.scss vendored
View file

@ -1,14 +0,0 @@
// Alerts
@mixin alert-variant($background, $border, $text-color) {
background-color: $background;
border-color: $border;
color: $text-color;
hr {
border-top-color: darken($border, 5%);
}
.alert-link {
color: darken($text-color, 10%);
}
}

11
docs/algolia-aerial/src/stylesheet/vendors/bootstrap/mixins/_background-variant.scss vendored
View file

@ -1,11 +0,0 @@
// Contextual backgrounds
// [converter] $parent hack
@mixin bg-variant($parent, $color) {
#{$parent} {
background-color: $color;
}
a#{$parent}:hover {
background-color: darken($color, 10%);
}
}

18
docs/algolia-aerial/src/stylesheet/vendors/bootstrap/mixins/_border-radius.scss vendored
View file

@ -1,18 +0,0 @@
// Single side border-radius
@mixin border-top-radius($radius) {
border-top-right-radius: $radius;
border-top-left-radius: $radius;
}
@mixin border-right-radius($radius) {
border-bottom-right-radius: $radius;
border-top-right-radius: $radius;
}
@mixin border-bottom-radius($radius) {
border-bottom-right-radius: $radius;
border-bottom-left-radius: $radius;
}
@mixin border-left-radius($radius) {
border-bottom-left-radius: $radius;
border-top-left-radius: $radius;
}

56
docs/algolia-aerial/src/stylesheet/vendors/bootstrap/mixins/_buttons.scss vendored
View file

@ -1,56 +0,0 @@
// Button variants
//
// Easily pump out default styles, as well as :hover, :focus, :active,
// and disabled options for all buttons
@mixin button-variant($color, $background, $border) {
color: $color;
background-color: $background;
border-color: $border;
&:hover,
&:focus,
&.focus,
&:active,
&.active,
.open > &.dropdown-toggle {
color: $color;
background-color: darken($background, 10%);
border-color: darken($border, 12%);
}
&:active,
&.active,
.open > &.dropdown-toggle {
background-image: none;
}
&.disabled,
&[disabled],
fieldset[disabled] & {
&,
&:hover,
&:focus,
&.focus,
&:active,
&.active {
background-color: $background;
border-color: $border;
&.btn-primary {
color: #fff;
}
}
}
.badge {
color: $background;
background-color: $color;
}
}
// Button sizes
@mixin button-size($padding-vertical, $padding-horizontal, $font-size, $line-height, $border-radius) {
padding: $padding-vertical $padding-horizontal;
font-size: $font-size;
line-height: $line-height;
border-radius: $border-radius;
}

7
docs/algolia-aerial/src/stylesheet/vendors/bootstrap/mixins/_center-block.scss vendored
View file

@ -1,7 +0,0 @@
// Center-align a block level element
@mixin center-block() {
display: block;
margin-left: auto;
margin-right: auto;
}

22
docs/algolia-aerial/src/stylesheet/vendors/bootstrap/mixins/_clearfix.scss vendored
View file

@ -1,22 +0,0 @@
// Clearfix
//
// For modern browsers
// 1. The space content is one way to avoid an Opera bug when the
// contenteditable attribute is included anywhere else in the document.
// Otherwise it causes space to appear at the top and bottom of elements
// that are clearfixed.
// 2. The use of `table` rather than `block` is only necessary if using
// `:before` to contain the top-margins of child elements.
//
// Source: http://nicolasgallagher.com/micro-clearfix-hack/
@mixin clearfix() {
&:before,
&:after {
content: " "; // 1
display: table; // 2
}
&:after {
clear: both;
}
}

88
docs/algolia-aerial/src/stylesheet/vendors/bootstrap/mixins/_forms.scss vendored
View file

@ -1,88 +0,0 @@
// Form validation states
//
// Used in forms.less to generate the form validation CSS for warnings, errors,
// and successes.
@mixin form-control-validation($text-color: #555, $border-color: #ccc, $background-color: #f5f5f5) {
// Color the label and help text
.help-block,
.control-label,
.radio,
.checkbox,
.radio-inline,
.checkbox-inline,
&.radio label,
&.checkbox label,
&.radio-inline label,
&.checkbox-inline label {
color: $text-color;
}
// Set the border and box shadow on specific inputs to match
.form-control {
border-color: $border-color;
@include box-shadow(inset 0 1px 1px rgba(0,0,0,.075)); // Redeclare so transitions work
&:focus {
border-color: darken($border-color, 10%);
$shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px lighten($border-color, 20%);
@include box-shadow($shadow);
}
}
// Set validation states also for addons
.input-group-addon {
color: $text-color;
border-color: $border-color;
background-color: $background-color;
}
// Optional feedback icon
.form-control-feedback {
color: $text-color;
}
}
// Form control focus state
//
// Generate a customized focus state and for any input with the specified color,
// which defaults to the `$input-border-focus` variable.
//
// We highly encourage you to not customize the default value, but instead use
// this to tweak colors on an as-needed basis. This aesthetic change is based on
// WebKit's default styles, but applicable to a wider range of browsers. Its
// usability and accessibility should be taken into account with any change.
//
// Example usage: change the default blue border and shadow to white for better
// contrast against a dark gray background.
@mixin form-control-focus($color: $input-border-focus) {
$color-rgba: rgba(red($color), green($color), blue($color), .6);
&:focus {
border-color: $color;
outline: 0;
@include box-shadow(inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px $color-rgba);
}
}
// Form control sizing
//
// Relative text size, padding, and border-radii changes for form controls. For
// horizontal sizing, wrap controls in the predefined grid classes. `<select>`
// element gets special love because it's special, and that's a fact!
// [converter] $parent hack
@mixin input-size($parent, $input-height, $padding-vertical, $padding-horizontal, $font-size, $line-height, $border-radius) {
#{$parent} {
height: $input-height;
padding: $padding-vertical $padding-horizontal;
font-size: $font-size;
line-height: $line-height;
border-radius: $border-radius;
}
select#{$parent} {
height: $input-height;
line-height: $input-height;
}
textarea#{$parent},
select[multiple]#{$parent} {
height: auto;
}
}

58
docs/algolia-aerial/src/stylesheet/vendors/bootstrap/mixins/_gradients.scss vendored
View file

@ -1,58 +0,0 @@
// Gradients
// Horizontal gradient, from left to right
//
// Creates two color stops, start and end, by specifying a color and position for each color stop.
// Color stops are not available in IE9 and below.
@mixin gradient-horizontal($start-color: #555, $end-color: #333, $start-percent: 0%, $end-percent: 100%) {
background-image: -webkit-linear-gradient(left, $start-color $start-percent, $end-color $end-percent); // Safari 5.1-6, Chrome 10+
background-image: -o-linear-gradient(left, $start-color $start-percent, $end-color $end-percent); // Opera 12
background-image: linear-gradient(to right, $start-color $start-percent, $end-color $end-percent); // Standard, IE10, Firefox 16+, Opera 12.10+, Safari 7+, Chrome 26+
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{ie-hex-str($start-color)}', endColorstr='#{ie-hex-str($end-color)}', GradientType=1); // IE9 and down
}
// Vertical gradient, from top to bottom
//
// Creates two color stops, start and end, by specifying a color and position for each color stop.
// Color stops are not available in IE9 and below.
@mixin gradient-vertical($start-color: #555, $end-color: #333, $start-percent: 0%, $end-percent: 100%) {
background-image: -webkit-linear-gradient(top, $start-color $start-percent, $end-color $end-percent); // Safari 5.1-6, Chrome 10+
background-image: -o-linear-gradient(top, $start-color $start-percent, $end-color $end-percent); // Opera 12
background-image: linear-gradient(to bottom, $start-color $start-percent, $end-color $end-percent); // Standard, IE10, Firefox 16+, Opera 12.10+, Safari 7+, Chrome 26+
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{ie-hex-str($start-color)}', endColorstr='#{ie-hex-str($end-color)}', GradientType=0); // IE9 and down
}
@mixin gradient-directional($start-color: #555, $end-color: #333, $deg: 45deg) {
background-repeat: repeat-x;
background-image: -webkit-linear-gradient($deg, $start-color, $end-color); // Safari 5.1-6, Chrome 10+
background-image: -o-linear-gradient($deg, $start-color, $end-color); // Opera 12
background-image: linear-gradient($deg, $start-color, $end-color); // Standard, IE10, Firefox 16+, Opera 12.10+, Safari 7+, Chrome 26+
}
@mixin gradient-horizontal-three-colors($start-color: #00b3ee, $mid-color: #7a43b6, $color-stop: 50%, $end-color: #c3325f) {
background-image: -webkit-linear-gradient(left, $start-color, $mid-color $color-stop, $end-color);
background-image: -o-linear-gradient(left, $start-color, $mid-color $color-stop, $end-color);
background-image: linear-gradient(to right, $start-color, $mid-color $color-stop, $end-color);
background-repeat: no-repeat;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{ie-hex-str($start-color)}', endColorstr='#{ie-hex-str($end-color)}', GradientType=1); // IE9 and down, gets no color-stop at all for proper fallback
}
@mixin gradient-vertical-three-colors($start-color: #00b3ee, $mid-color: #7a43b6, $color-stop: 50%, $end-color: #c3325f) {
background-image: -webkit-linear-gradient($start-color, $mid-color $color-stop, $end-color);
background-image: -o-linear-gradient($start-color, $mid-color $color-stop, $end-color);
background-image: linear-gradient($start-color, $mid-color $color-stop, $end-color);
background-repeat: no-repeat;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{ie-hex-str($start-color)}', endColorstr='#{ie-hex-str($end-color)}', GradientType=0); // IE9 and down, gets no color-stop at all for proper fallback
}
@mixin gradient-radial($inner-color: #555, $outer-color: #333) {
background-image: -webkit-radial-gradient(circle, $inner-color, $outer-color);
background-image: radial-gradient(circle, $inner-color, $outer-color);
background-repeat: no-repeat;
}
@mixin gradient-striped($color: rgba(255,255,255,.15), $angle: 45deg) {
background-image: -webkit-linear-gradient($angle, $color 25%, transparent 25%, transparent 50%, $color 50%, $color 75%, transparent 75%, transparent);
background-image: -o-linear-gradient($angle, $color 25%, transparent 25%, transparent 50%, $color 50%, $color 75%, transparent 75%, transparent);
background-image: linear-gradient($angle, $color 25%, transparent 25%, transparent 50%, $color 50%, $color 75%, transparent 75%, transparent);
}

81
docs/algolia-aerial/src/stylesheet/vendors/bootstrap/mixins/_grid-framework.scss vendored
View file

@ -1,81 +0,0 @@
// Framework grid generation
//
// Used only by Bootstrap to generate the correct number of grid classes given
// any value of `$grid-columns`.
// [converter] This is defined recursively in LESS, but Sass supports real loops
@mixin make-grid-columns($i: 1, $list: ".col-xs-#{$i}, .col-sm-#{$i}, .col-md-#{$i}, .col-lg-#{$i}") {
@for $i from (1 + 1) through $grid-columns {
$list: "#{$list}, .col-xs-#{$i}, .col-sm-#{$i}, .col-md-#{$i}, .col-lg-#{$i}";
}
#{$list} {
position: relative;
// Prevent columns from collapsing when empty
min-height: 1px;
// Inner gutter via padding
padding-left: ($grid-gutter-width / 2);
padding-right: ($grid-gutter-width / 2);
}
}
// [converter] This is defined recursively in LESS, but Sass supports real loops
@mixin float-grid-columns($class, $i: 1, $list: ".col-#{$class}-#{$i}") {
@for $i from (1 + 1) through $grid-columns {
$list: "#{$list}, .col-#{$class}-#{$i}";
}
#{$list} {
float: left;
}
}
@mixin calc-grid-column($index, $class, $type) {
@if ($type == width) and ($index > 0) {
.col-#{$class}-#{$index} {
width: percentage(($index / $grid-columns));
}
}
@if ($type == push) and ($index > 0) {
.col-#{$class}-push-#{$index} {
left: percentage(($index / $grid-columns));
}
}
@if ($type == push) and ($index == 0) {
.col-#{$class}-push-0 {
left: auto;
}
}
@if ($type == pull) and ($index > 0) {
.col-#{$class}-pull-#{$index} {
right: percentage(($index / $grid-columns));
}
}
@if ($type == pull) and ($index == 0) {
.col-#{$class}-pull-0 {
right: auto;
}
}
@if ($type == offset) {
.col-#{$class}-offset-#{$index} {
margin-left: percentage(($index / $grid-columns));
}
}
}
// [converter] This is defined recursively in LESS, but Sass supports real loops
@mixin loop-grid-columns($columns, $class, $type) {
@for $i from 0 through $columns {
@include calc-grid-column($i, $class, $type);
}
}
// Create grid for specific class
@mixin make-grid($class) {
@include float-grid-columns($class);
@include loop-grid-columns($grid-columns, $class, width);
@include loop-grid-columns($grid-columns, $class, pull);
@include loop-grid-columns($grid-columns, $class, push);
@include loop-grid-columns($grid-columns, $class, offset);
}

122
docs/algolia-aerial/src/stylesheet/vendors/bootstrap/mixins/_grid.scss vendored
View file

@ -1,122 +0,0 @@
// Grid system
//
// Generate semantic grid columns with these mixins.
// Centered container element
@mixin container-fixed($gutter: $grid-gutter-width) {
margin-right: auto;
margin-left: auto;
padding-left: ($gutter / 2);
padding-right: ($gutter / 2);
@include clearfix;
}
// Creates a wrapper for a series of columns
@mixin make-row($gutter: $grid-gutter-width) {
margin-left: ($gutter / -2);
margin-right: ($gutter / -2);
@include clearfix;
}
// Generate the extra small columns
@mixin make-xs-column($columns, $gutter: $grid-gutter-width) {
position: relative;
float: left;
width: percentage(($columns / $grid-columns));
min-height: 1px;
padding-left: ($gutter / 2);
padding-right: ($gutter / 2);
}
@mixin make-xs-column-offset($columns) {
margin-left: percentage(($columns / $grid-columns));
}
@mixin make-xs-column-push($columns) {
left: percentage(($columns / $grid-columns));
}
@mixin make-xs-column-pull($columns) {
right: percentage(($columns / $grid-columns));
}
// Generate the small columns
@mixin make-sm-column($columns, $gutter: $grid-gutter-width) {
position: relative;
min-height: 1px;
padding-left: ($gutter / 2);
padding-right: ($gutter / 2);
@media (min-width: $screen-sm-min) {
float: left;
width: percentage(($columns / $grid-columns));
}
}
@mixin make-sm-column-offset($columns) {
@media (min-width: $screen-sm-min) {
margin-left: percentage(($columns / $grid-columns));
}
}
@mixin make-sm-column-push($columns) {
@media (min-width: $screen-sm-min) {
left: percentage(($columns / $grid-columns));
}
}
@mixin make-sm-column-pull($columns) {
@media (min-width: $screen-sm-min) {
right: percentage(($columns / $grid-columns));
}
}
// Generate the medium columns
@mixin make-md-column($columns, $gutter: $grid-gutter-width) {
position: relative;
min-height: 1px;
padding-left: ($gutter / 2);
padding-right: ($gutter / 2);
@media (min-width: $screen-md-min) {
float: left;
width: percentage(($columns / $grid-columns));
}
}
@mixin make-md-column-offset($columns) {
@media (min-width: $screen-md-min) {
margin-left: percentage(($columns / $grid-columns));
}
}
@mixin make-md-column-push($columns) {
@media (min-width: $screen-md-min) {
left: percentage(($columns / $grid-columns));
}
}
@mixin make-md-column-pull($columns) {
@media (min-width: $screen-md-min) {
right: percentage(($columns / $grid-columns));
}
}
// Generate the large columns
@mixin make-lg-column($columns, $gutter: $grid-gutter-width) {
position: relative;
min-height: 1px;
padding-left: ($gutter / 2);
padding-right: ($gutter / 2);
@media (min-width: $screen-lg-min) {
float: left;
width: percentage(($columns / $grid-columns));
}
}
@mixin make-lg-column-offset($columns) {
@media (min-width: $screen-lg-min) {
margin-left: percentage(($columns / $grid-columns));
}
}
@mixin make-lg-column-push($columns) {
@media (min-width: $screen-lg-min) {
left: percentage(($columns / $grid-columns));
}
}
@mixin make-lg-column-pull($columns) {
@media (min-width: $screen-lg-min) {
right: percentage(($columns / $grid-columns));
}
}

21
docs/algolia-aerial/src/stylesheet/vendors/bootstrap/mixins/_hide-text.scss vendored
View file

@ -1,21 +0,0 @@
// CSS image replacement
//
// Heads up! v3 launched with with only `.hide-text()`, but per our pattern for
// mixins being reused as classes with the same name, this doesn't hold up. As
// of v3.0.1 we have added `.text-hide()` and deprecated `.hide-text()`.
//
// Source: https://github.com/h5bp/html5-boilerplate/commit/aa0396eae757
// Deprecated as of v3.0.1 (will be removed in v4)
@mixin hide-text() {
font: #{0/0} a;
color: transparent;
text-shadow: none;
background-color: transparent;
border: 0;
}
// New mixin to use as of v3.0.1
@mixin text-hide() {
@include hide-text;
}

33
docs/algolia-aerial/src/stylesheet/vendors/bootstrap/mixins/_image.scss vendored
View file

@ -1,33 +0,0 @@
// Image Mixins
// - Responsive image
// - Retina image
// Responsive image
//
// Keep images from scaling beyond the width of their parents.
@mixin img-responsive($display: block) {
display: $display;
max-width: 100%; // Part 1: Set a maximum relative to the parent
height: auto; // Part 2: Scale the height according to the width, otherwise you get stretching
}
// Retina image
//
// Short retina mixin for setting background-image and -size. Note that the
// spelling of `min--moz-device-pixel-ratio` is intentional.
@mixin img-retina($file-1x, $file-2x, $width-1x, $height-1x) {
background-image: url(if($bootstrap-sass-asset-helper, twbs-image-path("#{$file-1x}"), "#{$file-1x}"));
@media
only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and ( min--moz-device-pixel-ratio: 2),
only screen and ( -o-min-device-pixel-ratio: 2/1),
only screen and ( min-device-pixel-ratio: 2),
only screen and ( min-resolution: 192dpi),
only screen and ( min-resolution: 2dppx) {
background-image: url(if($bootstrap-sass-asset-helper, twbs-image-path("#{$file-2x}"), "#{$file-2x}"));
background-size: $width-1x $height-1x;
}
}

12
docs/algolia-aerial/src/stylesheet/vendors/bootstrap/mixins/_labels.scss vendored
View file

@ -1,12 +0,0 @@
// Labels
@mixin label-variant($color) {
background-color: $color;
&[href] {
&:hover,
&:focus {
background-color: darken($color, 10%);
}
}
}

31
docs/algolia-aerial/src/stylesheet/vendors/bootstrap/mixins/_list-group.scss vendored
View file

@ -1,31 +0,0 @@
// List Groups
@mixin list-group-item-variant($state, $background, $color) {
.list-group-item-#{$state} {
color: $color;
background-color: $background;
// [converter] extracted a& to a.list-group-item-#{$state}
}
a.list-group-item-#{$state} {
color: $color;
.list-group-item-heading {
color: inherit;
}
&:hover,
&:focus {
color: $color;
background-color: darken($background, 5%);
}
&.active,
&.active:hover,
&.active:focus {
color: #fff;
background-color: $color;
border-color: $color;
}
}
}

10
docs/algolia-aerial/src/stylesheet/vendors/bootstrap/mixins/_nav-divider.scss vendored
View file

@ -1,10 +0,0 @@
// Horizontal dividers
//
// Dividers (basically an hr) within dropdowns and nav lists
@mixin nav-divider($color: #e5e5e5) {
height: 1px;
margin: (($line-height-computed / 2) - 1) 0;
overflow: hidden;
background-color: $color;
}

9
docs/algolia-aerial/src/stylesheet/vendors/bootstrap/mixins/_nav-vertical-align.scss vendored
View file

@ -1,9 +0,0 @@
// Navbar vertical align
//
// Vertically center elements in the navbar.
// Example: an element has a height of 30px, so write out `.navbar-vertical-align(30px);` to calculate the appropriate top margin.
@mixin navbar-vertical-align($element-height) {
margin-top: (($navbar-height - $element-height) / 2);
margin-bottom: (($navbar-height - $element-height) / 2);
}

8
docs/algolia-aerial/src/stylesheet/vendors/bootstrap/mixins/_opacity.scss vendored
View file

@ -1,8 +0,0 @@
// Opacity
@mixin opacity($opacity) {
opacity: $opacity;
// IE8 filter
$opacity-ie: ($opacity * 100);
filter: #{alpha(opacity=$opacity-ie)};
}

23
docs/algolia-aerial/src/stylesheet/vendors/bootstrap/mixins/_pagination.scss vendored
View file

@ -1,23 +0,0 @@
// Pagination
@mixin pagination-size($padding-vertical, $padding-horizontal, $font-size, $border-radius) {
> li {
> a,
> span {
padding: $padding-vertical $padding-horizontal;
font-size: $font-size;
}
&:first-child {
> a,
> span {
@include border-left-radius($border-radius);
}
}
&:last-child {
> a,
> span {
@include border-right-radius($border-radius);
}
}
}
}

24
docs/algolia-aerial/src/stylesheet/vendors/bootstrap/mixins/_panels.scss vendored
View file

@ -1,24 +0,0 @@
// Panels
@mixin panel-variant($border, $heading-text-color, $heading-bg-color, $heading-border) {
border-color: $border;
& > .panel-heading {
color: $heading-text-color;
background-color: $heading-bg-color;
border-color: $heading-border;
+ .panel-collapse > .panel-body {
border-top-color: $border;
}
.badge {
color: $heading-bg-color;
background-color: $heading-text-color;
}
}
& > .panel-footer {
+ .panel-collapse > .panel-body {
border-bottom-color: $border;
}
}
}

10
docs/algolia-aerial/src/stylesheet/vendors/bootstrap/mixins/_progress-bar.scss vendored
View file

@ -1,10 +0,0 @@
// Progress bars
@mixin progress-bar-variant($color) {
background-color: $color;
// Deprecated parent class requirement as of v3.2.0
.progress-striped & {
@include gradient-striped;
}
}

8
docs/algolia-aerial/src/stylesheet/vendors/bootstrap/mixins/_reset-filter.scss vendored
View file

@ -1,8 +0,0 @@
// Reset filters for IE
//
// When you need to remove a gradient background, do not forget to use this to reset
// the IE filter for IE9 and below.
@mixin reset-filter() {
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
}

6
docs/algolia-aerial/src/stylesheet/vendors/bootstrap/mixins/_resize.scss vendored
View file

@ -1,6 +0,0 @@
// Resize anything
@mixin resizable($direction) {
resize: $direction; // Options: horizontal, vertical, both
overflow: auto; // Per CSS3 UI, `resize` only applies when `overflow` isn't `visible`
}

21
docs/algolia-aerial/src/stylesheet/vendors/bootstrap/mixins/_responsive-visibility.scss vendored
View file

@ -1,21 +0,0 @@
// Responsive utilities
//
// More easily include all the states for responsive-utilities.less.
// [converter] $parent hack
@mixin responsive-visibility($parent) {
#{$parent} {
display: block !important;
}
table#{$parent} { display: table; }
tr#{$parent} { display: table-row !important; }
th#{$parent},
td#{$parent} { display: table-cell !important; }
}
// [converter] $parent hack
@mixin responsive-invisibility($parent) {
#{$parent} {
display: none !important;
}
}

10
docs/algolia-aerial/src/stylesheet/vendors/bootstrap/mixins/_size.scss vendored
View file

@ -1,10 +0,0 @@
// Sizing shortcuts
@mixin size($width, $height) {
width: $width;
height: $height;
}
@mixin square($size) {
@include size($size, $size);
}

9
docs/algolia-aerial/src/stylesheet/vendors/bootstrap/mixins/_tab-focus.scss vendored
View file

@ -1,9 +0,0 @@
// WebKit-style focus
@mixin tab-focus() {
// Default
outline: thin dotted;
// WebKit
outline: 5px auto -webkit-focus-ring-color;
outline-offset: -2px;
}

28
docs/algolia-aerial/src/stylesheet/vendors/bootstrap/mixins/_table-row.scss vendored
View file

@ -1,28 +0,0 @@
// Tables
@mixin table-row-variant($state, $background) {
// Exact selectors below required to override `.table-striped` and prevent
// inheritance to nested tables.
.table > thead > tr,
.table > tbody > tr,
.table > tfoot > tr {
> td.#{$state},
> th.#{$state},
&.#{$state} > td,
&.#{$state} > th {
background-color: $background;
}
}
// Hover states for `.table-hover`
// Note: this is not available for cells or rows within `thead` or `tfoot`.
.table-hover > tbody > tr {
> td.#{$state}:hover,
> th.#{$state}:hover,
&.#{$state}:hover > td,
&:hover > .#{$state},
&.#{$state}:hover > th {
background-color: darken($background, 5%);
}
}
}

11
docs/algolia-aerial/src/stylesheet/vendors/bootstrap/mixins/_text-emphasis.scss vendored
View file

@ -1,11 +0,0 @@
// Typography
// [converter] $parent hack
@mixin text-emphasis-variant($parent, $color) {
#{$parent} {
color: $color;
}
a#{$parent}:hover {
color: darken($color, 10%);
}
}

8
docs/algolia-aerial/src/stylesheet/vendors/bootstrap/mixins/_text-overflow.scss vendored
View file

@ -1,8 +0,0 @@
// Text overflow
// Requires inline-block or block for proper styling
@mixin text-overflow() {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}

222
docs/algolia-aerial/src/stylesheet/vendors/bootstrap/mixins/_vendor-prefixes.scss vendored
View file

@ -1,222 +0,0 @@
// Vendor Prefixes
//
// All vendor mixins are deprecated as of v3.2.0 due to the introduction of
// Autoprefixer in our Gruntfile. They will be removed in v4.
// - Animations
// - Backface visibility
// - Box shadow
// - Box sizing
// - Content columns
// - Hyphens
// - Placeholder text
// - Transformations
// - Transitions
// - User Select
// Animations
@mixin animation($animation) {
-webkit-animation: $animation;
-o-animation: $animation;
animation: $animation;
}
@mixin animation-name($name) {
-webkit-animation-name: $name;
animation-name: $name;
}
@mixin animation-duration($duration) {
-webkit-animation-duration: $duration;
animation-duration: $duration;
}
@mixin animation-timing-function($timing-function) {
-webkit-animation-timing-function: $timing-function;
animation-timing-function: $timing-function;
}
@mixin animation-delay($delay) {
-webkit-animation-delay: $delay;
animation-delay: $delay;
}
@mixin animation-iteration-count($iteration-count) {
-webkit-animation-iteration-count: $iteration-count;
animation-iteration-count: $iteration-count;
}
@mixin animation-direction($direction) {
-webkit-animation-direction: $direction;
animation-direction: $direction;
}
@mixin animation-fill-mode($fill-mode) {
-webkit-animation-fill-mode: $fill-mode;
animation-fill-mode: $fill-mode;
}
// Backface visibility
// Prevent browsers from flickering when using CSS 3D transforms.
// Default value is `visible`, but can be changed to `hidden`
@mixin backface-visibility($visibility){
-webkit-backface-visibility: $visibility;
-moz-backface-visibility: $visibility;
backface-visibility: $visibility;
}
// Drop shadows
//
// Note: Deprecated `.box-shadow()` as of v3.1.0 since all of Bootstrap's
// supported browsers that have box shadow capabilities now support it.
@mixin box-shadow($shadow...) {
-webkit-box-shadow: $shadow; // iOS <4.3 & Android <4.1
box-shadow: $shadow;
}
// Box sizing
@mixin box-sizing($boxmodel) {
-webkit-box-sizing: $boxmodel;
-moz-box-sizing: $boxmodel;
box-sizing: $boxmodel;
}
// CSS3 Content Columns
@mixin content-columns($column-count, $column-gap: $grid-gutter-width) {
-webkit-column-count: $column-count;
-moz-column-count: $column-count;
column-count: $column-count;
-webkit-column-gap: $column-gap;
-moz-column-gap: $column-gap;
column-gap: $column-gap;
}
// Optional hyphenation
@mixin hyphens($mode: auto) {
word-wrap: break-word;
-webkit-hyphens: $mode;
-moz-hyphens: $mode;
-ms-hyphens: $mode; // IE10+
-o-hyphens: $mode;
hyphens: $mode;
}
// Placeholder text
@mixin placeholder($color: $input-color-placeholder) {
// Firefox
&::-moz-placeholder {
color: $color;
opacity: 1; // See https://github.com/twbs/bootstrap/pull/11526
}
&:-ms-input-placeholder { color: $color; } // Internet Explorer 10+
&::-webkit-input-placeholder { color: $color; } // Safari and Chrome
}
// Transformations
@mixin scale($ratio...) {
-webkit-transform: scale($ratio);
-ms-transform: scale($ratio); // IE9 only
-o-transform: scale($ratio);
transform: scale($ratio);
}
@mixin scaleX($ratio) {
-webkit-transform: scaleX($ratio);
-ms-transform: scaleX($ratio); // IE9 only
-o-transform: scaleX($ratio);
transform: scaleX($ratio);
}
@mixin scaleY($ratio) {
-webkit-transform: scaleY($ratio);
-ms-transform: scaleY($ratio); // IE9 only
-o-transform: scaleY($ratio);
transform: scaleY($ratio);
}
@mixin skew($x, $y) {
-webkit-transform: skewX($x) skewY($y);
-ms-transform: skewX($x) skewY($y); // See https://github.com/twbs/bootstrap/issues/4885; IE9+
-o-transform: skewX($x) skewY($y);
transform: skewX($x) skewY($y);
}
@mixin translate($x, $y) {
-webkit-transform: translate($x, $y);
-ms-transform: translate($x, $y); // IE9 only
-o-transform: translate($x, $y);
transform: translate($x, $y);
}
@mixin translate3d($x, $y, $z) {
-webkit-transform: translate3d($x, $y, $z);
transform: translate3d($x, $y, $z);
}
@mixin rotate($degrees) {
-webkit-transform: rotate($degrees);
-ms-transform: rotate($degrees); // IE9 only
-o-transform: rotate($degrees);
transform: rotate($degrees);
}
@mixin rotateX($degrees) {
-webkit-transform: rotateX($degrees);
-ms-transform: rotateX($degrees); // IE9 only
-o-transform: rotateX($degrees);
transform: rotateX($degrees);
}
@mixin rotateY($degrees) {
-webkit-transform: rotateY($degrees);
-ms-transform: rotateY($degrees); // IE9 only
-o-transform: rotateY($degrees);
transform: rotateY($degrees);
}
@mixin perspective($perspective) {
-webkit-perspective: $perspective;
-moz-perspective: $perspective;
perspective: $perspective;
}
@mixin perspective-origin($perspective) {
-webkit-perspective-origin: $perspective;
-moz-perspective-origin: $perspective;
perspective-origin: $perspective;
}
@mixin transform-origin($origin) {
-webkit-transform-origin: $origin;
-moz-transform-origin: $origin;
-ms-transform-origin: $origin; // IE9 only
transform-origin: $origin;
}
// Transitions
@mixin transition($transition...) {
-webkit-transition: $transition;
-o-transition: $transition;
transition: $transition;
}
@mixin transition-property($transition-property...) {
-webkit-transition-property: $transition-property;
transition-property: $transition-property;
}
@mixin transition-delay($transition-delay) {
-webkit-transition-delay: $transition-delay;
transition-delay: $transition-delay;
}
@mixin transition-duration($transition-duration...) {
-webkit-transition-duration: $transition-duration;
transition-duration: $transition-duration;
}
@mixin transition-timing-function($timing-function) {
-webkit-transition-timing-function: $timing-function;
transition-timing-function: $timing-function;
}
@mixin transition-transform($transition...) {
-webkit-transition: -webkit-transform $transition;
-moz-transition: -moz-transform $transition;
-o-transition: -o-transform $transition;
transition: transform $transition;
}
// User select
// For selecting text on the page
@mixin user-select($select) {
-webkit-user-select: $select;
-moz-user-select: $select;
-ms-user-select: $select; // IE10+
user-select: $select;
}

59
docs/algolia-aerial/webpack.config.js
View file

@ -1,59 +0,0 @@
const path = require('path');
const ExtractTextPlugin = require('extract-text-webpack-plugin');
const WebpackAutoInject = require('webpack-auto-inject-version');
module.exports = {
entry: './src/stylesheet/aerial.sass',
output: {
path: path.join(__dirname, './dist/'),
filename: 'aerial-source.css'
},
module: {
rules: [
{
test: /\.sass$/,
use: ExtractTextPlugin.extract({
fallback: 'style-loader',
use: ['css-loader','sass-loader']
})
},
{
test: /\.(ttf|eot|woff|woff2|svg)$/,
loader: 'file-loader',
options: {
name: 'fonts/[name].[ext]',
}
}
]
},
plugins: [
new ExtractTextPlugin('aerial-source.css'), // css file will override generated js file
new WebpackAutoInject({
NAME: 'AIV custom name',
SHORT: 'CUSTOM',
SILENT: false,
PACKAGE_JSON_PATH: './package.json',
components: {
AutoIncreaseVersion: false,
InjectAsComment: true,
InjectByTag: true
},
componentsOptions: {
AutoIncreaseVersion: {
runInWatchMode: false // it will increase version with every single build!
},
InjectAsComment: {
tag: 'Version: {version} - {date}',
dateFormat: 'h:MM:ss TT'
},
InjectByTag: {
fileRegex: /\.+/,
dateFormat: 'h:MM:ss TT'
}
},
LOGS_TEXT: {
AIS_START: 'DEMO AIV started'
}
})
]
}

9
docs/algolia-frontend-components/.babelrc
View file

@ -1,9 +0,0 @@
{
"presets": [
["env", {
"targets": {
"browsers": ["last 2 versions", "safari >= 7"]
}
}]
]
}

2
docs/algolia-frontend-components/.npmignore
View file

@ -1,2 +0,0 @@
/node_modules/
/components/**/*.data.json

28
docs/algolia-frontend-components/README.md
View file

@ -1,28 +0,0 @@
## Algolia front end components
This project was created so that we can more easily update our components across all of our websites and avoid issues with consistency.
### Why this approach
We have a lot of different websites running, a lot of community projects where our components are functionaly and design wise the same, yet we see offsets in CSS and changes to HTML structure which prove hard to maintain. There is no single source of truth for our components and thus we are seeing various different implementations and styles. In the future we want to avoid this and move faster. Changing a header on all of our websites should not take a week's time, but it should be as simple as pulling the components repository, rebuilding the components and re-deploying the websites. No manual cleaning of old CSS, copy/pasting html etc.
### How does it work?
The package uses javascript to generate custom content inside your component. All you need to specify is the data for that package to render and include it in your project.
Each component has a `<component>.example.json` file which you can simply rename to `<component>.data.json` to have it use the json file.
### Usage
Depending on your build process you can have a few different use cases.
### Build the components
Depending on the build tool, there a few use cases of how you can import components.
## @TODO write best practice for different build steps

47
docs/algolia-frontend-components/build/assets.js
View file

@ -1,47 +0,0 @@
const fs = require('fs');
const path = require('path');
const chalk = require('chalk');
const IMG_DIR = path.resolve(__dirname, './../images');
let assets = {}
if(!process.browser && !process.env.webpack) {
assets = {
algoliaLogo : fs.readFileSync(IMG_DIR + '/algolia-logo-darkbg.svg', 'utf8').toString(),
communityLogo : fs.readFileSync(IMG_DIR + '/algolia-community-dark.svg', 'utf8').toString(),
searchIcon : fs.readFileSync(IMG_DIR + '/search-icon.svg', 'utf8').toString(),
searchCloseIcon : fs.readFileSync(IMG_DIR + '/search-close-icon.svg', 'utf8').toString(),
iconSeparator : fs.readFileSync(IMG_DIR + '/icon-separator.svg', 'utf8').toString(),
InstantSearchReact : fs.readFileSync(IMG_DIR + '/react-instantsearch.svg', 'utf8').toString(),
instantSearchAndroid : fs.readFileSync(IMG_DIR + '/instantsearch-android.svg', 'utf8').toString(),
shopify : fs.readFileSync(IMG_DIR + '/shopify.svg', 'utf8').toString(),
wordpress : fs.readFileSync(IMG_DIR + '/wordpress.svg', 'utf8').toString()
}
} else if(process.env.webpack){
assets = {
algoliaLogo : fs.readFileSync(IMG_DIR + '/algolia-logo-darkbg.svg', 'utf8').toString(),
communityLogo : fs.readFileSync(IMG_DIR + '/algolia-community-dark.svg', 'utf8').toString(),
searchIcon : fs.readFileSync(IMG_DIR + '/search-icon.svg', 'utf8').toString(),
searchCloseIcon : fs.readFileSync(IMG_DIR + '/search-close-icon.svg', 'utf8').toString(),
iconSeparator : fs.readFileSync(IMG_DIR + '/icon-separator.svg', 'utf8').toString(),
InstantSearchReact : fs.readFileSync(IMG_DIR + '/react-instantsearch.svg', 'utf8').toString(),
instantSearchAndroid : fs.readFileSync(IMG_DIR + '/instantsearch-android.svg', 'utf8').toString(),
shopify : fs.readFileSync(IMG_DIR + '/shopify.svg', 'utf8').toString(),
wordpress : fs.readFileSync(IMG_DIR + '/wordpress.svg', 'utf8').toString()
}
} else if(process.env.NODE) {
assets = {
algoliaLogo : fs.readFileSync(IMG_DIR + '/algolia-logo-darkbg.svg', 'utf8').toString(),
communityLogo : fs.readFileSync(IMG_DIR + '/algolia-community-dark.svg', 'utf8').toString(),
searchIcon : fs.readFileSync(IMG_DIR + '/search-icon.svg', 'utf8').toString(),
searchCloseIcon : fs.readFileSync(IMG_DIR + '/search-close-icon.svg', 'utf8').toString(),
iconSeparator : fs.readFileSync(IMG_DIR + '/icon-separator.svg', 'utf8').toString(),
InstantSearchReact : fs.readFileSync(IMG_DIR + '/react-instantsearch.svg', 'utf8').toString(),
instantSearchAndroid : fs.readFileSync(IMG_DIR + '/instantsearch-android.svg', 'utf8').toString(),
shopify : fs.readFileSync(IMG_DIR + '/shopify.svg', 'utf8').toString(),
wordpress : fs.readFileSync(IMG_DIR + '/wordpress.svg', 'utf8').toString()
}
}
module.exports = assets;

146
docs/algolia-frontend-components/build/build.js
View file

@ -1,146 +0,0 @@
const fs = require('fs');
const path = require('path');
const glob = require('glob');
const chalk = require('chalk');
const ProgressBar = require('progress');
const sass = require('node-sass');
const babel = require('babel-core');
const assets = require('./assets');
const log = console.log;
const COMPONENT_DIR = path.resolve(__dirname, './../components');
const IMG_DIR = path.resolve(__dirname, './../images');
const DIST_DIR = path.resolve(__dirname, './../dist/');
const jshtmlglob = COMPONENT_DIR + "/**/*.html.js";
const cssglob = COMPONENT_DIR + "/**/*.scss";
const jsglob = COMPONENT_DIR + "/**/*.js";
const scssResolvePath = path.resolve(__dirname, '/stylesheets');
const outputMode = [...process.argv].indexOf('--erb') > 0 ? ".erb" : ".html";
const bar = new ProgressBar(`${chalk.green('building')} [:bar]`, { total: 40 });
const timer = setInterval(function() {
bar.tick();
if (bar.complete) {
clearInterval(timer);
}
}, 100);
const buildAssets = new Promise((resolve, reject) => {
fs.mkdir(DIST_DIR, function(e) {
if (!e || (e && e.code === 'EEXIST')) {} else {
console.log(e);
}
});
const jsPromise = glob(jsglob, (err, files) => {
const fl = files.length - 1;
files.forEach((file, i) => {
if (file.indexOf('.html.js') > 0) {
return
}
const componentName = file.split('/')
.filter((item, i, arr) => i === arr.length - 1)
.map(name => {
// Write filename with '_' prefix
// for middleman partials use case
return '_' + name.split('.')[0];
})[0];
const fileName = DIST_DIR + '/' + componentName + '.js';
let jsCode = fs.readFileSync(file, "utf8");
const removeExports = /(^module\.exports.*)/gm
jsCode = jsCode.replace(removeExports, "");
const transpiled = babel.transform(jsCode, {
env: "production",
presets: ["es2015"]
});
fs.writeFileSync(fileName, transpiled.code);
});
});
const htmlPromise = new Promise((resolve, reject) => {
glob(jshtmlglob, (err, files) => {
const fl = files.length - 1;
log(chalk.white('Start building algolia components'));
log(chalk.white('Output to ', chalk.bold.underline(DIST_DIR)));
files.forEach((file, i) => {
// Get component name from /path/to/file
const componentName = file.split('/')
.filter((item, i, arr) => i === arr.length - 1)
.map(name => {
// Write filename with '_' prefix
// for middleman partials use case
return '_' + name.split('.')[0];
})[0];
log(chalk.white('Building partial ->'), chalk.bold(componentName));
// Filename with path to dist dir
const fileName = DIST_DIR + '/' + componentName + outputMode;
// Require component
const component = require(file);
// Call it's render function
const html = component({}, assets);
// Write file
fs.writeFileSync(fileName, html);
if (i === fl) {
resolve({ message: 'Finished html assets' });
}
});
});
});
const cssPromise = new Promise((resolve, reject) => {
glob(cssglob, (err, files) => {
const fl = files.length - 1;
files.forEach((file, i) => {
const componentName = file.split('/')
.filter((item, i, arr) => i === arr.length - 1)
.map(name => {
// Write filename with '_' prefix
// for middleman partials use case
return '_' + name.split('.')[0];
})[0];
const cssContent = fs.readFileSync(file, "utf8");
const result = sass.render({
file: file,
includePaths: [scssResolvePath]
}, (err, result) => {
if (err) { reject(err) }
fs.writeFileSync(DIST_DIR + '/' + componentName + '.css', result.css.toString());
});
if (i === fl) {
resolve({ message: 'Finished CSS assets' });
}
})
});
});
Promise.all([htmlPromise, cssPromise]).then((data) => {
resolve('completed');
});
});
buildAssets.then(data => {
bar.complete = true;
})
module.exports = buildAssets;

15
docs/algolia-frontend-components/build/development.js
View file

@ -1,15 +0,0 @@
const fs = require('fs');
const path = require('path');
const glob = require('glob');
const buildAssets = require('./build.js');
const COMPONENT_DIR = path.resolve(__dirname, './../components');
const FILE_GLOB = COMPONENT_DIR + "/**/*";
glob(FILE_GLOB, (err, files) => {
files.forEach(file => {
fs.watch(file, (eventType, filename) => {
buildAssets();
});
})
});

55
docs/algolia-frontend-components/build/index.html
View file

@ -1,55 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.css" />
<script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.js"></script>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
${require('./../components/communityHeader/communityHeader.html.js')({
menu:{
community: {
"dropdownItems": [
{
"name": "React InstantSearch",
"url": "https://community.algolia.com/instantsearch.js/react",
"logo": "wordpress",
"backgroundColor": "linear-gradient(to bottom left, #2C5EE2 0%, #17204F 150%)"
},
{
"name": "instantsearch.js",
"url": "https://community.algolia.com/instantsearch.js/",
"logo": "https://community.algolia.com/assets/images/logo-is.svg",
"backgroundColor": "#385D72"
},{
"name": "Shopify",
"url": "https://community.algolia.com/shopify",
"logo": "shopify",
"backgroundColor": "linear-gradient(to bottom left, #29D98D, #03A8F6 450%)"
},
{
"name": "Helper.js",
"url": "https://community.algolia.com/algoliasearch-helper-js/",
"logo": "https://community.algolia.com/assets/images/logo-helper.svg",
"backgroundColor": "#FDBD57"
},{
"name": "wordpress",
"url": "https://community.algolia.com/wordpress",
"logo": "https://community.algolia.com/wordpress/img/icons/wp-icon.svg",
"backgroundColor": "linear-gradient(to bottom right, #4041B2, #516ED1)"
},
]
}
},
sideMenu:[
{ name: "Test", dropdownItems: [ {name: "test" },{name: "test2" }]},
{ name: "Test", dropdownItems: [ {name: "test" },{name: "test2" }]},
{ name: "Github", image:" <img src='https://assets-cdn.github.com/images/modules/logos_page/GitHub-Mark.png'/>", dropdownItems: [ {name: "Magento 1"}, {name: "Magento2"}]}
]
}, assets)}
</body>
</html>

12
docs/algolia-frontend-components/build/preview.js
View file

@ -1,12 +0,0 @@
import base from './../stylesheets/_base.scss';
import css from './../components/communityHeader/communityHeader.scss';
import communityHeader from './../components/communityHeader/communityHeader';
window.addEventListener('load', () => {
var header = new communityHeader({
apiKey: '52641df1ce4919ba42eb84595f4825c7',
indexName: 'wordpress_algolia',
inputSelector: '#searchbox'
});
});

81
docs/algolia-frontend-components/build/serve.js
View file

@ -1,81 +0,0 @@
const webpack = require('webpack');
const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const server = require('webpack-dev-server');
process.env.webpack = true;
let a = require('./../build/assets');
const plugins = [
new webpack.HotModuleReplacementPlugin(),
new HtmlWebpackPlugin({
template: path.join(process.cwd(), '/build/index.html'),
inject: true,
}),
new webpack.DefinePlugin({
'assets': JSON.stringify(a)
}),
]
const config = {
entry: [
path.join(process.cwd(),'build/preview.js')
],
output: {
path: path.resolve(process.cwd(), '/'),
publicPath: '/',
filename: '[name].js'
},
module: {
rules: [
{
test: /\.(js)$/,
exclude: [
/node_modules/
],
loader: 'babel-loader',
},
{
test: /\.svg$/,
use: 'raw-loader'
},
{
test: /\.scss$/,
use: [ {loader:'style-loader'}, {loader: 'css-loader'}, {loader:'sass-loader'}]
},
{
test: /\.html$/,
use: [
{loader: 'html-loader', options: { interpolate: true}}
]
},
{
test: /\.json$/,
loader: 'json-loader',
}
]
},
resolve: {
modules: ['.', 'node_modules', process.cwd()],
extensions: [
'.js',
'.scss',
'.svg'
]
},
plugins: plugins,
devServer: {
historyApiFallback: true,
hot: true,
inline: true
},
}
module.exports = config;

69
docs/algolia-frontend-components/components/communityHeader/communityHeader.example.json
View file

@ -1,69 +0,0 @@
{
"menu": {
"community": {
"style": "widelist",
"view": "integrations",
"label": "",
"caret": "",
"dropdownItems": [{
"name": "React InstantSearch",
"url": "https://community.algolia.com/instantsearch.js/react",
"logo": "InstantSearchReact",
"backgroundColor": "linear-gradient(to bottom left, #2C5EE2 0%, #17204F 150%)"
}, {
"name": "Wordpress",
"url": "https://community.algolia.com/wordpress",
"logo": "https://community.algolia.com/wordpress/img/icons/wp-icon.svg",
"backgroundColor": "linear-gradient(to bottom right, #4041B2, #516ED1)"
}, {
"name": "Autocomplete.js",
"url": "https://github.com/algolia/autocomplete.js",
"logo": "https://community.algolia.com/assets/images/illus-autocomplete.svg",
"backgroundColor": "#00587f"
}, {
"name": "instantsearch.js",
"url": "https://community.algolia.com/instantsearch.js/",
"logo": "https://community.algolia.com/assets/images/logo-is.svg",
"backgroundColor": "#385D72"
}, {
"name": "Helper.js",
"url": "https://community.algolia.com/algoliasearch-helper-js/",
"logo": "https://community.algolia.com/assets/images/logo-helper.svg",
"backgroundColor": "#FDBD57"
}, {
"name": "Magento",
"url": "https://community.algolia.com/magento/",
"logo": "https://res.cloudinary.com/hilnmyskv/image/upload/v1477318624/magento-icon-white.svg",
"backgroundColor": "linear-gradient(to bottom right, #ed9259, #e76d22)"
}]
},
"project": {
"view": "links",
"label": "Shopify plugin",
"logo": "",
"caret": "",
"dropdownItems": []
}
},
"mobileMenu": [{
"name": "Install",
"url": "",
"image": "",
"target": ""
}],
"sideMenu": [{
"name": "Install",
"url": "https://community.algolia.com/shopify/try.html",
"image": "",
"target": "",
"dropdownItems": []
}],
"docSearch": {
"input_selector": "searchbox",
"input_selector_placeholder": "Search the docs",
"input_mobile_selector": "mobile-searchbox",
"input_search_icon": "<img src='/images/icons/search-icon.svg'/>",
"input_cancel_icon": "<img src='/images/icons/cancel-icon.svg'/>",
"input_open_on_init": false
}
}

228
docs/algolia-frontend-components/components/communityHeader/communityHeader.html.js
View file

@ -1,228 +0,0 @@
let data = {};
const merge = require('deepmerge');
let assets = require('./../../build/assets');
try {
data = require('./communityHeader.data.json');
} catch (e) {
data = require('./communityHeader.example.json');
}
/**
* Render item template
* @param {[type]} t [template item]
* @return {[String]} [rendered template]
*/
const renderDropdownItem = (done, t, assets) => {
const isSvgTile = assets[t.logo] ? assets[t.logo] : false;
return done += `
<li>
<div class="dropdown-item">
<a href="${t.url || "#"}" ${t.target ? `target=${t.target}`: ""}>
${isSvgTile ? `<span class="item-icon" style="background: ${t.backgroundColor}">${isSvgTile}</svg></span>` : `<span class="item-icon" style="background: ${t.backgroundColor}"><img src="${t.logo || ""}" alt="${t.name || ""}"/></span>`}
<h4>${t.name}</h4>
</a>
</div>
</li>`;
}
const renderDropdownList = (data, assets) => {
let entireList = "";
Object.keys(data).forEach(list => {
const listItem = data[list];
const listArray = listItem.dropdownItems;
let listString = `
<div class="algc-dropdownroot__section">
<div class="algc-dropdownroot__content" data-dropdown-content="${listItem.view.toLowerCase()}">
<ul class="algc-dropdownroot__${listItem.style || 'widelist'}">`;
listString += listArray.reduce((prev, next, i) => renderDropdownItem(prev, next, assets), "");
listString +=
`</ul>
<div class="algc-dropdownroot__footer">
<a href="https://discourse.algolia.com/?utm_medium=social-owned&utm_source=communityHeader">
<span style="font-weight:bold;">Community Forum</span>
</a>
</div>
</div>
</div>`;
entireList += listString;
});
return entireList;
}
const renderMenu = ({ label, type, dropdownItems, logo, view, url, target }) => {
const link = (!dropdownItems || dropdownItems.length === 0) ? "#" : url
return `
<li class="algc-navigation__li">
<a class='algc-badge algc-navigation__navitem' href='${url} ${target ? `target=${target}`: ""}'
data-dropdown="${ view.toLowerCase() }" data-enabledropdown="${ dropdownItems.length > 0 }">
<svg class="algc-arrowseparator" viewBox="0 0 18 35" xmlns="http://www.w3.org/2000/svg"><g id="Symbols" fill="none" fill-rule="evenodd"><g id="community/header" fill="#3369E6"><g id="Group-13"><g id="Group-2"><path id="Combined-Shape-Copy" d="M1.8537 34.7643l15.5597-17.268L1.8537 0H0l15.5597 17.4964L0 34.7644z"/></g></g></g></g></svg>
${logo !== "" ? logo : ""}
${label ? `<span>${ label }</span>`: ""}
</a>
</li>`
}
const renderMenuList = (data) => {
let entireList = "";
const listItem = data["project"];
entireList += renderMenu(listItem);
return entireList;
}
const renderDocSearch = (docSearch, assets) => {
if(!docSearch) return ""
return `
<div class='algc-menu__search'>
<div class='algc-menu__search--holder${docSearch.input_open_on_init ? ` open` : ""}'>
<div class='algc-search__input algc-search__input--docsearch'>
<input id='${docSearch.input_selector}' placeholder='${docSearch.input_selector_placeholder}' type='search'>
<button id='search'>
${assets['searchIcon']}
</button>
<button id='cancel'>
${assets['searchCloseIcon']}
</button>
</div>
</div>
</div>`;
}
const renderRightList = (sideList) => {
if(!sideList.length) return;
let markup = "<ul class='algc-menu__list'>"
markup += sideList.reduce((prev,next) => renderRightListItem(prev,next),"");
markup += "</ul>"
return markup;
}
const renderRightListItem = (prev, data) => {
if(data.image){
return prev += `
<li class="algc-menu__list__item ${data.dropdownItems && data.dropdownItems.length ? "algc-menu--hassublist" : ""}">
<a href="${data.url || "#"}"
${data.target ? `target=${data.target}`: ""}
class="${data.dropdownItems && data.dropdownItems.length ? "algc-menu--sublistlink" : ""}">
${data.image}
${ renderGlyph(data) }
</a>
${renderSubList(data.dropdownItems)}
</li>`;
} else {
return prev += `
<li class="algc-menu__list__item ${data.dropdownItems && data.dropdownItems.length ? "algc-menu--hassublist" : ""}">
<a href="${data.url || "#"}" ${data.target ? `target=${data.target}`: ""} class="${data.dropdownItems && data.dropdownItems.length ? "algc-menu--sublistlink" : ""}">
${data.name}
${ renderGlyph(data) }
</a>
${renderSubList(data.dropdownItems)}
</li>`
}
}
const renderGlyph = (data) => {
if(data.dropdownItems && data.dropdownItems.length){
return '<span class="algc-glyph">▼</span>'
} else {
return "";
}
}
const renderSubList = (subList) => {
if(!subList || !subList.length) return "";
let markup = "<ul class='algc-menu__sublist'>";
markup += subList.reduce((prev,next) => renderSubListItem(prev,next),"");
markup += "</ul>";
return markup;
}
const renderSubListItem = (prev, data) => {
return prev += `
<li>
<a href="${data.url || "#"}" ${data.target ? `target=${data.target}`: ""}>${data.name}</a>
</li>
`
}
const renderMobileMenu = (sideList) => {
if(!sideList.length) return;
let markup = "<div class='algc-mobilemenu'><div class='algc-mobilemenuwrapper'><ul class='algc-mobilemenulist'>"
markup += sideList.reduce((prev,next) => renderMobileMenuItem(prev,next),"");
markup += "</ul></div></div>"
return markup;
}
const renderMobileMenuItem = (prev, data) => {
if(data.image){
return prev += `
<li class="algc-mobilemenu__item">
<a href="${data.url || "#"}" ${data.target ? `target=${data.target}`: ""}>
${data.image}
${data.name ? data.name : ""}
</a>
</li>`;
} else {
return prev += `
<li class="algc-mobilemenu__item">
<a href="${data.url || "#"}" ${data.target ? `target=${data.target}`: ""}>
${data.name}
</a>
</li>`
}
}
module.exports = function(paramData = {}, assetParams = {}){
const d = merge(data, paramData);
const a = merge(assets, assetParams);
return `<!-- Start community header -->
<nav class='algc-navigation'>
<div class='algc-navigation__container'>
<div class='algc-mainmenu'>
<ul class='algc-navigation__brands'>
<li class='algc-navigation__li algc-navigation__li--algolia'>
<a href='https://www.algolia.com/'>
${a['algoliaLogo']}
</a>
</li>
<li class='algc-navigation__li algc-navigation__li--community'>
<a href='https://community.algolia.com/' data-enabledropdown="true" data-dropdown="integrations">
<svg class="algc-arrowseparator" viewBox="0 0 18 35" xmlns="http://www.w3.org/2000/svg"><g id="Symbols" fill="none" fill-rule="evenodd"><g id="community/header" fill="#3369E6"><g id="Group-13"><g id="Group-2"><path id="Combined-Shape-Copy" d="M1.8537 34.7643l15.5597-17.268L1.8537 0H0l15.5597 17.4964L0 34.7644z"/></g></g></g></g></svg>
${a['communityLogo']}
${a['iconSeparator']}
</a>
</li>
${renderMenuList(d.menu)}
</ul>
<div class='algc-navigation__menu'>
${renderDocSearch(d.docSearch, a)}
${renderRightList(d.sideMenu)}
<button class='algc-openmobile'><span></span></button>
</div>
<div class='algc-navigation__dropdown-holder'>
<div class='algc-dropdownroot notransition'>
<div class='algc-dropdownroot__dropdownbg'></div>
<div class='algc-dropdownroot__dropdownarrow'></div>
<div class='algc-dropdownroot__dropdowncontainer'>
${renderDropdownList(d.menu, a)}
</div>
</div>
</div>
</div>
</div>
${renderMobileMenu(d.mobileMenu)}
</nav>
<!-- End community_header --> `;
}

280
docs/algolia-frontend-components/components/communityHeader/communityHeader.js
View file

@ -1,280 +0,0 @@
/**
* Main header function with docsearch
* @param {Object} docSearch config
*/
class communityHeader {
constructor(docSearchCredentials, docSearch) {
this.docSearchCredentials = docSearchCredentials;
this.docSearch = docSearch || null;
this.menuState = {
isOpen: false,
isOpenMobile: false
}
this.INIT_VAL = {
WIDTH: 490,
HEIGHT: 360
}
this.disableTransitionTimeout;
this.searchIcon = document.querySelector('#search');
this.cancelIcon = document.querySelector('#cancel');
this.searchInputContainer = document.querySelector('.algc-search__input');
this.searchContainer = this.searchInputContainer ? this.searchInputContainer.parentNode : null;
this.navRoot = document.querySelector('.algc-dropdownroot');
this.dropdownRoot = document.querySelector('.algc-navigation__dropdown-holder');
this.navItems = document.querySelectorAll('a[data-enabledropdown="true"]');
this.navContainer = document.querySelector('.algc-dropdownroot__dropdowncontainer');
this.menuContainer = document.querySelector('.algc-navigation__container');
this.navBg = document.querySelector('.algc-dropdownroot__dropdownbg');
this.navArrow = document.querySelector('.algc-dropdownroot__dropdownarrow');
this.dropDownContainer = document.querySelector('.algc-dropdownroot__dropdowncontainer');
this.menuTriggers = document.querySelectorAll('[data-enabledropdown="true"]');
this.mobileMenuButton = document.querySelector('.algc-openmobile ');
this.mobileMenu = document.querySelector('.algc-mobilemenu');
this.subList = document.querySelectorAll('.algc-menu--sublistlink');
this.subListHolders = [...this.subList].map(node => node.parentNode);
this.menuDropdowns = {};
[].forEach.call(document.querySelectorAll('[data-dropdown-content]'), (item) => {
this.menuDropdowns[item.dataset.dropdownContent] = {
parent: item.parentNode,
content: item
}
});
this.shouldInitDocSearch = this.shouldInitDocSearch.bind(this);
this.docSearchInit = this.checkDocSearch(docSearch);
this.enableDocSearch = this.verifyDocSearchParams(docSearchCredentials);
this.hasDocSearchRendered = document.querySelector('.algc-navigation .algc-search__input--docsearch');
this.triggerMenu = this.triggerMenu.bind(this);
this.shouldTriggerMenu = this.shouldTriggerMenu.bind(this);
this.closeMenu = this.closeMenu.bind(this);
this.toggleMobileMenu = this.toggleMobileMenu.bind(this);
this.docSearchToggling = this.docSearchToggling.bind(this);
this.initDocSearchStrategy = this.initDocSearchStrategy.bind(this);
this.openSublist = this.openSublist.bind(this);
this.closeSubLists = this.closeSubLists.bind(this);
this.bindListeners = this.bindListeners.bind(this);
this.calculatePosition = this.calculatePosition.bind(this);
this.verifyDocSearchParams();
this.shouldInitDocSearch();
this.initDocSearchStrategy();
this.bindListeners();
}
calculatePosition(sourceNode) {
const box = sourceNode.getBoundingClientRect();
const realWidth = sourceNode.offsetWidth;
const realHeight = sourceNode.offsetHeight;
return {
left: box.left,
top: box.top,
width: box.width,
height: box.height,
realWidth: realWidth,
realHeight: realHeight,
center: box.left + box.width / 2
}
}
shouldInitDocSearch() {
if (!this.enableDocSearch && this.hasDocSearchRendered) {
throw new Error('You need to pass docSearch: { apiKey, indexName, inputSelector } to communityHeader function in order to initialise docSearch');
}
}
checkDocSearch(docSearch = false) {
if (docSearch) return docSearch;
if (typeof window.docsearch === "function" || typeof docsearch === "function") {
return docsearch;
}
}
verifyDocSearchParams(docSearchCredentials) {
return (docSearchCredentials &&
docSearchCredentials.apiKey &&
docSearchCredentials.indexName &&
docSearchCredentials.inputSelector) ? true : false;
}
triggerMenu(event) {
const dropdown = event.target.dataset.dropdown;
const newTarget = this.menuDropdowns[dropdown].content;
const newContent = this.menuDropdowns[dropdown].parent;
const navItem = this.calculatePosition(event.target);
const newTargetCoordinates = this.calculatePosition(newTarget);
const menuContainerOffset = this.calculatePosition(this.menuContainer);
let leftDistance;
const scaleFactors = {
X: newTargetCoordinates.realWidth / this.INIT_VAL.WIDTH,
Y: newTargetCoordinates.realHeight / this.INIT_VAL.HEIGHT
}
leftDistance = (navItem.center - menuContainerOffset.left) + "px";
if(menuContainerOffset.left < 20){
leftDistance = "calc(50% - 36px)"
}
this.navBg.style.cssText = `
transform: translateX(${leftDistance}) scale(${scaleFactors.X}, ${scaleFactors.Y})`;
this.navArrow.style.cssText = `
transform: translateX(${leftDistance}) rotate(45deg)`;
this.dropDownContainer.style.cssText = `
transform: translateX(${leftDistance});
width: ${newTargetCoordinates.realWidth}px;
height: ${newTargetCoordinates.realHeight + 10}px;`;
this.dropdownRoot.style.pointerEvents = "auto";
Object.keys(this.menuDropdowns).forEach(key => {
if (key === dropdown) {
this.menuDropdowns[key].parent.classList.add('active');
} else {
this.menuDropdowns[key].parent.classList.remove('active');
}
})
if (!this.menuState.isOpen) {
setTimeout(() => {
this.navRoot.className = "algc-dropdownroot activeDropdown";
}, 50);
}
window.clearTimeout(this.disableTransitionTimeout);
this.menuState.isOpen = true;
}
shouldTriggerMenu(event) {
if(this.menuState.isOpen) {
this.triggerMenu(event);
} else {
this.triggerMenuTimeout = setTimeout(()=>{
this.triggerMenu(event);
}, 200);
}
}
closeMenu(event) {
window.clearTimeout(this.triggerMenuTimeout);
this.menuState.isOpen = false;
this.disableTransitionTimeout = setTimeout(() => {
this.dropdownRoot.style.pointerEvents = "none";
this.navRoot.className = "algc-dropdownroot notransition"
}, 50);
}
toggleMobileMenu(event) {
this.mobileMenuButton.classList.toggle('algc-openmobile--open');
this.mobileMenu.classList.toggle('algc-mobilemenu--open');
}
// Search
docSearchToggling() {
this.searchInput = document.querySelector(this.docSearchCredentials.inputSelector);
const openSearchInput = () => {
this.searchContainer.classList.add('open');
this.searchInput.focus();
}
const closeSearchInput = () => {
this.searchInput.blur();
this.searchContainer.classList.remove('open');
}
const emptySearchInput = () => {
if (this.searchInput.value !== '') {
this.searchInput.value = '';
} else {
closeSearchInput();
}
}
this.searchInput.setAttribute('value', '');
this.searchIcon.addEventListener('click', openSearchInput);
this.cancelIcon.addEventListener('click', emptySearchInput);
};
initDocSearch() {
this.docSearchToggling();
this.docSearchInit(this.docSearchCredentials);
}
initDocSearchStrategy() {
if (this.enableDocSearch && typeof this.docSearchInit === "function") {
this.initDocSearch();
} else if (this.docSearch === "lazy") {
const docSearchScript = document.createElement('script');
docSearchScript.type = 'text/javascript';
docSearchScript.async = true;
document.body.appendChild(docSearchScript);
docSearchScript.onload = () => {
this.docSearchInit = docsearch;
this.initDocSearch();
};
docSearchScript.src = "https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.js";
}
}
openSublist(node) {
const parent = node.parentNode;
this.subListHolders.forEach(holder => {
if (holder === parent && !parent.classList.contains('open')) {
holder.classList.add('open');
} else {
holder.classList.remove('open');
}
})
}
closeSubLists(event) {
this.subListHolders.forEach(holder => holder.classList.remove('open'));
}
bindListeners() {
var that = this;
this.subList.forEach(link => {
link.addEventListener('click', function(event){
event.preventDefault();
event.stopPropagation();
that.openSublist(this);
});
});
this.menuTriggers.forEach(item => {
item.addEventListener('mouseenter', this.shouldTriggerMenu);
item.addEventListener('focus', this.triggerMenu);
});
this.navItems.forEach(item => {
item.addEventListener('mouseleave', this.closeMenu);
});
this.navContainer.addEventListener('mouseenter', () => {
clearTimeout(this.disableTransitionTimeout);
});
this.mobileMenuButton.addEventListener('click', this.toggleMobileMenu);
document.addEventListener('click', this.closeSubLists);
document.querySelector('.algc-dropdownroot__dropdowncontainer').addEventListener('mouseleave', this.closeMenu);
}
}
module.exports = communityHeader

957
docs/algolia-frontend-components/components/communityHeader/communityHeader.scss
View file

@ -1,957 +0,0 @@
@import "./../../stylesheets/_variables.scss";
@import "./../../stylesheets/_functions.scss";
@import "./../../stylesheets/_mixins.scss";
$nav-height: 56px;
$nav-z-index: 50;
$nav-background: $deep-cove;
$nav-background-medium: mix($nav-background, #fff, 96%);
$nav-background-light: mix($nav-background, #fff, 92%);
.algc-navigation {
top: 0;
left: 0;
width: 100%;
color: #fff;
padding: 0 1em;
z-index: $z-top;
position: fixed;
perspective: 2000px;
transform-style: preserve-3d;
background: $nav-background;
font-size: 1em;
will-change: transform;
@media (max-width: $breakpoint-sm){
padding: 0 .5em;
}
.algc-mainmenu {
position: relative;
}
.algc-navigation__container{
margin: 0 auto;
max-width: $container-max-width;
}
a {
text-decoration: none;
}
}
.algc-navigation__brands {
height: $nav-height;
margin: 0;
padding: 0;
list-style-type: none;
float: left;
font-weight: $light;
display: flex;
align-items:center;
z-index: $z-1;
position: relative;
a {
text-decoration: none;
color: $white;
&:hover {
color: $white;
}
}
&:hover,
&:visited {
color: white;
}
img,svg {
max-width: none;
vertical-align: middle;
}
@media (max-width: $breakpoint-md) {
font-size: .8em;
}
.algc-navigation__li {
float: left;
text-align: center;
min-height: 33px;
display: flex;
align-items: center;
@media (min-width: $breakpoint-md) and (max-width: $breakpoint-lg) {
&:nth-child(2) {
padding-left: 0;
img,svg {
margin-left: 0px;
}
.algc-arrowseparator {
margin-left: 4px;
}
}
}
@media (max-width: $breakpoint-lg) {
&:nth-child(2) {
a { padding-left: 0; }
.algc-arrowseparator { display: none; }
}
}
@media (max-width: $breakpoint-sm) {
&:nth-child(2) {
width: 30px;
overflow: hidden;
}
}
}
a {
position: relative;
display: block;
padding-right: 12px;
@media (max-width: $breakpoint-lg) {
padding: 0 1.2em;
}
@media (max-width: $breakpoint-sm) {
padding: 0 .8em
}
}
.algc-navigation__li--algolia {
a {
padding-left: 0;
}
.algolia-logo {
width: auto;
height: 23px;
}
@media (max-width: $breakpoint-lg) {
display: none;
}
}
.algc-navigation__li--community {
a {
height: 33px;
}
.algolia-community-logo{
width: auto;
height: 30px;
}
}
}
//---------------------------
// Dropdown starts here
//---------------------------
.algc-navigation__dropdown-holder {
position: absolute;
top: $nav-height - 14px;
left: 25px;
max-width: 490px;
width: 100%;
height: 800px;
-webkit-perspective: 500px;
perspective: 500px;
pointer-events: none;
font-size: 1.2em;
@media (max-width: $breakpoint-sm) {
left:0;
max-width: 100%;
}
}
.algc-dropdownroot {
top: 4px;
width: 100%;
position: absolute;
opacity: 0;
transform-origin: 50% -50px;
transition-property: transform, opacity;
transition-duration: .25s;
will-change: transform, opacity;
pointer-events: none;
z-index: $z-top;
transform: rotateX(-15deg) translate(-50%, 0%);
&.notransition {
.algc-dropdownroot__dropdowncontainer,
.algc-dropdownroot__dropdownbg,
.algc-dropdownroot__section,
.algc-dropdownroot__dropdownarrow {
transition: none;
}
}
&.activeDropdown {
opacity: 1;
transform: translate(-50%, 0);
pointer-events: all;
.algc-dropdownroot__dropdownbg {
opacity: 1;
transform: none;
transform-origin: 50% 0;
}
}
.algc-dropdownroot__dropdownbg {
left: 0;
top: 10px;
box-shadow: 0 50px 100px rgba(50, 50, 93, .1), 0 15px 35px rgba(50, 50, 93, .15), 0 5px 15px rgba(0, 0, 0, .1);
border-radius: 4px;
transform-origin: 50% 0;
background-color: #FFF;
transition-property: transform, opacity;
transition-duration: .25s;
position: absolute;
width: 490px;
height: 360px;
will-change: transform, opacity;
}
.algc-dropdownroot__dropdownarrow {
left: 50%;
top: 6px;
background-color: #FFF;
box-shadow: -3px -3px 5px rgba(82, 95, 127, .04);
will-change: transform, opacity;
transition-property: transform, opacity;
transition-duration: .25s;
transform: rotate(45deg) translate(-50%, 0);
position: absolute;
width: 12px;
height: 12px;
border-radius: 2px;
pointer-events: none;
}
.algc-dropdownroot__dropdowncontainer {
margin: 0 auto;
position: relative;
overflow: hidden;
will-change: transform, width, height;
transition-property: transform, width, height;
transition-duration: .25s;
}
@media (max-width: $breakpoint-sm){
transform: translate(0,0) rotateX(-15deg);
&.activeDropdown {
transform: rotateX(0deg) translate(0,0) !important;
}
.algc-dropdownroot__dropdownbg {
width: 100%;
}
.algc-dropdownroot__widelist {
width: 100%;
}
.algc-dropdownroot__content {
width: 100% !important;
}
.algc-dropdownroot__section {
width:100%;
}
.algc-dropdownroot__dropdowncontainer {
width: 100% !important;
max-width: 100%;
transform: translate(0,0) !important;
}
}
}
.algc-dropdownroot__section {
position: absolute;
left: 0;
top: 0;
opacity: 0;
will-change: transform, opacity;
transition-property: transform, opacity;
transition-duration: .25s;
&.active {
opacity: 1;
transform: translateX(0);
z-index: $z-1
}
&.right {
transform: translateX(150px);
}
&.left {
transform: translateX(-150px);
}
.algc-dropdownroot__content {
position: absolute;
top: 10px;
left: 0;
background: #fff;
border-radius: 4px;
overflow: hidden;
}
}
.algc-dropdownroot__widelist {
display: flex;
flex-wrap: wrap;
list-style-type: none;
padding: 0;
width: 450px;
padding: em(10) em(20);
margin: 0;
background-color: $titan-white;
li {
flex: 50%;
border-radius: 3px;
margin: .5em auto;
a {
display: flex;
flex-wrap: wrap;
flex-direction: row;
align-items: center;
color: #333333;
background-color: $titan-white;
border-radius: 4px;
transition: background 160ms ease;
&:hover {
color: darken(#333333, 10%);
background-color: $athens-gray;
}
}
h4 {
text-align: center;
text-align: left;
margin: 0;
font-size: $text-sm;
}
.item-icon {
width: 42px;
height: 42px;
margin: 8px;
border-radius: 4px;
text-align:center;
position: relative;
img,
svg {
max-width: 60%;
transition: transform 0.2s ease 0.15s;
}
}
svg,
img {
position: absolute;
left: 50%;
top:50%;
max-width: 32px;
width: 100%;
height: auto;
transform: translate(-50%,-50%);
}
}
}
.algc-dropdownroot__footer {
text-align: center;
font-size: $text-sm;
transition: filter 0.2s ease, opacity 0.2s ease;
will-change: filter, opacity;
a {
padding: .8em 0;
display: block;
color: $nav-background;
opacity: 0.8;
&:hover {
opacity: 1;
}
}
img,
svg {
vertical-align: middle;
}
}
.algc-dropdownroot__links {
list-style-type: none;
padding: em(10) em(20);
display: flex;
flex-wrap: wrap;
width: 290px;
margin: 0;
li {
box-sizing: border-box;
display: flex;
align-items: center;
flex: 1 0 50%;
padding: em(10) em(10);
p {
margin: 0;
}
img,
svg {
margin-right: 5px;
height: 20px;
width: 20px;
}
}
}
.algc-navigation__menu {
float: right;
height: $nav-height;
line-height: $nav-height;
font-weight: $light;
z-index: $z-2;
.algc-menu__list {
list-style-type: none;
padding: 0;
margin: 0;
width: auto;
float: left;
position: relative;
z-index: $z-1;
a {
text-decoration: none;
color: $white;
}
@media (max-width: $breakpoint-md) {
display: none;
}
&__item {
position: relative;
height: $nav-height;
line-height: $nav-height;
display: inline-block;
float: left;
img,
svg {
height: $text-lg;
width: auto;
}
a {
padding: 0 .5em 0 .5em;
display: flex;
align-items: center;
height: 100%;
}
}
.algc-glyph {
margin-left: 1em;
font-size: .4em;
}
.algc-menu__list__item.algc-menu--hassublist.open {
.algc-menu__sublist {
opacity: 1;
transform: translate(0, 0);
pointer-events: auto;
transition: .25s;
}
}
}
.algc-menu__sublist {
pointer-events: none;
padding: 0;
position: absolute;
right: 0;
top:100%;
background-color: white;
list-style-type: none;
background-color: #FFF;
border-radius: 3px;
box-shadow: 0 1px 4px 0 rgba(31, 59, 93, 0.5);
font-size: 14px;
opacity:0;
transition: .14s;
transform: translate(0, 6px);
will-change: opacity, transform;
text-align: left;
&:before{
content: "";
position: absolute;
right: 16px;
top: -4px;
height: 12px;
width: 12px;
border-radius: 3px;
transform: rotate(45deg);
background-color: #FFF;
}
li:not(:last-child) {
border-bottom: solid 1px #eee;
}
li a {
text-transform: none;
margin: 0;
width: 100%;
border: none;
display: block;
padding: 1em 2em;
clear: both;
font-weight: normal;
line-height: 1.42857;
color: #333333;
white-space: nowrap;
font-size: 1em;
&:hover {
color: darken(#333333, 10%);
background-color: #f9f9f9;
}
}
}
}
.algc-mobilemenu{
display: block;
position: fixed;
top: 0;
right: 0;
width: 100%;
max-width: 200px;
padding: 64px $text-sm 0 $text-sm;
height: 100vh;
background-color: $deep-cove;
text-align: right;
font-weight: $light;
transform: translate(100%, 0);
transition: transform 140ms ease-out,
opacity 140ms 100ms ease-out;
opacity: 0;
will-change: transform;
a {
color: $white;
}
&:before{
width:100%;
height:100vh;
position: absolute;
content: "";
left:0;
top: 0;
box-shadow: 0 0 36px 3px rgba(0, 0, 0, 0.2);
z-index: $z--1;
}
&:after {
width: 100%;
height: 100%;
max-height: 40px;
bottom:0;
left:0;
position: fixed;
content: "";
background-image: -webkit-linear-gradient(bottom, transparent 0%,rgba(5,15,44,1) 100%);
}
&--open {
opacity: 1;
transition: 360ms cubic-bezier(0.19, 1, 0.22, 1);
transform: translate(0, 0);
}
@media (min-width: $breakpoint-md) {
display: none;
}
.algc-mobilemenulist {
list-style-type: none;
padding: 0 0 40px 0;
margin-bottom: 0;
position: absolute;
top:74px;
right:0;
width: 100%;
height: 100%;
overflow: auto;
}
.algc-mobilemenu__item {
line-height: 2.6;
position: relative;
&:after {
bottom: 0;
width:100%;
height: 1px;
position: absolute;
content: "";
display: block;
background: linear-gradient(76deg, rgba(28,199,208,0.01) 0%,rgba(28,199,208,0) 18%, rgba(28,199,208,0.49) 46%,rgba(80,191,221,.7) 93%,rgba(125,185,232,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
&:last-child {
&:after {
background-color: trasparent;
}
}
}
a {
padding: 0 $text-xs;
display: flex;
align-items: center;
justify-content: flex-end;
}
img, svg {
height: 1em;
margin-right: .4em;
}
}
// Docsearch input
.algc-menu__search {
width: auto;
padding: 0 12px;
height: $nav-height;
display: inline-block;
float: left;
font-size: $text-sm;
&--holder {
position: relative;
width: 32px;
height: $nav-height;
}
.algc-search__input {
button {
appearance: none;
border: none;
background: transparent;
position: absolute;
z-index: $z-1;
top: 50%;
bottom: 0;
margin: 0;
outline: none;
display: none;
width: 1.6em;
height: 1.6em;
transition: transform 0.28s ease;
transform: translate(0,-50%);
cursor: pointer;
transform: translate(0,-50%);
img,
svg {
top: 0;
bottom: 0;
left: 0;
right: 0;
width: 100%;
height: auto;
max-width: 16px;
max-height: $nav-height;
vertical-align: middle;
position: absolute;
margin: auto;
pointer-events: all;
transition: opacity 0.28s ease 0.15s;
@media (max-width: $breakpoint-sm) {
margin-top: 2px;
}
use {
fill: #fff
}
}
&#search {
z-index: $z-2;
display: block;
}
&#cancel {
z-index: $z-1;
display: block;
pointer-events: none;
opacity: 0;
right: -.35em;
transition: 40ms ease;
transform: translate(0, -40%) scale(.7);
img,
svg {
width: 12px;
top: 50%;
transform: translate(0,-50%);
}
}
}
// DOCSEARCH RELATED
input[type=search] {
padding: 0;
margin: 0 0 0 2.4em;
appearance: none;
background: transparent;
width: 32px;
max-height: 32px;
border: 1px solid transparent;
position: relative;
left: 0;
z-index: $z-1;
cursor: pointer;
transition: background 0.28s ease, transform 0.28s ease, width 0.28s ease;
padding: 8px;
outline: none;
font-weight: $light;
border-radius: 3px;
padding-left: 1.8em;
color: #fff;
line-height: 1.3em;
padding-right: 1.4em;
}
}
&--holder.open {
// DOCSEARCH RELATED
input[type="search"] {
background-color: rgba(white, 0.2);
width: 300px;
transform: translate(-300px);
outline: none;
cursor: auto;
#searchbox {
background-color: inherit !important;
}
@media (max-width: $breakpoint-xl){
transform: translate(-180px);
width: 180px;
}
@media (max-width: $breakpoint-md) and (orientation: landscape) {
transform: translate(-240px);
width: 240px;
}
@media (max-width: $breakpoint-sm) {
transform: translate(-140px);
width: 140px;
}
@media (max-width: 370px) {
transform: translate(-110px);
width: 110px;
}
@include placeholder {
color: rgba(#ffffff, 0.3);
}
}
button#search {
transform: translate(calc(-300px + 4em), -50%);
@media (max-width: 1180px){
transform: translate(calc(-180px + 4em), -50%);
}
@media (max-width: $breakpoint-md) and (orientation: landscape) {
transform: translate(calc(-240px + 4em), -50%);
}
@media (max-width: $breakpoint-sm) {
transform: translate(calc(-140px + 4em), -50%);
}
@media (max-width: 370px) {
transform: translate(calc(-110px + 4em), -50%)
}
}
button#cancel {
transition: 300ms 300ms ease;
pointer-events: auto;
opacity: 1;
}
}
}
.algolia-autocomplete {
position: inherit !important;
display: initial !important;
input#searchbox,
input[type="search"] {
vertical-align: middle !important;
-webkit-appearance: none;
appearance: none;
font-size: 16px;
@media (min-width: $breakpoint-sm) {
margin-top: -2px;
}
}
.ds-dropdown-menu {
top: $nav-height - 10px !important;
left: -438px !important;
right: inherit !important;
line-height: 26px !important;
font-size: $text-lg;
@media (max-width: $breakpoint-sm) {
margin-top: 0;
top: $nav-height !important;
left:0 !important;
right:0 !important;
width: 100% !important;
position:fixed !important;
min-width: 0 !important;
border-radius: 0;
&:before {
display: none;
}
[class^=ds-dataset-] {
border-radius: 0;
border-left: 0;
border-right: 0;
border-top: 0;
}
.algolia-docsearch-suggestion--subcategory-column {
white-space: nowrap;
text-overflow: ellipsis;
padding-right: 14px;
overflow: hidden;
}
}
}
}
.algc-openmobile {
height: 40px;
width: 40px;
vertical-align: middle;
position: relative;
z-index: $z-1;
cursor: pointer;
z-index: $z-3;
background-color: $deep-cove;
border: none;
&:focus {
outline: none;
}
@media (min-width: $breakpoint-md) {
display: none;
}
span {
height: 2px;
width: 62%;
top:50%;
left: 50%;
transform: translate(-50%, -50%);
transition: 140ms ease-out;
background-color: rgba($white, .88);
position: absolute;
&:before,
&:after {
content: "";
width: 100%;
height: 2px;
background-color: inherit;
position: absolute;
transition: 130ms ease-out;
transform: translate(-50%,-50%);
}
&:before {
transform-origin: left center;
margin-top: -4px;
}
&:after{
transform-origin: left center;
margin-top: 6px;
}
}
&--open {
span {
transition: 130ms ease-out;
transform: translate(-70%,-50%);
&:before,
&:after{
transition: 130ms ease-out;
transform: translate(-20%,-50%);
}
}
}
}
.algc-arrowseparator {
height: 33px;
margin-right: 16px;
}

11
docs/algolia-frontend-components/images/algolia-community-dark.svg
View file

File diff suppressed because one or more lines are too long
Side by side

Before

Width:  |  Height:  |  Size: 5.8 KiB

15
docs/algolia-frontend-components/images/algolia-logo-darkbg.svg
View file

File diff suppressed because one or more lines are too long
Side by side

Before

Width:  |  Height:  |  Size: 6.6 KiB

4
docs/algolia-frontend-components/images/icon-separator.svg
View file

@ -1,4 +0,0 @@
<svg width="12" height="7" role="img" arial-labelledby="algc-icon-separator-alt" viewBox="0 0 12 7" xmlns="http://www.w3.org/2000/svg">
<title id="algc-icon-separator-alt">menu with dropdown</title>
<path d="M6.458 3.58L2.81.37C2.344-.04 1.634.01 1.225.477c-.41.468-.362 1.18.105 1.59L5.51 5.74s.537.375 1.05.356c.515-.02.984-.433.984-.433l4.072-3.596c.467-.41.515-1.12.107-1.59C11.315.01 10.605-.04 10.138.37l-3.68 3.21z" fill="#FFF" fill-rule="evenodd" />
</svg>
Side by side

Before

Width:  |  Height:  |  Size: 469 B

1
docs/algolia-frontend-components/images/instantsearch-android.svg
View file

@ -1 +0,0 @@
<svg viewBox="0 0 124 117" xmlns="http://www.w3.org/2000/svg"><title>InstantSearch Android</title><path d="M85.47 60.44c.212-1.2-.06-2.452-.702-3.403l-9.572-14.19c3.495-3.65 5.836-8.34 6.72-13.36C84.343 15.738 75.552 2.705 62.272.364 48.99-1.98 36.274 7.26 33.85 21.013c-2.426 13.75 6.364 26.783 19.644 29.124 4.848.855 9.896.178 14.395-1.98l9.577 14.154c.635.987 1.675 1.68 2.836 1.886 2.39.42 4.73-1.28 5.167-3.755zM53.696 85.99c.863-.863 2.043-1.358 3.19-1.378l17.115-.298c.985-4.955 3.485-9.563 7.09-13.167 9.873-9.874 25.59-10.148 35.125-.613 9.536 9.535 9.262 25.252-.612 35.126-9.874 9.874-25.59 10.148-35.126.613-3.48-3.48-5.822-8.003-6.633-12.927l-17.09.273c-1.172.046-2.336-.408-3.17-1.24-1.716-1.717-1.665-4.61.112-6.388zm-4.167-31.53c.294 1.185.11 2.45-.464 3.445l-8.56 14.824c3.742 3.396 6.404 7.91 7.637 12.857 3.378 13.55-4.482 27.162-17.566 30.425C17.492 119.27 4.162 110.94.783 97.39-2.595 83.842 5.265 70.23 18.35 66.968c4.776-1.19 9.858-.868 14.497.972l8.567-14.788c.566-1.03 1.554-1.793 2.698-2.08 2.354-.586 4.81.948 5.417 3.386zM86.817 78.37c-6.27 6.27-6.444 16.3-.39 22.355 6.055 6.054 16.084 5.88 22.353-.39 6.27-6.27 6.446-16.3.39-22.353-6.053-6.055-16.082-5.88-22.352.39zM39.475 88.605C37.33 80 28.825 74.686 20.515 76.757 12.208 78.83 7.193 87.515 9.338 96.117c2.145 8.604 10.65 13.92 18.96 11.848 8.308-2.07 13.323-10.758 11.178-19.36zm32.815-60.84c-1.54 8.73-9.655 14.627-18.087 13.14C45.77 39.417 40.16 31.102 41.7 22.37c1.54-8.732 9.655-14.627 18.088-13.14 8.432 1.486 14.04 9.802 12.502 18.534z" fill="#FFF" fill-rule="evenodd"/></svg>
Side by side

Before

Width:  |  Height:  |  Size: 1.5 KiB

1
docs/algolia-frontend-components/images/react-instantsearch.svg
View file

@ -1 +0,0 @@
<svg viewBox="0 0 127 113" xmlns="http://www.w3.org/2000/svg"><title>React InstantSearch</title><path d="M51.438 52.172l-2.907-1.68-2.565 4.442c-1.52-.485-3.137-.746-4.816-.746-8.75 0-15.84 7.098-15.84 15.852 0 8.755 7.09 15.853 15.84 15.853 8.747 0 15.837-7.098 15.837-15.853 0-4.66-2.008-8.85-5.206-11.75l2.564-4.435 1.936-3.336-5.81-3.37-1.936 3.337 2.904 1.685zm19.292 14.51c1.54-7.14 7.885-12.494 15.482-12.494 8.75 0 15.84 7.098 15.84 15.852 0 8.755-7.09 15.853-15.84 15.853-7.597 0-13.943-5.353-15.482-12.495h-5.128v-6.715h5.128zm3.256-17.848l2.904-1.686-2.58-4.444c3.19-2.9 5.193-7.085 5.193-11.738 0-8.755-7.09-15.853-15.838-15.853s-15.84 7.098-15.84 15.853c0 8.754 7.092 15.853 15.84 15.853 1.685 0 3.31-.265 4.833-.753L71.07 50.5l1.86 3.316 5.858-3.287-1.874-3.34-2.928 1.644zm-5.46 48.817c9.465 7.297 18.232 9.824 23.72 6.652 4.93-2.854 7.322-10.372 6.404-21.197l6.692-.567c1.114 13.135-2.072 23.14-9.732 27.576-8.57 4.954-20.363 1.55-32.23-7.96-11.87 9.51-23.664 12.914-32.234 7.96-7.658-4.436-10.844-14.44-9.73-27.576l6.692.567c-.918 10.825 1.475 18.343 6.4 21.195 5.49 3.174 14.26.647 23.724-6.65-2.332-2.213-4.648-4.65-6.925-7.297l5.09-4.38c2.316 2.69 4.656 5.127 6.982 7.295 2.325-2.168 4.664-4.604 6.98-7.296l5.09 4.38c-2.276 2.647-4.593 5.085-6.924 7.3zM28.243 30.393c4.176-1.31 8.71-2.38 13.53-3.183l1.103 6.623c-4.92.82-9.467 1.933-13.557 3.273.776 3.706 1.885 7.634 3.337 11.715l-6.326 2.252c-1.41-3.96-2.532-7.827-3.363-11.545-10.185 4.496-16.25 10.552-16.25 16.62 0 5.608 5.14 11.386 14.597 15.885l-2.885 6.064C6.88 72.603 0 64.87 0 56.146 0 46.57 8.354 38.27 21.75 32.733c-1.89-14.33 1.134-25.656 9.416-30.45 7.857-4.593 18.53-2.077 29.646 6l-3.948 5.433c-9.196-6.682-17.264-8.584-22.32-5.63-5.25 3.04-7.485 11.27-6.3 22.306zm69.23 6.708c-4.098-1.34-8.655-2.452-13.586-3.266l1.094-6.626c4.834.798 9.38 1.87 13.567 3.178 1.182-11.033-1.055-19.263-6.312-22.306-5.045-2.948-13.113-1.046-22.31 5.636L65.98 8.283C77.094.206 87.766-2.31 95.612 2.275c8.29 4.8 11.314 16.124 9.427 30.45 13.376 5.528 21.718 13.83 21.718 23.42 0 8.724-6.882 16.458-18.43 21.95l-2.884-6.063c9.457-4.5 14.598-10.277 14.598-15.886 0-6.08-6.053-12.138-16.218-16.626-.83 3.72-1.954 7.588-3.365 11.552l-6.328-2.25c1.453-4.084 2.562-8.014 3.34-11.722zM61.79 73.398h3.812v-6.715h-3.81v6.715zm-20.64 5.78c-5.04 0-9.124-4.09-9.124-9.138 0-5.047 4.085-9.137 9.123-9.137 5.036 0 9.122 4.09 9.122 9.137 0 5.048-4.086 9.138-9.123 9.138zm45.062 0c5.038 0 9.123-4.09 9.123-9.138 0-5.047-4.085-9.137-9.123-9.137-5.037 0-9.122 4.09-9.122 9.137 0 5.048 4.085 9.138 9.122 9.138zM63.665 40.103c-5.038 0-9.123-4.09-9.123-9.137 0-5.047 4.085-9.137 9.123-9.137 5.037 0 9.123 4.09 9.123 9.136 0 5.047-4.086 9.137-9.123 9.137z" fill="#FFF" fill-rule="evenodd"/></svg>
Side by side

Before

Width:  |  Height:  |  Size: 2.7 KiB

4
docs/algolia-frontend-components/images/search-close-icon.svg
View file

@ -1,4 +0,0 @@
<svg role="img" aria-labelledby="algc-top-search-close" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 13 13">
<title id="algc-top-search-close">Close search input</title>
<path d="M5.274 6.5L.614 1.84 0 1.225 1.226 0l.613.613 4.66 4.66 4.66-4.66.614-.613L13 1.226l-.613.613-4.66 4.66 4.66 4.66.613.614L11.774 13l-.613-.613-4.66-4.66-4.66 4.66-.614.613L0 11.774l.613-.613" fill="#FFF" fill-rule="evenodd" />
</svg>
Side by side

Before

Width:  |  Height:  |  Size: 420 B

1
docs/algolia-frontend-components/images/shopify.svg
View file

@ -1 +0,0 @@
<svg viewBox="0 0 95 108" xmlns="http://www.w3.org/2000/svg"><title>Algolia Shopify integration</title><path d="M82.996 20.982c-.074-.542-.548-.842-.94-.875-.392-.033-8.675-.646-8.675-.646S67.63 13.75 67 13.12c-.632-.632-1.866-.44-2.345-.3l-3.22.995c-1.92-5.53-5.312-10.61-11.278-10.61-.164 0-.334.006-.504.016C47.955.974 45.854 0 44.038 0 30.14 0 23.5 17.373 21.417 26.202c-5.4 1.674-9.236 2.863-9.726 3.017-3.013.945-3.108 1.04-3.504 3.88C7.886 35.25 0 96.247 0 96.247l61.46 11.515 33.3-7.204S83.07 21.523 82.996 20.982zm-24.96-6.118l-5.2 1.61c.003-.367.004-.728.004-1.122 0-3.437-.477-6.203-1.242-8.397 3.074.386 5.122 3.883 6.44 7.91zm-10.25-7.228c.853 2.142 1.41 5.215 1.41 9.363 0 .21-.003.405-.004.6-3.383 1.05-7.058 2.186-10.74 3.327 2.067-7.982 5.944-11.836 9.333-13.29zm-4.13-3.908c.6 0 1.204.203 1.782.6-4.454 2.097-9.228 7.376-11.244 17.917l-8.49 2.63c2.36-8.04 7.97-21.147 17.95-21.147zm6.5 34.78L46.048 50.72s-3.6-1.92-8.008-1.92c-6.465 0-6.79 4.06-6.79 5.08 0 5.58 14.54 7.717 14.54 20.783 0 10.28-6.52 16.9-15.31 16.9-10.55 0-15.946-6.566-15.946-6.566l2.824-9.333s5.546 4.76 10.226 4.76c3.057 0 4.3-2.406 4.3-4.165 0-7.278-11.93-7.603-11.93-19.56 0-10.063 7.225-19.802 21.805-19.802 5.62 0 8.395 1.61 8.395 1.61z" fill="#FFF" fill-rule="evenodd"/></svg>
Side by side

Before

Width:  |  Height:  |  Size: 1.2 KiB

1
docs/algolia-frontend-components/images/wordpress.svg
View file

@ -1 +0,0 @@
<svg width="51" height="52" viewBox="0 0 51 52" xmlns="http://www.w3.org/2000/svg"><title>icon-wordpress</title><path d="M26.055.81C16.215.79 6.953 6.626 2.703 15.862l11.95.028V17.2c-3.68-.442-3.355 1.47-2.834 3.497l7.845 19.663L25.43 26.84l-2.646-6.334c-.96-1.697-.982-3.58-4.916-3.402l.056-1.205 17.528.042v1.35c-2.052.12-4.523-.517-3.214 3.687l7.09 18.622 3.876-10.872c1.27-4.557.074-8.937-1.434-13.232-.84-2.88-.447-5.287 3.312-6.242C39.344 3.4 32.572.82 26.055.81zM49.895 18L38.53 47.625c3.14-2.72 6.357-3.708 10.295-11.23 2.62-6.255 2.35-12.05 1.07-18.393zm-48.395.48C.39 27.227.492 29.788 3.238 36.93c3.58 6.84 6.354 8.28 10.294 10.963L1.5 18.483zm25 11.096l-8.423 20.32c5.91 1.687 11.2 1.476 16.043-.4l-7.62-19.92z" fill="#FFF" fill-rule="evenodd"/></svg>
Side by side

Before

Width:  |  Height:  |  Size: 763 B

5
docs/algolia-frontend-components/index.js
View file

@ -1,5 +0,0 @@
const htmlRender = {
communityHeader: require('./components/communityHeader/communityHeader.html.js')
}
module.exports = htmlRender;

5
docs/algolia-frontend-components/javascripts.js
View file

@ -1,5 +0,0 @@
const javascripts = {
communityHeader: require('./components/communityHeader/communityHeader.js')
}
module.exports = javascripts;

43
docs/algolia-frontend-components/package.json
View file

@ -1,43 +0,0 @@
{
"name": "algolia-frontend-components",
"version": "0.0.34",
"description": "Algolia components",
"main": "index.js",
"scripts": {
"clean": "rm -rf dist",
"watch": "node build/development.js --erb",
"build": "npm run clean --silent && node build/build.js --silent",
"build:erb": "npm run clean --silent && node build/build.js --erb",
"serve": "webpack-dev-server --config build/serve.js"
},
"author": "Jonas Badalic",
"license": "ISC",
"dependencies": {
"babel-cli": "^6.23.0",
"babel-core": "^6.23.1",
"babel-polyfill": "^6.23.0",
"babel-preset-env": "^1.1.9",
"babel-preset-es2015": "^6.22.0",
"chalk": "^2.0.0",
"deepmerge": "^2.0.0",
"glob": "^7.1.1",
"node-sass": "^4.5.0",
"path": "^0.12.7",
"progress": "^2.0.0",
"webpack": "^2.2.1",
"webpack-dev-server": "^3.0.0"
},
"devDependencies": {
"babel-loader": "7.1.5",
"css-loader": "1.0.0",
"extract-loader": "2.0.1",
"file-loader": "1.1.11",
"html-loader": "0.5.5",
"html-webpack-plugin": "3.2.0",
"json-loader": "0.5.7",
"raw-loader": "0.5.1",
"sass-loader": "7.1.0",
"style-loader": "0.21.0",
"url-loader": "1.0.1"
}
}

6
docs/algolia-frontend-components/stylesheets/_base.scss
View file

@ -1,6 +0,0 @@
* {
box-sizing: border-box;
}
body {
margin: 0;
}

Some files were not shown because too many files have changed in this diff Show more