Commit 0d0c9eee authored by Simonas's avatar Simonas

in progress

parent e881fbc3
.idea/ .idea/
var/ var/
\ No newline at end of file wordpress/node_modules
yarn.lock
\ No newline at end of file
...@@ -21,6 +21,9 @@ ...@@ -21,6 +21,9 @@
### DB restore ### DB restore
- `C:\web\dev.biuro> docker exec -i mysql mysql -uroot -pIiIjnsLi2wR9i1kWVbVpUAzP --default-character-set=utf8 wordpress < docker/mariadb/db_001.sql` - `C:\web\dev.biuro> docker exec -i mysql mysql -uroot -pIiIjnsLi2wR9i1kWVbVpUAzP --default-character-set=utf8 wordpress < docker/mariadb/db_001.sql`
## Development
- `C:\web\dev.biuro\wordpress>yarn (or npm install)`
## Wordpress ## Wordpress
- Regions created using [Wordpress Network](https://codex.wordpress.org/Create_A_Network) - Regions created using [Wordpress Network](https://codex.wordpress.org/Create_A_Network)
...@@ -32,21 +35,18 @@ ...@@ -32,21 +35,18 @@
### Plugins ### Plugins
### SEO ### SEO
might not be shared with everyone
- https://docs.google.com/document/d/1FiwVoiLvGGmi9V-HPBgJ3gsh3wGswt27csgvfdTU24w/edit?usp=sharing - https://docs.google.com/document/d/1FiwVoiLvGGmi9V-HPBgJ3gsh3wGswt27csgvfdTU24w/edit?usp=sharing
- https://docs.google.com/spreadsheets/d/1ggnqKuGxFFkLgI6NDZq4PXpRY_whdHX0kjZj7pCP_fk/edit?ts=5b5eaa62#gid=0 - https://docs.google.com/spreadsheets/d/1ggnqKuGxFFkLgI6NDZq4PXpRY_whdHX0kjZj7pCP_fk/edit?ts=5b5eaa62#gid=0
- https://docs.google.com/spreadsheets/d/1dXP0dh_v2sFajrcwR2_9HONMadCdZQW4Y2dVXvhxG3E/edit?ts=5b5eaa6b#gid=748245000 - https://docs.google.com/spreadsheets/d/1dXP0dh_v2sFajrcwR2_9HONMadCdZQW4Y2dVXvhxG3E/edit?ts=5b5eaa6b#gid=748245000
p.s. might not be shared with everyone
## Known issues (Windows 10) ## Known issues (Windows 10)
### Error ### Error
Cannot start service mysql: b"error while creating mount source path '/host_mnt/c/web/dev.biuro/var/mariadb': mkdir /host_mnt/c: file exists" ERROR: for mysql Cannot start service mysql: error while creating mount source path '/host_mnt/c/web/dev.biuro/var/mariadb': mkdir /host_mnt/c: file exists
### Solution ### Solution
Restart docker Restart docker
......
-----BEGIN CERTIFICATE-----
MIIFJDCCBAygAwIBAgISA76O6ZPLNB+y6MoTnwKMLgoOMA0GCSqGSIb3DQEBCwUA
MEoxCzAJBgNVBAYTAlVTMRYwFAYDVQQKEw1MZXQncyBFbmNyeXB0MSMwIQYDVQQD
ExpMZXQncyBFbmNyeXB0IEF1dGhvcml0eSBYMzAeFw0xODA5MjQxMzAwNDRaFw0x
ODEyMjMxMzAwNDRaMBMxETAPBgNVBAMTCGJpdXJvLmx0MIIBIjANBgkqhkiG9w0B
AQEFAAOCAQ8AMIIBCgKCAQEAj5hA/UJAx3ojXxKxeq550VLDvZlOqiU5bGyZDu0D
lN6ECu36zJ3diKLR3aXyACL6H6OPyIEUWAeM/xVWGF9QnAnGWzKTfQsjLC3XBT43
AWwXeCSX3kztjG9tNI7tUS9poKq5OaYpL7LHQx4bEhq2crRXSh+38fYNwYFzJwh4
GS17odM6b8aiujncyo5xWAIZWH99YCfIP6vm4QgU/N+XSj00MEwg8FQGe2ujGXsk
ciFwFgiton/LOp1bgOL4r58ScW7l2qyGBE56d2bEEpT4sK0KNqQM8/iFdVHjTLA0
h+45bH6aFU7rRMANxgbV7THnTMW2SbYzzhGROHGB3vMb7wIDAQABo4ICOTCCAjUw
DgYDVR0PAQH/BAQDAgWgMB0GA1UdJQQWMBQGCCsGAQUFBwMBBggrBgEFBQcDAjAM
BgNVHRMBAf8EAjAAMB0GA1UdDgQWBBTx9XKHPSgfL0YNX4jU2jZJGo41qTAfBgNV
HSMEGDAWgBSoSmpjBH3duubRObemRWXv86jsoTBvBggrBgEFBQcBAQRjMGEwLgYI
KwYBBQUHMAGGImh0dHA6Ly9vY3NwLmludC14My5sZXRzZW5jcnlwdC5vcmcwLwYI
KwYBBQUHMAKGI2h0dHA6Ly9jZXJ0LmludC14My5sZXRzZW5jcnlwdC5vcmcvMC8G
A1UdEQQoMCaCCGJpdXJvLmx0ggxkZXYuYml1cm8ubHSCDHd3dy5iaXVyby5sdDCB
/gYDVR0gBIH2MIHzMAgGBmeBDAECATCB5gYLKwYBBAGC3xMBAQEwgdYwJgYIKwYB
BQUHAgEWGmh0dHA6Ly9jcHMubGV0c2VuY3J5cHQub3JnMIGrBggrBgEFBQcCAjCB
ngyBm1RoaXMgQ2VydGlmaWNhdGUgbWF5IG9ubHkgYmUgcmVsaWVkIHVwb24gYnkg
UmVseWluZyBQYXJ0aWVzIGFuZCBvbmx5IGluIGFjY29yZGFuY2Ugd2l0aCB0aGUg
Q2VydGlmaWNhdGUgUG9saWN5IGZvdW5kIGF0IGh0dHBzOi8vbGV0c2VuY3J5cHQu
b3JnL3JlcG9zaXRvcnkvMBMGCisGAQQB1nkCBAMBAf8EAgUAMA0GCSqGSIb3DQEB
CwUAA4IBAQBZki20RN2bbpeaq2auZ8DgZmMlj07l3BUgAJdpsd+KEiOa8FxiiO+4
Te+PuGIbDRZHnC1H9ELbCyS2VPe2k4ZPoCrEs78+0g2bEGnifQRSHz4fc9u1wPCj
eVDPCX9KpQywxp+hdY+xrXrneRUZxvLq76Xypbb4MjNTKnP+imAl9DoqDQZx2LUz
3GS1BNjCYtkJu910Z+xPm88BJcK9ytHZDi6DqeN4erS/MfxFuF43dDBs4ObPAQDK
Jxsr6hl096H3UdQ8Pgc83UxR/tDsZttUHDvisYSmBZ8701CzMKgQjh4TwQ6qdlVV
+pcwt5S2HiF0miyZLpd4v9Iad46jvWWr
-----END CERTIFICATE-----
-----BEGIN PRIVATE KEY-----
MIIEvgIBADANBgkqhkiG9w0BAQEFAASCBKgwggSkAgEAAoIBAQCPmED9QkDHeiNf
ErF6rnnRUsO9mU6qJTlsbJkO7QOU3oQK7frMnd2IotHdpfIAIvofo4/IgRRYB4z/
FVYYX1CcCcZbMpN9CyMsLdcFPjcBbBd4JJfeTO2Mb200ju1RL2mgqrk5pikvssdD
HhsSGrZytFdKH7fx9g3BgXMnCHgZLXuh0zpvxqK6OdzKjnFYAhlYf31gJ8g/q+bh
CBT835dKPTQwTCDwVAZ7a6MZeyRyIXAWCK2if8s6nVuA4vivnxJxbuXarIYETnp3
ZsQSlPiwrQo2pAzz+IV1UeNMsDSH7jlsfpoVTutEwA3GBtXtMedMxbZJtjPOEZE4
cYHe8xvvAgMBAAECggEACqTknGFe3+qD2LZQBaINUaDq9ZD5rc8YlJrwNZUIIO7l
ptHBN420MD6xg9abO7tcAyBitiArW+MjZn00ZpYaKZbn5za2jBxZPRsgxzi3ZxmW
G8fKoiXdrf1MgQrfOJdlIw3EsStJ/kkoUCdZJlxojdQkbFAxmHP+zQtFd+0+yc7i
3OTUKJa0KtneV3Spt4XF0A1NkrZj30JBanYBeRW/0o8JWLaHi2cGjF3oUxiPJ4GB
29wa/moFxNDOmODQZB46aww9n+/HrJoS75ew9WIvW4oDmELw/Mbyl4KahthdJBiB
GxQDU9L6kKv5fkaXbhMeVqmuO3iZXL06X7EuqwrXkQKBgQDF2dYK7LG7u/w4gbsW
AYFo/4zM37VfQJdQVS5HCCaWI9HObBwsfWxyA/IymUjPfsdF5el3e3DQ22rg3G+V
Irn+oC9RuRoILOGrsU41oe6SZNc/lPCGQI4XuGtwBF/bv+fUSxEbcCg7pjhnEX9m
gS9wd39ZUH6UNjBhyRsUbcdcswKBgQC5zDiSZsp0dEd8YEZ9XsAQr6C2nR2kqt1T
lXjYpgjzONFsUF3kib6wo4Ezvc4W+doKSYYHwJATM1LCpHtU9P2bEzCTzjzT0nwd
NDLgKyK5d0pL7z4NaHwQBO0WkMcFLituHGpPwPVyZ3x4h6CIyVvr1L8ztD8P+i4r
Rq3ihaSZ1QKBgCKJVAO0LZJHzk9O1gmRWbWqZjmdE1v9OmybceiUU6gBuK3/0Ssy
+astZSnP+BXAW6in6Ykh0x+iLZXy5MdzuGPqMlhhp1ml+/6shKp4Cd0kHS7MIPBO
dH9PgfGb0d/aL+2u7N2NRnijG1ViiIqsIkvPkDtXAcF9dBSdtkxqnVJhAoGBALSA
f7FTZXqPgOeHTNP9mhBb34Gp0COqz4ylWRr46xcH6wUUarNdUsGehyXyTuapYze9
SBX98LqGkO+CBkN6I2tl0Dq4EQYkpellTcvUfE68YpS03479JBIYBxF2I7OXsB+w
QWQr7QhxG06pTL+3B7NsIzki8mUeQ35Nkx7PgSLlAoGBAIDifDmhZsVaH+Rz4x62
g776rA7gQZmIuwwEIdXe3pYY8xS5frKQgy1rsNYBzhwy+1+s6e77uJgL1LOXSUQh
06oyXCba7myXlDA425fKbmU8H1vaZh23ffNi+cwBtqnz/gwpbKobjndn/EwURtpQ
hZYjamyGxdtUYtFmkHLV/SrJ
-----END PRIVATE KEY-----
-----BEGIN CERTIFICATE-----
MIIGFzCCBP+gAwIBAgISA76O6ZPLNB+y6MoTnwKMLgoOMA0GCSqGSIb3DQEBCwUA
MEoxCzAJBgNVBAYTAlVTMRYwFAYDVQQKEw1MZXQncyBFbmNyeXB0MSMwIQYDVQQD
ExpMZXQncyBFbmNyeXB0IEF1dGhvcml0eSBYMzAeFw0xODA5MjQxMzAwNDRaFw0x
ODEyMjMxMzAwNDRaMBMxETAPBgNVBAMTCGJpdXJvLmx0MIIBIjANBgkqhkiG9w0B
AQEFAAOCAQ8AMIIBCgKCAQEAj5hA/UJAx3ojXxKxeq550VLDvZlOqiU5bGyZDu0D
lN6ECu36zJ3diKLR3aXyACL6H6OPyIEUWAeM/xVWGF9QnAnGWzKTfQsjLC3XBT43
AWwXeCSX3kztjG9tNI7tUS9poKq5OaYpL7LHQx4bEhq2crRXSh+38fYNwYFzJwh4
GS17odM6b8aiujncyo5xWAIZWH99YCfIP6vm4QgU/N+XSj00MEwg8FQGe2ujGXsk
ciFwFgiton/LOp1bgOL4r58ScW7l2qyGBE56d2bEEpT4sK0KNqQM8/iFdVHjTLA0
h+45bH6aFU7rRMANxgbV7THnTMW2SbYzzhGROHGB3vMb7wIDAQABo4IDLDCCAygw
DgYDVR0PAQH/BAQDAgWgMB0GA1UdJQQWMBQGCCsGAQUFBwMBBggrBgEFBQcDAjAM
BgNVHRMBAf8EAjAAMB0GA1UdDgQWBBTx9XKHPSgfL0YNX4jU2jZJGo41qTAfBgNV
HSMEGDAWgBSoSmpjBH3duubRObemRWXv86jsoTBvBggrBgEFBQcBAQRjMGEwLgYI
KwYBBQUHMAGGImh0dHA6Ly9vY3NwLmludC14My5sZXRzZW5jcnlwdC5vcmcwLwYI
KwYBBQUHMAKGI2h0dHA6Ly9jZXJ0LmludC14My5sZXRzZW5jcnlwdC5vcmcvMC8G
A1UdEQQoMCaCCGJpdXJvLmx0ggxkZXYuYml1cm8ubHSCDHd3dy5iaXVyby5sdDCB
/gYDVR0gBIH2MIHzMAgGBmeBDAECATCB5gYLKwYBBAGC3xMBAQEwgdYwJgYIKwYB
BQUHAgEWGmh0dHA6Ly9jcHMubGV0c2VuY3J5cHQub3JnMIGrBggrBgEFBQcCAjCB
ngyBm1RoaXMgQ2VydGlmaWNhdGUgbWF5IG9ubHkgYmUgcmVsaWVkIHVwb24gYnkg
UmVseWluZyBQYXJ0aWVzIGFuZCBvbmx5IGluIGFjY29yZGFuY2Ugd2l0aCB0aGUg
Q2VydGlmaWNhdGUgUG9saWN5IGZvdW5kIGF0IGh0dHBzOi8vbGV0c2VuY3J5cHQu
b3JnL3JlcG9zaXRvcnkvMIIBBAYKKwYBBAHWeQIEAgSB9QSB8gDwAHYAwRZK4Kdy
0tQ5LcgKwQdw1PDEm96ZGkhAwfoHUWT2M2AAAAFmC+HikgAABAMARzBFAiEAk+CB
Gj+P+nSHAdgc+0rb2+h2FCc/z2tyJ4TrwPJutmsCIHpCOgEdXfRVBWlBrFShFpJA
9bYLI3VP7H/JvYPJSxISAHYApFASaQVaFVReYhGrN7wQP2KuVXakXksXFEU+GyIQ
aiUAAAFmC+HinAAABAMARzBFAiEAkMkt+l3Y1UST6eXpAQUB3oWSiDuapU4BHl2Q
zDkxbyoCIBjJsq9AmthTM3e/8/Tp18lmMhZxtU2vZbWwSLJt1LZ2MA0GCSqGSIb3
DQEBCwUAA4IBAQAmsiez6bB13lBRYQqmYHG0HX1mJQPulHTMrEIqJnWzqjQIgZxg
XpBa9SXY1GxZLgiNsVCEBegwlXfkvjZsrvznTY80IpfCYxtsMHbHPfNRFM4zGaw6
K2pJK4tywjd+/ECExExN+82mvn1/0upI1sXiOeL2gljAsCjevdQmCH98jh5KkpUs
WzqgOr5pFGz4jtel5PeLnFVptqsSS/eHalbK0hOook8/nLEohKYW8qYQUx8B5Kye
s/C+0KtrwSEVA83j8YRqMR2lZZK9wFJG/QHXgKc36faybvaTenzp6pOJDLFnRSqN
d9QUxsZZh9+8oBDJUR8kljWiodUKIe7tFM2E
-----END CERTIFICATE-----
This source diff could not be displayed because it is too large. You can view the blob instead.
{
"presets": ["@babel/preset-env"]
}
# EditorConfig helps developers define and maintain consistent
# coding styles between different editors and IDEs
# editorconfig.org
root = true
[*]
# Change these settings to your own preference
indent_style = space
indent_size = 4
# We recommend you to keep these unchanged
end_of_line = lf
charset = utf-8
trim_trailing_whitespace = true
insert_final_newline = true
[*.md]
trim_trailing_whitespace = false
{
"extends": [
"standard-preact",
"eslint:recommended"
],
"parserOptions": {
"ecmaVersion": 6,
"sourceType": "module",
"ecmaFeatures": {
"jsx": true
}
},
"env": {
"browser": true,
"es6": true,
"node": true,
"mocha": true
},
"rules": {
"no-console": 0, // disallow use of console (off by default in the node environment)
"no-unused-vars": 1, // disallow declaration of variables that are not used in the code
"react/jsx-indent": [2, 4]
// 'indent': [2, 2, { 'SwitchCase': 1, 'VariableDeclarator': 4 }],
// 'react/jsx-indent': [2, 4],
// 'react/jsx-indent-props': [0, 2]
}
}
{
"rules": { }
}
User-agent: *
Disallow: /
{
"name": "Our demo",
"short_name": "Our demo",
"icons": [
{
"src": "/wp-content/themes/biuro/icons/android-chrome-192x192.png",
"sizes": "192x192",
"type": "image/png"
},
{
"src": "/wp-content/themes/biuro/icons/android-chrome-512x512.png",
"sizes": "512x512",
"type": "image/png"
}
],
"theme_color": "#ffffff",
"background_color": "#ffffff",
"display": "standalone"
}
/* ==========================================================================
Settings:
Used with preprocessors and contain font, colors definitions, etc.
global variables, such as brand colors, configs etc
========================================================================== */
@import '_settings--colors';
@import '_settings--typography';
@import '_settings--vars';
/* ------------- Settings: colors ------------- */
/* critical:start */
:root {
--color--light-orange: #ebe6de;
--color--dark-orange: #8f4a3f;
--color--gray: #4d4d4d;
}
/* critical:end */
/* ------------- Settings: typography ------------- */
/* critical:start */
:root {
--typo--font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
--typo--font-size: 2.4rem;
--typo--line-height: 1.286;
--typo--font-face: 'Open Sans', 'system', sans-serif;
}
/* critical:end */
/* ------------- Settings: vars ------------- */
/* critical:start */
:root {
/*
--header-height: 62px;
--border-top: inset 0 2px 1px -1px var(--color-light-gray);
*/
}
/* critical:end */
/* ==========================================================================
Tools:
Globally used mixins and functions. It’s important not to output any CSS in the first 2 layers.
mixins and helper functions
========================================================================== */
@import '_tools--custom-media';
@import '_tools--font-face';
/* ------------- Tools: custom media ------------- */
@custom-media --min--xxx-large (width >= 112.5rem); /* 1800px; */
@custom-media --min--xx-large (width >= 90rem); /* 1440px; */
@custom-media --min--x-large (width >= 80rem); /* 1281px; */
@custom-media --min--large (width >= 64rem); /* 1025px; */
@custom-media --min--medium (width >= 60rem); /* 960px; */
@custom-media --min--small (width >= 48rem); /* 768px; */
@custom-media --min--x-small (width >= 37.5rem); /* 600px; */
@custom-media --min--xx-small (width >= 30rem); /* 480px; */
@custom-media --min--xxx-small (width >= 22.5rem); /* 360px; */
@custom-media --min--xxxx-small (width >= 20rem); /* 320px; */
@custom-media --max--xxx-large (width < 112.5rem); /* 1800px; */
@custom-media --max--xx-large (width < 90rem); /* 1440px; */
@custom-media --max--x-large (width < 80rem); /* 1281px; */
@custom-media --max--large (width < 64rem); /* 1025px; */
@custom-media --max--medium (width < 60rem); /* 1025px; */
@custom-media --max--small (width < 48rem); /* 768px; */
@custom-media --max--x-small (width < 37.5rem); /* 600px; */
@custom-media --max--xx-small (width < 30rem); /* 480px; */
@custom-media --max--xxx-small (width < 22.5rem); /* 360px; */
@custom-media --max--xxxx-small (width < 20rem); /* 320px; */
/* ------------- Tools: font face ------------- */
/*
@font-face {
font-family: 'Avenir';
src: local('☺'),
url('../fonts/avenir-roman.woff2') format('woff2'),
url('../fonts/avenir-roman.woff') format('woff');
font-style: normal;
font-weight: 500;
font-display: swap;
}
@font-face {
font-family: 'Avenir';
src: local('☺'),
url('../fonts/avenir-heavy.woff2') format('woff2'),
url('../fonts/avenir-heavy.woff') format('woff');
font-style: normal;
font-weight: 600;
font-display: swap;
}
@font-face {
font-family: 'Avenir';
src: local('☺'),
url('../fonts/avenir-black.woff2') format('woff2'),
url('../fonts/avenir-black.woff') format('woff');
font-style: normal;
font-weight: 700;
font-display: swap;
}
*/
/* ==========================================================================
Generic:
Reset and/or normalize styles, box-sizing definition, etc. This is the first layer which generates actual CSS.
ground zero styles, reset styles such as normalize.css
========================================================================== */
@import '_generic--normalize.css';
@import '_generic--box-sizing.css';
/* ------------- Generic: box sizing ------------- */
/* critical:start */
html { box-sizing: border-box; }
*,
*:before,
*:after { box-sizing: inherit; }
/* critical:end */
/* ------------- Generic: normalize ------------- */
/* critical:start */
/* critical:end */
/*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */
/* Document
========================================================================== */
/**
* 1. Correct the line height in all browsers.
* 2. Prevent adjustments of font size after orientation changes in iOS.
*/
html {
line-height: 1.15; /* 1 */
-webkit-text-size-adjust: 100%; /* 2 */
}
/* Sections
========================================================================== */
/**
* Remove the margin in all browsers.
*/
body {
margin: 0;
}
/**
* Correct the font size and margin on `h1` elements within `section` and
* `article` contexts in Chrome, Firefox, and Safari.
*/
/*
h1 {
font-size: 2em;
margin: 0.67em 0;
}
*/
/* Grouping content
========================================================================== */
/**
* 1. Add the correct box sizing in Firefox.
* 2. Show the overflow in Edge and IE.
*/
hr {
box-sizing: content-box; /* 1 */
height: 0; /* 1 */
overflow: visible; /* 2 */
}
/**
* 1. Correct the inheritance and scaling of font size in all browsers.
* 2. Correct the odd `em` font sizing in all browsers.
*/
pre {
font-family: monospace, monospace; /* 1 */
font-size: 1em; /* 2 */
}
/* Text-level semantics
========================================================================== */
/**
* Remove the gray background on active links in IE 10.
*/
a {
background-color: transparent;
}
/**
* 1. Remove the bottom border in Chrome 57-
* 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
*/
abbr[title] {
border-bottom: none; /* 1 */
text-decoration: underline; /* 2 */
text-decoration: underline dotted; /* 2 */
}
/**
* Add the correct font weight in Chrome, Edge, and Safari.
*/
b,
strong {
font-weight: bolder;
}
/**
* 1. Correct the inheritance and scaling of font size in all browsers.
* 2. Correct the odd `em` font sizing in all browsers.
*/
code,
kbd,
samp {
font-family: monospace, monospace; /* 1 */
font-size: 1em; /* 2 */
}
/**
* Add the correct font size in all browsers.
*/
small {
font-size: 80%;
}
/**
* Prevent `sub` and `sup` elements from affecting the line height in
* all browsers.
*/
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sub {
bottom: -0.25em;
}
sup {
top: -0.5em;
}
/* Embedded content
========================================================================== */
/**
* Remove the border on images inside links in IE 10.
*/
img {
border-style: none;
}
/* Forms
========================================================================== */
/**
* 1. Change the font styles in all browsers.
* 2. Remove the margin in Firefox and Safari.
*/
button,
input,
optgroup,
select,
textarea {
font-family: inherit; /* 1 */
font-size: 100%; /* 1 */
line-height: 1.15; /* 1 */
margin: 0; /* 2 */
}
/**
* Show the overflow in IE.
* 1. Show the overflow in Edge.
*/
button,
input { /* 1 */
overflow: visible;
}
/**
* Remove the inheritance of text transform in Edge, Firefox, and IE.
* 1. Remove the inheritance of text transform in Firefox.
*/
button,
select { /* 1 */
text-transform: none;
}
/**
* Correct the inability to style clickable types in iOS and Safari.
*/
button,
[type="button"],
[type="reset"],
[type="submit"] {
-webkit-appearance: button;
}
/**
* Remove the inner border and padding in Firefox.
*/
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
border-style: none;
padding: 0;
}
/**
* Restore the focus styles unset by the previous rule.
*/
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
outline: 1px dotted ButtonText;
}
/**
* Correct the padding in Firefox.
*/
fieldset {
padding: 0.35em 0.75em 0.625em;
}
/**
* 1. Correct the text wrapping in Edge and IE.
* 2. Correct the color inheritance from `fieldset` elements in IE.
* 3. Remove the padding so developers are not caught out when they zero out
* `fieldset` elements in all browsers.
*/
legend {
box-sizing: border-box; /* 1 */
color: inherit; /* 2 */
display: table; /* 1 */
max-width: 100%; /* 1 */
padding: 0; /* 3 */
white-space: normal; /* 1 */
}
/**
* Add the correct vertical alignment in Chrome, Firefox, and Opera.
*/
progress {
vertical-align: baseline;
}
/**
* Remove the default vertical scrollbar in IE 10+.
*/
textarea {
overflow: auto;
}
/**
* 1. Add the correct box sizing in IE 10.
* 2. Remove the padding in IE 10.
*/
[type="checkbox"],
[type="radio"] {
box-sizing: border-box; /* 1 */
padding: 0; /* 2 */
}
/**
* Correct the cursor style of increment and decrement buttons in Chrome.
*/
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
height: auto;
}
/**
* 1. Correct the odd appearance in Chrome and Safari.
* 2. Correct the outline style in Safari.
*/
[type="search"] {
-webkit-appearance: textfield; /* 1 */
outline-offset: -2px; /* 2 */
}
/**
* Remove the inner padding in Chrome and Safari on macOS.
*/
[type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
}
/**
* 1. Correct the inability to style clickable types in iOS and Safari.
* 2. Change font properties to `inherit` in Safari.
*/
::-webkit-file-upload-button {
-webkit-appearance: button; /* 1 */
font: inherit; /* 2 */
}
/* Interactive
========================================================================== */
/*
* Add the correct display in Edge, IE 10+, and Firefox.
*/
details {
display: block;
}
/*
* Add the correct display in all browsers.
*/
summary {
display: list-item;
}
/* Misc
========================================================================== */
/**
* Add the correct display in IE 10+.
*/
template {
display: none;
}
/**
* Add the correct display in IE 10.
*/
[hidden] {
display: none;
}
/* ==========================================================================
Elements:
styling for bare HTML elements (like H1, A, etc.). These come with default styling from the browser so we can redefine them here.
a.k.a. Base, unclassed html elements, e.g. headings, lists, tables, this is the last layer that styles tag selectors
========================================================================== */
@import '_element--anchor.css';
@import '_element--body.css';
@import '_element--figure.css';
@import '_element--headers.css';
@import '_element--html.css';
@import '_element--images.css';
@import '_element--paragraph.css';
@import '_element--strong.css';
@import '_element--table.css';
/* ------------- Elements: anchor ------------- */
a {
/* critical:start */
color: var(--color--gray);
/* critical:end */
&:hover { text-decoration: none; }
}
@media (--min--x-large) {
[href^="tel"] { pointer-events: none; text-decoration: none; color: inherit; }
}
/* ------------- Elements: body ------------- */
/* critical:start */
body { margin: 0; color: var(--color--gray); font-weight: 300;
font-family: var(--typo--font-family);
font-size: calc(24px + 1 * ((100vw - 480px) / 960));
line-height: var(--typo--line-height);
/*
@media (--min--xx-large) {
font-size: 2.4rem;
}
*/
}
/* critical:end */
/* .fonts-loaded body { font-family: var(--typo--font-face); } */
/* ------------- Elements: figure ------------- */
figure { margin: 0; }
/* ------------- Elements: headers ------------- */
/* critical:start */
h1 { font-size: 4.8rem; line-height: 1.05; font-weight: 100; margin: 0; color: var(--color--dark-orange) }
/* h2 { font-size: 2.4rem; line-height: 1; font-weight: 500; margin: 0 0 2rem; } */
/* h3 { font-size: 1.7rem; line-height: 1.1; font-weight: 500; margin: 0 0 .8rem; } */
/* h4 { font-size: 1.6rem; line-height: 1.2; font-weight: 500; margin: 0 0 .8rem; } */
/* critical:end */
/* h1,
h2,
h3 {
@nest .fonts-loaded & { font-weight: 600; }
} */
/* ------------- Elements: html ------------- */
/* critical:start */
html { min-height: 100%; font-size: 62.5%; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
/* critical:end */
/* ------------- Elements: images ------------- */
img { max-width: 100%; }
/* ------------- Elements: paragraph ------------- */
p { margin: 0 0 1.8rem; font-size: var(--typo--font-size); }
/* ------------- Elements: strong ------------- */
b,
strong { font-weight: 600; }
/* ------------- Elements: table ------------- */
table { border-collapse: collapse; border-spacing: 0; }
/* ==========================================================================
Layouts:
Layout styles (e.g. container, header, main, footer, grid systems etc)
l-: layout classes
========================================================================== */
@import '_layout--container.css';
@import '_layout--header.css';
@import '_layout--main.css';
@import '_layout--nav.css';
@import '_layout--aside.css';
@import '_layout--footer.css';
/* ------------- Layout: aside ------------- */
/* critical:start */
.l-aside { }
/* critical:end */
/* ------------- Layout: container ------------- */
/* critical:start */
.l-container { }
/* critical:end */
/* ------------- Layout: footer ------------- */
/* critical:start */
.l-footer { }
/* critical:end */
/* ------------- Layout: header ------------- */
/* critical:start */
.l-header { }
/* critical:end */
/* .l-header { background: rgba(0, 0, 0, .25); } */
/* ------------- Layout: main ------------- */
/* critical:start */
.l-main { }
/* critical:end */
/* ------------- Layout: navigation ------------- */
/* critical:start */
.l-nav { }
/* critical:end */
/* ==========================================================================
Objects:
Class-based selectors which define undecorated design patterns, for example media object known from OOCSS
no cosmetic design patterns. Class only styles from here onwards. Classes here are loosely named and I start doing OOCSS here (e.g. .button, .list-item, grid systems etc)
o-: Signify that something is an Object, and that it may be used in any number of unrelated contexts to the one you can currently see it in. Making modifications to these types of class could potentially have knock-on effects in a lot of other unrelated places. Tread carefully.
========================================================================== */
@import '_object--nav.css';
/* ------------- Object: navigation ------------- */
/* critical:start */
/*.o-nav { margin: 0; padding: 0; list-style: none; }*/
/*.o-nav--item { display: block; }*/
/*.o-nav--link { display: block; }*/
/* critical:end */
/*.o-nav { user-select: none; }*/
/* ==========================================================================
Components:
Specific UI components. This is where majority of our work takes place and our UI components are often composed of Objects and Components
rich design UI styling. Class names here are more specific. This layer usually has the biggest volume
c-: Signify that something is a Component. This is a concrete, implementation-specific piece of UI. All of the changes you make to its styles should be detectable in the context you’re currently looking at. Modifying these styles should be safe and have no side effects.
========================================================================== */
/*@import '_component--logo.css';*/
/*@import '_component--nav.css';*/
/* ------------- Component: logo ------------- */
/* critical:start */
.c-logo { display: block; text-decoration: none; }
/* critical:end */
/* ------------- Component: nav ------------- */
/* critical:start */
/* critical:end */
.c-nav { }
.c-nav--item { margin: 10px; }
.c-nav--link { line-height: 40px; font-size: 24px; text-decoration: none;
&:hover { text-decoration: underline; }
}
/* ==========================================================================
States:
is-, has-: Signify that the piece of UI in question is currently styled a certain way because of a state or condition. This stateful namespace is gorgeous, and comes from SMACSS. It tells us that the DOM currently has a temporary, optional, or short-lived style applied to it due to a certain state being invoked.
========================================================================== */
/*@import '_state--nav.css';*/
/* ------------- State: nav ------------- */
/* critical:start */
.c-svg--toggler-close { display: none; margin-right: -28px; }
/* critical:end */
.is-nav--open {
& .l-nav { transform: translateX(0); pointer-events: auto; }
& .c-svg--toggler-open { display: none; }
& .c-svg--toggler-close { display: block; }
}
/* ==========================================================================
Themes:
If applicable, thematic styles are placed here (e.g. seasonal Christmas theme) Themed components, used for multiple sites with the same layout and components. Can be utilised for multi-site
t-: Signify that a class is responsible for adding a Theme to a view. It lets us know that UI Components’ current cosmetic appearance may be due to the presence of a theme.
========================================================================== */
/* @import '_theme--.css'; */
/* ==========================================================================
Trumps / Utils:
Utilities and helper classes with ability to override anything which goes before in the triangle, eg. hide helper class
utilities, helpers and overrides. !important is often used.
u-: Signify that this class is a Utility class. It has a very specific role (often providing only one declaration) and should not be bound onto or changed. It can be reused and is not tied to any specific piece of UI. You will probably recognise this namespace from libraries and methodologies like SUIT.
========================================================================== */
/* @import '_utils-alignment.css'; */
/* @import '_utils-floating.css'; */
/* @import '_utils-overflow.css'; */
/* @import '_utils-reset.css'; */
/* @import '_utils-fill.css'; */
/* @import '_utils-position.css'; */
/* @import '_utils-visibility.css'; */
/* @import '_utils-weight.css'; */
/* @import '_utils-width.css'; */
/**
* Misc utils
*
* @atom Misc
* @section Utils
* @markup
* <div>.u-no-wrap</div>
*/
/*.u-no-wrap { white-space: nowrap; }*/
/*
// .u-ellipsis-col { white-space: nowrap; max-width: 120px; overflow: hidden; text-overflow: ellipsis; }
// .u-break-normal { word-break: normal !important; }
// .u-text-upper { text-transform: uppercase; }
// .u-resize-vertical { resize: vertical; }
// Settings – used with preprocessors and contain font, colors definitions, etc.
// Tools – globally used mixins and functions. It’s important not to output any CSS in the first 2 layers.
// Generic – reset and/or normalize styles, box-sizing definition, etc. This is the first layer which generates actual CSS.
// Elements – styling for bare HTML elements (like H1, A, etc.). These come with default styling from the browser so we can redefine them here.
// Objects – class-based selectors which define undecorated design patterns, for example media object known from OOCSS
// Components – specific UI components. This is where majority of our work takes place and our UI components are often composed of Objects and Components
// Trumps – utilities and helper classes with ability to override anything which goes before in the triangle, eg. hide helper class
*/
/* ------------- Util: alignment ------------- */
/**
* Content alignment
*
* @atom Alignment
* @section Utils > Alignment
* @markup
* <div>.u-align-top</div>
* <div>.u-align-middle</div>
* <div>.u-align-bottom</div>
* <div>.u-align-left</div>
* <div>.u-align-center</div>
* <div>.u-align-justify</div>
* <div>.u-align-right</div>
*/
/*
.u-align-top { vertical-align: top; }
.u-align-middle { vertical-align: middle; }
.u-align-bottom { vertical-align: bottom; }
.u-align-left { text-align: left; }
.u-align-center { text-align: center; }
.u-align-justify { text-align: justify; }
.u-align-right { text-align: right; }
*/
/* ------------- Util: fill ------------- */
/**
* Fill styles
*
* @atom Fill
* @section Utils > Fill
* @markup
* <div>.u-fill--brand</div>
*/
/* critical:start */
/*.u-fill--brand { fill: var(--brand--color); }*/
/* critical:end */
/*
.u-no-padding { padding: 0; }
.u-no-select { user-select: none; }
.u-no-background { background: none; }
.u-no-border { border: 0; }
*/
/* ------------- Util: floating ------------- */
/**
* Floating elements
*
* @atom Floating
* @section Utils > Floating
* @markup
* <div>.u-f-none</div>
* <div>.u-f-left</div>
* <div>.u-f-right</div>
*/
/*
.u-f-none { float: none; }
.u-f-left { float: left; }
.u-f-right { float: right; }
*/
/* ------------- Util: overflow ------------- */
/**
* Overflow utils
*
* @atom Overflow
* @section Utils > Overflow
* @markup
* <div>.u-over-hidden</div>
* <div>.u-over-visible</div>
*/
/*
.u-over-hidden { overflow: hidden; }
.u-over-visible { overflow: visible; }
*/
/* ------------- Util: position ------------- */
/**
* Position utils
*
* @atom Position
* @section Utils > Position
* @markup
* <div>.u-pos--mid-abs</div>
*/
/* critical:start */
/*.u-pos--mid-abs { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }*/
/* critical:end */
/* ------------- Util: reset ------------- */
/**
* Reset styles
*
* @atom Reset
* @section Utils > Reset
* @markup
* <div>.u-no--margin</div>
*
* <div>.u-no--padding</div>
* <div>.u-no--select</div>
* <div>.u-no--background</div>
* <div>.u-no--border</div>
*/
/*.u-no--margin { margin: 0; }*/
/*
.u-no-padding { padding: 0; }
.u-no-select { user-select: none; }
.u-no-background { background: none; }
.u-no-border { border: 0; }
*/
/* ------------- Util: visibility ------------- */
/**
* Elements visibility
*
* @atom Visibility
* @section Utils > Visibility
* @markup
* <div>.u-hidden</div>
* <div>.u-hidden--max-small</div>
* <div>.u-hidden--visually</div>
* <div>.u-hidden--print</div>
*/
/* critical:start */
/*.u-hidden { display: none; }*/
/* critical:end */
/*
.u-hidden--max-small {
@media (--max--small) {
display: none;
}
}
.u-hidden--visually { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } */
/*
@media print {
.u-hidden--print { display: none; }
}
*/
/* ------------- Util: weight ------------- */
/**
* Element font weight example: .u-weight--700 { font-weight: 700; }
*
* @atom Weight
* @section Utils > Weight
* @markup
* <div>.u-weight--500</div>
* <div>.u-weight--600</div>
* <div>.u-weight--700</div>
*/
/*
.u-weight--500 { font-weight: 500; }
.u-weight--600 { font-weight: 600; }
*/
/*.u-weight--700 { font-weight: 700; }*/
/* ------------- Util: width ------------- */
/**
* Element width example: .u-width--75 { width: 75%; }
*
* @atom Width
* @section Utils > Width
* @markup
* <div>.u-width--10</div>
* <div>.u-width--20</div>
* <div>.u-width--25</div>
* <div>.u-width--30</div>
* <div>.u-width--33</div>
* <div>.u-width--50</div>
* <div>.u-width--66</div>
* <div>.u-width--75</div>
* <div>.u-width--100</div>
*/
/*
.u-width--10 { width: 10%; }
.u-width--20 { width: 20%; }
.u-width--25 { width: 25%; }
.u-width--30 { width: 30%; }
.u-width--33 { width: 33.33%; }
.u-width--50 { width: 50%; }
.u-width--66 { width: 66.67%; }
.u-width--75 { width: 75%; }
.u-width--100 { width: 100%; }
*/
This diff is collapsed.
<?xml version="1.0" encoding="utf-8"?>
<browserconfig>
<msapplication>
<tile>
<square150x150logo src="/wp-content/themes/biuro/icons/mstile-150x150.png"/>
<TileColor>#fcfcfc</TileColor>
</tile>
</msapplication>
</browserconfig>
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
width="700.000000pt" height="700.000000pt" viewBox="0 0 700.000000 700.000000"
preserveAspectRatio="xMidYMid meet">
<metadata>
Created by potrace 1.11, written by Peter Selinger 2001-2013
</metadata>
<g transform="translate(0.000000,700.000000) scale(0.100000,-0.100000)"
fill="#000000" stroke="none">
<path d="M3435 6636 c-32 -14 -49 -31 -1113 -1085 -376 -372 -780 -770 -897
-886 -1241 -1225 -1332 -1317 -1344 -1355 -16 -53 -14 -78 9 -125 35 -73 143
-110 213 -73 14 7 148 133 297 280 148 147 274 269 278 272 4 3 8 -597 8
-1332 -1 -735 3 -1370 7 -1411 30 -264 220 -478 488 -550 70 -19 107 -20 703
-21 618 0 630 0 672 20 26 13 53 36 66 58 l23 37 2 740 c1 407 2 745 2 750 1
7 240 11 750 11 838 0 800 -4 851 71 20 29 25 48 24 94 -1 70 -29 113 -90 140
-40 18 -81 19 -891 19 l-848 -1 -40 -22 c-22 -13 -49 -40 -62 -62 l-23 -40 0
-746 0 -745 -522 1 c-501 1 -525 2 -574 22 -97 38 -169 115 -196 207 -9 31
-13 421 -14 1566 l-2 1525 323 320 c266 264 874 866 1816 1798 77 75 144 137
149 137 6 0 77 -66 159 -147 82 -82 461 -457 842 -834 382 -377 795 -786 919
-909 191 -189 1243 -1227 1255 -1239 3 -2 26 -9 52 -16 135 -34 246 102 184
223 -11 21 -262 277 -583 593 -609 602 -759 751 -1748 1729 -963 953 -982 972
-1017 987 -41 16 -89 16 -128 -1z"/>
<path d="M5911 2928 c-48 -13 -77 -35 -103 -76 l-22 -35 -1 -936 c-1 -515 -5
-949 -10 -966 -25 -94 -104 -181 -194 -217 -55 -21 -63 -22 -681 -23 l-625 -2
-43 -27 c-105 -66 -100 -216 9 -274 l44 -23 650 3 c594 3 655 5 705 22 253 83
421 272 463 521 9 53 12 311 11 998 0 877 -1 927 -19 954 -45 70 -112 99 -184
81z"/>
</g>
</svg>
This diff is collapsed.
const RT_API = {
root: '//town.loc.al/'
}
const config = {
// http://www.gnuton.org/blog/react-theme/wp-json/v1/prettyPermalink/blog/
endpoints: {
'wp-api': `${RT_API.root}wp/v2`,
'prettypermalink': `${RT_API.root}react-theme/v1/prettyPermalink/`,
'menu': `${RT_API.root}react-theme/v1/menu-locations/`,
'languages': `${RT_API.root}pll/v1/languages/`
}
};
export { config };
// require('./../sass/styles.scss');
// import 'babel-polyfill';
import React from 'react';
import ReactDom from 'react-dom';
import {Provider} from 'react-redux';
import {Router, browserHistory} from 'react-router';
import routes from './routes';
import store from './store';
ReactDom.render(
<Provider store={store}>
<Router history={browserHistory} routes={routes}/>
</Provider>,
document.getElementById('container')
);
import React from 'react';
import {Route, IndexRoute} from 'react-router';
import Blog from './containers/blog';
import Search from './containers/search';
import Category from './containers/category';
import Tag from './containers/tag';
import Single from './containers/single';
export default (
<Route path="/">
<IndexRoute component={Blog}/>
<Route path="page/:pageNum" component={Blog} addHandlerKey={true}/>
<Route path="search/:term" component={Search}/>
<Route path="category/:slug/" component={Category}/>
<Route path="category/:parent/:slug/" component={Category}/>
<Route path="category/:slug/:pageNum(\\d+)" component={Category}/>
<Route path="category/:parent/:slug/:pageNum(\\d+)" component={Category}/>
<Route path="tag/:slug" component={Tag}/>
<Route path="tag/:slug/:pageNum(\\d+)" component={Tag}/>
<Route path="*" component={Single}/>
</Route>
);
import preact, { h, Component } from 'preact'; // eslint-disable-line no-unused-vars
import { Router, Route } from 'preact-router'
import Home from './containers/home';
import Page from './containers/page';
import Header from './components/header';
import Navigation from './components/navigation';
import Footer from './components/footer';
export default class Routes extends Component {
constructor() {
super();
this.state = {
menus: {},
pages: {},
page: {},
posts: [],
initiated: false
}
this.changed = (e) => {
const pages = this.state.pages || {},
page = pages[e.url] || null;
if (!page) {
return;
}
console.error('changed: ' + new Date().getTime());
console.dir(e);
console.dir(page);
// this.setState({
// categoryID: page.categoryID,
// // page: page
// })
document.title = page.title;
// console.error('changed to: ' + e.url);
// console.dir(e.url);
// console.error('Page: ' + e.url);
// console.dir(page);
// console.log('categoryID: ' + page.categoryID);
}
}
componentWillMount() {
// // initial
// this.setState({
// menus: state.menus,
// pages: state.pages,
// })
// console.dir(state);
console.log('Routes: componentWillMount: ' + new Date().getTime());
}
componentDidMount() {
console.log('Routes: componentDidMount: ' + new Date().getTime());
}
componentWillUnmount() {
console.log('Routes: componentWillUnmount: ' + new Date().getTime());
}
componentWillReceiveProps() {
console.log('Routes: componentWillReceiveProps: ' + new Date().getTime());
}
shouldComponentUpdate() {
}
componentWillUpdate() {
console.log('Routes: componentWillUpdate: ' + new Date().getTime());
}
componentDidUpdate() {
console.log('Routes: componentDidUpdate: ' + new Date().getTime());
}
render(props) {
if (!this.state.initiated) {
this.setState({
initiated: true,
menus: props.menus,
pages: props.pages,
})
}
// // this.setState({
// // categoryID: 13
// // })
// // state = Object.assign({}, props);
// console.error('Routes: 17');
// console.dir(this.state);
// console.log('----------------');
// console.dir(props);
return (
<div class="l-wrap">
<Header />
<Navigation />
<Router onChange={this.changed}>
<Route path="/" component={Home} page={this.state.page} />
<Route default component={Page} page={this.state.page} />
</Router>
<Footer menus={this.state.menus} />
</div>
)
}
}
import {createStore, applyMiddleware} from 'redux';
import thunk from 'redux-thunk';
import promise from 'redux-promise-middleware';
// import logger from 'redux-logger';
import combinedReducers from './reducers';
// const appliedMiddleware = applyMiddleware(promise(), thunk, logger());
const appliedMiddleware = applyMiddleware(promise(), thunk);
export default createStore(combinedReducers, appliedMiddleware);
// <!-- Global site tag (gtag.js) - Google Analytics -->
// <script async src="https://www.googletagmanager.com/gtag/js?id=UA-116106305-1"></script>
// <script>
// window.dataLayer = window.dataLayer || [];
// function gtag(){dataLayer.push(arguments);}
// gtag('js', new Date());
// gtag('config', 'UA-116106305-1');
// </script>
// gtag('config', 'GA_TRACKING_ID', {'page_path': '/new-page.html'});
// // gtag('event', 'page_view', { 'send_to': 'GA_TRACKING_ID' });
const ID = 'UA-116106305-1';
const res = document.createElement('script');
res.async = 'true';
res.src = 'https://www.googletagmanager.com/gtag/js?id=' + ID;
const script = document.getElementsByTagName('script')[0];
script.parentNode.insertBefore(res, script);
window.dataLayer = window.dataLayer || [];
const gtag = () => {
window.dataLayer.push(arguments)
}
gtag('js', new Date());
gtag('config', ID);
export default (path) => {
gtag('config', ID, {'page_path': path});
}
// var resource = document.createElement('script');
// resource.async = 'true';
// resource.src = "http://example.com/script.js";
// var script = document.getElementsByTagName('script')[0];
// script.parentNode.insertBefore(resource, script);
// export class Sticker {
// constructor () {
// this.delay = 6500;
// this.max = 5;
// this.sticker = document.querySelector('#sticker');
// this.update = this.update.bind(this);
// if (!this.sticker) {
// return;
// }
// this.update();
// }
// getNo () {
// return Math.floor(Math.random() * Math.floor(this.max));
// }
// update () {
// this.sticker.dataset.sticker = this.getNo();
// setTimeout(this.update, this.delay);
// }
// }
// new Sticker();
import preact, { h, Component } from 'preact'; // eslint-disable-line no-unused-vars
import { getSourceSet } from '../helpers/helpers';
export default class Footer extends Component {
constructor() {
super();
}
render(props) {
const img = props.img,
classCSS = props.classCSS || 'o-figure--inner';
if (!img) {
return (
<div class="o-figure--inner" style="box-shadow: inset rgba(0, 0, 0, .15) 0px 0px 1px 1px" />
);
}
const srcset = getSourceSet(img),
holder = img.holder + '.webp 1x';
return (
<div class={classCSS}>
<picture class="o-figure--holder">
<source type="image/webp" srcset={holder} class="o-figure--holder" />
<img src={img.holder} tabindex="-1" alt="" class="o-figure--holder" />
</picture>
<picture class="o-figure--picture">
<source type="image/webp" media="(max-width: 338px)" srcset={srcset.imgwebp} />
<source type="image/webp" media="(max-width: 498px)" srcset={srcset.mediumwebp} />
<source type="image/webp" srcset={srcset.largewebp} />
<source media="(max-width: 338px)" srcset={srcset.img} />
<source media="(max-width: 498px)" srcset={srcset.medium} />
<img srcset={srcset.large} src={img.large} alt={img.text} />
</picture>
</div>
);
}
}
import preact, { h, Component } from 'preact'; // eslint-disable-line no-unused-vars
export default class Footer extends Component {
constructor() {
super();
}
render(props) {
const pages = props.pages || [],
page = props.page || {},
paths = page.paths || [];
return (
<footer class="l-footer" role="contentinfo">
<hr />
<ul class="o-nav c-nav-lang">
{paths.sort((a, b) => a.order > b.order).map(path => {
return (
<li><a href={path.path}>{path.name}</a></li>
)
})}
</ul>
<ul class="o-nav c-nav-sub">
{pages.sort((a, b) => a.order > b.order).map(item => {
let classCSS = 'o-nav--link c-nav-sub--link';
if (item.objectID === page.ID) {
classCSS += ' is-active--nav-sub--link'
}
return (
<li class="o-nav--item c-nav-sub--item">
<a class={classCSS} href={item.path}>{item.title}</a>
</li>
);
})}
</ul>
</footer>
);
}
}
import preact, { h, Component } from 'preact'; // eslint-disable-line no-unused-vars
export default class Header extends Component {
constructor() {
super();
}
render(props) {
const page = props.page || {},
homeURL = page.homeURL || '/',
title = page.title || '';
return (
<header class="l-header" role="banner">
<a href={homeURL} class="c-logo" title={title}>
<img src="/i/logo.svg" alt="Body & Mind & Soul logo" class="c-logo--svg" />
<img src="/i/slogan.svg" alt="Body & Mind & Soul slogan" class="c-logo--svg-slogan" />
</a>
</header>
);
}
}
import preact, { h, Component } from 'preact'; // eslint-disable-line no-unused-vars
export default class Location extends Component {
constructor(props) {
super(props);
}
componentDidMount() {
if (window.google) {
return;
}
const s = document.createElement("script")
s.src = 'https://maps.googleapis.com/maps/api/js?key=AIzaSyAWdUXaoWq9b655Nm0TFCo8-GYFWIB3Z4M'
s.async = true
s.defer = true
s.onload = () => {
const map = new window.google.maps.Map(document.getElementById('map'), {
center: {lat: 54.687754, lng: 25.275849},
zoom: 17,
mapTypeControlOptions: {
mapTypeIds: [window.google.maps.MapTypeId.ROADMAP, window.google.maps.MapTypeId.HYBRID, 'tehgrayz']
}
});
const type = new window.google.maps.StyledMapType([{
featureType: 'all',
elementType: 'all',
stylers: [{ saturation: -100 }]
}], { name: "Grayscale" });
map.mapTypes.set('tehgrayz', type);
map.setMapTypeId('tehgrayz');
// new window.google.maps.Marker({
// position: new window.google.maps.LatLng(54.687740, 25.275846),
// map: map,
// icon: new window.google.maps.MarkerImage('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAE0AAABECAYAAADEBrh4AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAB1dJREFUeNrsW3lMVEcY/3ZZLgVBrYFUbkOtmCBoqbUcpmgVS/2jak3TGtGoiAdJBdSIpOLZBtNoTbWJ2sYmVkWpiUgVEZWqIGBFLB5VkKMBiYAKgrKc2/k+9m13EXbfA5SHzi+ZzL7ZfY+Z3/vuGRQBAUEa4JACeyXnQDo4aZw0ThonjZPGSeMY0KQ5OjrC4cOH4PjxJAgPXyJb0lSymoxKBSNHvg0KhQLs7e25pInB8+fPoa2tjT4LPSfNCEaPHg2BgQFw6dJlbtPEYsaMEIiJiQa1upGuUUW5TTOBlpYW6s3MzHTXI0a8BcHBwXSdnZ0NZWX/ctL0odG0G1w3NzeDi4srrFy5gq7r6uo4aQg3NzeYMiUYGhoaYPBgG0bc/1Uq1E59Z9Da2srVEzFq1ChYsCCMvOaVK9lEmsCboKbcEXSCID3Pnj3TSRmSVVNTAw8eVEJjYyPcufMPNDU1gVKp5JLWHczNzcno+/v7Q2hoKJSXl8OgQYMo8OWkGXEI5uYWMGbMu2BjYwPW1lbQ3t4uq2BXtgk7ek8h9EDChg8fzpzGFBg6dCgnTSyB6Gnj479hvSsnTQwwO0AVFRonbQCCk/a6kyaXJF4pBxJMBa4Yo2HQi79XKPr/PfdrnNbe3kYhhVrdpMsIVCpzNq4xyENra+vgxo2/ITn5JBQXF7/ZpF29+hfMn7+A0ql5874iiSsrK6O0avLkIPqNra0trFgRSWNy8Jz9ThrmlpgmITIzsyhxP3IkkXpMnVAlnzyphfr6ennZVn5qSDL4qaEBm7APGzaMknM0/lgWwlwTP6ONs7Kyou8bGuqhurrm9SINwwEs60iNpZAgBwcHmDv3c8jNvcoMfgMVInGDxdraGjw9Pcn23b59Bx4/ftKjEhF66L50In1GGhpurH+pVGagEWkllUoFFBYWMbJy4ebNm5CWlgZ+fu9BSEgILfTy5UywtLQk0ioqyqlcNG7cOApJxL3Ijj41NZUIlx1pGBIcPXq0FzFbOxGEOHMmjYjCcAOrtuhFcZPl2rVrjNxb3HsKQNuFBKGKI9CmoarjONbQ8KWgvZOD95RN5VatVlMvFB8F4PXTp08HhvfUzweFt65/rdGIF1BUO5QgDFqlGGRUS6llbmHevTH8uFZj6+uWtF27dsKQIUN0Hg4n05EwK+DcufNw4MCvJv+4q6srREQsBSenkdqFaCAnJxv27ftZt6NuDKtXx5CDSEn5w2A8NPQT8PHxga1btxmMe3h4QGTkSoiNXU82sTs4OztDXFws7Nz5A+126QN39Vet+po9I046afv3/8Kko+Pr5cuXwb17heTdkLSHD6tMLtjX1wc2b95ESTYSjHGWq6sbCy3mwO7dP7KJRZGdMobi4hKYM2c2nDp12kByZs6cCWPHerHn7GHJfK1ufNq0j5k6NxklTJB8Ly8vmt/ChYsM0jTc1PH0fKdnpaH8/HxKqLFVVVVBUVERfcZYCpNqY7Czs4P162OZRO2HvXv3wd27d1nI8ACysrIgKiqGiEcJNIWMjAw66Ofk5KQbc3d3ZxpgS0cUxo/31VusOQQEBEBS0u+iVLi8vILN6x5s3Bj/gilC4ntdT1MqzXReTQyCggJJ/U6cSO4ytEhISIDg4I9oh8kY8GWhhOMeqIBJkz6gQDcxMZFJ1jTduLe3N5MgC/ayb4is42lg27ZvmWe2h8WLF0mzmy/Du+BxA1xYdygtLWPhRTOzQe4mn4X2bOrUYJ0j8vPzgwsXLrCWwf6OB9kghL//h3D9er4oW9lRt1ORZ46JWQOzZn1GL7FfSevsfbuGOA+cmZnJ1NGO1NTR0QHs7e1YkJtHh2awbDRhwgT6HfYnT6ZImqOFhQU8evQINmyIh+joKHJcaA9NpYIvhTSsrnp5jen2e9y7xDd9/77pKiw6i+Li+zBx4vukpmhPhZgOJc7X15elVt7Mw7fCrVs9yxZycnLh2LEk2LRpI0UMLS2tr540PAKKXmj27FldSmB0dDScPZvOJEVcPpiScgqmT59Ox0tRLQWkp58j6QgLCyMn1ZvYDD18SUkJbUj3iXqiGEupLiAZW7ZshSVLFrNwJYLO02Kshsn4jh3f03kN9KziJSGHYisXFxc6kiWgurqasgV87unTqRJMh4KtyfKF8YSE7ZS2OTs79T5hLywshMrKSklvLi8vD8LDI8gzrV27hiaKhhfL2gcP/iYp0sf70tPTiaDOadbFixdJXUtLS0U/DzOTgoKCF+aA4+vWxcLSpeEDI2EfQODl7h5FBpwCThonjZPGSeOkcXDSXj4UUmr9fYXAwMl7WLesh7djGI9JbbJhvvvnay9pkZ0X/YruHbikMalAaZnPWoHEW7ez9tMba9MYcXWsm8FahchbULrWvfGOgBFXoSWuzsRPc1n7QmvPuPdkxBVoVbU7QopY+5S1Rh5yGBKXrDXwnVGn9ZTVPE7rGmjgv9O7btYSVgAyg9yC2zi9cGIha+flGNzK7f8927QG/0vWDsk1I/hPgAEAFVQqJuvXiMgAAAAASUVORK5CYII=', new window.google.maps.Size(77, 68), new window.google.maps.Point(0, 0)),
// title: 'The Town'
// });
}
document.body.appendChild(s);
}
render() {
return null;
}
}
import preact, { h, Component } from 'preact'; // eslint-disable-line no-unused-vars
import AsyncRoute from 'preact-async-route';
// import Location from '../components/location';
// import { Link } from 'preact-router';
export default class Navigation extends Component {
constructor() {
super();
}
render(props) {
const pages = props.pages || [],
page = props.page || {};
console.error('navigation: ' + new Date().getTime());
return (
<nav id="nav" class="l-nav" role="navigation">
<ul id="nav-list" class="o-nav c-nav">
{pages.sort((a, b) => a.order > b.order).map(item => {
let classCSS = 'o-nav--link c-nav--link';
if (item.objectID === page.ID) {
classCSS += ' is-active--nav--link'
}
return (
<li class="o-nav--item c-nav--item">
<a class={classCSS} href={item.path}>{item.title}</a>
</li>
);
})}
</ul>
<div id="sticker" class="o-box c-box--sticker" data-sticker="4" />
<div id="map" class="o-box c-box--map">
<AsyncRoute page={page} getComponent={() => import('./location' /* webpackChunkName: 'location' */ ).then(module => module.default)} loading={() => <h1>loading ...</h1>} />
</div>
<div class="o-box">
<h2>OPENING HOURS</h2>
<h3 class="u-no--margin">Town Vilnius</h3>
<p>MON: 8:00-22:00</p>
<h3 class="u-no--margin">Town Kaunas</h3>
<p>MON: 10:00-22:00</p>
<h3 class="u-no--margin">Steak for Break</h3>
<p>MON: 11:00-22:00</p>
<p>
<a href="/" class="u-weight-700" title="The Town Steakhouse restaurants opening hours">More details</a>
</p>
</div>
</nav>
);
}
}
import preact, { h, Component } from 'preact'; // eslint-disable-line no-unused-vars
import Swiper from './vendor/swiper';
import Figure from './figure';
// https://github.com/developit/preact/issues/768
// https://github.com/kidjp85/react-id-swiper/blob/master/src/ReactIdSwiper.js
export default class SwiperGallery extends Component {
constructor() {
super();
this.initialize = (ref) => {
this.container = ref;
}
}
componentDidMount() {
this.swiper = new Swiper(this.container, {
loop: true,
navigation: {
nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev',
},
pagination: {
el: '.swiper-pagination',
},
});
}
componentWillUnmount() {
if (typeof this.swiper !== 'undefined') {
this.swiper.destroy(true, true);
}
delete this.swiper;
}
render(props) {
const page = props.page || {},
images = page.images || [];
return (
<div class="swiper-container o-figure--inner" ref={ref => this.initialize(ref)}>
<div class="swiper-wrapper">
{images.map(img => {
return (
<Figure img={img} classCSS='swiper-slide' />
);
})}
</div>
<div class="swiper-button-next" />
<div class="swiper-button-prev" />
<div class="swiper-pagination" />
</div>
);
}
}
This diff is collapsed.
This diff is collapsed.
This source diff could not be displayed because it is too large. You can view the blob instead.
const pkg = require('../package.json');
const date = {
day: new Date().getDate(),
month: ('January February March April May June July August September October November December').split(' ')[new Date().getMonth()],
year: new Date().getFullYear(),
};
module.exports = `${`
/**
* Swiper ${pkg.version}
* ${pkg.description}
* ${pkg.homepage}
*
* Copyright 2014-${date.year} ${pkg.author}
*
* Released under the ${pkg.license} License
*
* Released on: ${date.month} ${date.day}, ${date.year}
*/
`.trim()}\n`;
module.exports = {
components: [
'virtual',
'keyboard',
'mousewheel',
'navigation',
'pagination',
'scrollbar',
'parallax',
'zoom',
'lazy',
'controller',
'a11y',
'history',
'hash-navigation',
'autoplay',
'effect-fade',
'effect-cube',
'effect-flip',
'effect-coverflow',
],
target: 'universal',
themeColor: '#007aff',
colors: {
white: '#ffffff',
black: '#000000',
},
};
/* eslint import/no-extraneous-dependencies: ["error", {"devDependencies": true}] */
/* eslint no-console: "off" */
const gulp = require('gulp');
const fs = require('fs');
const rollup = require('rollup');
const buble = require('rollup-plugin-buble');
const replace = require('rollup-plugin-replace');
const resolve = require('rollup-plugin-node-resolve');
const header = require('gulp-header');
const uglify = require('gulp-uglify');
const sourcemaps = require('gulp-sourcemaps');
const rename = require('gulp-rename');
const config = require('./build-config.js');
const banner = require('./banner.js');
function es(components, cb) {
const env = process.env.NODE_ENV || 'development';
const target = process.env.TARGET || config.target;
// Bundle
rollup.rollup({
input: './src/swiper.js',
external: ['dom7', 'ssr-window'],
plugins: [
replace({
delimiters: ['', ''],
'process.env.NODE_ENV': JSON.stringify(env),
'process.env.TARGET': JSON.stringify(target),
'//IMPORT_COMPONENTS': components.map(component => `import ${component.capitalized} from './components/${component.name}/${component.name}';`).join('\n'),
'//INSTALL_COMPONENTS': components.map(component => `${component.capitalized}`).join(',\n '),
'//EXPORT': 'export default Swiper',
}),
],
}).then(bundle => bundle.write({
format: 'es',
name: 'Swiper',
strict: true,
sourcemap: env === 'development',
sourcemapFile: `./${env === 'development' ? 'build' : 'dist'}/js/swiper.esm.bundle.js.map`,
banner,
file: `./${env === 'development' ? 'build' : 'dist'}/js/swiper.esm.bundle.js`,
})).then(() => {
if (cb) cb();
}).catch((err) => {
if (cb) cb();
console.error(err.toString());
});
// Modular
rollup.rollup({
input: './src/swiper.js',
external: ['dom7', 'ssr-window'],
plugins: [
replace({
delimiters: ['', ''],
'process.env.NODE_ENV': JSON.stringify(env),
'process.env.TARGET': JSON.stringify(target),
'//IMPORT_COMPONENTS': components.map(component => `import ${component.capitalized} from './components/${component.name}/${component.name}';`).join('\n'),
'//INSTALL_COMPONENTS': '',
'//EXPORT': `export { Swiper, ${components.map(component => component.capitalized).join(', ')} }`,
}),
],
}).then(bundle => bundle.write({
format: 'es',
name: 'Swiper',
strict: true,
banner,
sourcemap: env === 'development',
sourcemapFile: `./${env === 'development' ? 'build' : 'dist'}/js/swiper.esm.js.map`,
file: `./${env === 'development' ? 'build' : 'dist'}/js/swiper.esm.js`,
})).then(() => {
if (cb) cb();
}).catch((err) => {
if (cb) cb();
console.error(err.toString());
});
}
function umd(components, cb) {
const env = process.env.NODE_ENV || 'development';
const target = process.env.TARGET || config.target;
rollup.rollup({
input: './src/swiper.js',
plugins: [
replace({
delimiters: ['', ''],
'process.env.NODE_ENV': JSON.stringify(env),
'process.env.TARGET': JSON.stringify(target),
'//IMPORT_COMPONENTS': components.map(component => `import ${component.capitalized} from './components/${component.name}/${component.name}';`).join('\n'),
'//INSTALL_COMPONENTS': components.map(component => `${component.capitalized}`).join(',\n '),
'//EXPORT': 'export default Swiper;',
}),
resolve({ jsnext: true }),
buble(),
],
}).then(bundle => bundle.write({
format: 'umd',
name: 'Swiper',
strict: true,
sourcemap: env === 'development',
sourcemapFile: `./${env === 'development' ? 'build' : 'dist'}/js/swiper.js.map`,
banner,
file: `./${env === 'development' ? 'build' : 'dist'}/js/swiper.js`,
})).then(() => {
if (env === 'development') {
if (cb) cb();
return;
}
// Minified version
gulp.src('./dist/js/swiper.js')
.pipe(sourcemaps.init())
.pipe(uglify())
.pipe(header(banner))
.pipe(rename((filePath) => {
/* eslint no-param-reassign: ["error", { "props": false }] */
filePath.basename += '.min';
}))
.pipe(sourcemaps.write('./'))
.pipe(gulp.dest('./dist/js/'))
.on('end', () => {
cb();
});
}).catch((err) => {
if (cb) cb();
console.error(err.toString());
});
}
function build(cb) {
const env = process.env.NODE_ENV || 'development';
const components = [];
config.components.forEach((name) => {
// eslint-disable-next-line
const capitalized = name.split('-').map((word) => {
return word.split('').map((char, index) => {
if (index === 0) return char.toUpperCase();
return char;
}).join('');
}).join('');
const jsFilePath = `./src/components/${name}/${name}.js`;
if (fs.existsSync(jsFilePath)) {
components.push({ name, capitalized });
}
});
const expectCbs = env === 'development' ? 1 : 2;
let cbs = 0;
umd(components, () => {
cbs += 1;
if (cbs === expectCbs) cb();
});
if (env !== 'development') {
es(components, () => {
cbs += 1;
if (cbs === expectCbs) cb();
});
}
}
module.exports = build;
/* eslint import/no-extraneous-dependencies: ["error", {"devDependencies": true}] */
/* eslint no-console: "off" */
const gulp = require('gulp');
const fs = require('fs');
const modifyFile = require('gulp-modify-file');
const less = require('gulp-less');
const autoprefixer = require('gulp-autoprefixer');
const header = require('gulp-header');
const rename = require('gulp-rename');
const cleanCSS = require('gulp-clean-css');
const config = require('./build-config.js');
const banner = require('./banner.js');
function build(cb) {
const env = process.env.NODE_ENV || 'development';
const components = [];
config.components.forEach((name) => {
const lessFilePath = `./src/components/${name}/${name}.less`;
if (fs.existsSync(lessFilePath)) {
components.push(name);
}
});
const colors = [];
Object.keys(config.colors).forEach((key) => {
colors.push(`${key} ${config.colors[key]}`);
});
gulp.src('./src/swiper.less')
.pipe(modifyFile((content) => {
const newContent = content
.replace('//IMPORT_COMPONENTS', components.map(component => `@import url('./components/${component}/${component}.less');`).join('\n'))
.replace('$themeColor', config.themeColor)
.replace('$colors', colors.join(', '));
return newContent;
}))
.pipe(less())
.on('error', (err) => {
if (cb) cb();
console.error(err.toString());
})
.pipe(autoprefixer({
cascade: false,
}))
.on('error', (err) => {
if (cb) cb();
console.error(err.toString());
})
.pipe(header(banner))
.pipe(gulp.dest(`./${env === 'development' ? 'build' : 'dist'}/css/`))
.on('end', () => {
if (env === 'development') {
if (cb) cb();
return;
}
gulp.src('./dist/css/swiper.css')
.pipe(cleanCSS({
advanced: false,
aggressiveMerging: false,
}))
.pipe(header(banner))
.pipe(rename((filePath) => {
/* eslint no-param-reassign: ["error", { "props": false }] */
filePath.basename += '.min';
}))
.pipe(gulp.dest('./dist/css/'))
.on('end', () => {
if (cb) cb();
});
});
}
module.exports = build;
/* eslint no-console: ["error", { allow: ["log"] }] */
const gulp = require('gulp');
const connect = require('gulp-connect');
const gopen = require('gulp-open');
const modifyFile = require('gulp-modify-file');
const buildJs = require('./build-js.js');
const buildLess = require('./build-less.js');
// Tasks
gulp.task('playground', (cb) => {
const env = process.env.NODE_ENV || 'development';
gulp.src('./playground/index.html')
.pipe(modifyFile((content) => {
if (env === 'development') {
return content
.replace('../dist/css/swiper.min.css', '../build/css/swiper.css')
.replace('../dist/js/swiper.min.js', '../build/js/swiper.js');
}
return content
.replace('../build/css/swiper.css', '../dist/css/swiper.min.css')
.replace('../build/js/swiper.js', '../dist/js/swiper.min.js');
}))
.pipe(gulp.dest('./playground/'))
.on('end', () => {
if (cb) cb();
});
});
gulp.task('js', (cb) => {
buildJs(cb);
});
gulp.task('less', (cb) => {
buildLess(cb);
});
gulp.task('build', ['js', 'less']);
gulp.task('watch', () => {
gulp.watch('./src/**/**/*.js', ['js']);
gulp.watch('./src/**/**/*.less', ['less']);
});
gulp.task('connect', () => {
connect.server({
root: ['./'],
livereload: true,
port: '3000',
});
});
gulp.task('open', () => {
gulp.src('./playground/index.html').pipe(gopen({ uri: 'http://localhost:3000/playground/' }));
});
gulp.task('server', ['watch', 'connect', 'open']);
gulp.task('default', ['server']);
import $ from '../../utils/dom';
import Utils from '../../utils/utils';
const a11y = {
makeElFocusable($el) {
$el.attr('tabIndex', '0');
return $el;
},
addElRole($el, role) {
$el.attr('role', role);
return $el;
},
addElLabel($el, label) {
$el.attr('aria-label', label);
return $el;
},
disableEl($el) {
$el.attr('aria-disabled', true);
return $el;
},
enableEl($el) {
$el.attr('aria-disabled', false);
return $el;
},
onEnterKey(e) {
const swiper = this;
const params = swiper.params.a11y;
if (e.keyCode !== 13) return;
const $targetEl = $(e.target);
if (swiper.navigation && swiper.navigation.$nextEl && $targetEl.is(swiper.navigation.$nextEl)) {
if (!(swiper.isEnd && !swiper.params.loop)) {
swiper.slideNext();
}
if (swiper.isEnd) {
swiper.a11y.notify(params.lastSlideMessage);
} else {
swiper.a11y.notify(params.nextSlideMessage);
}
}
if (swiper.navigation && swiper.navigation.$prevEl && $targetEl.is(swiper.navigation.$prevEl)) {
if (!(swiper.isBeginning && !swiper.params.loop)) {
swiper.slidePrev();
}
if (swiper.isBeginning) {
swiper.a11y.notify(params.firstSlideMessage);
} else {
swiper.a11y.notify(params.prevSlideMessage);
}
}
if (swiper.pagination && $targetEl.is(`.${swiper.params.pagination.bulletClass}`)) {
$targetEl[0].click();
}
},
notify(message) {
const swiper = this;
const notification = swiper.a11y.liveRegion;
if (notification.length === 0) return;
notification.html('');
notification.html(message);
},
updateNavigation() {
const swiper = this;
if (swiper.params.loop) return;
const { $nextEl, $prevEl } = swiper.navigation;
if ($prevEl && $prevEl.length > 0) {
if (swiper.isBeginning) {
swiper.a11y.disableEl($prevEl);
} else {
swiper.a11y.enableEl($prevEl);
}
}
if ($nextEl && $nextEl.length > 0) {
if (swiper.isEnd) {
swiper.a11y.disableEl($nextEl);
} else {
swiper.a11y.enableEl($nextEl);
}
}
},
updatePagination() {
const swiper = this;
const params = swiper.params.a11y;
if (swiper.pagination && swiper.params.pagination.clickable && swiper.pagination.bullets && swiper.pagination.bullets.length) {
swiper.pagination.bullets.each((bulletIndex, bulletEl) => {
const $bulletEl = $(bulletEl);
swiper.a11y.makeElFocusable($bulletEl);
swiper.a11y.addElRole($bulletEl, 'button');
swiper.a11y.addElLabel($bulletEl, params.paginationBulletMessage.replace(/{{index}}/, $bulletEl.index() + 1));
});
}
},
init() {
const swiper = this;
swiper.$el.append(swiper.a11y.liveRegion);
// Navigation
const params = swiper.params.a11y;
let $nextEl;
let $prevEl;
if (swiper.navigation && swiper.navigation.$nextEl) {
$nextEl = swiper.navigation.$nextEl;
}
if (swiper.navigation && swiper.navigation.$prevEl) {
$prevEl = swiper.navigation.$prevEl;
}
if ($nextEl) {
swiper.a11y.makeElFocusable($nextEl);
swiper.a11y.addElRole($nextEl, 'button');
swiper.a11y.addElLabel($nextEl, params.nextSlideMessage);
$nextEl.on('keydown', swiper.a11y.onEnterKey);
}
if ($prevEl) {
swiper.a11y.makeElFocusable($prevEl);
swiper.a11y.addElRole($prevEl, 'button');
swiper.a11y.addElLabel($prevEl, params.prevSlideMessage);
$prevEl.on('keydown', swiper.a11y.onEnterKey);
}
// Pagination
if (swiper.pagination && swiper.params.pagination.clickable && swiper.pagination.bullets && swiper.pagination.bullets.length) {
swiper.pagination.$el.on('keydown', `.${swiper.params.pagination.bulletClass}`, swiper.a11y.onEnterKey);
}
},
destroy() {
const swiper = this;
if (swiper.a11y.liveRegion && swiper.a11y.liveRegion.length > 0) swiper.a11y.liveRegion.remove();
let $nextEl;
let $prevEl;
if (swiper.navigation && swiper.navigation.$nextEl) {
$nextEl = swiper.navigation.$nextEl;
}
if (swiper.navigation && swiper.navigation.$prevEl) {
$prevEl = swiper.navigation.$prevEl;
}
if ($nextEl) {
$nextEl.off('keydown', swiper.a11y.onEnterKey);
}
if ($prevEl) {
$prevEl.off('keydown', swiper.a11y.onEnterKey);
}
// Pagination
if (swiper.pagination && swiper.params.pagination.clickable && swiper.pagination.bullets && swiper.pagination.bullets.length) {
swiper.pagination.$el.off('keydown', `.${swiper.params.pagination.bulletClass}`, swiper.a11y.onEnterKey);
}
},
};
export default {
name: 'a11y',
params: {
a11y: {
enabled: true,
notificationClass: 'swiper-notification',
prevSlideMessage: 'Previous slide',
nextSlideMessage: 'Next slide',
firstSlideMessage: 'This is the first slide',
lastSlideMessage: 'This is the last slide',
paginationBulletMessage: 'Go to slide {{index}}',
},
},
create() {
const swiper = this;
Utils.extend(swiper, {
a11y: {
liveRegion: $(`<span class="${swiper.params.a11y.notificationClass}" aria-live="assertive" aria-atomic="true"></span>`),
},
});
Object.keys(a11y).forEach((methodName) => {
swiper.a11y[methodName] = a11y[methodName].bind(swiper);
});
},
on: {
init() {
const swiper = this;
if (!swiper.params.a11y.enabled) return;
swiper.a11y.init();
swiper.a11y.updateNavigation();
},
toEdge() {
const swiper = this;
if (!swiper.params.a11y.enabled) return;
swiper.a11y.updateNavigation();
},
fromEdge() {
const swiper = this;
if (!swiper.params.a11y.enabled) return;
swiper.a11y.updateNavigation();
},
paginationUpdate() {
const swiper = this;
if (!swiper.params.a11y.enabled) return;
swiper.a11y.updatePagination();
},
destroy() {
const swiper = this;
if (!swiper.params.a11y.enabled) return;
swiper.a11y.destroy();
},
},
};
/* a11y */
.swiper-container .swiper-notification {
position: absolute;
left: 0;
top: 0;
pointer-events: none;
opacity: 0;
z-index: -1000;
}
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment