From e0e3f51b1762f58bf64e77ad639e5322bf2f82c9 Mon Sep 17 00:00:00 2001
From: Feoktist Shovchko <fshovchko@exadel.com>
Date: Tue, 30 May 2023 20:27:00 +0300
Subject: [PATCH 01/18] docs(gh-pages): news section

---
 pages/11ty/date.js                        |  14 ++
 pages/11ty/join.js                        |  11 ++
 pages/src/common/links.less               |  11 ++
 pages/src/landing/blogs/blogs.less        | 155 +++++++++++++++++
 pages/views/_includes/landing/blogs2.njk  |  33 ++++
 pages/views/_includes/landing/blogs3.njk  |  31 ++++
 pages/views/articles/ESL v4.0.0 copy 2.md | 196 +++++++++++++++++++++
 pages/views/articles/ESL v4.0.0 copy.md   | 197 ++++++++++++++++++++++
 pages/views/articles/ESL v4.0.0.md        | 197 ++++++++++++++++++++++
 pages/views/blogs/ESL v4.0.0 copy 2.md    | 197 ++++++++++++++++++++++
 pages/views/blogs/ESL v4.0.0 copy.md      | 197 ++++++++++++++++++++++
 pages/views/blogs/ESL v4.0.0.md           |   6 +-
 pages/views/index.njk                     |   3 +-
 13 files changed, 1244 insertions(+), 4 deletions(-)
 create mode 100644 pages/11ty/date.js
 create mode 100644 pages/11ty/join.js
 create mode 100644 pages/views/_includes/landing/blogs2.njk
 create mode 100644 pages/views/_includes/landing/blogs3.njk
 create mode 100644 pages/views/articles/ESL v4.0.0 copy 2.md
 create mode 100644 pages/views/articles/ESL v4.0.0 copy.md
 create mode 100644 pages/views/articles/ESL v4.0.0.md
 create mode 100644 pages/views/blogs/ESL v4.0.0 copy 2.md
 create mode 100644 pages/views/blogs/ESL v4.0.0 copy.md

diff --git a/pages/11ty/date.js b/pages/11ty/date.js
new file mode 100644
index 000000000..43ee075e3
--- /dev/null
+++ b/pages/11ty/date.js
@@ -0,0 +1,14 @@
+module.exports = (config) => {
+  /** Filter items by hidden marker */
+  const notHiddenFilter = (date2) => {
+    let date = new Date(date2);
+    let year = date.getFullYear();
+    let month = date.getMonth() +1
+    let day = date.getDate();
+    let finaldate = `${month}-${day}-${year}`
+
+    return finaldate
+  };
+
+  config.addFilter('date', notHiddenFilter);
+};
diff --git a/pages/11ty/join.js b/pages/11ty/join.js
new file mode 100644
index 000000000..2292530b8
--- /dev/null
+++ b/pages/11ty/join.js
@@ -0,0 +1,11 @@
+module.exports = function (config) {
+  config.addCollection('news', function(collection) {
+    const collections = collection.getAll()[0].data.collections;
+    const news = collections.blogs.concat(collections.articles).sort((a, b) => a.date - b.date)
+    news.title = 'Articles & News'
+    return news;
+    /* collection.getAll().filter((item) => {
+      console.log(item.data.tags)
+      return item.data?.tags?.includes('articles')})*/
+  });
+};  
diff --git a/pages/src/common/links.less b/pages/src/common/links.less
index 47e0d4ea0..4f1f521ce 100644
--- a/pages/src/common/links.less
+++ b/pages/src/common/links.less
@@ -7,6 +7,7 @@
   font-size: 1rem;
   font-weight: 600;
 
+
   &::after, &::before {
     display: inline-block;
     margin: 0 5px;
@@ -53,6 +54,16 @@
   }
 }
 
+.arrow-link2 {
+  color: white;
+
+  &::after, &::before {
+    background-color: white;
+    transform: rotate(90deg);
+  }
+}
+
+
 // Icon link hover effect
 .icon-link:hover svg {
   filter: drop-shadow(0 0 4px @link-fg);
diff --git a/pages/src/landing/blogs/blogs.less b/pages/src/landing/blogs/blogs.less
index 5f4e4538a..498781def 100644
--- a/pages/src/landing/blogs/blogs.less
+++ b/pages/src/landing/blogs/blogs.less
@@ -48,3 +48,158 @@
     font-size: 1rem;
   }
 }
+
+.blogs2 {
+  position: relative;
+  margin-bottom: 2rem;
+
+  &-item {
+    display: flex;
+    flex: 1 0 0px;
+    align-items: center;
+    padding: 10px 45px;
+    list-style: none;
+
+    &::before {
+      content: '';
+      position: absolute;
+      top: 0;
+      left: 1px;
+      height: 100%;
+      border-left: 3px solid #cfcfcf;
+    }
+  }
+
+  &-container {
+    // padding-bottom: 35px;
+    margin-bottom: 0;
+  }
+
+  &-content-name {
+    margin-bottom: 20px;
+    font-size: 1.5rem;
+  }
+
+  &-content-text {
+    margin-bottom: 20px;
+    font-size: 1rem;
+  }
+
+  &-more {
+    text-align: center;
+    padding-bottom: 20px;
+
+    /* &::before {
+      content: '';
+      position: absolute;
+      left: calc(37.5%);
+      bottom: 1px;
+
+      width: 25%;
+      border-bottom: 3px solid #cfcfcf;
+    }
+
+    &::after {
+      content: '';
+      position: absolute;
+      left: calc(50% - 10px);
+      bottom: -11px;
+
+      transform: rotate(45deg);
+
+      width: 20px;
+      height: 20px;
+      border-right: 3px solid #cfcfcf;
+      border-bottom: 3px solid #cfcfcf;
+    }*/
+  }
+}
+
+.blogs3 {
+  position: relative;
+  margin-bottom: 2rem;
+
+  &-item {
+    display: flex;
+    flex: 1 0 0px;
+    align-items: center;
+    padding: 30px 45px;
+    list-style: none;
+
+    @media @sm-xl {
+      display: block;
+    }
+    @media @sm {
+      min-width: 300px;
+      max-width: 350px;
+    }
+    @media @md-lg {
+      min-width: 540px;
+      max-width: 700px;
+    }
+    @media @xl {
+      min-width: 600px;
+      max-width: 700px;
+    }
+
+    &::before {
+      content: '';
+      position: absolute;
+      top: 0;
+      left: 1px;
+      height: 100%;
+      border-left: 3px solid #cfcfcf;
+    }
+  }
+
+  &-container {
+    padding-bottom: 35px;
+
+    @media @sm-xl {
+      padding-bottom: 50px;
+      display: flex;
+      flex-direction: column;
+      max-height: 700px;
+      flex-wrap: wrap;
+    }
+  }
+
+  &-content-name {
+    margin-bottom: 20px;
+    font-size: 1.5rem;
+  }
+
+  &-content-text {
+    margin-bottom: 20px;
+    font-size: 1rem;
+  }
+
+  &-more {
+    text-align: center;
+    padding-bottom: 20px;
+
+    /* &::before {
+      content: '';
+      position: absolute;
+      left: calc(37.5%);
+      bottom: 1px;
+
+      width: 25%;
+      border-bottom: 3px solid #cfcfcf;
+    }
+
+    &::after {
+      content: '';
+      position: absolute;
+      left: calc(50% - 10px);
+      bottom: -11px;
+
+      transform: rotate(45deg);
+
+      width: 20px;
+      height: 20px;
+      border-right: 3px solid #cfcfcf;
+      border-bottom: 3px solid #cfcfcf;
+    }*/
+  }
+}
diff --git a/pages/views/_includes/landing/blogs2.njk b/pages/views/_includes/landing/blogs2.njk
new file mode 100644
index 000000000..f95643234
--- /dev/null
+++ b/pages/views/_includes/landing/blogs2.njk
@@ -0,0 +1,33 @@
+{% set releasedBlogs = collections.news | released %}
+{% if releasedBlogs.length %}
+<div class="blogs2 container">
+  <h2>{{ collections.news.title }}</h2>
+  <esl-animate target="::next::child" group></esl-animate>
+  <ul class="blogs2-container">
+    {% for item in releasedBlogs | reverse | limit(3) %}
+      <li class="blogs2-item esl-animate-slide-down">
+        <div class="blogs2-content">
+          {% set found = false %}
+          {% for tag in item.data.tags %}
+            {% if tag === 'articles' %}{% set found = true %}{% endif %}
+          {% endfor %}
+
+          <h4 class="blogs2-content-name">
+            {% if found %} 🚩
+            {% else %} ⚡️ 
+            {% endif %}
+            {{ item.data.name }}
+
+            <span style="float: right; font-size: 0.5em;">({{item.date | date}})</span>
+          </h4>
+          <p class="blogs2-content-text">{{ item.templateContent | text | truncate(250) }}          <a class="arrow-link btn-link btn-sm"  href="{{ item.url | url }}">{{ landing.blogs.cta.text }}</a></p>
+        </div>
+      </li>
+    {% endfor %}
+  </ul>
+  {# <div class="blogs2-more">
+    <a class="arrow-link btn-link arrow-link2" style="text-align: center" href="{{ item.url | url }}">Load More</a>
+  </div> #}
+  {# <div class="blogs2-more">Load More</div> #}
+</div>
+{% endif %}
diff --git a/pages/views/_includes/landing/blogs3.njk b/pages/views/_includes/landing/blogs3.njk
new file mode 100644
index 000000000..c84c675e4
--- /dev/null
+++ b/pages/views/_includes/landing/blogs3.njk
@@ -0,0 +1,31 @@
+{% set releasedBlogs = collections.news | released %}
+{% if releasedBlogs.length %}
+<div class="blogs3 container">
+  <h2>{{ collections.news.title }}</h2>
+  <esl-animate target="::next::child" group></esl-animate>
+  <ul class="blogs3-container">
+    {% for item in releasedBlogs | reverse | limit(6) %}
+      <li class="blogs3-item esl-animate-slide-down">
+        <div class="blogs3-content">
+          {% set found = false %}
+          {% for tag in item.data.tags %}
+            {% if tag === 'articles' %}{% set found = true %}{% endif %}
+          {% endfor %}
+
+          <h4 class="blogs3-content-name">
+            {% if found %} 🚩
+            {% else %} ⚡️ 
+            {% endif %}
+            {{ item.data.name }}
+            <span style="float: right; font-size: 0.5em;">({{item.date | date}})</span>
+          </h4>
+          <p class="blogs3-content-text">{{ item.templateContent | text | truncate(250) }} <a class="arrow-link btn-link btn-sm"  href="{{ item.url | url }}">{{ landing.blogs.cta.text }}</a></p>
+        </div>
+      </li>
+    {% endfor %}
+  </ul>
+  {# <div class="blogs2-more">
+    <a class="arrow-link btn-link arrow-link2" style="text-align: center" href="{{ item.url | url }}">Load More</a>
+  </div> #}
+</div>
+{% endif %}
diff --git a/pages/views/articles/ESL v4.0.0 copy 2.md b/pages/views/articles/ESL v4.0.0 copy 2.md
new file mode 100644
index 000000000..5cabd607b
--- /dev/null
+++ b/pages/views/articles/ESL v4.0.0 copy 2.md	
@@ -0,0 +1,196 @@
+---
+layout: content
+name: Article1
+title: Article1
+tags: [articles, New]
+date: 2022-06-01
+containerCls: container markdown-container
+---
+
+## ESL Core
+### Features:
+  - `ESLEventListener`s currency_exchange :currency_exchange: functionality introduced
+  - `ESLMixinElement`s functionality introduced
+  - `ESLBaseElement` extended API 
+    - `ESLBaseElement.create` shortcut to create current custom element
+
+### Structural changes:
+  - Attribute decorators moved to the `esl-utils`
+  - All ESL modules migrated to `ESLEventListener`s
+  - Event names are now defined on the prototype level
+
+### BREAKING CHANGES
+  - `$$fire` no longer adds 'esl:' prefix to the fired events
+
+---
+
+## ESL Media Query
+
+### Features:
+  - `ESLMediaQuery` now implements `EventTarget` interface
+  - `ESLMediaRuleList` API reworked with `EventTarget` interface and new calculation strategy
+
+### BREAKING CHANGES
+  - `ESLMediaRuleList.parseTuple` arguments order changed
+  - `ESLMediaRule` no longer supports default marker, now "default" is equal to "all" query
+  - `ESLMediaRuleList` observation callback signature changed, now it should be `EventListener`
+  - `ESLMediaRuleList.prototype.default` removed as no longer default rules
+  - `ESLMediaRuleList` no longer fires events on rule change, now it's based on active value change
+  - `ESLMediaRuleList` now uses merging of all active rules to define result value, however you were still able to get the last active rule value
+  - `ESLMediaRuleList.prototype.active` now returns an array of active rules
+
+---
+
+## ESL Traversing Query
+
+### Features:
+  - add comma support to define multiple target ([#1120](https://github.com/exadel-inc/esl/issues/1120) / [#1129](https://github.com/exadel-inc/esl/issues/1129)) ([2890d7b](https://github.com/exadel-inc/esl/commit/2890d7b7667492b982b266048d23874c57b938ea)), closes [#1102](https://github.com/exadel-inc/esl/issues/1102)
+  - add ability to find closest element ([ada6fbb](https://github.com/exadel-inc/esl/commit/ada6fbb172a2fb2cf0d435420ad8fb0a46e7766f))
+
+---
+  
+## ESL Utils
+
+### Features:
+  - ability to grow/shrink axis of the `Rect` ([1c58a1c](https://github.com/exadel-inc/esl/commit/1c58a1c19b0aa82abf7eb73c40781e9c4a4860ba))
+  - `SyntheticEventTarget` to implement `EventTarget` interface with more listeners control ([e4f3eb8](https://github.com/exadel-inc/esl/commit/e4f3eb89e0dd8227937d476a8d2090730342de64))
+  - simplify and extend `@prop` decorator API ([fd6ede3](https://github.com/exadel-inc/esl/commit/fd6ede34b0a3c7496083cb58aa9b726d4a692085))
+  - add `skipOneRender` RAF utility ([ddc3227](https://github.com/exadel-inc/esl/commit/ddc322798e6f8cf447874896786fe6d368bbe5ef))
+  - add ability to pass predicate to sequence finder ([dd8c3cb](https://github.com/exadel-inc/esl/commit/dd8c3cbb43ed529330c32459b9787949a0927a01))
+  - add `@decorate` decorator to bind and decorate method of the class
+  - `@attr` extended with ability to pass Serializer/Parser ([012eb83](https://github.com/exadel-inc/esl/commit/012eb83ebcbba8315a2766af090239774c21234e))
+  - create dom html sanitize method ([004642f](https://github.com/exadel-inc/esl/commit/004642f866ac1b2ed5278084963288d8c2fd17e0))
+  - create `extractValues` object utility ([8edd9e7](https://github.com/exadel-inc/esl/commit/8edd9e7b564b4ac78a4fc952ee58f76b6a54cf89))
+  - create cumulative imports for esl-utils submodules ([2e9d6ad](https://github.com/exadel-inc/esl/commit/2e9d6ad8f327ede991feef4ebc7c76fdd55726af))
+
+### BREAKING CHANGES
+  - `isMouseEvent`, `isTouchEvent` moved outside of `EventUtils`
+  - `normalizeTouchPoint` renamed to `touchPoint` and moved outside of `EventUtils`
+  - `normalizeCoordinates` removed. Use `getOffsetPoint` in combination with `getTouchPoint` instead
+  - `@prop` signature changed `prop(value?: any, prototypeConfig: OverrideDecoratorConfig = {})` instead
+  - `ScrollUtils.lock` no longer accessible. Use `lockScroll(document.documentElement, {strategy: '...'})` instead
+  - `ScrollUtils.unlock` no longer accessible. Use `unlockScroll(document.documentElement, {strategy: '...'})` instead
+  - `ScrollUtils.lockRequest` no longer accessible. Use `lockScroll(document.documentElement, {strategy: '...', initiatior})` instead
+  - `ScrollUtils.unlockRequest` no longer accessible. Use `unlockScroll(document.documentElement, {strategy: '...', initiatior})` instead
+
+### Bugfixes
+  - make attr decorators correctly strict typed
+  - `deepMerge` primitive values merging improved, undefined arguments now ignored ([5b7b730](https://github.com/exadel-inc/esl/commit/5b7b73003acd4d29250af12603ced5d58c40aff6))
+  - fix `@bind` decorator to save original function enumerable marker ([92c2086](https://github.com/exadel-inc/esl/commit/92c2086df610a5572143463302baf7aeea6174e9))
+  - update `@decorate` decorator to allow to save context properly (on instance level) ([0ac1b0c](https://github.com/exadel-inc/esl/commit/0ac1b0cb9c90648ae1e0a18a16a936971c4b4ee9))
+
+---
+
+## ESL Toggleable and ESL Trigger
+
+### Features:
+  - migrate `esl-toggleable` and `esl-trigger` to ESLEventListeners
+  - `esl:show:request` additional data ([a121872](https://github.com/exadel-inc/esl/commit/a121872b6e69fd7fb7a71bdfa9058430e650f423))
+  - support of `esl:hide:request` ([8a0928b](https://github.com/exadel-inc/esl/commit/8a0928b2f2bda63c6fbbaf5e9b6453d660091ec1))
+  - add support of dynamic `aria-label` for `esl-trigger` ([5c18841](https://github.com/exadel-inc/esl/commit/5c188418720ad4a972caa7450563a29268d8ec97))
+  - add esc key event handler for `esl-trigger` ([3dab6da](https://github.com/exadel-inc/esl/commit/3dab6dad39259f7e920c9a108757271cb58a216d))
+  - add `ignore-esc` attribute for `esl-trigger` ([605b715](https://github.com/exadel-inc/esl/commit/605b715a29ef1a852e24ce5120ca30d394fc19c1))
+
+
+## ESL Panel and ESL Panel Group
+
+### Features:
+  - migrate `esl-panel` and `esl-panel-group` to ESLEventListeners
+  - add `refresh-strategy` attribute ([#1156](https://github.com/exadel-inc/esl/issues/1156)) ([36027ad](https://github.com/exadel-inc/esl/commit/36027ad2574c0c33df1b6370484448a6889a647a))
+  - add ability to control min/max open panels per media condition ([67ca2ba](https://github.com/exadel-inc/esl/commit/67ca2ba16e3fc4ee4300d1c79ca2e5d0da845af7))
+
+### BREAKING CHANGES
+  - `ESLPanelGroup.noCollapse` (with related attribute) renamed to `ESLPanelGroup.noAnimate` (`no-animate` attribute)
+  - `ESLPanelGroup.shouldCollapse` renamed to `ESLPanelGroup.shouldAnimate`
+  - `PanelActionParams.noCollapse` renamed to `PanelActionParams.noAnimate`
+  - `ESLPanelGroup` `view` attribute is no longer supported
+  - `open` mode of `ESLPanelGroup` is no longer supported, it should be replaced with a `min-open-items="all"`
+  - `accordion-group="single"` attribute of `ESLPanelGroup` is no longer supported, replaced with `max-open-items="1"`
+  - `accordion-group="single"` attribute of `ESLPanelGroup` is no longer supported, replaced with `max-open-items="all"`
+  - components inherited from `ESLPanelGroup` should use `@listen({inherit: true})` for proper subscription
+
+### Bugfixes
+  - add `capturedBy` and fix `after:show` dispatch ([9bdc98c](https://github.com/exadel-inc/esl/commit/9bdc98c98a2926fe42c7cd15007c31a19171027c))
+  - fix `esl:before:hide` bubbling from uncontrolled toggleables ([9212b6b](https://github.com/exadel-inc/esl/commit/9212b6beacd97d39d0410a464598e9e2e0bdb1c2))
+  - fix animation process capturing by `ESLPanel` component ([9a5b3a5](https://github.com/exadel-inc/esl/commit/9a5b3a576d5cb4dbd47d113d944932586155c7f6))
+  - change `no-animate` API ([dde3500](https://github.com/exadel-inc/esl/commit/dde35009268a92bae92a45f00d11cb29edee98fa))
+
+
+## ESL Tab and ESLTabs
+
+### Features:
+  - `esl-tab` and `esl-tabs` migrated to ESLEventListeners
+
+### Bugfixes:
+  - fix alignment behavior ([b5ebd66](https://github.com/exadel-inc/esl/commit/b5ebd668de7b4d1eea7311ae7d734c02abb537cf))
+
+### BREAKING CHANGES
+  - Listeners extended from `ESLTab` should now use `@listen` annotation to work correctly
+  - Listeners extended from `ESLTabs` should now use `@listen` annotation to work correctly
+
+## ESL Alert
+
+### Features:
+  - `esl-alert` migrated to ESLEventListeners, inner API updates
+
+### BREAKING CHANGES
+  - Listeners extended from `ESLAlert` should now use `@listen` annotation to work correctly
+  - `eventNs` is no longer supported, event is now defined directly on the prototype level
+
+
+## ESL Popup
+
+### Features:
+  - add configurable `rootMargin` for the popup activator observer ([5d647d6](https://github.com/exadel-inc/esl/commit/5d647d60673a65e7b27472c1b68a1e174fa40740))
+  - add extended `offsetContainer` configuration ([63cbc0a](https://github.com/exadel-inc/esl/commit/63cbc0a996a8578549360dadaa3bb17c53884bfe))
+
+### BREAKING CHANGES
+  - Listeners extended from `ESLPopup` should now use `@listen` annotation to work correctly
+
+
+## ESL Footnotes
+
+### Features:
+  - migrate `esl-notes` and `esl-footnotes` to ESLEventListeners
+  - add configurable `intersectionMargin`  for the note tooltip activator observer ([b9b1599](https://github.com/exadel-inc/esl/commit/b9b159942e3534965f43cac94c140d5680308548))
+
+### BREAKING CHANGES
+  - Listeners extended from `ESLNote` should now use `@listen` annotation to work correctly
+  - Listeners extended from `ESLFootnote` should now use `@listen` annotation to work correctly
+  - `eventNs` is no longer supported, event is now defined directly on the prototype level
+
+## ESL Image and ESL Media
+
+### Bugfixes:
+  - fix esl-image to prevent DOM XSS vulnerabilities ([4fd925d](https://github.com/exadel-inc/esl/commit/4fd925df8605994b0f7d345d77a425e0cdc487e8))
+  - fix wrong error status on svg images in FF ([cad6b40](https://github.com/exadel-inc/esl/commit/cad6b40ccce01aaea8b1869b2cd7d542939a4fd4))
+
+
+## ESL Scrollbar
+
+### Features:
+  - migrate `esl-scrollbar` to ESLEventListeners
+
+### Bugfixes
+  - remove unnecessary width ([6e18909](https://github.com/exadel-inc/esl/commit/6e18909c6768c259d76084b463404fe6b29c9af8))
+
+### BREAKING CHANGES
+  - Listeners extended from `ESLScrollbar` should now use `@listen` annotation to work correctly
+
+
+## ESL Select
+
+### Features:
+  - migrate `esl-select` to ESLEventListeners ([76ca947](https://github.com/exadel-inc/esl/commit/76ca9479090546cdf092d1c9c3f5d993263f0581))
+  - add `dropdown-class` param to specify dropdown additional CSS class(es) ([938357f](https://github.com/exadel-inc/esl/commit/938357fa6fb5db804f445f31eb4f73641dfbcccf))
+
+
+## ESL Polyfills
+
+### Features:
+  - `Event`, `CustomEvent`, `MouseEvent`, `KeyboardEvent`, `FocusEvent` extended polyfills ([9ca3c40](https://github.com/exadel-inc/esl/commit/9ca3c406ff1f6f99490fdf09d2f15bc450c7be57))
+  - `Object.assign` and `Array.from` extended polyfills ([590bca4](https://github.com/exadel-inc/esl/commit/590bca4fab39c566db68f7bc2440e5d84355a991))
+  - extended `es5-target-shim` ([ef53df9](https://github.com/exadel-inc/esl/commit/ef53df936dd2beda859a41e9f8a900199bb24f3e))
+
+### BREAKING CHANGES
+  - ES5 shim `shimES5ElementConstructor` replaced with `shimES5Constructor`
diff --git a/pages/views/articles/ESL v4.0.0 copy.md b/pages/views/articles/ESL v4.0.0 copy.md
new file mode 100644
index 000000000..aa533fd4c
--- /dev/null
+++ b/pages/views/articles/ESL v4.0.0 copy.md	
@@ -0,0 +1,197 @@
+---
+layout: content
+name: Article2
+title: Article2
+tags: [articles, draft]
+date: 2023-09-01
+containerCls: container markdown-container
+---
+
+## ESL Core
+
+### Features:
+  - `ESLEventListener`s  functionality introduced
+  - `ESLMixinElement`s functionality introduced
+  - `ESLBaseElement` extended API 
+    - `ESLBaseElement.create` shortcut to create current custom element
+
+### Structural changes:
+  - Attribute decorators moved to the `esl-utils`
+  - All ESL modules migrated to `ESLEventListener`s
+  - Event names are now defined on the prototype level
+
+### BREAKING CHANGES
+  - `$$fire` no longer adds 'esl:' prefix to the fired events
+
+---
+
+## ESL Media Query
+
+### Features:
+  - `ESLMediaQuery` now implements `EventTarget` interface
+  - `ESLMediaRuleList` API reworked with `EventTarget` interface and new calculation strategy
+
+### BREAKING CHANGES
+  - `ESLMediaRuleList.parseTuple` arguments order changed
+  - `ESLMediaRule` no longer supports default marker, now "default" is equal to "all" query
+  - `ESLMediaRuleList` observation callback signature changed, now it should be `EventListener`
+  - `ESLMediaRuleList.prototype.default` removed as no longer default rules
+  - `ESLMediaRuleList` no longer fires events on rule change, now it's based on active value change
+  - `ESLMediaRuleList` now uses merging of all active rules to define result value, however you were still able to get the last active rule value
+  - `ESLMediaRuleList.prototype.active` now returns an array of active rules
+
+---
+
+## ESL Traversing Query
+
+### Features:
+  - add comma support to define multiple target ([#1120](https://github.com/exadel-inc/esl/issues/1120) / [#1129](https://github.com/exadel-inc/esl/issues/1129)) ([2890d7b](https://github.com/exadel-inc/esl/commit/2890d7b7667492b982b266048d23874c57b938ea)), closes [#1102](https://github.com/exadel-inc/esl/issues/1102)
+  - add ability to find closest element ([ada6fbb](https://github.com/exadel-inc/esl/commit/ada6fbb172a2fb2cf0d435420ad8fb0a46e7766f))
+
+---
+  
+## ESL Utils
+
+### Features:
+  - ability to grow/shrink axis of the `Rect` ([1c58a1c](https://github.com/exadel-inc/esl/commit/1c58a1c19b0aa82abf7eb73c40781e9c4a4860ba))
+  - `SyntheticEventTarget` to implement `EventTarget` interface with more listeners control ([e4f3eb8](https://github.com/exadel-inc/esl/commit/e4f3eb89e0dd8227937d476a8d2090730342de64))
+  - simplify and extend `@prop` decorator API ([fd6ede3](https://github.com/exadel-inc/esl/commit/fd6ede34b0a3c7496083cb58aa9b726d4a692085))
+  - add `skipOneRender` RAF utility ([ddc3227](https://github.com/exadel-inc/esl/commit/ddc322798e6f8cf447874896786fe6d368bbe5ef))
+  - add ability to pass predicate to sequence finder ([dd8c3cb](https://github.com/exadel-inc/esl/commit/dd8c3cbb43ed529330c32459b9787949a0927a01))
+  - add `@decorate` decorator to bind and decorate method of the class
+  - `@attr` extended with ability to pass Serializer/Parser ([012eb83](https://github.com/exadel-inc/esl/commit/012eb83ebcbba8315a2766af090239774c21234e))
+  - create dom html sanitize method ([004642f](https://github.com/exadel-inc/esl/commit/004642f866ac1b2ed5278084963288d8c2fd17e0))
+  - create `extractValues` object utility ([8edd9e7](https://github.com/exadel-inc/esl/commit/8edd9e7b564b4ac78a4fc952ee58f76b6a54cf89))
+  - create cumulative imports for esl-utils submodules ([2e9d6ad](https://github.com/exadel-inc/esl/commit/2e9d6ad8f327ede991feef4ebc7c76fdd55726af))
+
+### BREAKING CHANGES
+  - `isMouseEvent`, `isTouchEvent` moved outside of `EventUtils`
+  - `normalizeTouchPoint` renamed to `touchPoint` and moved outside of `EventUtils`
+  - `normalizeCoordinates` removed. Use `getOffsetPoint` in combination with `getTouchPoint` instead
+  - `@prop` signature changed `prop(value?: any, prototypeConfig: OverrideDecoratorConfig = {})` instead
+  - `ScrollUtils.lock` no longer accessible. Use `lockScroll(document.documentElement, {strategy: '...'})` instead
+  - `ScrollUtils.unlock` no longer accessible. Use `unlockScroll(document.documentElement, {strategy: '...'})` instead
+  - `ScrollUtils.lockRequest` no longer accessible. Use `lockScroll(document.documentElement, {strategy: '...', initiatior})` instead
+  - `ScrollUtils.unlockRequest` no longer accessible. Use `unlockScroll(document.documentElement, {strategy: '...', initiatior})` instead
+
+### Bugfixes
+  - make attr decorators correctly strict typed
+  - `deepMerge` primitive values merging improved, undefined arguments now ignored ([5b7b730](https://github.com/exadel-inc/esl/commit/5b7b73003acd4d29250af12603ced5d58c40aff6))
+  - fix `@bind` decorator to save original function enumerable marker ([92c2086](https://github.com/exadel-inc/esl/commit/92c2086df610a5572143463302baf7aeea6174e9))
+  - update `@decorate` decorator to allow to save context properly (on instance level) ([0ac1b0c](https://github.com/exadel-inc/esl/commit/0ac1b0cb9c90648ae1e0a18a16a936971c4b4ee9))
+
+---
+
+## ESL Toggleable and ESL Trigger
+
+### Features:
+  - migrate `esl-toggleable` and `esl-trigger` to ESLEventListeners
+  - `esl:show:request` additional data ([a121872](https://github.com/exadel-inc/esl/commit/a121872b6e69fd7fb7a71bdfa9058430e650f423))
+  - support of `esl:hide:request` ([8a0928b](https://github.com/exadel-inc/esl/commit/8a0928b2f2bda63c6fbbaf5e9b6453d660091ec1))
+  - add support of dynamic `aria-label` for `esl-trigger` ([5c18841](https://github.com/exadel-inc/esl/commit/5c188418720ad4a972caa7450563a29268d8ec97))
+  - add esc key event handler for `esl-trigger` ([3dab6da](https://github.com/exadel-inc/esl/commit/3dab6dad39259f7e920c9a108757271cb58a216d))
+  - add `ignore-esc` attribute for `esl-trigger` ([605b715](https://github.com/exadel-inc/esl/commit/605b715a29ef1a852e24ce5120ca30d394fc19c1))
+
+
+## ESL Panel and ESL Panel Group
+
+### Features:
+  - migrate `esl-panel` and `esl-panel-group` to ESLEventListeners
+  - add `refresh-strategy` attribute ([#1156](https://github.com/exadel-inc/esl/issues/1156)) ([36027ad](https://github.com/exadel-inc/esl/commit/36027ad2574c0c33df1b6370484448a6889a647a))
+  - add ability to control min/max open panels per media condition ([67ca2ba](https://github.com/exadel-inc/esl/commit/67ca2ba16e3fc4ee4300d1c79ca2e5d0da845af7))
+
+### BREAKING CHANGES
+  - `ESLPanelGroup.noCollapse` (with related attribute) renamed to `ESLPanelGroup.noAnimate` (`no-animate` attribute)
+  - `ESLPanelGroup.shouldCollapse` renamed to `ESLPanelGroup.shouldAnimate`
+  - `PanelActionParams.noCollapse` renamed to `PanelActionParams.noAnimate`
+  - `ESLPanelGroup` `view` attribute is no longer supported
+  - `open` mode of `ESLPanelGroup` is no longer supported, it should be replaced with a `min-open-items="all"`
+  - `accordion-group="single"` attribute of `ESLPanelGroup` is no longer supported, replaced with `max-open-items="1"`
+  - `accordion-group="single"` attribute of `ESLPanelGroup` is no longer supported, replaced with `max-open-items="all"`
+  - components inherited from `ESLPanelGroup` should use `@listen({inherit: true})` for proper subscription
+
+### Bugfixes
+  - add `capturedBy` and fix `after:show` dispatch ([9bdc98c](https://github.com/exadel-inc/esl/commit/9bdc98c98a2926fe42c7cd15007c31a19171027c))
+  - fix `esl:before:hide` bubbling from uncontrolled toggleables ([9212b6b](https://github.com/exadel-inc/esl/commit/9212b6beacd97d39d0410a464598e9e2e0bdb1c2))
+  - fix animation process capturing by `ESLPanel` component ([9a5b3a5](https://github.com/exadel-inc/esl/commit/9a5b3a576d5cb4dbd47d113d944932586155c7f6))
+  - change `no-animate` API ([dde3500](https://github.com/exadel-inc/esl/commit/dde35009268a92bae92a45f00d11cb29edee98fa))
+
+
+## ESL Tab and ESLTabs
+
+### Features:
+  - `esl-tab` and `esl-tabs` migrated to ESLEventListeners
+
+### Bugfixes:
+  - fix alignment behavior ([b5ebd66](https://github.com/exadel-inc/esl/commit/b5ebd668de7b4d1eea7311ae7d734c02abb537cf))
+
+### BREAKING CHANGES
+  - Listeners extended from `ESLTab` should now use `@listen` annotation to work correctly
+  - Listeners extended from `ESLTabs` should now use `@listen` annotation to work correctly
+
+## ESL Alert
+
+### Features:
+  - `esl-alert` migrated to ESLEventListeners, inner API updates
+
+### BREAKING CHANGES
+  - Listeners extended from `ESLAlert` should now use `@listen` annotation to work correctly
+  - `eventNs` is no longer supported, event is now defined directly on the prototype level
+
+
+## ESL Popup
+
+### Features:
+  - add configurable `rootMargin` for the popup activator observer ([5d647d6](https://github.com/exadel-inc/esl/commit/5d647d60673a65e7b27472c1b68a1e174fa40740))
+  - add extended `offsetContainer` configuration ([63cbc0a](https://github.com/exadel-inc/esl/commit/63cbc0a996a8578549360dadaa3bb17c53884bfe))
+
+### BREAKING CHANGES
+  - Listeners extended from `ESLPopup` should now use `@listen` annotation to work correctly
+
+
+## ESL Footnotes
+
+### Features:
+  - migrate `esl-notes` and `esl-footnotes` to ESLEventListeners
+  - add configurable `intersectionMargin`  for the note tooltip activator observer ([b9b1599](https://github.com/exadel-inc/esl/commit/b9b159942e3534965f43cac94c140d5680308548))
+
+### BREAKING CHANGES
+  - Listeners extended from `ESLNote` should now use `@listen` annotation to work correctly
+  - Listeners extended from `ESLFootnote` should now use `@listen` annotation to work correctly
+  - `eventNs` is no longer supported, event is now defined directly on the prototype level
+
+## ESL Image and ESL Media
+
+### Bugfixes:
+  - fix esl-image to prevent DOM XSS vulnerabilities ([4fd925d](https://github.com/exadel-inc/esl/commit/4fd925df8605994b0f7d345d77a425e0cdc487e8))
+  - fix wrong error status on svg images in FF ([cad6b40](https://github.com/exadel-inc/esl/commit/cad6b40ccce01aaea8b1869b2cd7d542939a4fd4))
+
+
+## ESL Scrollbar
+
+### Features:
+  - migrate `esl-scrollbar` to ESLEventListeners
+
+### Bugfixes
+  - remove unnecessary width ([6e18909](https://github.com/exadel-inc/esl/commit/6e18909c6768c259d76084b463404fe6b29c9af8))
+
+### BREAKING CHANGES
+  - Listeners extended from `ESLScrollbar` should now use `@listen` annotation to work correctly
+
+
+## ESL Select
+
+### Features:
+  - migrate `esl-select` to ESLEventListeners ([76ca947](https://github.com/exadel-inc/esl/commit/76ca9479090546cdf092d1c9c3f5d993263f0581))
+  - add `dropdown-class` param to specify dropdown additional CSS class(es) ([938357f](https://github.com/exadel-inc/esl/commit/938357fa6fb5db804f445f31eb4f73641dfbcccf))
+
+
+## ESL Polyfills
+
+### Features:
+  - `Event`, `CustomEvent`, `MouseEvent`, `KeyboardEvent`, `FocusEvent` extended polyfills ([9ca3c40](https://github.com/exadel-inc/esl/commit/9ca3c406ff1f6f99490fdf09d2f15bc450c7be57))
+  - `Object.assign` and `Array.from` extended polyfills ([590bca4](https://github.com/exadel-inc/esl/commit/590bca4fab39c566db68f7bc2440e5d84355a991))
+  - extended `es5-target-shim` ([ef53df9](https://github.com/exadel-inc/esl/commit/ef53df936dd2beda859a41e9f8a900199bb24f3e))
+
+### BREAKING CHANGES
+  - ES5 shim `shimES5ElementConstructor` replaced with `shimES5Constructor`
diff --git a/pages/views/articles/ESL v4.0.0.md b/pages/views/articles/ESL v4.0.0.md
new file mode 100644
index 000000000..ce33b92ee
--- /dev/null
+++ b/pages/views/articles/ESL v4.0.0.md	
@@ -0,0 +1,197 @@
+---
+layout: content
+name: Article3
+title: Article3
+tags: [articles, draft]
+date: 2023-10-01
+containerCls: container markdown-container
+---
+
+## ESL Core
+
+### Features:
+  - `ESLEventListener`s  functionality introduced
+  - `ESLMixinElement`s functionality introduced
+  - `ESLBaseElement` extended API 
+    - `ESLBaseElement.create` shortcut to create current custom element
+
+### Structural changes:
+  - Attribute decorators moved to the `esl-utils`
+  - All ESL modules migrated to `ESLEventListener`s
+  - Event names are now defined on the prototype level
+
+### BREAKING CHANGES
+  - `$$fire` no longer adds 'esl:' prefix to the fired events
+
+---
+
+## ESL Media Query
+
+### Features:
+  - `ESLMediaQuery` now implements `EventTarget` interface
+  - `ESLMediaRuleList` API reworked with `EventTarget` interface and new calculation strategy
+
+### BREAKING CHANGES
+  - `ESLMediaRuleList.parseTuple` arguments order changed
+  - `ESLMediaRule` no longer supports default marker, now "default" is equal to "all" query
+  - `ESLMediaRuleList` observation callback signature changed, now it should be `EventListener`
+  - `ESLMediaRuleList.prototype.default` removed as no longer default rules
+  - `ESLMediaRuleList` no longer fires events on rule change, now it's based on active value change
+  - `ESLMediaRuleList` now uses merging of all active rules to define result value, however you were still able to get the last active rule value
+  - `ESLMediaRuleList.prototype.active` now returns an array of active rules
+
+---
+
+## ESL Traversing Query
+
+### Features:
+  - add comma support to define multiple target ([#1120](https://github.com/exadel-inc/esl/issues/1120) / [#1129](https://github.com/exadel-inc/esl/issues/1129)) ([2890d7b](https://github.com/exadel-inc/esl/commit/2890d7b7667492b982b266048d23874c57b938ea)), closes [#1102](https://github.com/exadel-inc/esl/issues/1102)
+  - add ability to find closest element ([ada6fbb](https://github.com/exadel-inc/esl/commit/ada6fbb172a2fb2cf0d435420ad8fb0a46e7766f))
+
+---
+  
+## ESL Utils
+
+### Features:
+  - ability to grow/shrink axis of the `Rect` ([1c58a1c](https://github.com/exadel-inc/esl/commit/1c58a1c19b0aa82abf7eb73c40781e9c4a4860ba))
+  - `SyntheticEventTarget` to implement `EventTarget` interface with more listeners control ([e4f3eb8](https://github.com/exadel-inc/esl/commit/e4f3eb89e0dd8227937d476a8d2090730342de64))
+  - simplify and extend `@prop` decorator API ([fd6ede3](https://github.com/exadel-inc/esl/commit/fd6ede34b0a3c7496083cb58aa9b726d4a692085))
+  - add `skipOneRender` RAF utility ([ddc3227](https://github.com/exadel-inc/esl/commit/ddc322798e6f8cf447874896786fe6d368bbe5ef))
+  - add ability to pass predicate to sequence finder ([dd8c3cb](https://github.com/exadel-inc/esl/commit/dd8c3cbb43ed529330c32459b9787949a0927a01))
+  - add `@decorate` decorator to bind and decorate method of the class
+  - `@attr` extended with ability to pass Serializer/Parser ([012eb83](https://github.com/exadel-inc/esl/commit/012eb83ebcbba8315a2766af090239774c21234e))
+  - create dom html sanitize method ([004642f](https://github.com/exadel-inc/esl/commit/004642f866ac1b2ed5278084963288d8c2fd17e0))
+  - create `extractValues` object utility ([8edd9e7](https://github.com/exadel-inc/esl/commit/8edd9e7b564b4ac78a4fc952ee58f76b6a54cf89))
+  - create cumulative imports for esl-utils submodules ([2e9d6ad](https://github.com/exadel-inc/esl/commit/2e9d6ad8f327ede991feef4ebc7c76fdd55726af))
+
+### BREAKING CHANGES
+  - `isMouseEvent`, `isTouchEvent` moved outside of `EventUtils`
+  - `normalizeTouchPoint` renamed to `touchPoint` and moved outside of `EventUtils`
+  - `normalizeCoordinates` removed. Use `getOffsetPoint` in combination with `getTouchPoint` instead
+  - `@prop` signature changed `prop(value?: any, prototypeConfig: OverrideDecoratorConfig = {})` instead
+  - `ScrollUtils.lock` no longer accessible. Use `lockScroll(document.documentElement, {strategy: '...'})` instead
+  - `ScrollUtils.unlock` no longer accessible. Use `unlockScroll(document.documentElement, {strategy: '...'})` instead
+  - `ScrollUtils.lockRequest` no longer accessible. Use `lockScroll(document.documentElement, {strategy: '...', initiatior})` instead
+  - `ScrollUtils.unlockRequest` no longer accessible. Use `unlockScroll(document.documentElement, {strategy: '...', initiatior})` instead
+
+### Bugfixes
+  - make attr decorators correctly strict typed
+  - `deepMerge` primitive values merging improved, undefined arguments now ignored ([5b7b730](https://github.com/exadel-inc/esl/commit/5b7b73003acd4d29250af12603ced5d58c40aff6))
+  - fix `@bind` decorator to save original function enumerable marker ([92c2086](https://github.com/exadel-inc/esl/commit/92c2086df610a5572143463302baf7aeea6174e9))
+  - update `@decorate` decorator to allow to save context properly (on instance level) ([0ac1b0c](https://github.com/exadel-inc/esl/commit/0ac1b0cb9c90648ae1e0a18a16a936971c4b4ee9))
+
+---
+
+## ESL Toggleable and ESL Trigger
+
+### Features:
+  - migrate `esl-toggleable` and `esl-trigger` to ESLEventListeners
+  - `esl:show:request` additional data ([a121872](https://github.com/exadel-inc/esl/commit/a121872b6e69fd7fb7a71bdfa9058430e650f423))
+  - support of `esl:hide:request` ([8a0928b](https://github.com/exadel-inc/esl/commit/8a0928b2f2bda63c6fbbaf5e9b6453d660091ec1))
+  - add support of dynamic `aria-label` for `esl-trigger` ([5c18841](https://github.com/exadel-inc/esl/commit/5c188418720ad4a972caa7450563a29268d8ec97))
+  - add esc key event handler for `esl-trigger` ([3dab6da](https://github.com/exadel-inc/esl/commit/3dab6dad39259f7e920c9a108757271cb58a216d))
+  - add `ignore-esc` attribute for `esl-trigger` ([605b715](https://github.com/exadel-inc/esl/commit/605b715a29ef1a852e24ce5120ca30d394fc19c1))
+
+
+## ESL Panel and ESL Panel Group
+
+### Features:
+  - migrate `esl-panel` and `esl-panel-group` to ESLEventListeners
+  - add `refresh-strategy` attribute ([#1156](https://github.com/exadel-inc/esl/issues/1156)) ([36027ad](https://github.com/exadel-inc/esl/commit/36027ad2574c0c33df1b6370484448a6889a647a))
+  - add ability to control min/max open panels per media condition ([67ca2ba](https://github.com/exadel-inc/esl/commit/67ca2ba16e3fc4ee4300d1c79ca2e5d0da845af7))
+
+### BREAKING CHANGES
+  - `ESLPanelGroup.noCollapse` (with related attribute) renamed to `ESLPanelGroup.noAnimate` (`no-animate` attribute)
+  - `ESLPanelGroup.shouldCollapse` renamed to `ESLPanelGroup.shouldAnimate`
+  - `PanelActionParams.noCollapse` renamed to `PanelActionParams.noAnimate`
+  - `ESLPanelGroup` `view` attribute is no longer supported
+  - `open` mode of `ESLPanelGroup` is no longer supported, it should be replaced with a `min-open-items="all"`
+  - `accordion-group="single"` attribute of `ESLPanelGroup` is no longer supported, replaced with `max-open-items="1"`
+  - `accordion-group="single"` attribute of `ESLPanelGroup` is no longer supported, replaced with `max-open-items="all"`
+  - components inherited from `ESLPanelGroup` should use `@listen({inherit: true})` for proper subscription
+
+### Bugfixes
+  - add `capturedBy` and fix `after:show` dispatch ([9bdc98c](https://github.com/exadel-inc/esl/commit/9bdc98c98a2926fe42c7cd15007c31a19171027c))
+  - fix `esl:before:hide` bubbling from uncontrolled toggleables ([9212b6b](https://github.com/exadel-inc/esl/commit/9212b6beacd97d39d0410a464598e9e2e0bdb1c2))
+  - fix animation process capturing by `ESLPanel` component ([9a5b3a5](https://github.com/exadel-inc/esl/commit/9a5b3a576d5cb4dbd47d113d944932586155c7f6))
+  - change `no-animate` API ([dde3500](https://github.com/exadel-inc/esl/commit/dde35009268a92bae92a45f00d11cb29edee98fa))
+
+
+## ESL Tab and ESLTabs
+
+### Features:
+  - `esl-tab` and `esl-tabs` migrated to ESLEventListeners
+
+### Bugfixes:
+  - fix alignment behavior ([b5ebd66](https://github.com/exadel-inc/esl/commit/b5ebd668de7b4d1eea7311ae7d734c02abb537cf))
+
+### BREAKING CHANGES
+  - Listeners extended from `ESLTab` should now use `@listen` annotation to work correctly
+  - Listeners extended from `ESLTabs` should now use `@listen` annotation to work correctly
+
+## ESL Alert
+
+### Features:
+  - `esl-alert` migrated to ESLEventListeners, inner API updates
+
+### BREAKING CHANGES
+  - Listeners extended from `ESLAlert` should now use `@listen` annotation to work correctly
+  - `eventNs` is no longer supported, event is now defined directly on the prototype level
+
+
+## ESL Popup
+
+### Features:
+  - add configurable `rootMargin` for the popup activator observer ([5d647d6](https://github.com/exadel-inc/esl/commit/5d647d60673a65e7b27472c1b68a1e174fa40740))
+  - add extended `offsetContainer` configuration ([63cbc0a](https://github.com/exadel-inc/esl/commit/63cbc0a996a8578549360dadaa3bb17c53884bfe))
+
+### BREAKING CHANGES
+  - Listeners extended from `ESLPopup` should now use `@listen` annotation to work correctly
+
+
+## ESL Footnotes
+
+### Features:
+  - migrate `esl-notes` and `esl-footnotes` to ESLEventListeners
+  - add configurable `intersectionMargin`  for the note tooltip activator observer ([b9b1599](https://github.com/exadel-inc/esl/commit/b9b159942e3534965f43cac94c140d5680308548))
+
+### BREAKING CHANGES
+  - Listeners extended from `ESLNote` should now use `@listen` annotation to work correctly
+  - Listeners extended from `ESLFootnote` should now use `@listen` annotation to work correctly
+  - `eventNs` is no longer supported, event is now defined directly on the prototype level
+
+## ESL Image and ESL Media
+
+### Bugfixes:
+  - fix esl-image to prevent DOM XSS vulnerabilities ([4fd925d](https://github.com/exadel-inc/esl/commit/4fd925df8605994b0f7d345d77a425e0cdc487e8))
+  - fix wrong error status on svg images in FF ([cad6b40](https://github.com/exadel-inc/esl/commit/cad6b40ccce01aaea8b1869b2cd7d542939a4fd4))
+
+
+## ESL Scrollbar
+
+### Features:
+  - migrate `esl-scrollbar` to ESLEventListeners
+
+### Bugfixes
+  - remove unnecessary width ([6e18909](https://github.com/exadel-inc/esl/commit/6e18909c6768c259d76084b463404fe6b29c9af8))
+
+### BREAKING CHANGES
+  - Listeners extended from `ESLScrollbar` should now use `@listen` annotation to work correctly
+
+
+## ESL Select
+
+### Features:
+  - migrate `esl-select` to ESLEventListeners ([76ca947](https://github.com/exadel-inc/esl/commit/76ca9479090546cdf092d1c9c3f5d993263f0581))
+  - add `dropdown-class` param to specify dropdown additional CSS class(es) ([938357f](https://github.com/exadel-inc/esl/commit/938357fa6fb5db804f445f31eb4f73641dfbcccf))
+
+
+## ESL Polyfills
+
+### Features:
+  - `Event`, `CustomEvent`, `MouseEvent`, `KeyboardEvent`, `FocusEvent` extended polyfills ([9ca3c40](https://github.com/exadel-inc/esl/commit/9ca3c406ff1f6f99490fdf09d2f15bc450c7be57))
+  - `Object.assign` and `Array.from` extended polyfills ([590bca4](https://github.com/exadel-inc/esl/commit/590bca4fab39c566db68f7bc2440e5d84355a991))
+  - extended `es5-target-shim` ([ef53df9](https://github.com/exadel-inc/esl/commit/ef53df936dd2beda859a41e9f8a900199bb24f3e))
+
+### BREAKING CHANGES
+  - ES5 shim `shimES5ElementConstructor` replaced with `shimES5Constructor`
diff --git a/pages/views/blogs/ESL v4.0.0 copy 2.md b/pages/views/blogs/ESL v4.0.0 copy 2.md
new file mode 100644
index 000000000..1dcdd55ca
--- /dev/null
+++ b/pages/views/blogs/ESL v4.0.0 copy 2.md	
@@ -0,0 +1,197 @@
+---
+layout: content
+name: Blog1
+title: Blog1
+tags: [blogs, new]
+date: 2022-10-01
+containerCls: container markdown-container
+---
+
+## ESL Core
+
+### Features:
+  - `ESLEventListener`s  functionality introduced
+  - `ESLMixinElement`s functionality introduced
+  - `ESLBaseElement` extended API 
+    - `ESLBaseElement.create` shortcut to create current custom element
+
+### Structural changes:
+  - Attribute decorators moved to the `esl-utils`
+  - All ESL modules migrated to `ESLEventListener`s
+  - Event names are now defined on the prototype level
+
+### BREAKING CHANGES
+  - `$$fire` no longer adds 'esl:' prefix to the fired events
+
+---
+
+## ESL Media Query
+
+### Features:
+  - `ESLMediaQuery` now implements `EventTarget` interface
+  - `ESLMediaRuleList` API reworked with `EventTarget` interface and new calculation strategy
+
+### BREAKING CHANGES
+  - `ESLMediaRuleList.parseTuple` arguments order changed
+  - `ESLMediaRule` no longer supports default marker, now "default" is equal to "all" query
+  - `ESLMediaRuleList` observation callback signature changed, now it should be `EventListener`
+  - `ESLMediaRuleList.prototype.default` removed as no longer default rules
+  - `ESLMediaRuleList` no longer fires events on rule change, now it's based on active value change
+  - `ESLMediaRuleList` now uses merging of all active rules to define result value, however you were still able to get the last active rule value
+  - `ESLMediaRuleList.prototype.active` now returns an array of active rules
+
+---
+
+## ESL Traversing Query
+
+### Features:
+  - add comma support to define multiple target ([#1120](https://github.com/exadel-inc/esl/issues/1120) / [#1129](https://github.com/exadel-inc/esl/issues/1129)) ([2890d7b](https://github.com/exadel-inc/esl/commit/2890d7b7667492b982b266048d23874c57b938ea)), closes [#1102](https://github.com/exadel-inc/esl/issues/1102)
+  - add ability to find closest element ([ada6fbb](https://github.com/exadel-inc/esl/commit/ada6fbb172a2fb2cf0d435420ad8fb0a46e7766f))
+
+---
+  
+## ESL Utils
+
+### Features:
+  - ability to grow/shrink axis of the `Rect` ([1c58a1c](https://github.com/exadel-inc/esl/commit/1c58a1c19b0aa82abf7eb73c40781e9c4a4860ba))
+  - `SyntheticEventTarget` to implement `EventTarget` interface with more listeners control ([e4f3eb8](https://github.com/exadel-inc/esl/commit/e4f3eb89e0dd8227937d476a8d2090730342de64))
+  - simplify and extend `@prop` decorator API ([fd6ede3](https://github.com/exadel-inc/esl/commit/fd6ede34b0a3c7496083cb58aa9b726d4a692085))
+  - add `skipOneRender` RAF utility ([ddc3227](https://github.com/exadel-inc/esl/commit/ddc322798e6f8cf447874896786fe6d368bbe5ef))
+  - add ability to pass predicate to sequence finder ([dd8c3cb](https://github.com/exadel-inc/esl/commit/dd8c3cbb43ed529330c32459b9787949a0927a01))
+  - add `@decorate` decorator to bind and decorate method of the class
+  - `@attr` extended with ability to pass Serializer/Parser ([012eb83](https://github.com/exadel-inc/esl/commit/012eb83ebcbba8315a2766af090239774c21234e))
+  - create dom html sanitize method ([004642f](https://github.com/exadel-inc/esl/commit/004642f866ac1b2ed5278084963288d8c2fd17e0))
+  - create `extractValues` object utility ([8edd9e7](https://github.com/exadel-inc/esl/commit/8edd9e7b564b4ac78a4fc952ee58f76b6a54cf89))
+  - create cumulative imports for esl-utils submodules ([2e9d6ad](https://github.com/exadel-inc/esl/commit/2e9d6ad8f327ede991feef4ebc7c76fdd55726af))
+
+### BREAKING CHANGES
+  - `isMouseEvent`, `isTouchEvent` moved outside of `EventUtils`
+  - `normalizeTouchPoint` renamed to `touchPoint` and moved outside of `EventUtils`
+  - `normalizeCoordinates` removed. Use `getOffsetPoint` in combination with `getTouchPoint` instead
+  - `@prop` signature changed `prop(value?: any, prototypeConfig: OverrideDecoratorConfig = {})` instead
+  - `ScrollUtils.lock` no longer accessible. Use `lockScroll(document.documentElement, {strategy: '...'})` instead
+  - `ScrollUtils.unlock` no longer accessible. Use `unlockScroll(document.documentElement, {strategy: '...'})` instead
+  - `ScrollUtils.lockRequest` no longer accessible. Use `lockScroll(document.documentElement, {strategy: '...', initiatior})` instead
+  - `ScrollUtils.unlockRequest` no longer accessible. Use `unlockScroll(document.documentElement, {strategy: '...', initiatior})` instead
+
+### Bugfixes
+  - make attr decorators correctly strict typed
+  - `deepMerge` primitive values merging improved, undefined arguments now ignored ([5b7b730](https://github.com/exadel-inc/esl/commit/5b7b73003acd4d29250af12603ced5d58c40aff6))
+  - fix `@bind` decorator to save original function enumerable marker ([92c2086](https://github.com/exadel-inc/esl/commit/92c2086df610a5572143463302baf7aeea6174e9))
+  - update `@decorate` decorator to allow to save context properly (on instance level) ([0ac1b0c](https://github.com/exadel-inc/esl/commit/0ac1b0cb9c90648ae1e0a18a16a936971c4b4ee9))
+
+---
+
+## ESL Toggleable and ESL Trigger
+
+### Features:
+  - migrate `esl-toggleable` and `esl-trigger` to ESLEventListeners
+  - `esl:show:request` additional data ([a121872](https://github.com/exadel-inc/esl/commit/a121872b6e69fd7fb7a71bdfa9058430e650f423))
+  - support of `esl:hide:request` ([8a0928b](https://github.com/exadel-inc/esl/commit/8a0928b2f2bda63c6fbbaf5e9b6453d660091ec1))
+  - add support of dynamic `aria-label` for `esl-trigger` ([5c18841](https://github.com/exadel-inc/esl/commit/5c188418720ad4a972caa7450563a29268d8ec97))
+  - add esc key event handler for `esl-trigger` ([3dab6da](https://github.com/exadel-inc/esl/commit/3dab6dad39259f7e920c9a108757271cb58a216d))
+  - add `ignore-esc` attribute for `esl-trigger` ([605b715](https://github.com/exadel-inc/esl/commit/605b715a29ef1a852e24ce5120ca30d394fc19c1))
+
+
+## ESL Panel and ESL Panel Group
+
+### Features:
+  - migrate `esl-panel` and `esl-panel-group` to ESLEventListeners
+  - add `refresh-strategy` attribute ([#1156](https://github.com/exadel-inc/esl/issues/1156)) ([36027ad](https://github.com/exadel-inc/esl/commit/36027ad2574c0c33df1b6370484448a6889a647a))
+  - add ability to control min/max open panels per media condition ([67ca2ba](https://github.com/exadel-inc/esl/commit/67ca2ba16e3fc4ee4300d1c79ca2e5d0da845af7))
+
+### BREAKING CHANGES
+  - `ESLPanelGroup.noCollapse` (with related attribute) renamed to `ESLPanelGroup.noAnimate` (`no-animate` attribute)
+  - `ESLPanelGroup.shouldCollapse` renamed to `ESLPanelGroup.shouldAnimate`
+  - `PanelActionParams.noCollapse` renamed to `PanelActionParams.noAnimate`
+  - `ESLPanelGroup` `view` attribute is no longer supported
+  - `open` mode of `ESLPanelGroup` is no longer supported, it should be replaced with a `min-open-items="all"`
+  - `accordion-group="single"` attribute of `ESLPanelGroup` is no longer supported, replaced with `max-open-items="1"`
+  - `accordion-group="single"` attribute of `ESLPanelGroup` is no longer supported, replaced with `max-open-items="all"`
+  - components inherited from `ESLPanelGroup` should use `@listen({inherit: true})` for proper subscription
+
+### Bugfixes
+  - add `capturedBy` and fix `after:show` dispatch ([9bdc98c](https://github.com/exadel-inc/esl/commit/9bdc98c98a2926fe42c7cd15007c31a19171027c))
+  - fix `esl:before:hide` bubbling from uncontrolled toggleables ([9212b6b](https://github.com/exadel-inc/esl/commit/9212b6beacd97d39d0410a464598e9e2e0bdb1c2))
+  - fix animation process capturing by `ESLPanel` component ([9a5b3a5](https://github.com/exadel-inc/esl/commit/9a5b3a576d5cb4dbd47d113d944932586155c7f6))
+  - change `no-animate` API ([dde3500](https://github.com/exadel-inc/esl/commit/dde35009268a92bae92a45f00d11cb29edee98fa))
+
+
+## ESL Tab and ESLTabs
+
+### Features:
+  - `esl-tab` and `esl-tabs` migrated to ESLEventListeners
+
+### Bugfixes:
+  - fix alignment behavior ([b5ebd66](https://github.com/exadel-inc/esl/commit/b5ebd668de7b4d1eea7311ae7d734c02abb537cf))
+
+### BREAKING CHANGES
+  - Listeners extended from `ESLTab` should now use `@listen` annotation to work correctly
+  - Listeners extended from `ESLTabs` should now use `@listen` annotation to work correctly
+
+## ESL Alert
+
+### Features:
+  - `esl-alert` migrated to ESLEventListeners, inner API updates
+
+### BREAKING CHANGES
+  - Listeners extended from `ESLAlert` should now use `@listen` annotation to work correctly
+  - `eventNs` is no longer supported, event is now defined directly on the prototype level
+
+
+## ESL Popup
+
+### Features:
+  - add configurable `rootMargin` for the popup activator observer ([5d647d6](https://github.com/exadel-inc/esl/commit/5d647d60673a65e7b27472c1b68a1e174fa40740))
+  - add extended `offsetContainer` configuration ([63cbc0a](https://github.com/exadel-inc/esl/commit/63cbc0a996a8578549360dadaa3bb17c53884bfe))
+
+### BREAKING CHANGES
+  - Listeners extended from `ESLPopup` should now use `@listen` annotation to work correctly
+
+
+## ESL Footnotes
+
+### Features:
+  - migrate `esl-notes` and `esl-footnotes` to ESLEventListeners
+  - add configurable `intersectionMargin`  for the note tooltip activator observer ([b9b1599](https://github.com/exadel-inc/esl/commit/b9b159942e3534965f43cac94c140d5680308548))
+
+### BREAKING CHANGES
+  - Listeners extended from `ESLNote` should now use `@listen` annotation to work correctly
+  - Listeners extended from `ESLFootnote` should now use `@listen` annotation to work correctly
+  - `eventNs` is no longer supported, event is now defined directly on the prototype level
+
+## ESL Image and ESL Media
+
+### Bugfixes:
+  - fix esl-image to prevent DOM XSS vulnerabilities ([4fd925d](https://github.com/exadel-inc/esl/commit/4fd925df8605994b0f7d345d77a425e0cdc487e8))
+  - fix wrong error status on svg images in FF ([cad6b40](https://github.com/exadel-inc/esl/commit/cad6b40ccce01aaea8b1869b2cd7d542939a4fd4))
+
+
+## ESL Scrollbar
+
+### Features:
+  - migrate `esl-scrollbar` to ESLEventListeners
+
+### Bugfixes
+  - remove unnecessary width ([6e18909](https://github.com/exadel-inc/esl/commit/6e18909c6768c259d76084b463404fe6b29c9af8))
+
+### BREAKING CHANGES
+  - Listeners extended from `ESLScrollbar` should now use `@listen` annotation to work correctly
+
+
+## ESL Select
+
+### Features:
+  - migrate `esl-select` to ESLEventListeners ([76ca947](https://github.com/exadel-inc/esl/commit/76ca9479090546cdf092d1c9c3f5d993263f0581))
+  - add `dropdown-class` param to specify dropdown additional CSS class(es) ([938357f](https://github.com/exadel-inc/esl/commit/938357fa6fb5db804f445f31eb4f73641dfbcccf))
+
+
+## ESL Polyfills
+
+### Features:
+  - `Event`, `CustomEvent`, `MouseEvent`, `KeyboardEvent`, `FocusEvent` extended polyfills ([9ca3c40](https://github.com/exadel-inc/esl/commit/9ca3c406ff1f6f99490fdf09d2f15bc450c7be57))
+  - `Object.assign` and `Array.from` extended polyfills ([590bca4](https://github.com/exadel-inc/esl/commit/590bca4fab39c566db68f7bc2440e5d84355a991))
+  - extended `es5-target-shim` ([ef53df9](https://github.com/exadel-inc/esl/commit/ef53df936dd2beda859a41e9f8a900199bb24f3e))
+
+### BREAKING CHANGES
+  - ES5 shim `shimES5ElementConstructor` replaced with `shimES5Constructor`
diff --git a/pages/views/blogs/ESL v4.0.0 copy.md b/pages/views/blogs/ESL v4.0.0 copy.md
new file mode 100644
index 000000000..d0f2ee341
--- /dev/null
+++ b/pages/views/blogs/ESL v4.0.0 copy.md	
@@ -0,0 +1,197 @@
+---
+layout: content
+name: Blog2
+title: Blog2
+tags: [blogs, draft]
+date: 2022-10-01
+containerCls: container markdown-container
+---
+
+## ESL Core
+
+### Features:
+  - `ESLEventListener`s  functionality introduced
+  - `ESLMixinElement`s functionality introduced
+  - `ESLBaseElement` extended API 
+    - `ESLBaseElement.create` shortcut to create current custom element
+
+### Structural changes:
+  - Attribute decorators moved to the `esl-utils`
+  - All ESL modules migrated to `ESLEventListener`s
+  - Event names are now defined on the prototype level
+
+### BREAKING CHANGES
+  - `$$fire` no longer adds 'esl:' prefix to the fired events
+
+---
+
+## ESL Media Query
+
+### Features:
+  - `ESLMediaQuery` now implements `EventTarget` interface
+  - `ESLMediaRuleList` API reworked with `EventTarget` interface and new calculation strategy
+
+### BREAKING CHANGES
+  - `ESLMediaRuleList.parseTuple` arguments order changed
+  - `ESLMediaRule` no longer supports default marker, now "default" is equal to "all" query
+  - `ESLMediaRuleList` observation callback signature changed, now it should be `EventListener`
+  - `ESLMediaRuleList.prototype.default` removed as no longer default rules
+  - `ESLMediaRuleList` no longer fires events on rule change, now it's based on active value change
+  - `ESLMediaRuleList` now uses merging of all active rules to define result value, however you were still able to get the last active rule value
+  - `ESLMediaRuleList.prototype.active` now returns an array of active rules
+
+---
+
+## ESL Traversing Query
+
+### Features:
+  - add comma support to define multiple target ([#1120](https://github.com/exadel-inc/esl/issues/1120) / [#1129](https://github.com/exadel-inc/esl/issues/1129)) ([2890d7b](https://github.com/exadel-inc/esl/commit/2890d7b7667492b982b266048d23874c57b938ea)), closes [#1102](https://github.com/exadel-inc/esl/issues/1102)
+  - add ability to find closest element ([ada6fbb](https://github.com/exadel-inc/esl/commit/ada6fbb172a2fb2cf0d435420ad8fb0a46e7766f))
+
+---
+  
+## ESL Utils
+
+### Features:
+  - ability to grow/shrink axis of the `Rect` ([1c58a1c](https://github.com/exadel-inc/esl/commit/1c58a1c19b0aa82abf7eb73c40781e9c4a4860ba))
+  - `SyntheticEventTarget` to implement `EventTarget` interface with more listeners control ([e4f3eb8](https://github.com/exadel-inc/esl/commit/e4f3eb89e0dd8227937d476a8d2090730342de64))
+  - simplify and extend `@prop` decorator API ([fd6ede3](https://github.com/exadel-inc/esl/commit/fd6ede34b0a3c7496083cb58aa9b726d4a692085))
+  - add `skipOneRender` RAF utility ([ddc3227](https://github.com/exadel-inc/esl/commit/ddc322798e6f8cf447874896786fe6d368bbe5ef))
+  - add ability to pass predicate to sequence finder ([dd8c3cb](https://github.com/exadel-inc/esl/commit/dd8c3cbb43ed529330c32459b9787949a0927a01))
+  - add `@decorate` decorator to bind and decorate method of the class
+  - `@attr` extended with ability to pass Serializer/Parser ([012eb83](https://github.com/exadel-inc/esl/commit/012eb83ebcbba8315a2766af090239774c21234e))
+  - create dom html sanitize method ([004642f](https://github.com/exadel-inc/esl/commit/004642f866ac1b2ed5278084963288d8c2fd17e0))
+  - create `extractValues` object utility ([8edd9e7](https://github.com/exadel-inc/esl/commit/8edd9e7b564b4ac78a4fc952ee58f76b6a54cf89))
+  - create cumulative imports for esl-utils submodules ([2e9d6ad](https://github.com/exadel-inc/esl/commit/2e9d6ad8f327ede991feef4ebc7c76fdd55726af))
+
+### BREAKING CHANGES
+  - `isMouseEvent`, `isTouchEvent` moved outside of `EventUtils`
+  - `normalizeTouchPoint` renamed to `touchPoint` and moved outside of `EventUtils`
+  - `normalizeCoordinates` removed. Use `getOffsetPoint` in combination with `getTouchPoint` instead
+  - `@prop` signature changed `prop(value?: any, prototypeConfig: OverrideDecoratorConfig = {})` instead
+  - `ScrollUtils.lock` no longer accessible. Use `lockScroll(document.documentElement, {strategy: '...'})` instead
+  - `ScrollUtils.unlock` no longer accessible. Use `unlockScroll(document.documentElement, {strategy: '...'})` instead
+  - `ScrollUtils.lockRequest` no longer accessible. Use `lockScroll(document.documentElement, {strategy: '...', initiatior})` instead
+  - `ScrollUtils.unlockRequest` no longer accessible. Use `unlockScroll(document.documentElement, {strategy: '...', initiatior})` instead
+
+### Bugfixes
+  - make attr decorators correctly strict typed
+  - `deepMerge` primitive values merging improved, undefined arguments now ignored ([5b7b730](https://github.com/exadel-inc/esl/commit/5b7b73003acd4d29250af12603ced5d58c40aff6))
+  - fix `@bind` decorator to save original function enumerable marker ([92c2086](https://github.com/exadel-inc/esl/commit/92c2086df610a5572143463302baf7aeea6174e9))
+  - update `@decorate` decorator to allow to save context properly (on instance level) ([0ac1b0c](https://github.com/exadel-inc/esl/commit/0ac1b0cb9c90648ae1e0a18a16a936971c4b4ee9))
+
+---
+
+## ESL Toggleable and ESL Trigger
+
+### Features:
+  - migrate `esl-toggleable` and `esl-trigger` to ESLEventListeners
+  - `esl:show:request` additional data ([a121872](https://github.com/exadel-inc/esl/commit/a121872b6e69fd7fb7a71bdfa9058430e650f423))
+  - support of `esl:hide:request` ([8a0928b](https://github.com/exadel-inc/esl/commit/8a0928b2f2bda63c6fbbaf5e9b6453d660091ec1))
+  - add support of dynamic `aria-label` for `esl-trigger` ([5c18841](https://github.com/exadel-inc/esl/commit/5c188418720ad4a972caa7450563a29268d8ec97))
+  - add esc key event handler for `esl-trigger` ([3dab6da](https://github.com/exadel-inc/esl/commit/3dab6dad39259f7e920c9a108757271cb58a216d))
+  - add `ignore-esc` attribute for `esl-trigger` ([605b715](https://github.com/exadel-inc/esl/commit/605b715a29ef1a852e24ce5120ca30d394fc19c1))
+
+
+## ESL Panel and ESL Panel Group
+
+### Features:
+  - migrate `esl-panel` and `esl-panel-group` to ESLEventListeners
+  - add `refresh-strategy` attribute ([#1156](https://github.com/exadel-inc/esl/issues/1156)) ([36027ad](https://github.com/exadel-inc/esl/commit/36027ad2574c0c33df1b6370484448a6889a647a))
+  - add ability to control min/max open panels per media condition ([67ca2ba](https://github.com/exadel-inc/esl/commit/67ca2ba16e3fc4ee4300d1c79ca2e5d0da845af7))
+
+### BREAKING CHANGES
+  - `ESLPanelGroup.noCollapse` (with related attribute) renamed to `ESLPanelGroup.noAnimate` (`no-animate` attribute)
+  - `ESLPanelGroup.shouldCollapse` renamed to `ESLPanelGroup.shouldAnimate`
+  - `PanelActionParams.noCollapse` renamed to `PanelActionParams.noAnimate`
+  - `ESLPanelGroup` `view` attribute is no longer supported
+  - `open` mode of `ESLPanelGroup` is no longer supported, it should be replaced with a `min-open-items="all"`
+  - `accordion-group="single"` attribute of `ESLPanelGroup` is no longer supported, replaced with `max-open-items="1"`
+  - `accordion-group="single"` attribute of `ESLPanelGroup` is no longer supported, replaced with `max-open-items="all"`
+  - components inherited from `ESLPanelGroup` should use `@listen({inherit: true})` for proper subscription
+
+### Bugfixes
+  - add `capturedBy` and fix `after:show` dispatch ([9bdc98c](https://github.com/exadel-inc/esl/commit/9bdc98c98a2926fe42c7cd15007c31a19171027c))
+  - fix `esl:before:hide` bubbling from uncontrolled toggleables ([9212b6b](https://github.com/exadel-inc/esl/commit/9212b6beacd97d39d0410a464598e9e2e0bdb1c2))
+  - fix animation process capturing by `ESLPanel` component ([9a5b3a5](https://github.com/exadel-inc/esl/commit/9a5b3a576d5cb4dbd47d113d944932586155c7f6))
+  - change `no-animate` API ([dde3500](https://github.com/exadel-inc/esl/commit/dde35009268a92bae92a45f00d11cb29edee98fa))
+
+
+## ESL Tab and ESLTabs
+
+### Features:
+  - `esl-tab` and `esl-tabs` migrated to ESLEventListeners
+
+### Bugfixes:
+  - fix alignment behavior ([b5ebd66](https://github.com/exadel-inc/esl/commit/b5ebd668de7b4d1eea7311ae7d734c02abb537cf))
+
+### BREAKING CHANGES
+  - Listeners extended from `ESLTab` should now use `@listen` annotation to work correctly
+  - Listeners extended from `ESLTabs` should now use `@listen` annotation to work correctly
+
+## ESL Alert
+
+### Features:
+  - `esl-alert` migrated to ESLEventListeners, inner API updates
+
+### BREAKING CHANGES
+  - Listeners extended from `ESLAlert` should now use `@listen` annotation to work correctly
+  - `eventNs` is no longer supported, event is now defined directly on the prototype level
+
+
+## ESL Popup
+
+### Features:
+  - add configurable `rootMargin` for the popup activator observer ([5d647d6](https://github.com/exadel-inc/esl/commit/5d647d60673a65e7b27472c1b68a1e174fa40740))
+  - add extended `offsetContainer` configuration ([63cbc0a](https://github.com/exadel-inc/esl/commit/63cbc0a996a8578549360dadaa3bb17c53884bfe))
+
+### BREAKING CHANGES
+  - Listeners extended from `ESLPopup` should now use `@listen` annotation to work correctly
+
+
+## ESL Footnotes
+
+### Features:
+  - migrate `esl-notes` and `esl-footnotes` to ESLEventListeners
+  - add configurable `intersectionMargin`  for the note tooltip activator observer ([b9b1599](https://github.com/exadel-inc/esl/commit/b9b159942e3534965f43cac94c140d5680308548))
+
+### BREAKING CHANGES
+  - Listeners extended from `ESLNote` should now use `@listen` annotation to work correctly
+  - Listeners extended from `ESLFootnote` should now use `@listen` annotation to work correctly
+  - `eventNs` is no longer supported, event is now defined directly on the prototype level
+
+## ESL Image and ESL Media
+
+### Bugfixes:
+  - fix esl-image to prevent DOM XSS vulnerabilities ([4fd925d](https://github.com/exadel-inc/esl/commit/4fd925df8605994b0f7d345d77a425e0cdc487e8))
+  - fix wrong error status on svg images in FF ([cad6b40](https://github.com/exadel-inc/esl/commit/cad6b40ccce01aaea8b1869b2cd7d542939a4fd4))
+
+
+## ESL Scrollbar
+
+### Features:
+  - migrate `esl-scrollbar` to ESLEventListeners
+
+### Bugfixes
+  - remove unnecessary width ([6e18909](https://github.com/exadel-inc/esl/commit/6e18909c6768c259d76084b463404fe6b29c9af8))
+
+### BREAKING CHANGES
+  - Listeners extended from `ESLScrollbar` should now use `@listen` annotation to work correctly
+
+
+## ESL Select
+
+### Features:
+  - migrate `esl-select` to ESLEventListeners ([76ca947](https://github.com/exadel-inc/esl/commit/76ca9479090546cdf092d1c9c3f5d993263f0581))
+  - add `dropdown-class` param to specify dropdown additional CSS class(es) ([938357f](https://github.com/exadel-inc/esl/commit/938357fa6fb5db804f445f31eb4f73641dfbcccf))
+
+
+## ESL Polyfills
+
+### Features:
+  - `Event`, `CustomEvent`, `MouseEvent`, `KeyboardEvent`, `FocusEvent` extended polyfills ([9ca3c40](https://github.com/exadel-inc/esl/commit/9ca3c406ff1f6f99490fdf09d2f15bc450c7be57))
+  - `Object.assign` and `Array.from` extended polyfills ([590bca4](https://github.com/exadel-inc/esl/commit/590bca4fab39c566db68f7bc2440e5d84355a991))
+  - extended `es5-target-shim` ([ef53df9](https://github.com/exadel-inc/esl/commit/ef53df936dd2beda859a41e9f8a900199bb24f3e))
+
+### BREAKING CHANGES
+  - ES5 shim `shimES5ElementConstructor` replaced with `shimES5Constructor`
diff --git a/pages/views/blogs/ESL v4.0.0.md b/pages/views/blogs/ESL v4.0.0.md
index 8bc829f16..f0cbdb222 100644
--- a/pages/views/blogs/ESL v4.0.0.md	
+++ b/pages/views/blogs/ESL v4.0.0.md	
@@ -1,8 +1,8 @@
 ---
 layout: content
-name: ESL v4.0.0
-title: ESL v4.0.0
-tags: [blogs, draft]
+name: Blog3
+title: Blog3
+tags: [blogs, draft, new]
 date: 2022-10-01
 containerCls: container markdown-container
 ---
diff --git a/pages/views/index.njk b/pages/views/index.njk
index 6c84ffaff..08cd38480 100644
--- a/pages/views/index.njk
+++ b/pages/views/index.njk
@@ -2,9 +2,10 @@
 layout: landing
 ---
 
+{% include 'landing/blogs2.njk/'%}
+{% include 'landing/blogs3.njk/'%}
 {% include 'landing/marquee.njk' %}
 {% include 'landing/benefits.njk' %}
 {#{% include 'landing/overview.njk/'%}#}
 {% include 'landing/browser-support.njk/'%}
 {% include 'landing/promo-banner.njk/'%}
-{% include 'landing/blogs.njk/'%}

From a89caa8e2a5a2a53f9b87c210021e7a35be11cf5 Mon Sep 17 00:00:00 2001
From: Feoktist Shovchko <fshovchko@exadel.com>
Date: Mon, 19 Jun 2023 20:01:42 +0300
Subject: [PATCH 02/18] chore(gh-pages): news section refactoring

---
 pages/11ty/join.js                        |  11 --
 pages/11ty/news.js                        |   6 +
 pages/src/landing/blogs/blogs.less        | 206 ++++------------------
 pages/views/_includes/landing/blogs.njk   |  19 --
 pages/views/_includes/landing/blogs2.njk  |  33 ----
 pages/views/_includes/landing/blogs3.njk  |  31 ----
 pages/views/_includes/landing/news.njk    |  20 +++
 pages/views/articles/ESL v4.0.0 copy 2.md | 196 --------------------
 pages/views/articles/ESL v4.0.0 copy.md   | 197 ---------------------
 pages/views/articles/ESL v4.0.0.md        | 197 ---------------------
 pages/views/blogs/ESL v4.0.0 copy 2.md    | 197 ---------------------
 pages/views/blogs/ESL v4.0.0 copy.md      | 197 ---------------------
 pages/views/blogs/ESL v4.0.0.md           |   1 +
 pages/views/index.11tydata.yml            |   7 +-
 pages/views/index.njk                     |   4 +-
 15 files changed, 70 insertions(+), 1252 deletions(-)
 delete mode 100644 pages/11ty/join.js
 create mode 100644 pages/11ty/news.js
 delete mode 100644 pages/views/_includes/landing/blogs.njk
 delete mode 100644 pages/views/_includes/landing/blogs2.njk
 delete mode 100644 pages/views/_includes/landing/blogs3.njk
 create mode 100644 pages/views/_includes/landing/news.njk
 delete mode 100644 pages/views/articles/ESL v4.0.0 copy 2.md
 delete mode 100644 pages/views/articles/ESL v4.0.0 copy.md
 delete mode 100644 pages/views/articles/ESL v4.0.0.md
 delete mode 100644 pages/views/blogs/ESL v4.0.0 copy 2.md
 delete mode 100644 pages/views/blogs/ESL v4.0.0 copy.md

diff --git a/pages/11ty/join.js b/pages/11ty/join.js
deleted file mode 100644
index 2292530b8..000000000
--- a/pages/11ty/join.js
+++ /dev/null
@@ -1,11 +0,0 @@
-module.exports = function (config) {
-  config.addCollection('news', function(collection) {
-    const collections = collection.getAll()[0].data.collections;
-    const news = collections.blogs.concat(collections.articles).sort((a, b) => a.date - b.date)
-    news.title = 'Articles & News'
-    return news;
-    /* collection.getAll().filter((item) => {
-      console.log(item.data.tags)
-      return item.data?.tags?.includes('articles')})*/
-  });
-};  
diff --git a/pages/11ty/news.js b/pages/11ty/news.js
new file mode 100644
index 000000000..599371003
--- /dev/null
+++ b/pages/11ty/news.js
@@ -0,0 +1,6 @@
+module.exports = (config) => {
+  config.addCollection('news', (collection) => {
+    const collections = collection.getAll()[0].data.collections;
+    return collections.blogs.concat(collections.articles).sort((a, b) => a.date - b.date);
+  });
+};  
diff --git a/pages/src/landing/blogs/blogs.less b/pages/src/landing/blogs/blogs.less
index 498781def..78f16670c 100644
--- a/pages/src/landing/blogs/blogs.less
+++ b/pages/src/landing/blogs/blogs.less
@@ -1,64 +1,21 @@
 @import (reference) "../../common/variables.less";
 
-.blogs {
+.news {
   position: relative;
-  margin-bottom: 2rem;
+  margin: 5rem auto;
 
   &-item {
     display: flex;
     flex: 1 0 0px;
     align-items: center;
-    padding: 30px 45px;
     list-style: none;
-    @media @sm-xl {
-      display: block;
-    }
-    @media @sm {
-      min-width: 300px;
-      max-width: 350px;
-    }
-    @media @md-lg {
-      min-width: 340px;
-      max-width: 500px;
-    }
-    @media @xl {
-      min-width: 400px;
-      max-width: 500px;
-    }
   }
 
-  &-container {
-    margin: 0 -45px;
-    padding-bottom: 35px;
-
-    @media @sm-xl {
-      padding-bottom: 50px;
-      display: flex;
-      flex-wrap: wrap;
-    }
-  }
-
-  &-content-name {
-    margin-bottom: 20px;
-    font-size: 1.5rem;
-  }
-
-  &-content-text {
-    margin-bottom: 20px;
-    font-size: 1rem;
-  }
-}
-
-.blogs2 {
-  position: relative;
-  margin-bottom: 2rem;
-
-  &-item {
-    display: flex;
-    flex: 1 0 0px;
-    align-items: center;
+  &-content {
     padding: 10px 45px;
-    list-style: none;
+    color: white;
+    background-size: 0% 100%;
+    transition: color .2s ease-in, background-size 1.5s, background-color 1.5s;
 
     &::before {
       content: '';
@@ -66,140 +23,53 @@
       top: 0;
       left: 1px;
       height: 100%;
-      border-left: 3px solid #cfcfcf;
+      border-left: 3px solid @nav-dark-fg;
+      transition: border-color .2s ease-in-out;
     }
-  }
-
-  &-container {
-    // padding-bottom: 35px;
-    margin-bottom: 0;
-  }
-
-  &-content-name {
-    margin-bottom: 20px;
-    font-size: 1.5rem;
-  }
 
-  &-content-text {
-    margin-bottom: 20px;
-    font-size: 1rem;
-  }
-
-  &-more {
-    text-align: center;
-    padding-bottom: 20px;
-
-    /* &::before {
-      content: '';
-      position: absolute;
-      left: calc(37.5%);
-      bottom: 1px;
+    &-cta {
+      color: @nav-dark-hover;
+      font-weight: bold;
 
-      width: 25%;
-      border-bottom: 3px solid #cfcfcf;
+      opacity: 0;
+      transition: opacity .2s ease-in;
     }
 
-    &::after {
-      content: '';
-      position: absolute;
-      left: calc(50% - 10px);
-      bottom: -11px;
-
-      transform: rotate(45deg);
-
-      width: 20px;
-      height: 20px;
-      border-right: 3px solid #cfcfcf;
-      border-bottom: 3px solid #cfcfcf;
-    }*/
-  }
-}
-
-.blogs3 {
-  position: relative;
-  margin-bottom: 2rem;
-
-  &-item {
-    display: flex;
-    flex: 1 0 0px;
-    align-items: center;
-    padding: 30px 45px;
-    list-style: none;
-
-    @media @sm-xl {
-      display: block;
-    }
-    @media @sm {
-      min-width: 300px;
-      max-width: 350px;
-    }
-    @media @md-lg {
-      min-width: 540px;
-      max-width: 700px;
-    }
-    @media @xl {
-      min-width: 600px;
-      max-width: 700px;
+    &-date {
+      padding: 5px 0 15px;
+      font-size: .7em;
     }
 
-    &::before {
-      content: '';
-      position: absolute;
-      top: 0;
-      left: 1px;
-      height: 100%;
-      border-left: 3px solid #cfcfcf;
+    &-name {
+      font-size: 1.5rem;
     }
-  }
-
-  &-container {
-    padding-bottom: 35px;
 
-    @media @sm-xl {
-      padding-bottom: 50px;
-      display: flex;
-      flex-direction: column;
-      max-height: 700px;
-      flex-wrap: wrap;
+    &-text {
+      font-size: 1rem;
     }
-  }
 
-  &-content-name {
-    margin-bottom: 20px;
-    font-size: 1.5rem;
-  }
+    &:hover {
+      color: @nav-dark-hover;
+      text-decoration: none;
 
-  &-content-text {
-    margin-bottom: 20px;
-    font-size: 1rem;
-  }
+      background-color: rgba(@nav-dark-selected, .1);
+      background-image: linear-gradient(to right, #fff0 0%, #fff0 50%, #fff3 100%);
+      background-size: 200% 100%; 
+      background-repeat: no-repeat;
 
-  &-more {
-    text-align: center;
-    padding-bottom: 20px;
+      &::before {
+        border-color: @nav-dark-accent;
+      }
 
-    /* &::before {
-      content: '';
-      position: absolute;
-      left: calc(37.5%);
-      bottom: 1px;
+      .news-content {
+        &-cta {
+          opacity: 1;
+        }
 
-      width: 25%;
-      border-bottom: 3px solid #cfcfcf;
+        &-text {
+          color: @nav-dark-accent;
+        }
+      }
     }
-
-    &::after {
-      content: '';
-      position: absolute;
-      left: calc(50% - 10px);
-      bottom: -11px;
-
-      transform: rotate(45deg);
-
-      width: 20px;
-      height: 20px;
-      border-right: 3px solid #cfcfcf;
-      border-bottom: 3px solid #cfcfcf;
-    }*/
   }
 }
diff --git a/pages/views/_includes/landing/blogs.njk b/pages/views/_includes/landing/blogs.njk
deleted file mode 100644
index fff3fa2bd..000000000
--- a/pages/views/_includes/landing/blogs.njk
+++ /dev/null
@@ -1,19 +0,0 @@
-{% set releasedBlogs = collections.blogs | released %}
-{% if releasedBlogs.length %}
-<div class="blogs container">
-  <h2>{{ landing.blogs.title }}</h2>
-  {% if 'new' in [].concat(tags) %}<span class="badge badge-sup badge-success">New</span>{% endif %}
-  <esl-animate target="::next::child" group></esl-animate>
-  <ul class="blogs-container">
-    {% for item in releasedBlogs | reverse | limit(3) %}
-      <li class="blogs-item esl-animate-slide-left">
-        <div class="blogs-content">
-          <h4 class="blogs-content-name">{{ item.data.name }}</h4>
-          <p class="blogs-content-text">{{ item.templateContent | text | truncate(250) }}</p>
-          <a class="arrow-link btn-link btn-sm"  href="{{ item.url | url }}">{{ landing.blogs.cta.text }}</a>
-        </div>
-      </li>
-    {% endfor %}
-  </ul>
-</div>
-{% endif %}
diff --git a/pages/views/_includes/landing/blogs2.njk b/pages/views/_includes/landing/blogs2.njk
deleted file mode 100644
index f95643234..000000000
--- a/pages/views/_includes/landing/blogs2.njk
+++ /dev/null
@@ -1,33 +0,0 @@
-{% set releasedBlogs = collections.news | released %}
-{% if releasedBlogs.length %}
-<div class="blogs2 container">
-  <h2>{{ collections.news.title }}</h2>
-  <esl-animate target="::next::child" group></esl-animate>
-  <ul class="blogs2-container">
-    {% for item in releasedBlogs | reverse | limit(3) %}
-      <li class="blogs2-item esl-animate-slide-down">
-        <div class="blogs2-content">
-          {% set found = false %}
-          {% for tag in item.data.tags %}
-            {% if tag === 'articles' %}{% set found = true %}{% endif %}
-          {% endfor %}
-
-          <h4 class="blogs2-content-name">
-            {% if found %} 🚩
-            {% else %} ⚡️ 
-            {% endif %}
-            {{ item.data.name }}
-
-            <span style="float: right; font-size: 0.5em;">({{item.date | date}})</span>
-          </h4>
-          <p class="blogs2-content-text">{{ item.templateContent | text | truncate(250) }}          <a class="arrow-link btn-link btn-sm"  href="{{ item.url | url }}">{{ landing.blogs.cta.text }}</a></p>
-        </div>
-      </li>
-    {% endfor %}
-  </ul>
-  {# <div class="blogs2-more">
-    <a class="arrow-link btn-link arrow-link2" style="text-align: center" href="{{ item.url | url }}">Load More</a>
-  </div> #}
-  {# <div class="blogs2-more">Load More</div> #}
-</div>
-{% endif %}
diff --git a/pages/views/_includes/landing/blogs3.njk b/pages/views/_includes/landing/blogs3.njk
deleted file mode 100644
index c84c675e4..000000000
--- a/pages/views/_includes/landing/blogs3.njk
+++ /dev/null
@@ -1,31 +0,0 @@
-{% set releasedBlogs = collections.news | released %}
-{% if releasedBlogs.length %}
-<div class="blogs3 container">
-  <h2>{{ collections.news.title }}</h2>
-  <esl-animate target="::next::child" group></esl-animate>
-  <ul class="blogs3-container">
-    {% for item in releasedBlogs | reverse | limit(6) %}
-      <li class="blogs3-item esl-animate-slide-down">
-        <div class="blogs3-content">
-          {% set found = false %}
-          {% for tag in item.data.tags %}
-            {% if tag === 'articles' %}{% set found = true %}{% endif %}
-          {% endfor %}
-
-          <h4 class="blogs3-content-name">
-            {% if found %} 🚩
-            {% else %} ⚡️ 
-            {% endif %}
-            {{ item.data.name }}
-            <span style="float: right; font-size: 0.5em;">({{item.date | date}})</span>
-          </h4>
-          <p class="blogs3-content-text">{{ item.templateContent | text | truncate(250) }} <a class="arrow-link btn-link btn-sm"  href="{{ item.url | url }}">{{ landing.blogs.cta.text }}</a></p>
-        </div>
-      </li>
-    {% endfor %}
-  </ul>
-  {# <div class="blogs2-more">
-    <a class="arrow-link btn-link arrow-link2" style="text-align: center" href="{{ item.url | url }}">Load More</a>
-  </div> #}
-</div>
-{% endif %}
diff --git a/pages/views/_includes/landing/news.njk b/pages/views/_includes/landing/news.njk
new file mode 100644
index 000000000..5137cb931
--- /dev/null
+++ b/pages/views/_includes/landing/news.njk
@@ -0,0 +1,20 @@
+{% set releasedBlogs = collections.news | released %}
+{% if releasedBlogs.length %}
+  <div class="news container">
+    <h2>{{ landing.news.title }}</h2>
+    <esl-animate target="::next::child" group></esl-animate>
+    <ul class="news-container">
+      {% for item in releasedBlogs | reverse | limit(3) %}
+        <li class="esl-animate-slide-down news-item">
+          <a class="news-content" href="{{ item.url | url }}">
+            <h4 class="news-content-name">{{ item.data.emoji }}{{ item.data.name }}</h4>
+            <div class="news-content-date">{{item.date | date}}</div>
+            <p class="news-content-text">{{ item.templateContent | text | truncate(250) }}
+              <span class="news-content-cta">{{ landing.news.cta.text }}</span>
+            </p>
+          </a>
+        </li>
+      {% endfor %}
+    </ul>
+  </div>
+{% endif %}
diff --git a/pages/views/articles/ESL v4.0.0 copy 2.md b/pages/views/articles/ESL v4.0.0 copy 2.md
deleted file mode 100644
index 5cabd607b..000000000
--- a/pages/views/articles/ESL v4.0.0 copy 2.md	
+++ /dev/null
@@ -1,196 +0,0 @@
----
-layout: content
-name: Article1
-title: Article1
-tags: [articles, New]
-date: 2022-06-01
-containerCls: container markdown-container
----
-
-## ESL Core
-### Features:
-  - `ESLEventListener`s currency_exchange :currency_exchange: functionality introduced
-  - `ESLMixinElement`s functionality introduced
-  - `ESLBaseElement` extended API 
-    - `ESLBaseElement.create` shortcut to create current custom element
-
-### Structural changes:
-  - Attribute decorators moved to the `esl-utils`
-  - All ESL modules migrated to `ESLEventListener`s
-  - Event names are now defined on the prototype level
-
-### BREAKING CHANGES
-  - `$$fire` no longer adds 'esl:' prefix to the fired events
-
----
-
-## ESL Media Query
-
-### Features:
-  - `ESLMediaQuery` now implements `EventTarget` interface
-  - `ESLMediaRuleList` API reworked with `EventTarget` interface and new calculation strategy
-
-### BREAKING CHANGES
-  - `ESLMediaRuleList.parseTuple` arguments order changed
-  - `ESLMediaRule` no longer supports default marker, now "default" is equal to "all" query
-  - `ESLMediaRuleList` observation callback signature changed, now it should be `EventListener`
-  - `ESLMediaRuleList.prototype.default` removed as no longer default rules
-  - `ESLMediaRuleList` no longer fires events on rule change, now it's based on active value change
-  - `ESLMediaRuleList` now uses merging of all active rules to define result value, however you were still able to get the last active rule value
-  - `ESLMediaRuleList.prototype.active` now returns an array of active rules
-
----
-
-## ESL Traversing Query
-
-### Features:
-  - add comma support to define multiple target ([#1120](https://github.com/exadel-inc/esl/issues/1120) / [#1129](https://github.com/exadel-inc/esl/issues/1129)) ([2890d7b](https://github.com/exadel-inc/esl/commit/2890d7b7667492b982b266048d23874c57b938ea)), closes [#1102](https://github.com/exadel-inc/esl/issues/1102)
-  - add ability to find closest element ([ada6fbb](https://github.com/exadel-inc/esl/commit/ada6fbb172a2fb2cf0d435420ad8fb0a46e7766f))
-
----
-  
-## ESL Utils
-
-### Features:
-  - ability to grow/shrink axis of the `Rect` ([1c58a1c](https://github.com/exadel-inc/esl/commit/1c58a1c19b0aa82abf7eb73c40781e9c4a4860ba))
-  - `SyntheticEventTarget` to implement `EventTarget` interface with more listeners control ([e4f3eb8](https://github.com/exadel-inc/esl/commit/e4f3eb89e0dd8227937d476a8d2090730342de64))
-  - simplify and extend `@prop` decorator API ([fd6ede3](https://github.com/exadel-inc/esl/commit/fd6ede34b0a3c7496083cb58aa9b726d4a692085))
-  - add `skipOneRender` RAF utility ([ddc3227](https://github.com/exadel-inc/esl/commit/ddc322798e6f8cf447874896786fe6d368bbe5ef))
-  - add ability to pass predicate to sequence finder ([dd8c3cb](https://github.com/exadel-inc/esl/commit/dd8c3cbb43ed529330c32459b9787949a0927a01))
-  - add `@decorate` decorator to bind and decorate method of the class
-  - `@attr` extended with ability to pass Serializer/Parser ([012eb83](https://github.com/exadel-inc/esl/commit/012eb83ebcbba8315a2766af090239774c21234e))
-  - create dom html sanitize method ([004642f](https://github.com/exadel-inc/esl/commit/004642f866ac1b2ed5278084963288d8c2fd17e0))
-  - create `extractValues` object utility ([8edd9e7](https://github.com/exadel-inc/esl/commit/8edd9e7b564b4ac78a4fc952ee58f76b6a54cf89))
-  - create cumulative imports for esl-utils submodules ([2e9d6ad](https://github.com/exadel-inc/esl/commit/2e9d6ad8f327ede991feef4ebc7c76fdd55726af))
-
-### BREAKING CHANGES
-  - `isMouseEvent`, `isTouchEvent` moved outside of `EventUtils`
-  - `normalizeTouchPoint` renamed to `touchPoint` and moved outside of `EventUtils`
-  - `normalizeCoordinates` removed. Use `getOffsetPoint` in combination with `getTouchPoint` instead
-  - `@prop` signature changed `prop(value?: any, prototypeConfig: OverrideDecoratorConfig = {})` instead
-  - `ScrollUtils.lock` no longer accessible. Use `lockScroll(document.documentElement, {strategy: '...'})` instead
-  - `ScrollUtils.unlock` no longer accessible. Use `unlockScroll(document.documentElement, {strategy: '...'})` instead
-  - `ScrollUtils.lockRequest` no longer accessible. Use `lockScroll(document.documentElement, {strategy: '...', initiatior})` instead
-  - `ScrollUtils.unlockRequest` no longer accessible. Use `unlockScroll(document.documentElement, {strategy: '...', initiatior})` instead
-
-### Bugfixes
-  - make attr decorators correctly strict typed
-  - `deepMerge` primitive values merging improved, undefined arguments now ignored ([5b7b730](https://github.com/exadel-inc/esl/commit/5b7b73003acd4d29250af12603ced5d58c40aff6))
-  - fix `@bind` decorator to save original function enumerable marker ([92c2086](https://github.com/exadel-inc/esl/commit/92c2086df610a5572143463302baf7aeea6174e9))
-  - update `@decorate` decorator to allow to save context properly (on instance level) ([0ac1b0c](https://github.com/exadel-inc/esl/commit/0ac1b0cb9c90648ae1e0a18a16a936971c4b4ee9))
-
----
-
-## ESL Toggleable and ESL Trigger
-
-### Features:
-  - migrate `esl-toggleable` and `esl-trigger` to ESLEventListeners
-  - `esl:show:request` additional data ([a121872](https://github.com/exadel-inc/esl/commit/a121872b6e69fd7fb7a71bdfa9058430e650f423))
-  - support of `esl:hide:request` ([8a0928b](https://github.com/exadel-inc/esl/commit/8a0928b2f2bda63c6fbbaf5e9b6453d660091ec1))
-  - add support of dynamic `aria-label` for `esl-trigger` ([5c18841](https://github.com/exadel-inc/esl/commit/5c188418720ad4a972caa7450563a29268d8ec97))
-  - add esc key event handler for `esl-trigger` ([3dab6da](https://github.com/exadel-inc/esl/commit/3dab6dad39259f7e920c9a108757271cb58a216d))
-  - add `ignore-esc` attribute for `esl-trigger` ([605b715](https://github.com/exadel-inc/esl/commit/605b715a29ef1a852e24ce5120ca30d394fc19c1))
-
-
-## ESL Panel and ESL Panel Group
-
-### Features:
-  - migrate `esl-panel` and `esl-panel-group` to ESLEventListeners
-  - add `refresh-strategy` attribute ([#1156](https://github.com/exadel-inc/esl/issues/1156)) ([36027ad](https://github.com/exadel-inc/esl/commit/36027ad2574c0c33df1b6370484448a6889a647a))
-  - add ability to control min/max open panels per media condition ([67ca2ba](https://github.com/exadel-inc/esl/commit/67ca2ba16e3fc4ee4300d1c79ca2e5d0da845af7))
-
-### BREAKING CHANGES
-  - `ESLPanelGroup.noCollapse` (with related attribute) renamed to `ESLPanelGroup.noAnimate` (`no-animate` attribute)
-  - `ESLPanelGroup.shouldCollapse` renamed to `ESLPanelGroup.shouldAnimate`
-  - `PanelActionParams.noCollapse` renamed to `PanelActionParams.noAnimate`
-  - `ESLPanelGroup` `view` attribute is no longer supported
-  - `open` mode of `ESLPanelGroup` is no longer supported, it should be replaced with a `min-open-items="all"`
-  - `accordion-group="single"` attribute of `ESLPanelGroup` is no longer supported, replaced with `max-open-items="1"`
-  - `accordion-group="single"` attribute of `ESLPanelGroup` is no longer supported, replaced with `max-open-items="all"`
-  - components inherited from `ESLPanelGroup` should use `@listen({inherit: true})` for proper subscription
-
-### Bugfixes
-  - add `capturedBy` and fix `after:show` dispatch ([9bdc98c](https://github.com/exadel-inc/esl/commit/9bdc98c98a2926fe42c7cd15007c31a19171027c))
-  - fix `esl:before:hide` bubbling from uncontrolled toggleables ([9212b6b](https://github.com/exadel-inc/esl/commit/9212b6beacd97d39d0410a464598e9e2e0bdb1c2))
-  - fix animation process capturing by `ESLPanel` component ([9a5b3a5](https://github.com/exadel-inc/esl/commit/9a5b3a576d5cb4dbd47d113d944932586155c7f6))
-  - change `no-animate` API ([dde3500](https://github.com/exadel-inc/esl/commit/dde35009268a92bae92a45f00d11cb29edee98fa))
-
-
-## ESL Tab and ESLTabs
-
-### Features:
-  - `esl-tab` and `esl-tabs` migrated to ESLEventListeners
-
-### Bugfixes:
-  - fix alignment behavior ([b5ebd66](https://github.com/exadel-inc/esl/commit/b5ebd668de7b4d1eea7311ae7d734c02abb537cf))
-
-### BREAKING CHANGES
-  - Listeners extended from `ESLTab` should now use `@listen` annotation to work correctly
-  - Listeners extended from `ESLTabs` should now use `@listen` annotation to work correctly
-
-## ESL Alert
-
-### Features:
-  - `esl-alert` migrated to ESLEventListeners, inner API updates
-
-### BREAKING CHANGES
-  - Listeners extended from `ESLAlert` should now use `@listen` annotation to work correctly
-  - `eventNs` is no longer supported, event is now defined directly on the prototype level
-
-
-## ESL Popup
-
-### Features:
-  - add configurable `rootMargin` for the popup activator observer ([5d647d6](https://github.com/exadel-inc/esl/commit/5d647d60673a65e7b27472c1b68a1e174fa40740))
-  - add extended `offsetContainer` configuration ([63cbc0a](https://github.com/exadel-inc/esl/commit/63cbc0a996a8578549360dadaa3bb17c53884bfe))
-
-### BREAKING CHANGES
-  - Listeners extended from `ESLPopup` should now use `@listen` annotation to work correctly
-
-
-## ESL Footnotes
-
-### Features:
-  - migrate `esl-notes` and `esl-footnotes` to ESLEventListeners
-  - add configurable `intersectionMargin`  for the note tooltip activator observer ([b9b1599](https://github.com/exadel-inc/esl/commit/b9b159942e3534965f43cac94c140d5680308548))
-
-### BREAKING CHANGES
-  - Listeners extended from `ESLNote` should now use `@listen` annotation to work correctly
-  - Listeners extended from `ESLFootnote` should now use `@listen` annotation to work correctly
-  - `eventNs` is no longer supported, event is now defined directly on the prototype level
-
-## ESL Image and ESL Media
-
-### Bugfixes:
-  - fix esl-image to prevent DOM XSS vulnerabilities ([4fd925d](https://github.com/exadel-inc/esl/commit/4fd925df8605994b0f7d345d77a425e0cdc487e8))
-  - fix wrong error status on svg images in FF ([cad6b40](https://github.com/exadel-inc/esl/commit/cad6b40ccce01aaea8b1869b2cd7d542939a4fd4))
-
-
-## ESL Scrollbar
-
-### Features:
-  - migrate `esl-scrollbar` to ESLEventListeners
-
-### Bugfixes
-  - remove unnecessary width ([6e18909](https://github.com/exadel-inc/esl/commit/6e18909c6768c259d76084b463404fe6b29c9af8))
-
-### BREAKING CHANGES
-  - Listeners extended from `ESLScrollbar` should now use `@listen` annotation to work correctly
-
-
-## ESL Select
-
-### Features:
-  - migrate `esl-select` to ESLEventListeners ([76ca947](https://github.com/exadel-inc/esl/commit/76ca9479090546cdf092d1c9c3f5d993263f0581))
-  - add `dropdown-class` param to specify dropdown additional CSS class(es) ([938357f](https://github.com/exadel-inc/esl/commit/938357fa6fb5db804f445f31eb4f73641dfbcccf))
-
-
-## ESL Polyfills
-
-### Features:
-  - `Event`, `CustomEvent`, `MouseEvent`, `KeyboardEvent`, `FocusEvent` extended polyfills ([9ca3c40](https://github.com/exadel-inc/esl/commit/9ca3c406ff1f6f99490fdf09d2f15bc450c7be57))
-  - `Object.assign` and `Array.from` extended polyfills ([590bca4](https://github.com/exadel-inc/esl/commit/590bca4fab39c566db68f7bc2440e5d84355a991))
-  - extended `es5-target-shim` ([ef53df9](https://github.com/exadel-inc/esl/commit/ef53df936dd2beda859a41e9f8a900199bb24f3e))
-
-### BREAKING CHANGES
-  - ES5 shim `shimES5ElementConstructor` replaced with `shimES5Constructor`
diff --git a/pages/views/articles/ESL v4.0.0 copy.md b/pages/views/articles/ESL v4.0.0 copy.md
deleted file mode 100644
index aa533fd4c..000000000
--- a/pages/views/articles/ESL v4.0.0 copy.md	
+++ /dev/null
@@ -1,197 +0,0 @@
----
-layout: content
-name: Article2
-title: Article2
-tags: [articles, draft]
-date: 2023-09-01
-containerCls: container markdown-container
----
-
-## ESL Core
-
-### Features:
-  - `ESLEventListener`s  functionality introduced
-  - `ESLMixinElement`s functionality introduced
-  - `ESLBaseElement` extended API 
-    - `ESLBaseElement.create` shortcut to create current custom element
-
-### Structural changes:
-  - Attribute decorators moved to the `esl-utils`
-  - All ESL modules migrated to `ESLEventListener`s
-  - Event names are now defined on the prototype level
-
-### BREAKING CHANGES
-  - `$$fire` no longer adds 'esl:' prefix to the fired events
-
----
-
-## ESL Media Query
-
-### Features:
-  - `ESLMediaQuery` now implements `EventTarget` interface
-  - `ESLMediaRuleList` API reworked with `EventTarget` interface and new calculation strategy
-
-### BREAKING CHANGES
-  - `ESLMediaRuleList.parseTuple` arguments order changed
-  - `ESLMediaRule` no longer supports default marker, now "default" is equal to "all" query
-  - `ESLMediaRuleList` observation callback signature changed, now it should be `EventListener`
-  - `ESLMediaRuleList.prototype.default` removed as no longer default rules
-  - `ESLMediaRuleList` no longer fires events on rule change, now it's based on active value change
-  - `ESLMediaRuleList` now uses merging of all active rules to define result value, however you were still able to get the last active rule value
-  - `ESLMediaRuleList.prototype.active` now returns an array of active rules
-
----
-
-## ESL Traversing Query
-
-### Features:
-  - add comma support to define multiple target ([#1120](https://github.com/exadel-inc/esl/issues/1120) / [#1129](https://github.com/exadel-inc/esl/issues/1129)) ([2890d7b](https://github.com/exadel-inc/esl/commit/2890d7b7667492b982b266048d23874c57b938ea)), closes [#1102](https://github.com/exadel-inc/esl/issues/1102)
-  - add ability to find closest element ([ada6fbb](https://github.com/exadel-inc/esl/commit/ada6fbb172a2fb2cf0d435420ad8fb0a46e7766f))
-
----
-  
-## ESL Utils
-
-### Features:
-  - ability to grow/shrink axis of the `Rect` ([1c58a1c](https://github.com/exadel-inc/esl/commit/1c58a1c19b0aa82abf7eb73c40781e9c4a4860ba))
-  - `SyntheticEventTarget` to implement `EventTarget` interface with more listeners control ([e4f3eb8](https://github.com/exadel-inc/esl/commit/e4f3eb89e0dd8227937d476a8d2090730342de64))
-  - simplify and extend `@prop` decorator API ([fd6ede3](https://github.com/exadel-inc/esl/commit/fd6ede34b0a3c7496083cb58aa9b726d4a692085))
-  - add `skipOneRender` RAF utility ([ddc3227](https://github.com/exadel-inc/esl/commit/ddc322798e6f8cf447874896786fe6d368bbe5ef))
-  - add ability to pass predicate to sequence finder ([dd8c3cb](https://github.com/exadel-inc/esl/commit/dd8c3cbb43ed529330c32459b9787949a0927a01))
-  - add `@decorate` decorator to bind and decorate method of the class
-  - `@attr` extended with ability to pass Serializer/Parser ([012eb83](https://github.com/exadel-inc/esl/commit/012eb83ebcbba8315a2766af090239774c21234e))
-  - create dom html sanitize method ([004642f](https://github.com/exadel-inc/esl/commit/004642f866ac1b2ed5278084963288d8c2fd17e0))
-  - create `extractValues` object utility ([8edd9e7](https://github.com/exadel-inc/esl/commit/8edd9e7b564b4ac78a4fc952ee58f76b6a54cf89))
-  - create cumulative imports for esl-utils submodules ([2e9d6ad](https://github.com/exadel-inc/esl/commit/2e9d6ad8f327ede991feef4ebc7c76fdd55726af))
-
-### BREAKING CHANGES
-  - `isMouseEvent`, `isTouchEvent` moved outside of `EventUtils`
-  - `normalizeTouchPoint` renamed to `touchPoint` and moved outside of `EventUtils`
-  - `normalizeCoordinates` removed. Use `getOffsetPoint` in combination with `getTouchPoint` instead
-  - `@prop` signature changed `prop(value?: any, prototypeConfig: OverrideDecoratorConfig = {})` instead
-  - `ScrollUtils.lock` no longer accessible. Use `lockScroll(document.documentElement, {strategy: '...'})` instead
-  - `ScrollUtils.unlock` no longer accessible. Use `unlockScroll(document.documentElement, {strategy: '...'})` instead
-  - `ScrollUtils.lockRequest` no longer accessible. Use `lockScroll(document.documentElement, {strategy: '...', initiatior})` instead
-  - `ScrollUtils.unlockRequest` no longer accessible. Use `unlockScroll(document.documentElement, {strategy: '...', initiatior})` instead
-
-### Bugfixes
-  - make attr decorators correctly strict typed
-  - `deepMerge` primitive values merging improved, undefined arguments now ignored ([5b7b730](https://github.com/exadel-inc/esl/commit/5b7b73003acd4d29250af12603ced5d58c40aff6))
-  - fix `@bind` decorator to save original function enumerable marker ([92c2086](https://github.com/exadel-inc/esl/commit/92c2086df610a5572143463302baf7aeea6174e9))
-  - update `@decorate` decorator to allow to save context properly (on instance level) ([0ac1b0c](https://github.com/exadel-inc/esl/commit/0ac1b0cb9c90648ae1e0a18a16a936971c4b4ee9))
-
----
-
-## ESL Toggleable and ESL Trigger
-
-### Features:
-  - migrate `esl-toggleable` and `esl-trigger` to ESLEventListeners
-  - `esl:show:request` additional data ([a121872](https://github.com/exadel-inc/esl/commit/a121872b6e69fd7fb7a71bdfa9058430e650f423))
-  - support of `esl:hide:request` ([8a0928b](https://github.com/exadel-inc/esl/commit/8a0928b2f2bda63c6fbbaf5e9b6453d660091ec1))
-  - add support of dynamic `aria-label` for `esl-trigger` ([5c18841](https://github.com/exadel-inc/esl/commit/5c188418720ad4a972caa7450563a29268d8ec97))
-  - add esc key event handler for `esl-trigger` ([3dab6da](https://github.com/exadel-inc/esl/commit/3dab6dad39259f7e920c9a108757271cb58a216d))
-  - add `ignore-esc` attribute for `esl-trigger` ([605b715](https://github.com/exadel-inc/esl/commit/605b715a29ef1a852e24ce5120ca30d394fc19c1))
-
-
-## ESL Panel and ESL Panel Group
-
-### Features:
-  - migrate `esl-panel` and `esl-panel-group` to ESLEventListeners
-  - add `refresh-strategy` attribute ([#1156](https://github.com/exadel-inc/esl/issues/1156)) ([36027ad](https://github.com/exadel-inc/esl/commit/36027ad2574c0c33df1b6370484448a6889a647a))
-  - add ability to control min/max open panels per media condition ([67ca2ba](https://github.com/exadel-inc/esl/commit/67ca2ba16e3fc4ee4300d1c79ca2e5d0da845af7))
-
-### BREAKING CHANGES
-  - `ESLPanelGroup.noCollapse` (with related attribute) renamed to `ESLPanelGroup.noAnimate` (`no-animate` attribute)
-  - `ESLPanelGroup.shouldCollapse` renamed to `ESLPanelGroup.shouldAnimate`
-  - `PanelActionParams.noCollapse` renamed to `PanelActionParams.noAnimate`
-  - `ESLPanelGroup` `view` attribute is no longer supported
-  - `open` mode of `ESLPanelGroup` is no longer supported, it should be replaced with a `min-open-items="all"`
-  - `accordion-group="single"` attribute of `ESLPanelGroup` is no longer supported, replaced with `max-open-items="1"`
-  - `accordion-group="single"` attribute of `ESLPanelGroup` is no longer supported, replaced with `max-open-items="all"`
-  - components inherited from `ESLPanelGroup` should use `@listen({inherit: true})` for proper subscription
-
-### Bugfixes
-  - add `capturedBy` and fix `after:show` dispatch ([9bdc98c](https://github.com/exadel-inc/esl/commit/9bdc98c98a2926fe42c7cd15007c31a19171027c))
-  - fix `esl:before:hide` bubbling from uncontrolled toggleables ([9212b6b](https://github.com/exadel-inc/esl/commit/9212b6beacd97d39d0410a464598e9e2e0bdb1c2))
-  - fix animation process capturing by `ESLPanel` component ([9a5b3a5](https://github.com/exadel-inc/esl/commit/9a5b3a576d5cb4dbd47d113d944932586155c7f6))
-  - change `no-animate` API ([dde3500](https://github.com/exadel-inc/esl/commit/dde35009268a92bae92a45f00d11cb29edee98fa))
-
-
-## ESL Tab and ESLTabs
-
-### Features:
-  - `esl-tab` and `esl-tabs` migrated to ESLEventListeners
-
-### Bugfixes:
-  - fix alignment behavior ([b5ebd66](https://github.com/exadel-inc/esl/commit/b5ebd668de7b4d1eea7311ae7d734c02abb537cf))
-
-### BREAKING CHANGES
-  - Listeners extended from `ESLTab` should now use `@listen` annotation to work correctly
-  - Listeners extended from `ESLTabs` should now use `@listen` annotation to work correctly
-
-## ESL Alert
-
-### Features:
-  - `esl-alert` migrated to ESLEventListeners, inner API updates
-
-### BREAKING CHANGES
-  - Listeners extended from `ESLAlert` should now use `@listen` annotation to work correctly
-  - `eventNs` is no longer supported, event is now defined directly on the prototype level
-
-
-## ESL Popup
-
-### Features:
-  - add configurable `rootMargin` for the popup activator observer ([5d647d6](https://github.com/exadel-inc/esl/commit/5d647d60673a65e7b27472c1b68a1e174fa40740))
-  - add extended `offsetContainer` configuration ([63cbc0a](https://github.com/exadel-inc/esl/commit/63cbc0a996a8578549360dadaa3bb17c53884bfe))
-
-### BREAKING CHANGES
-  - Listeners extended from `ESLPopup` should now use `@listen` annotation to work correctly
-
-
-## ESL Footnotes
-
-### Features:
-  - migrate `esl-notes` and `esl-footnotes` to ESLEventListeners
-  - add configurable `intersectionMargin`  for the note tooltip activator observer ([b9b1599](https://github.com/exadel-inc/esl/commit/b9b159942e3534965f43cac94c140d5680308548))
-
-### BREAKING CHANGES
-  - Listeners extended from `ESLNote` should now use `@listen` annotation to work correctly
-  - Listeners extended from `ESLFootnote` should now use `@listen` annotation to work correctly
-  - `eventNs` is no longer supported, event is now defined directly on the prototype level
-
-## ESL Image and ESL Media
-
-### Bugfixes:
-  - fix esl-image to prevent DOM XSS vulnerabilities ([4fd925d](https://github.com/exadel-inc/esl/commit/4fd925df8605994b0f7d345d77a425e0cdc487e8))
-  - fix wrong error status on svg images in FF ([cad6b40](https://github.com/exadel-inc/esl/commit/cad6b40ccce01aaea8b1869b2cd7d542939a4fd4))
-
-
-## ESL Scrollbar
-
-### Features:
-  - migrate `esl-scrollbar` to ESLEventListeners
-
-### Bugfixes
-  - remove unnecessary width ([6e18909](https://github.com/exadel-inc/esl/commit/6e18909c6768c259d76084b463404fe6b29c9af8))
-
-### BREAKING CHANGES
-  - Listeners extended from `ESLScrollbar` should now use `@listen` annotation to work correctly
-
-
-## ESL Select
-
-### Features:
-  - migrate `esl-select` to ESLEventListeners ([76ca947](https://github.com/exadel-inc/esl/commit/76ca9479090546cdf092d1c9c3f5d993263f0581))
-  - add `dropdown-class` param to specify dropdown additional CSS class(es) ([938357f](https://github.com/exadel-inc/esl/commit/938357fa6fb5db804f445f31eb4f73641dfbcccf))
-
-
-## ESL Polyfills
-
-### Features:
-  - `Event`, `CustomEvent`, `MouseEvent`, `KeyboardEvent`, `FocusEvent` extended polyfills ([9ca3c40](https://github.com/exadel-inc/esl/commit/9ca3c406ff1f6f99490fdf09d2f15bc450c7be57))
-  - `Object.assign` and `Array.from` extended polyfills ([590bca4](https://github.com/exadel-inc/esl/commit/590bca4fab39c566db68f7bc2440e5d84355a991))
-  - extended `es5-target-shim` ([ef53df9](https://github.com/exadel-inc/esl/commit/ef53df936dd2beda859a41e9f8a900199bb24f3e))
-
-### BREAKING CHANGES
-  - ES5 shim `shimES5ElementConstructor` replaced with `shimES5Constructor`
diff --git a/pages/views/articles/ESL v4.0.0.md b/pages/views/articles/ESL v4.0.0.md
deleted file mode 100644
index ce33b92ee..000000000
--- a/pages/views/articles/ESL v4.0.0.md	
+++ /dev/null
@@ -1,197 +0,0 @@
----
-layout: content
-name: Article3
-title: Article3
-tags: [articles, draft]
-date: 2023-10-01
-containerCls: container markdown-container
----
-
-## ESL Core
-
-### Features:
-  - `ESLEventListener`s  functionality introduced
-  - `ESLMixinElement`s functionality introduced
-  - `ESLBaseElement` extended API 
-    - `ESLBaseElement.create` shortcut to create current custom element
-
-### Structural changes:
-  - Attribute decorators moved to the `esl-utils`
-  - All ESL modules migrated to `ESLEventListener`s
-  - Event names are now defined on the prototype level
-
-### BREAKING CHANGES
-  - `$$fire` no longer adds 'esl:' prefix to the fired events
-
----
-
-## ESL Media Query
-
-### Features:
-  - `ESLMediaQuery` now implements `EventTarget` interface
-  - `ESLMediaRuleList` API reworked with `EventTarget` interface and new calculation strategy
-
-### BREAKING CHANGES
-  - `ESLMediaRuleList.parseTuple` arguments order changed
-  - `ESLMediaRule` no longer supports default marker, now "default" is equal to "all" query
-  - `ESLMediaRuleList` observation callback signature changed, now it should be `EventListener`
-  - `ESLMediaRuleList.prototype.default` removed as no longer default rules
-  - `ESLMediaRuleList` no longer fires events on rule change, now it's based on active value change
-  - `ESLMediaRuleList` now uses merging of all active rules to define result value, however you were still able to get the last active rule value
-  - `ESLMediaRuleList.prototype.active` now returns an array of active rules
-
----
-
-## ESL Traversing Query
-
-### Features:
-  - add comma support to define multiple target ([#1120](https://github.com/exadel-inc/esl/issues/1120) / [#1129](https://github.com/exadel-inc/esl/issues/1129)) ([2890d7b](https://github.com/exadel-inc/esl/commit/2890d7b7667492b982b266048d23874c57b938ea)), closes [#1102](https://github.com/exadel-inc/esl/issues/1102)
-  - add ability to find closest element ([ada6fbb](https://github.com/exadel-inc/esl/commit/ada6fbb172a2fb2cf0d435420ad8fb0a46e7766f))
-
----
-  
-## ESL Utils
-
-### Features:
-  - ability to grow/shrink axis of the `Rect` ([1c58a1c](https://github.com/exadel-inc/esl/commit/1c58a1c19b0aa82abf7eb73c40781e9c4a4860ba))
-  - `SyntheticEventTarget` to implement `EventTarget` interface with more listeners control ([e4f3eb8](https://github.com/exadel-inc/esl/commit/e4f3eb89e0dd8227937d476a8d2090730342de64))
-  - simplify and extend `@prop` decorator API ([fd6ede3](https://github.com/exadel-inc/esl/commit/fd6ede34b0a3c7496083cb58aa9b726d4a692085))
-  - add `skipOneRender` RAF utility ([ddc3227](https://github.com/exadel-inc/esl/commit/ddc322798e6f8cf447874896786fe6d368bbe5ef))
-  - add ability to pass predicate to sequence finder ([dd8c3cb](https://github.com/exadel-inc/esl/commit/dd8c3cbb43ed529330c32459b9787949a0927a01))
-  - add `@decorate` decorator to bind and decorate method of the class
-  - `@attr` extended with ability to pass Serializer/Parser ([012eb83](https://github.com/exadel-inc/esl/commit/012eb83ebcbba8315a2766af090239774c21234e))
-  - create dom html sanitize method ([004642f](https://github.com/exadel-inc/esl/commit/004642f866ac1b2ed5278084963288d8c2fd17e0))
-  - create `extractValues` object utility ([8edd9e7](https://github.com/exadel-inc/esl/commit/8edd9e7b564b4ac78a4fc952ee58f76b6a54cf89))
-  - create cumulative imports for esl-utils submodules ([2e9d6ad](https://github.com/exadel-inc/esl/commit/2e9d6ad8f327ede991feef4ebc7c76fdd55726af))
-
-### BREAKING CHANGES
-  - `isMouseEvent`, `isTouchEvent` moved outside of `EventUtils`
-  - `normalizeTouchPoint` renamed to `touchPoint` and moved outside of `EventUtils`
-  - `normalizeCoordinates` removed. Use `getOffsetPoint` in combination with `getTouchPoint` instead
-  - `@prop` signature changed `prop(value?: any, prototypeConfig: OverrideDecoratorConfig = {})` instead
-  - `ScrollUtils.lock` no longer accessible. Use `lockScroll(document.documentElement, {strategy: '...'})` instead
-  - `ScrollUtils.unlock` no longer accessible. Use `unlockScroll(document.documentElement, {strategy: '...'})` instead
-  - `ScrollUtils.lockRequest` no longer accessible. Use `lockScroll(document.documentElement, {strategy: '...', initiatior})` instead
-  - `ScrollUtils.unlockRequest` no longer accessible. Use `unlockScroll(document.documentElement, {strategy: '...', initiatior})` instead
-
-### Bugfixes
-  - make attr decorators correctly strict typed
-  - `deepMerge` primitive values merging improved, undefined arguments now ignored ([5b7b730](https://github.com/exadel-inc/esl/commit/5b7b73003acd4d29250af12603ced5d58c40aff6))
-  - fix `@bind` decorator to save original function enumerable marker ([92c2086](https://github.com/exadel-inc/esl/commit/92c2086df610a5572143463302baf7aeea6174e9))
-  - update `@decorate` decorator to allow to save context properly (on instance level) ([0ac1b0c](https://github.com/exadel-inc/esl/commit/0ac1b0cb9c90648ae1e0a18a16a936971c4b4ee9))
-
----
-
-## ESL Toggleable and ESL Trigger
-
-### Features:
-  - migrate `esl-toggleable` and `esl-trigger` to ESLEventListeners
-  - `esl:show:request` additional data ([a121872](https://github.com/exadel-inc/esl/commit/a121872b6e69fd7fb7a71bdfa9058430e650f423))
-  - support of `esl:hide:request` ([8a0928b](https://github.com/exadel-inc/esl/commit/8a0928b2f2bda63c6fbbaf5e9b6453d660091ec1))
-  - add support of dynamic `aria-label` for `esl-trigger` ([5c18841](https://github.com/exadel-inc/esl/commit/5c188418720ad4a972caa7450563a29268d8ec97))
-  - add esc key event handler for `esl-trigger` ([3dab6da](https://github.com/exadel-inc/esl/commit/3dab6dad39259f7e920c9a108757271cb58a216d))
-  - add `ignore-esc` attribute for `esl-trigger` ([605b715](https://github.com/exadel-inc/esl/commit/605b715a29ef1a852e24ce5120ca30d394fc19c1))
-
-
-## ESL Panel and ESL Panel Group
-
-### Features:
-  - migrate `esl-panel` and `esl-panel-group` to ESLEventListeners
-  - add `refresh-strategy` attribute ([#1156](https://github.com/exadel-inc/esl/issues/1156)) ([36027ad](https://github.com/exadel-inc/esl/commit/36027ad2574c0c33df1b6370484448a6889a647a))
-  - add ability to control min/max open panels per media condition ([67ca2ba](https://github.com/exadel-inc/esl/commit/67ca2ba16e3fc4ee4300d1c79ca2e5d0da845af7))
-
-### BREAKING CHANGES
-  - `ESLPanelGroup.noCollapse` (with related attribute) renamed to `ESLPanelGroup.noAnimate` (`no-animate` attribute)
-  - `ESLPanelGroup.shouldCollapse` renamed to `ESLPanelGroup.shouldAnimate`
-  - `PanelActionParams.noCollapse` renamed to `PanelActionParams.noAnimate`
-  - `ESLPanelGroup` `view` attribute is no longer supported
-  - `open` mode of `ESLPanelGroup` is no longer supported, it should be replaced with a `min-open-items="all"`
-  - `accordion-group="single"` attribute of `ESLPanelGroup` is no longer supported, replaced with `max-open-items="1"`
-  - `accordion-group="single"` attribute of `ESLPanelGroup` is no longer supported, replaced with `max-open-items="all"`
-  - components inherited from `ESLPanelGroup` should use `@listen({inherit: true})` for proper subscription
-
-### Bugfixes
-  - add `capturedBy` and fix `after:show` dispatch ([9bdc98c](https://github.com/exadel-inc/esl/commit/9bdc98c98a2926fe42c7cd15007c31a19171027c))
-  - fix `esl:before:hide` bubbling from uncontrolled toggleables ([9212b6b](https://github.com/exadel-inc/esl/commit/9212b6beacd97d39d0410a464598e9e2e0bdb1c2))
-  - fix animation process capturing by `ESLPanel` component ([9a5b3a5](https://github.com/exadel-inc/esl/commit/9a5b3a576d5cb4dbd47d113d944932586155c7f6))
-  - change `no-animate` API ([dde3500](https://github.com/exadel-inc/esl/commit/dde35009268a92bae92a45f00d11cb29edee98fa))
-
-
-## ESL Tab and ESLTabs
-
-### Features:
-  - `esl-tab` and `esl-tabs` migrated to ESLEventListeners
-
-### Bugfixes:
-  - fix alignment behavior ([b5ebd66](https://github.com/exadel-inc/esl/commit/b5ebd668de7b4d1eea7311ae7d734c02abb537cf))
-
-### BREAKING CHANGES
-  - Listeners extended from `ESLTab` should now use `@listen` annotation to work correctly
-  - Listeners extended from `ESLTabs` should now use `@listen` annotation to work correctly
-
-## ESL Alert
-
-### Features:
-  - `esl-alert` migrated to ESLEventListeners, inner API updates
-
-### BREAKING CHANGES
-  - Listeners extended from `ESLAlert` should now use `@listen` annotation to work correctly
-  - `eventNs` is no longer supported, event is now defined directly on the prototype level
-
-
-## ESL Popup
-
-### Features:
-  - add configurable `rootMargin` for the popup activator observer ([5d647d6](https://github.com/exadel-inc/esl/commit/5d647d60673a65e7b27472c1b68a1e174fa40740))
-  - add extended `offsetContainer` configuration ([63cbc0a](https://github.com/exadel-inc/esl/commit/63cbc0a996a8578549360dadaa3bb17c53884bfe))
-
-### BREAKING CHANGES
-  - Listeners extended from `ESLPopup` should now use `@listen` annotation to work correctly
-
-
-## ESL Footnotes
-
-### Features:
-  - migrate `esl-notes` and `esl-footnotes` to ESLEventListeners
-  - add configurable `intersectionMargin`  for the note tooltip activator observer ([b9b1599](https://github.com/exadel-inc/esl/commit/b9b159942e3534965f43cac94c140d5680308548))
-
-### BREAKING CHANGES
-  - Listeners extended from `ESLNote` should now use `@listen` annotation to work correctly
-  - Listeners extended from `ESLFootnote` should now use `@listen` annotation to work correctly
-  - `eventNs` is no longer supported, event is now defined directly on the prototype level
-
-## ESL Image and ESL Media
-
-### Bugfixes:
-  - fix esl-image to prevent DOM XSS vulnerabilities ([4fd925d](https://github.com/exadel-inc/esl/commit/4fd925df8605994b0f7d345d77a425e0cdc487e8))
-  - fix wrong error status on svg images in FF ([cad6b40](https://github.com/exadel-inc/esl/commit/cad6b40ccce01aaea8b1869b2cd7d542939a4fd4))
-
-
-## ESL Scrollbar
-
-### Features:
-  - migrate `esl-scrollbar` to ESLEventListeners
-
-### Bugfixes
-  - remove unnecessary width ([6e18909](https://github.com/exadel-inc/esl/commit/6e18909c6768c259d76084b463404fe6b29c9af8))
-
-### BREAKING CHANGES
-  - Listeners extended from `ESLScrollbar` should now use `@listen` annotation to work correctly
-
-
-## ESL Select
-
-### Features:
-  - migrate `esl-select` to ESLEventListeners ([76ca947](https://github.com/exadel-inc/esl/commit/76ca9479090546cdf092d1c9c3f5d993263f0581))
-  - add `dropdown-class` param to specify dropdown additional CSS class(es) ([938357f](https://github.com/exadel-inc/esl/commit/938357fa6fb5db804f445f31eb4f73641dfbcccf))
-
-
-## ESL Polyfills
-
-### Features:
-  - `Event`, `CustomEvent`, `MouseEvent`, `KeyboardEvent`, `FocusEvent` extended polyfills ([9ca3c40](https://github.com/exadel-inc/esl/commit/9ca3c406ff1f6f99490fdf09d2f15bc450c7be57))
-  - `Object.assign` and `Array.from` extended polyfills ([590bca4](https://github.com/exadel-inc/esl/commit/590bca4fab39c566db68f7bc2440e5d84355a991))
-  - extended `es5-target-shim` ([ef53df9](https://github.com/exadel-inc/esl/commit/ef53df936dd2beda859a41e9f8a900199bb24f3e))
-
-### BREAKING CHANGES
-  - ES5 shim `shimES5ElementConstructor` replaced with `shimES5Constructor`
diff --git a/pages/views/blogs/ESL v4.0.0 copy 2.md b/pages/views/blogs/ESL v4.0.0 copy 2.md
deleted file mode 100644
index 1dcdd55ca..000000000
--- a/pages/views/blogs/ESL v4.0.0 copy 2.md	
+++ /dev/null
@@ -1,197 +0,0 @@
----
-layout: content
-name: Blog1
-title: Blog1
-tags: [blogs, new]
-date: 2022-10-01
-containerCls: container markdown-container
----
-
-## ESL Core
-
-### Features:
-  - `ESLEventListener`s  functionality introduced
-  - `ESLMixinElement`s functionality introduced
-  - `ESLBaseElement` extended API 
-    - `ESLBaseElement.create` shortcut to create current custom element
-
-### Structural changes:
-  - Attribute decorators moved to the `esl-utils`
-  - All ESL modules migrated to `ESLEventListener`s
-  - Event names are now defined on the prototype level
-
-### BREAKING CHANGES
-  - `$$fire` no longer adds 'esl:' prefix to the fired events
-
----
-
-## ESL Media Query
-
-### Features:
-  - `ESLMediaQuery` now implements `EventTarget` interface
-  - `ESLMediaRuleList` API reworked with `EventTarget` interface and new calculation strategy
-
-### BREAKING CHANGES
-  - `ESLMediaRuleList.parseTuple` arguments order changed
-  - `ESLMediaRule` no longer supports default marker, now "default" is equal to "all" query
-  - `ESLMediaRuleList` observation callback signature changed, now it should be `EventListener`
-  - `ESLMediaRuleList.prototype.default` removed as no longer default rules
-  - `ESLMediaRuleList` no longer fires events on rule change, now it's based on active value change
-  - `ESLMediaRuleList` now uses merging of all active rules to define result value, however you were still able to get the last active rule value
-  - `ESLMediaRuleList.prototype.active` now returns an array of active rules
-
----
-
-## ESL Traversing Query
-
-### Features:
-  - add comma support to define multiple target ([#1120](https://github.com/exadel-inc/esl/issues/1120) / [#1129](https://github.com/exadel-inc/esl/issues/1129)) ([2890d7b](https://github.com/exadel-inc/esl/commit/2890d7b7667492b982b266048d23874c57b938ea)), closes [#1102](https://github.com/exadel-inc/esl/issues/1102)
-  - add ability to find closest element ([ada6fbb](https://github.com/exadel-inc/esl/commit/ada6fbb172a2fb2cf0d435420ad8fb0a46e7766f))
-
----
-  
-## ESL Utils
-
-### Features:
-  - ability to grow/shrink axis of the `Rect` ([1c58a1c](https://github.com/exadel-inc/esl/commit/1c58a1c19b0aa82abf7eb73c40781e9c4a4860ba))
-  - `SyntheticEventTarget` to implement `EventTarget` interface with more listeners control ([e4f3eb8](https://github.com/exadel-inc/esl/commit/e4f3eb89e0dd8227937d476a8d2090730342de64))
-  - simplify and extend `@prop` decorator API ([fd6ede3](https://github.com/exadel-inc/esl/commit/fd6ede34b0a3c7496083cb58aa9b726d4a692085))
-  - add `skipOneRender` RAF utility ([ddc3227](https://github.com/exadel-inc/esl/commit/ddc322798e6f8cf447874896786fe6d368bbe5ef))
-  - add ability to pass predicate to sequence finder ([dd8c3cb](https://github.com/exadel-inc/esl/commit/dd8c3cbb43ed529330c32459b9787949a0927a01))
-  - add `@decorate` decorator to bind and decorate method of the class
-  - `@attr` extended with ability to pass Serializer/Parser ([012eb83](https://github.com/exadel-inc/esl/commit/012eb83ebcbba8315a2766af090239774c21234e))
-  - create dom html sanitize method ([004642f](https://github.com/exadel-inc/esl/commit/004642f866ac1b2ed5278084963288d8c2fd17e0))
-  - create `extractValues` object utility ([8edd9e7](https://github.com/exadel-inc/esl/commit/8edd9e7b564b4ac78a4fc952ee58f76b6a54cf89))
-  - create cumulative imports for esl-utils submodules ([2e9d6ad](https://github.com/exadel-inc/esl/commit/2e9d6ad8f327ede991feef4ebc7c76fdd55726af))
-
-### BREAKING CHANGES
-  - `isMouseEvent`, `isTouchEvent` moved outside of `EventUtils`
-  - `normalizeTouchPoint` renamed to `touchPoint` and moved outside of `EventUtils`
-  - `normalizeCoordinates` removed. Use `getOffsetPoint` in combination with `getTouchPoint` instead
-  - `@prop` signature changed `prop(value?: any, prototypeConfig: OverrideDecoratorConfig = {})` instead
-  - `ScrollUtils.lock` no longer accessible. Use `lockScroll(document.documentElement, {strategy: '...'})` instead
-  - `ScrollUtils.unlock` no longer accessible. Use `unlockScroll(document.documentElement, {strategy: '...'})` instead
-  - `ScrollUtils.lockRequest` no longer accessible. Use `lockScroll(document.documentElement, {strategy: '...', initiatior})` instead
-  - `ScrollUtils.unlockRequest` no longer accessible. Use `unlockScroll(document.documentElement, {strategy: '...', initiatior})` instead
-
-### Bugfixes
-  - make attr decorators correctly strict typed
-  - `deepMerge` primitive values merging improved, undefined arguments now ignored ([5b7b730](https://github.com/exadel-inc/esl/commit/5b7b73003acd4d29250af12603ced5d58c40aff6))
-  - fix `@bind` decorator to save original function enumerable marker ([92c2086](https://github.com/exadel-inc/esl/commit/92c2086df610a5572143463302baf7aeea6174e9))
-  - update `@decorate` decorator to allow to save context properly (on instance level) ([0ac1b0c](https://github.com/exadel-inc/esl/commit/0ac1b0cb9c90648ae1e0a18a16a936971c4b4ee9))
-
----
-
-## ESL Toggleable and ESL Trigger
-
-### Features:
-  - migrate `esl-toggleable` and `esl-trigger` to ESLEventListeners
-  - `esl:show:request` additional data ([a121872](https://github.com/exadel-inc/esl/commit/a121872b6e69fd7fb7a71bdfa9058430e650f423))
-  - support of `esl:hide:request` ([8a0928b](https://github.com/exadel-inc/esl/commit/8a0928b2f2bda63c6fbbaf5e9b6453d660091ec1))
-  - add support of dynamic `aria-label` for `esl-trigger` ([5c18841](https://github.com/exadel-inc/esl/commit/5c188418720ad4a972caa7450563a29268d8ec97))
-  - add esc key event handler for `esl-trigger` ([3dab6da](https://github.com/exadel-inc/esl/commit/3dab6dad39259f7e920c9a108757271cb58a216d))
-  - add `ignore-esc` attribute for `esl-trigger` ([605b715](https://github.com/exadel-inc/esl/commit/605b715a29ef1a852e24ce5120ca30d394fc19c1))
-
-
-## ESL Panel and ESL Panel Group
-
-### Features:
-  - migrate `esl-panel` and `esl-panel-group` to ESLEventListeners
-  - add `refresh-strategy` attribute ([#1156](https://github.com/exadel-inc/esl/issues/1156)) ([36027ad](https://github.com/exadel-inc/esl/commit/36027ad2574c0c33df1b6370484448a6889a647a))
-  - add ability to control min/max open panels per media condition ([67ca2ba](https://github.com/exadel-inc/esl/commit/67ca2ba16e3fc4ee4300d1c79ca2e5d0da845af7))
-
-### BREAKING CHANGES
-  - `ESLPanelGroup.noCollapse` (with related attribute) renamed to `ESLPanelGroup.noAnimate` (`no-animate` attribute)
-  - `ESLPanelGroup.shouldCollapse` renamed to `ESLPanelGroup.shouldAnimate`
-  - `PanelActionParams.noCollapse` renamed to `PanelActionParams.noAnimate`
-  - `ESLPanelGroup` `view` attribute is no longer supported
-  - `open` mode of `ESLPanelGroup` is no longer supported, it should be replaced with a `min-open-items="all"`
-  - `accordion-group="single"` attribute of `ESLPanelGroup` is no longer supported, replaced with `max-open-items="1"`
-  - `accordion-group="single"` attribute of `ESLPanelGroup` is no longer supported, replaced with `max-open-items="all"`
-  - components inherited from `ESLPanelGroup` should use `@listen({inherit: true})` for proper subscription
-
-### Bugfixes
-  - add `capturedBy` and fix `after:show` dispatch ([9bdc98c](https://github.com/exadel-inc/esl/commit/9bdc98c98a2926fe42c7cd15007c31a19171027c))
-  - fix `esl:before:hide` bubbling from uncontrolled toggleables ([9212b6b](https://github.com/exadel-inc/esl/commit/9212b6beacd97d39d0410a464598e9e2e0bdb1c2))
-  - fix animation process capturing by `ESLPanel` component ([9a5b3a5](https://github.com/exadel-inc/esl/commit/9a5b3a576d5cb4dbd47d113d944932586155c7f6))
-  - change `no-animate` API ([dde3500](https://github.com/exadel-inc/esl/commit/dde35009268a92bae92a45f00d11cb29edee98fa))
-
-
-## ESL Tab and ESLTabs
-
-### Features:
-  - `esl-tab` and `esl-tabs` migrated to ESLEventListeners
-
-### Bugfixes:
-  - fix alignment behavior ([b5ebd66](https://github.com/exadel-inc/esl/commit/b5ebd668de7b4d1eea7311ae7d734c02abb537cf))
-
-### BREAKING CHANGES
-  - Listeners extended from `ESLTab` should now use `@listen` annotation to work correctly
-  - Listeners extended from `ESLTabs` should now use `@listen` annotation to work correctly
-
-## ESL Alert
-
-### Features:
-  - `esl-alert` migrated to ESLEventListeners, inner API updates
-
-### BREAKING CHANGES
-  - Listeners extended from `ESLAlert` should now use `@listen` annotation to work correctly
-  - `eventNs` is no longer supported, event is now defined directly on the prototype level
-
-
-## ESL Popup
-
-### Features:
-  - add configurable `rootMargin` for the popup activator observer ([5d647d6](https://github.com/exadel-inc/esl/commit/5d647d60673a65e7b27472c1b68a1e174fa40740))
-  - add extended `offsetContainer` configuration ([63cbc0a](https://github.com/exadel-inc/esl/commit/63cbc0a996a8578549360dadaa3bb17c53884bfe))
-
-### BREAKING CHANGES
-  - Listeners extended from `ESLPopup` should now use `@listen` annotation to work correctly
-
-
-## ESL Footnotes
-
-### Features:
-  - migrate `esl-notes` and `esl-footnotes` to ESLEventListeners
-  - add configurable `intersectionMargin`  for the note tooltip activator observer ([b9b1599](https://github.com/exadel-inc/esl/commit/b9b159942e3534965f43cac94c140d5680308548))
-
-### BREAKING CHANGES
-  - Listeners extended from `ESLNote` should now use `@listen` annotation to work correctly
-  - Listeners extended from `ESLFootnote` should now use `@listen` annotation to work correctly
-  - `eventNs` is no longer supported, event is now defined directly on the prototype level
-
-## ESL Image and ESL Media
-
-### Bugfixes:
-  - fix esl-image to prevent DOM XSS vulnerabilities ([4fd925d](https://github.com/exadel-inc/esl/commit/4fd925df8605994b0f7d345d77a425e0cdc487e8))
-  - fix wrong error status on svg images in FF ([cad6b40](https://github.com/exadel-inc/esl/commit/cad6b40ccce01aaea8b1869b2cd7d542939a4fd4))
-
-
-## ESL Scrollbar
-
-### Features:
-  - migrate `esl-scrollbar` to ESLEventListeners
-
-### Bugfixes
-  - remove unnecessary width ([6e18909](https://github.com/exadel-inc/esl/commit/6e18909c6768c259d76084b463404fe6b29c9af8))
-
-### BREAKING CHANGES
-  - Listeners extended from `ESLScrollbar` should now use `@listen` annotation to work correctly
-
-
-## ESL Select
-
-### Features:
-  - migrate `esl-select` to ESLEventListeners ([76ca947](https://github.com/exadel-inc/esl/commit/76ca9479090546cdf092d1c9c3f5d993263f0581))
-  - add `dropdown-class` param to specify dropdown additional CSS class(es) ([938357f](https://github.com/exadel-inc/esl/commit/938357fa6fb5db804f445f31eb4f73641dfbcccf))
-
-
-## ESL Polyfills
-
-### Features:
-  - `Event`, `CustomEvent`, `MouseEvent`, `KeyboardEvent`, `FocusEvent` extended polyfills ([9ca3c40](https://github.com/exadel-inc/esl/commit/9ca3c406ff1f6f99490fdf09d2f15bc450c7be57))
-  - `Object.assign` and `Array.from` extended polyfills ([590bca4](https://github.com/exadel-inc/esl/commit/590bca4fab39c566db68f7bc2440e5d84355a991))
-  - extended `es5-target-shim` ([ef53df9](https://github.com/exadel-inc/esl/commit/ef53df936dd2beda859a41e9f8a900199bb24f3e))
-
-### BREAKING CHANGES
-  - ES5 shim `shimES5ElementConstructor` replaced with `shimES5Constructor`
diff --git a/pages/views/blogs/ESL v4.0.0 copy.md b/pages/views/blogs/ESL v4.0.0 copy.md
deleted file mode 100644
index d0f2ee341..000000000
--- a/pages/views/blogs/ESL v4.0.0 copy.md	
+++ /dev/null
@@ -1,197 +0,0 @@
----
-layout: content
-name: Blog2
-title: Blog2
-tags: [blogs, draft]
-date: 2022-10-01
-containerCls: container markdown-container
----
-
-## ESL Core
-
-### Features:
-  - `ESLEventListener`s  functionality introduced
-  - `ESLMixinElement`s functionality introduced
-  - `ESLBaseElement` extended API 
-    - `ESLBaseElement.create` shortcut to create current custom element
-
-### Structural changes:
-  - Attribute decorators moved to the `esl-utils`
-  - All ESL modules migrated to `ESLEventListener`s
-  - Event names are now defined on the prototype level
-
-### BREAKING CHANGES
-  - `$$fire` no longer adds 'esl:' prefix to the fired events
-
----
-
-## ESL Media Query
-
-### Features:
-  - `ESLMediaQuery` now implements `EventTarget` interface
-  - `ESLMediaRuleList` API reworked with `EventTarget` interface and new calculation strategy
-
-### BREAKING CHANGES
-  - `ESLMediaRuleList.parseTuple` arguments order changed
-  - `ESLMediaRule` no longer supports default marker, now "default" is equal to "all" query
-  - `ESLMediaRuleList` observation callback signature changed, now it should be `EventListener`
-  - `ESLMediaRuleList.prototype.default` removed as no longer default rules
-  - `ESLMediaRuleList` no longer fires events on rule change, now it's based on active value change
-  - `ESLMediaRuleList` now uses merging of all active rules to define result value, however you were still able to get the last active rule value
-  - `ESLMediaRuleList.prototype.active` now returns an array of active rules
-
----
-
-## ESL Traversing Query
-
-### Features:
-  - add comma support to define multiple target ([#1120](https://github.com/exadel-inc/esl/issues/1120) / [#1129](https://github.com/exadel-inc/esl/issues/1129)) ([2890d7b](https://github.com/exadel-inc/esl/commit/2890d7b7667492b982b266048d23874c57b938ea)), closes [#1102](https://github.com/exadel-inc/esl/issues/1102)
-  - add ability to find closest element ([ada6fbb](https://github.com/exadel-inc/esl/commit/ada6fbb172a2fb2cf0d435420ad8fb0a46e7766f))
-
----
-  
-## ESL Utils
-
-### Features:
-  - ability to grow/shrink axis of the `Rect` ([1c58a1c](https://github.com/exadel-inc/esl/commit/1c58a1c19b0aa82abf7eb73c40781e9c4a4860ba))
-  - `SyntheticEventTarget` to implement `EventTarget` interface with more listeners control ([e4f3eb8](https://github.com/exadel-inc/esl/commit/e4f3eb89e0dd8227937d476a8d2090730342de64))
-  - simplify and extend `@prop` decorator API ([fd6ede3](https://github.com/exadel-inc/esl/commit/fd6ede34b0a3c7496083cb58aa9b726d4a692085))
-  - add `skipOneRender` RAF utility ([ddc3227](https://github.com/exadel-inc/esl/commit/ddc322798e6f8cf447874896786fe6d368bbe5ef))
-  - add ability to pass predicate to sequence finder ([dd8c3cb](https://github.com/exadel-inc/esl/commit/dd8c3cbb43ed529330c32459b9787949a0927a01))
-  - add `@decorate` decorator to bind and decorate method of the class
-  - `@attr` extended with ability to pass Serializer/Parser ([012eb83](https://github.com/exadel-inc/esl/commit/012eb83ebcbba8315a2766af090239774c21234e))
-  - create dom html sanitize method ([004642f](https://github.com/exadel-inc/esl/commit/004642f866ac1b2ed5278084963288d8c2fd17e0))
-  - create `extractValues` object utility ([8edd9e7](https://github.com/exadel-inc/esl/commit/8edd9e7b564b4ac78a4fc952ee58f76b6a54cf89))
-  - create cumulative imports for esl-utils submodules ([2e9d6ad](https://github.com/exadel-inc/esl/commit/2e9d6ad8f327ede991feef4ebc7c76fdd55726af))
-
-### BREAKING CHANGES
-  - `isMouseEvent`, `isTouchEvent` moved outside of `EventUtils`
-  - `normalizeTouchPoint` renamed to `touchPoint` and moved outside of `EventUtils`
-  - `normalizeCoordinates` removed. Use `getOffsetPoint` in combination with `getTouchPoint` instead
-  - `@prop` signature changed `prop(value?: any, prototypeConfig: OverrideDecoratorConfig = {})` instead
-  - `ScrollUtils.lock` no longer accessible. Use `lockScroll(document.documentElement, {strategy: '...'})` instead
-  - `ScrollUtils.unlock` no longer accessible. Use `unlockScroll(document.documentElement, {strategy: '...'})` instead
-  - `ScrollUtils.lockRequest` no longer accessible. Use `lockScroll(document.documentElement, {strategy: '...', initiatior})` instead
-  - `ScrollUtils.unlockRequest` no longer accessible. Use `unlockScroll(document.documentElement, {strategy: '...', initiatior})` instead
-
-### Bugfixes
-  - make attr decorators correctly strict typed
-  - `deepMerge` primitive values merging improved, undefined arguments now ignored ([5b7b730](https://github.com/exadel-inc/esl/commit/5b7b73003acd4d29250af12603ced5d58c40aff6))
-  - fix `@bind` decorator to save original function enumerable marker ([92c2086](https://github.com/exadel-inc/esl/commit/92c2086df610a5572143463302baf7aeea6174e9))
-  - update `@decorate` decorator to allow to save context properly (on instance level) ([0ac1b0c](https://github.com/exadel-inc/esl/commit/0ac1b0cb9c90648ae1e0a18a16a936971c4b4ee9))
-
----
-
-## ESL Toggleable and ESL Trigger
-
-### Features:
-  - migrate `esl-toggleable` and `esl-trigger` to ESLEventListeners
-  - `esl:show:request` additional data ([a121872](https://github.com/exadel-inc/esl/commit/a121872b6e69fd7fb7a71bdfa9058430e650f423))
-  - support of `esl:hide:request` ([8a0928b](https://github.com/exadel-inc/esl/commit/8a0928b2f2bda63c6fbbaf5e9b6453d660091ec1))
-  - add support of dynamic `aria-label` for `esl-trigger` ([5c18841](https://github.com/exadel-inc/esl/commit/5c188418720ad4a972caa7450563a29268d8ec97))
-  - add esc key event handler for `esl-trigger` ([3dab6da](https://github.com/exadel-inc/esl/commit/3dab6dad39259f7e920c9a108757271cb58a216d))
-  - add `ignore-esc` attribute for `esl-trigger` ([605b715](https://github.com/exadel-inc/esl/commit/605b715a29ef1a852e24ce5120ca30d394fc19c1))
-
-
-## ESL Panel and ESL Panel Group
-
-### Features:
-  - migrate `esl-panel` and `esl-panel-group` to ESLEventListeners
-  - add `refresh-strategy` attribute ([#1156](https://github.com/exadel-inc/esl/issues/1156)) ([36027ad](https://github.com/exadel-inc/esl/commit/36027ad2574c0c33df1b6370484448a6889a647a))
-  - add ability to control min/max open panels per media condition ([67ca2ba](https://github.com/exadel-inc/esl/commit/67ca2ba16e3fc4ee4300d1c79ca2e5d0da845af7))
-
-### BREAKING CHANGES
-  - `ESLPanelGroup.noCollapse` (with related attribute) renamed to `ESLPanelGroup.noAnimate` (`no-animate` attribute)
-  - `ESLPanelGroup.shouldCollapse` renamed to `ESLPanelGroup.shouldAnimate`
-  - `PanelActionParams.noCollapse` renamed to `PanelActionParams.noAnimate`
-  - `ESLPanelGroup` `view` attribute is no longer supported
-  - `open` mode of `ESLPanelGroup` is no longer supported, it should be replaced with a `min-open-items="all"`
-  - `accordion-group="single"` attribute of `ESLPanelGroup` is no longer supported, replaced with `max-open-items="1"`
-  - `accordion-group="single"` attribute of `ESLPanelGroup` is no longer supported, replaced with `max-open-items="all"`
-  - components inherited from `ESLPanelGroup` should use `@listen({inherit: true})` for proper subscription
-
-### Bugfixes
-  - add `capturedBy` and fix `after:show` dispatch ([9bdc98c](https://github.com/exadel-inc/esl/commit/9bdc98c98a2926fe42c7cd15007c31a19171027c))
-  - fix `esl:before:hide` bubbling from uncontrolled toggleables ([9212b6b](https://github.com/exadel-inc/esl/commit/9212b6beacd97d39d0410a464598e9e2e0bdb1c2))
-  - fix animation process capturing by `ESLPanel` component ([9a5b3a5](https://github.com/exadel-inc/esl/commit/9a5b3a576d5cb4dbd47d113d944932586155c7f6))
-  - change `no-animate` API ([dde3500](https://github.com/exadel-inc/esl/commit/dde35009268a92bae92a45f00d11cb29edee98fa))
-
-
-## ESL Tab and ESLTabs
-
-### Features:
-  - `esl-tab` and `esl-tabs` migrated to ESLEventListeners
-
-### Bugfixes:
-  - fix alignment behavior ([b5ebd66](https://github.com/exadel-inc/esl/commit/b5ebd668de7b4d1eea7311ae7d734c02abb537cf))
-
-### BREAKING CHANGES
-  - Listeners extended from `ESLTab` should now use `@listen` annotation to work correctly
-  - Listeners extended from `ESLTabs` should now use `@listen` annotation to work correctly
-
-## ESL Alert
-
-### Features:
-  - `esl-alert` migrated to ESLEventListeners, inner API updates
-
-### BREAKING CHANGES
-  - Listeners extended from `ESLAlert` should now use `@listen` annotation to work correctly
-  - `eventNs` is no longer supported, event is now defined directly on the prototype level
-
-
-## ESL Popup
-
-### Features:
-  - add configurable `rootMargin` for the popup activator observer ([5d647d6](https://github.com/exadel-inc/esl/commit/5d647d60673a65e7b27472c1b68a1e174fa40740))
-  - add extended `offsetContainer` configuration ([63cbc0a](https://github.com/exadel-inc/esl/commit/63cbc0a996a8578549360dadaa3bb17c53884bfe))
-
-### BREAKING CHANGES
-  - Listeners extended from `ESLPopup` should now use `@listen` annotation to work correctly
-
-
-## ESL Footnotes
-
-### Features:
-  - migrate `esl-notes` and `esl-footnotes` to ESLEventListeners
-  - add configurable `intersectionMargin`  for the note tooltip activator observer ([b9b1599](https://github.com/exadel-inc/esl/commit/b9b159942e3534965f43cac94c140d5680308548))
-
-### BREAKING CHANGES
-  - Listeners extended from `ESLNote` should now use `@listen` annotation to work correctly
-  - Listeners extended from `ESLFootnote` should now use `@listen` annotation to work correctly
-  - `eventNs` is no longer supported, event is now defined directly on the prototype level
-
-## ESL Image and ESL Media
-
-### Bugfixes:
-  - fix esl-image to prevent DOM XSS vulnerabilities ([4fd925d](https://github.com/exadel-inc/esl/commit/4fd925df8605994b0f7d345d77a425e0cdc487e8))
-  - fix wrong error status on svg images in FF ([cad6b40](https://github.com/exadel-inc/esl/commit/cad6b40ccce01aaea8b1869b2cd7d542939a4fd4))
-
-
-## ESL Scrollbar
-
-### Features:
-  - migrate `esl-scrollbar` to ESLEventListeners
-
-### Bugfixes
-  - remove unnecessary width ([6e18909](https://github.com/exadel-inc/esl/commit/6e18909c6768c259d76084b463404fe6b29c9af8))
-
-### BREAKING CHANGES
-  - Listeners extended from `ESLScrollbar` should now use `@listen` annotation to work correctly
-
-
-## ESL Select
-
-### Features:
-  - migrate `esl-select` to ESLEventListeners ([76ca947](https://github.com/exadel-inc/esl/commit/76ca9479090546cdf092d1c9c3f5d993263f0581))
-  - add `dropdown-class` param to specify dropdown additional CSS class(es) ([938357f](https://github.com/exadel-inc/esl/commit/938357fa6fb5db804f445f31eb4f73641dfbcccf))
-
-
-## ESL Polyfills
-
-### Features:
-  - `Event`, `CustomEvent`, `MouseEvent`, `KeyboardEvent`, `FocusEvent` extended polyfills ([9ca3c40](https://github.com/exadel-inc/esl/commit/9ca3c406ff1f6f99490fdf09d2f15bc450c7be57))
-  - `Object.assign` and `Array.from` extended polyfills ([590bca4](https://github.com/exadel-inc/esl/commit/590bca4fab39c566db68f7bc2440e5d84355a991))
-  - extended `es5-target-shim` ([ef53df9](https://github.com/exadel-inc/esl/commit/ef53df936dd2beda859a41e9f8a900199bb24f3e))
-
-### BREAKING CHANGES
-  - ES5 shim `shimES5ElementConstructor` replaced with `shimES5Constructor`
diff --git a/pages/views/blogs/ESL v4.0.0.md b/pages/views/blogs/ESL v4.0.0.md
index f0cbdb222..6ecc55e9a 100644
--- a/pages/views/blogs/ESL v4.0.0.md	
+++ b/pages/views/blogs/ESL v4.0.0.md	
@@ -4,6 +4,7 @@ name: Blog3
 title: Blog3
 tags: [blogs, draft, new]
 date: 2022-10-01
+emoji: ⚡️
 containerCls: container markdown-container
 ---
 
diff --git a/pages/views/index.11tydata.yml b/pages/views/index.11tydata.yml
index c75a821da..262717406 100644
--- a/pages/views/index.11tydata.yml
+++ b/pages/views/index.11tydata.yml
@@ -53,10 +53,11 @@ landing:
           Our UI component library doesn't introduce any additional restrictions — only benefits, as it offers
           utilities and framework-agnostic web components that work with any tech stack.
 
-  blogs:
-    title: Articles
+  news:
+    title: Articles & Blogs
     cta:
-      text: Read More
+      text: Read more
+  
   support:
     title: Browser Support
     text:
diff --git a/pages/views/index.njk b/pages/views/index.njk
index 08cd38480..380ae6a45 100644
--- a/pages/views/index.njk
+++ b/pages/views/index.njk
@@ -2,10 +2,8 @@
 layout: landing
 ---
 
-{% include 'landing/blogs2.njk/'%}
-{% include 'landing/blogs3.njk/'%}
 {% include 'landing/marquee.njk' %}
 {% include 'landing/benefits.njk' %}
-{#{% include 'landing/overview.njk/'%}#}
 {% include 'landing/browser-support.njk/'%}
 {% include 'landing/promo-banner.njk/'%}
+{% include 'landing/news.njk/'%}

From 04793599eddda1555698a71361bf8de6df40d51e Mon Sep 17 00:00:00 2001
From: Feoktist Shovchko <fshovchko@exadel.com>
Date: Mon, 19 Jun 2023 20:30:41 +0300
Subject: [PATCH 03/18] chore(gh-pages): news section refactoring

---
 pages/11ty/date.filter.js                  |  8 ++++++++
 pages/11ty/date.js                         | 14 --------------
 pages/11ty/{news.js => news.collection.js} |  2 +-
 pages/src/common/links.less                | 11 -----------
 pages/views/blogs/ESL v4.0.0.md            |  6 +++---
 pages/views/index.njk                      |  1 +
 6 files changed, 13 insertions(+), 29 deletions(-)
 create mode 100644 pages/11ty/date.filter.js
 delete mode 100644 pages/11ty/date.js
 rename pages/11ty/{news.js => news.collection.js} (59%)

diff --git a/pages/11ty/date.filter.js b/pages/11ty/date.filter.js
new file mode 100644
index 000000000..290a113e8
--- /dev/null
+++ b/pages/11ty/date.filter.js
@@ -0,0 +1,8 @@
+module.exports = (config) => {
+  const date = (timestamp) => {
+    const date = new Date(timestamp);
+    return `${date.getDate()}-${date.getMonth() + 1}-${date.getFullYear()}`;
+  };
+
+  config.addFilter('date', date);
+};
diff --git a/pages/11ty/date.js b/pages/11ty/date.js
deleted file mode 100644
index 43ee075e3..000000000
--- a/pages/11ty/date.js
+++ /dev/null
@@ -1,14 +0,0 @@
-module.exports = (config) => {
-  /** Filter items by hidden marker */
-  const notHiddenFilter = (date2) => {
-    let date = new Date(date2);
-    let year = date.getFullYear();
-    let month = date.getMonth() +1
-    let day = date.getDate();
-    let finaldate = `${month}-${day}-${year}`
-
-    return finaldate
-  };
-
-  config.addFilter('date', notHiddenFilter);
-};
diff --git a/pages/11ty/news.js b/pages/11ty/news.collection.js
similarity index 59%
rename from pages/11ty/news.js
rename to pages/11ty/news.collection.js
index 599371003..0f9afcefe 100644
--- a/pages/11ty/news.js
+++ b/pages/11ty/news.collection.js
@@ -1,6 +1,6 @@
 module.exports = (config) => {
   config.addCollection('news', (collection) => {
     const collections = collection.getAll()[0].data.collections;
-    return collections.blogs.concat(collections.articles).sort((a, b) => a.date - b.date);
+    return (collections.blogs || []).concat(collections.articles || []).sort((a, b) => a.date - b.date);
   });
 };  
diff --git a/pages/src/common/links.less b/pages/src/common/links.less
index 4f1f521ce..47e0d4ea0 100644
--- a/pages/src/common/links.less
+++ b/pages/src/common/links.less
@@ -7,7 +7,6 @@
   font-size: 1rem;
   font-weight: 600;
 
-
   &::after, &::before {
     display: inline-block;
     margin: 0 5px;
@@ -54,16 +53,6 @@
   }
 }
 
-.arrow-link2 {
-  color: white;
-
-  &::after, &::before {
-    background-color: white;
-    transform: rotate(90deg);
-  }
-}
-
-
 // Icon link hover effect
 .icon-link:hover svg {
   filter: drop-shadow(0 0 4px @link-fg);
diff --git a/pages/views/blogs/ESL v4.0.0.md b/pages/views/blogs/ESL v4.0.0.md
index 6ecc55e9a..9eae31ce9 100644
--- a/pages/views/blogs/ESL v4.0.0.md	
+++ b/pages/views/blogs/ESL v4.0.0.md	
@@ -1,8 +1,8 @@
 ---
 layout: content
-name: Blog3
-title: Blog3
-tags: [blogs, draft, new]
+name: ESL v4.0.0
+title: ESL v4.0.0
+tags: [blogs, draft]
 date: 2022-10-01
 emoji: ⚡️
 containerCls: container markdown-container
diff --git a/pages/views/index.njk b/pages/views/index.njk
index 380ae6a45..2004a98cb 100644
--- a/pages/views/index.njk
+++ b/pages/views/index.njk
@@ -4,6 +4,7 @@ layout: landing
 
 {% include 'landing/marquee.njk' %}
 {% include 'landing/benefits.njk' %}
+{#{% include 'landing/overview.njk/'%}#}
 {% include 'landing/browser-support.njk/'%}
 {% include 'landing/promo-banner.njk/'%}
 {% include 'landing/news.njk/'%}

From 9d6b2053469f0ca72c5b775e689543f121e7321b Mon Sep 17 00:00:00 2001
From: Feoktist Shovchko <fshovchko@exadel.com>
Date: Mon, 19 Jun 2023 20:39:45 +0300
Subject: [PATCH 04/18] chore(gh-pages): news section refactoring

---
 pages/views/_includes/landing/news.njk | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/pages/views/_includes/landing/news.njk b/pages/views/_includes/landing/news.njk
index 5137cb931..e53f1aa29 100644
--- a/pages/views/_includes/landing/news.njk
+++ b/pages/views/_includes/landing/news.njk
@@ -1,10 +1,10 @@
-{% set releasedBlogs = collections.news | released %}
-{% if releasedBlogs.length %}
+{% set releasedNews = collections.news | released %}
+{% if releasedNews.length %}
   <div class="news container">
     <h2>{{ landing.news.title }}</h2>
     <esl-animate target="::next::child" group></esl-animate>
     <ul class="news-container">
-      {% for item in releasedBlogs | reverse | limit(3) %}
+      {% for item in releasedNews | reverse | limit(3) %}
         <li class="esl-animate-slide-down news-item">
           <a class="news-content" href="{{ item.url | url }}">
             <h4 class="news-content-name">{{ item.data.emoji }}{{ item.data.name }}</h4>

From 7b13f499314703145fd25c81fb33f5bb442ffc43 Mon Sep 17 00:00:00 2001
From: Feoktist Shovchko <fshovchko@exadel.com>
Date: Fri, 23 Jun 2023 23:15:04 +0300
Subject: [PATCH 05/18] chore(gh-pages): news section refactoring

---
 pages/11ty/markdown.shortcut.js            | 34 ++++++++++++++++++++++
 pages/11ty/news.collection.js              |  6 ----
 pages/src/landing/blogs/blogs.less         | 25 ++++++++++++++--
 pages/views/_includes/landing/news.njk     | 20 -------------
 pages/views/_includes/landing/newsline.njk | 22 ++++++++++++++
 pages/views/blogs/ESL v4.0.0.md            |  2 +-
 pages/views/index.njk                      |  2 +-
 7 files changed, 80 insertions(+), 31 deletions(-)
 delete mode 100644 pages/11ty/news.collection.js
 delete mode 100644 pages/views/_includes/landing/news.njk
 create mode 100644 pages/views/_includes/landing/newsline.njk

diff --git a/pages/11ty/markdown.shortcut.js b/pages/11ty/markdown.shortcut.js
index 536e89654..5843923a5 100644
--- a/pages/11ty/markdown.shortcut.js
+++ b/pages/11ty/markdown.shortcut.js
@@ -37,6 +37,38 @@ class MDRenderer {
     }
   }
 
+  static async renderTruncate(content, maxLength = 250) {
+    try {
+      const {body} = new JSDOM(content).window.document;
+
+      let limitReached = false;
+      let index = 0;
+    
+      const nodeHandler = (node) => {
+        if (limitReached) {
+          node.remove();
+          return;
+        }
+    
+        const childNodes = Array.from(node.childNodes);
+        if (childNodes.length) {
+          childNodes.forEach((childNode) => nodeHandler(childNode));
+        } else {
+          index += node.textContent.length;
+          if (index < maxLength) return;
+          limitReached = true;
+          node.textContent += `${node.textContent.slice(0, -(index - maxLength))}... `;
+          node.parentNode.insertAdjacentHTML('beforeend', `<p class="news-content-cta">Read more</p>`);
+        }
+      };
+    
+      nodeHandler(body);
+      return MDRenderer.renderContent(body);
+    } catch (e) {
+      return `Rendering error: ${e}`;
+    }
+  }
+
   /** Read file and render markdown */
   static async parseFile(filePath) {
     const absolutePath = path.resolve(__dirname, '../../', filePath);
@@ -74,6 +106,8 @@ class MDRenderer {
 }
 
 module.exports = (config) => {
+  console.log(config)
   config.addNunjucksAsyncShortcode('mdRender', MDRenderer.render);
+  config.addNunjucksAsyncShortcode('mdRenderTruncate', MDRenderer.renderTruncate);
 };
 module.exports.MDRenderer = MDRenderer;
diff --git a/pages/11ty/news.collection.js b/pages/11ty/news.collection.js
deleted file mode 100644
index 0f9afcefe..000000000
--- a/pages/11ty/news.collection.js
+++ /dev/null
@@ -1,6 +0,0 @@
-module.exports = (config) => {
-  config.addCollection('news', (collection) => {
-    const collections = collection.getAll()[0].data.collections;
-    return (collections.blogs || []).concat(collections.articles || []).sort((a, b) => a.date - b.date);
-  });
-};  
diff --git a/pages/src/landing/blogs/blogs.less b/pages/src/landing/blogs/blogs.less
index 78f16670c..c93f3f687 100644
--- a/pages/src/landing/blogs/blogs.less
+++ b/pages/src/landing/blogs/blogs.less
@@ -1,6 +1,6 @@
 @import (reference) "../../common/variables.less";
 
-.news {
+.newsline {
   position: relative;
   margin: 5rem auto;
 
@@ -12,6 +12,7 @@
   }
 
   &-content {
+    width: 100%;
     padding: 10px 45px;
     color: white;
     background-size: 0% 100%;
@@ -28,6 +29,7 @@
     }
 
     &-cta {
+      display: inline-block;
       color: @nav-dark-hover;
       font-weight: bold;
 
@@ -36,16 +38,33 @@
     }
 
     &-date {
-      padding: 5px 0 15px;
       font-size: .7em;
     }
 
     &-name {
+      padding-bottom: 5px;
       font-size: 1.5rem;
     }
 
     &-text {
       font-size: 1rem;
+
+      h1, .h1 {
+        font-size: 1.6rem;
+      }
+      h2, .h2 {
+        font-size: 1.4rem;
+        margin-bottom: 1rem;
+      }
+      h3, .h3 {
+        font-size: 1.3rem;
+      }
+      h4, .h4 {
+        font-size: 1.2rem;
+      }
+      h5, .h5 {
+        font-size: 1.1rem;
+      }
     }
 
     &:hover {
@@ -61,7 +80,7 @@
         border-color: @nav-dark-accent;
       }
 
-      .news-content {
+      .newsline-content {
         &-cta {
           opacity: 1;
         }
diff --git a/pages/views/_includes/landing/news.njk b/pages/views/_includes/landing/news.njk
deleted file mode 100644
index e53f1aa29..000000000
--- a/pages/views/_includes/landing/news.njk
+++ /dev/null
@@ -1,20 +0,0 @@
-{% set releasedNews = collections.news | released %}
-{% if releasedNews.length %}
-  <div class="news container">
-    <h2>{{ landing.news.title }}</h2>
-    <esl-animate target="::next::child" group></esl-animate>
-    <ul class="news-container">
-      {% for item in releasedNews | reverse | limit(3) %}
-        <li class="esl-animate-slide-down news-item">
-          <a class="news-content" href="{{ item.url | url }}">
-            <h4 class="news-content-name">{{ item.data.emoji }}{{ item.data.name }}</h4>
-            <div class="news-content-date">{{item.date | date}}</div>
-            <p class="news-content-text">{{ item.templateContent | text | truncate(250) }}
-              <span class="news-content-cta">{{ landing.news.cta.text }}</span>
-            </p>
-          </a>
-        </li>
-      {% endfor %}
-    </ul>
-  </div>
-{% endif %}
diff --git a/pages/views/_includes/landing/newsline.njk b/pages/views/_includes/landing/newsline.njk
new file mode 100644
index 000000000..33cd8b9ed
--- /dev/null
+++ b/pages/views/_includes/landing/newsline.njk
@@ -0,0 +1,22 @@
+{% set releasedNews = collections.news | released %}
+{% if releasedNews.length %}
+  <div class="newsline container">
+    <h2>{{ landing.news.title }}</h2>
+    <esl-animate target="::next::child" group></esl-animate>
+    <ul class="newsline-container">
+      {% for item in releasedNews | reverse | limit(3) %}
+        <li class="esl-animate-slide-down newsline-item">
+          <a class="newsline-content" href="{{ item.data.link or (item.url | url) }}">
+            <h4 class="newsline-content-name">{{ item.data.emoji }}{{ item.data.name }}</h4>
+            {% if item.data.date %}
+              <p class="newsline-content-date">{{ item.date | date }}</p>
+            {% endif %}
+            <div class="newsline-content-text">
+              {% mdRenderTruncate item.templateContent %}
+            </div>
+          </a>
+        </li>
+      {% endfor %}
+    </ul>
+  </div>
+{% endif %}
diff --git a/pages/views/blogs/ESL v4.0.0.md b/pages/views/blogs/ESL v4.0.0.md
index 9eae31ce9..35f65459a 100644
--- a/pages/views/blogs/ESL v4.0.0.md	
+++ b/pages/views/blogs/ESL v4.0.0.md	
@@ -2,7 +2,7 @@
 layout: content
 name: ESL v4.0.0
 title: ESL v4.0.0
-tags: [blogs, draft]
+tags: [blogs, news, draft]
 date: 2022-10-01
 emoji: ⚡️
 containerCls: container markdown-container
diff --git a/pages/views/index.njk b/pages/views/index.njk
index 2004a98cb..d98330485 100644
--- a/pages/views/index.njk
+++ b/pages/views/index.njk
@@ -7,4 +7,4 @@ layout: landing
 {#{% include 'landing/overview.njk/'%}#}
 {% include 'landing/browser-support.njk/'%}
 {% include 'landing/promo-banner.njk/'%}
-{% include 'landing/news.njk/'%}
+{% include 'landing/newsline.njk/'%}

From fec20aa56e6b5991a22fc248e11cf58735a967ba Mon Sep 17 00:00:00 2001
From: Feoktist Shovchko <fshovchko@exadel.com>
Date: Fri, 23 Jun 2023 23:18:07 +0300
Subject: [PATCH 06/18] chore(gh-pages): remove debug log

---
 pages/11ty/markdown.shortcut.js | 1 -
 pages/views/index.11tydata.yml  | 2 +-
 2 files changed, 1 insertion(+), 2 deletions(-)

diff --git a/pages/11ty/markdown.shortcut.js b/pages/11ty/markdown.shortcut.js
index 5843923a5..ce5441dbe 100644
--- a/pages/11ty/markdown.shortcut.js
+++ b/pages/11ty/markdown.shortcut.js
@@ -106,7 +106,6 @@ class MDRenderer {
 }
 
 module.exports = (config) => {
-  console.log(config)
   config.addNunjucksAsyncShortcode('mdRender', MDRenderer.render);
   config.addNunjucksAsyncShortcode('mdRenderTruncate', MDRenderer.renderTruncate);
 };
diff --git a/pages/views/index.11tydata.yml b/pages/views/index.11tydata.yml
index 262717406..a2e345866 100644
--- a/pages/views/index.11tydata.yml
+++ b/pages/views/index.11tydata.yml
@@ -54,7 +54,7 @@ landing:
           utilities and framework-agnostic web components that work with any tech stack.
 
   news:
-    title: Articles & Blogs
+    title: News & Articles
     cta:
       text: Read more
   

From 561a1847994d6bd31658112e3790cbf2c921c458 Mon Sep 17 00:00:00 2001
From: Feoktist Shovchko <fshovchko@exadel.com>
Date: Tue, 27 Jun 2023 15:03:37 +0300
Subject: [PATCH 07/18] chore(gh-pages): remove truncate method

---
 pages/11ty/date.filter.js                  |  6 ++--
 pages/11ty/markdown.shortcut.js            | 40 ++++------------------
 pages/views/_includes/landing/newsline.njk |  2 +-
 3 files changed, 9 insertions(+), 39 deletions(-)

diff --git a/pages/11ty/date.filter.js b/pages/11ty/date.filter.js
index 290a113e8..d76d3e350 100644
--- a/pages/11ty/date.filter.js
+++ b/pages/11ty/date.filter.js
@@ -1,8 +1,6 @@
 module.exports = (config) => {
-  const date = (timestamp) => {
-    const date = new Date(timestamp);
-    return `${date.getDate()}-${date.getMonth() + 1}-${date.getFullYear()}`;
-  };
+  const date = (timestamp) => 
+    new Intl.DateTimeFormat('UTC', { month: 'long', day: '2-digit', year: 'numeric' }).format(new Date(timestamp));
 
   config.addFilter('date', date);
 };
diff --git a/pages/11ty/markdown.shortcut.js b/pages/11ty/markdown.shortcut.js
index ce5441dbe..06360d405 100644
--- a/pages/11ty/markdown.shortcut.js
+++ b/pages/11ty/markdown.shortcut.js
@@ -37,38 +37,6 @@ class MDRenderer {
     }
   }
 
-  static async renderTruncate(content, maxLength = 250) {
-    try {
-      const {body} = new JSDOM(content).window.document;
-
-      let limitReached = false;
-      let index = 0;
-    
-      const nodeHandler = (node) => {
-        if (limitReached) {
-          node.remove();
-          return;
-        }
-    
-        const childNodes = Array.from(node.childNodes);
-        if (childNodes.length) {
-          childNodes.forEach((childNode) => nodeHandler(childNode));
-        } else {
-          index += node.textContent.length;
-          if (index < maxLength) return;
-          limitReached = true;
-          node.textContent += `${node.textContent.slice(0, -(index - maxLength))}... `;
-          node.parentNode.insertAdjacentHTML('beforeend', `<p class="news-content-cta">Read more</p>`);
-        }
-      };
-    
-      nodeHandler(body);
-      return MDRenderer.renderContent(body);
-    } catch (e) {
-      return `Rendering error: ${e}`;
-    }
-  }
-
   /** Read file and render markdown */
   static async parseFile(filePath) {
     const absolutePath = path.resolve(__dirname, '../../', filePath);
@@ -84,7 +52,11 @@ class MDRenderer {
   }
 
   static renderContent(content) {
-    return `<div class="markdown-container">${content.innerHTML}</div>`;
+    return MDRenderer.renderContentString(content.innerHTML);
+  }
+
+  static renderContentString(str) {
+    return `<div class="markdown-container">${str}</div>`;
   }
 
   static resolveLinks(dom, basePath) {
@@ -107,6 +79,6 @@ class MDRenderer {
 
 module.exports = (config) => {
   config.addNunjucksAsyncShortcode('mdRender', MDRenderer.render);
-  config.addNunjucksAsyncShortcode('mdRenderTruncate', MDRenderer.renderTruncate);
+  config.addNunjucksShortcode('mdWrap', MDRenderer.renderContentString);
 };
 module.exports.MDRenderer = MDRenderer;
diff --git a/pages/views/_includes/landing/newsline.njk b/pages/views/_includes/landing/newsline.njk
index 33cd8b9ed..7c546976a 100644
--- a/pages/views/_includes/landing/newsline.njk
+++ b/pages/views/_includes/landing/newsline.njk
@@ -12,7 +12,7 @@
               <p class="newsline-content-date">{{ item.date | date }}</p>
             {% endif %}
             <div class="newsline-content-text">
-              {% mdRenderTruncate item.templateContent %}
+              {% mdWrap item.templateContent %}
             </div>
           </a>
         </li>

From 758994b36b69a7dfbf82bd5eb7da5be637bef52f Mon Sep 17 00:00:00 2001
From: Feoktist Shovchko <fshovchko@exadel.com>
Date: Tue, 27 Jun 2023 15:42:58 +0300
Subject: [PATCH 08/18] chore(gh-pages): news section refactoring

---
 pages/views/_includes/landing/newsline.njk | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/pages/views/_includes/landing/newsline.njk b/pages/views/_includes/landing/newsline.njk
index 7c546976a..753d2959b 100644
--- a/pages/views/_includes/landing/newsline.njk
+++ b/pages/views/_includes/landing/newsline.njk
@@ -9,7 +9,7 @@
           <a class="newsline-content" href="{{ item.data.link or (item.url | url) }}">
             <h4 class="newsline-content-name">{{ item.data.emoji }}{{ item.data.name }}</h4>
             {% if item.data.date %}
-              <p class="newsline-content-date">{{ item.date | date }}</p>
+              <time class="newsline-content-date">{{ item.date | date }}</time>
             {% endif %}
             <div class="newsline-content-text">
               {% mdWrap item.templateContent %}

From 406098ff37940b91d0a141f82f452ee9c2143783 Mon Sep 17 00:00:00 2001
From: Feoktist Shovchko <fshovchko@exadel.com>
Date: Wed, 28 Jun 2023 10:01:31 +0300
Subject: [PATCH 09/18] chore(gh-pages): update date semantics

---
 pages/11ty/date.filter.js                  | 6 +++---
 pages/11ty/markdown.shortcut.js            | 7 +------
 pages/views/_includes/landing/newsline.njk | 6 ++----
 3 files changed, 6 insertions(+), 13 deletions(-)

diff --git a/pages/11ty/date.filter.js b/pages/11ty/date.filter.js
index d76d3e350..d271b5ca7 100644
--- a/pages/11ty/date.filter.js
+++ b/pages/11ty/date.filter.js
@@ -1,6 +1,6 @@
-module.exports = (config) => {
-  const date = (timestamp) => 
-    new Intl.DateTimeFormat('UTC', { month: 'long', day: '2-digit', year: 'numeric' }).format(new Date(timestamp));
+const date = (timestamp) => 
+  new Intl.DateTimeFormat('UTC', { month: 'long', day: '2-digit', year: 'numeric' }).format(new Date(timestamp));
 
+module.exports = (config) => {
   config.addFilter('date', date);
 };
diff --git a/pages/11ty/markdown.shortcut.js b/pages/11ty/markdown.shortcut.js
index 06360d405..536e89654 100644
--- a/pages/11ty/markdown.shortcut.js
+++ b/pages/11ty/markdown.shortcut.js
@@ -52,11 +52,7 @@ class MDRenderer {
   }
 
   static renderContent(content) {
-    return MDRenderer.renderContentString(content.innerHTML);
-  }
-
-  static renderContentString(str) {
-    return `<div class="markdown-container">${str}</div>`;
+    return `<div class="markdown-container">${content.innerHTML}</div>`;
   }
 
   static resolveLinks(dom, basePath) {
@@ -79,6 +75,5 @@ class MDRenderer {
 
 module.exports = (config) => {
   config.addNunjucksAsyncShortcode('mdRender', MDRenderer.render);
-  config.addNunjucksShortcode('mdWrap', MDRenderer.renderContentString);
 };
 module.exports.MDRenderer = MDRenderer;
diff --git a/pages/views/_includes/landing/newsline.njk b/pages/views/_includes/landing/newsline.njk
index 753d2959b..3bbce3972 100644
--- a/pages/views/_includes/landing/newsline.njk
+++ b/pages/views/_includes/landing/newsline.njk
@@ -9,11 +9,9 @@
           <a class="newsline-content" href="{{ item.data.link or (item.url | url) }}">
             <h4 class="newsline-content-name">{{ item.data.emoji }}{{ item.data.name }}</h4>
             {% if item.data.date %}
-              <time class="newsline-content-date">{{ item.date | date }}</time>
+              <time class="newsline-content-date" datetime="{{ item.date.toISOString() }}">{{ item.date | date }}</time>
             {% endif %}
-            <div class="newsline-content-text">
-              {% mdWrap item.templateContent %}
-            </div>
+            <div class="newsline-content-text markdown-container">{{ item.templateContent | safe }}</div>
           </a>
         </li>
       {% endfor %}

From d75841349b2faf5fc26fa11adb85118f30b7eec1 Mon Sep 17 00:00:00 2001
From: "ala'n (Alexey Stsefanovich)" <astsefanovich@exadel.com>
Date: Wed, 28 Jun 2023 20:10:03 +0200
Subject: [PATCH 10/18] chore(gh-pages): fix date formatter localization

---
 pages/11ty/date.filter.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/pages/11ty/date.filter.js b/pages/11ty/date.filter.js
index d271b5ca7..2fd64fccf 100644
--- a/pages/11ty/date.filter.js
+++ b/pages/11ty/date.filter.js
@@ -1,5 +1,5 @@
-const date = (timestamp) => 
-  new Intl.DateTimeFormat('UTC', { month: 'long', day: '2-digit', year: 'numeric' }).format(new Date(timestamp));
+const date = (timestamp) =>
+  new Intl.DateTimeFormat('en-GB', { timeZone: 'UTC', month: 'long', day: '2-digit', year: 'numeric' }).format(new Date(timestamp));
 
 module.exports = (config) => {
   config.addFilter('date', date);

From cfe07d9be48bb72ec475a7e782a1367aec7810ae Mon Sep 17 00:00:00 2001
From: "ala'n (Alexey Stsefanovich)" <astsefanovich@exadel.com>
Date: Wed, 28 Jun 2023 20:10:36 +0200
Subject: [PATCH 11/18] chore(gh-pages): fix indexing of the 11ty watch

---
 pages/views/components/index.njk | 2 ++
 pages/views/core/index.njk       | 2 ++
 pages/views/examples/index.njk   | 2 ++
 pages/views/index.njk            | 2 ++
 4 files changed, 8 insertions(+)

diff --git a/pages/views/components/index.njk b/pages/views/components/index.njk
index 0b5a7ad6e..aeaf6f3d5 100644
--- a/pages/views/components/index.njk
+++ b/pages/views/components/index.njk
@@ -8,4 +8,6 @@ collection: components
 hidden: true
 list: true
 collectionIcon: sidebar/components.svg
+eleventyImport:
+  collections: ["components"]
 ---
diff --git a/pages/views/core/index.njk b/pages/views/core/index.njk
index 52e7c0cfa..c3e16a634 100644
--- a/pages/views/core/index.njk
+++ b/pages/views/core/index.njk
@@ -8,4 +8,6 @@ collection: core
 hidden: true
 list: true
 collectionIcon: sidebar/utils.svg
+eleventyImport:
+  collections: ["core"]
 ---
diff --git a/pages/views/examples/index.njk b/pages/views/examples/index.njk
index 661cf28a5..8ba412c0c 100644
--- a/pages/views/examples/index.njk
+++ b/pages/views/examples/index.njk
@@ -7,4 +7,6 @@ order: -1
 collection: examples
 hidden: true
 collectionIcon: sidebar/examples.svg
+eleventyImport:
+  collections: ["examples"]
 ---
diff --git a/pages/views/index.njk b/pages/views/index.njk
index d98330485..beeac92df 100644
--- a/pages/views/index.njk
+++ b/pages/views/index.njk
@@ -1,5 +1,7 @@
 ---
 layout: landing
+eleventyImport:
+  collections: ["news"]
 ---
 
 {% include 'landing/marquee.njk' %}

From 00d8636bcbb4d39ec032228db022c336c715b226 Mon Sep 17 00:00:00 2001
From: "ala'n (Alexey Stsefanovich)" <astsefanovich@exadel.com>
Date: Wed, 28 Jun 2023 20:13:54 +0200
Subject: [PATCH 12/18] chore(gh-pages): rework the Newsline component

---
 pages/src/landing/blogs/blogs.less         | 94 ---------------------
 pages/src/landing/landing.less             |  2 +-
 pages/src/landing/newsline/newsline.less   | 95 ++++++++++++++++++++++
 pages/views/_includes/landing/newsline.njk | 28 +++++--
 4 files changed, 117 insertions(+), 102 deletions(-)
 delete mode 100644 pages/src/landing/blogs/blogs.less
 create mode 100644 pages/src/landing/newsline/newsline.less

diff --git a/pages/src/landing/blogs/blogs.less b/pages/src/landing/blogs/blogs.less
deleted file mode 100644
index c93f3f687..000000000
--- a/pages/src/landing/blogs/blogs.less
+++ /dev/null
@@ -1,94 +0,0 @@
-@import (reference) "../../common/variables.less";
-
-.newsline {
-  position: relative;
-  margin: 5rem auto;
-
-  &-item {
-    display: flex;
-    flex: 1 0 0px;
-    align-items: center;
-    list-style: none;
-  }
-
-  &-content {
-    width: 100%;
-    padding: 10px 45px;
-    color: white;
-    background-size: 0% 100%;
-    transition: color .2s ease-in, background-size 1.5s, background-color 1.5s;
-
-    &::before {
-      content: '';
-      position: absolute;
-      top: 0;
-      left: 1px;
-      height: 100%;
-      border-left: 3px solid @nav-dark-fg;
-      transition: border-color .2s ease-in-out;
-    }
-
-    &-cta {
-      display: inline-block;
-      color: @nav-dark-hover;
-      font-weight: bold;
-
-      opacity: 0;
-      transition: opacity .2s ease-in;
-    }
-
-    &-date {
-      font-size: .7em;
-    }
-
-    &-name {
-      padding-bottom: 5px;
-      font-size: 1.5rem;
-    }
-
-    &-text {
-      font-size: 1rem;
-
-      h1, .h1 {
-        font-size: 1.6rem;
-      }
-      h2, .h2 {
-        font-size: 1.4rem;
-        margin-bottom: 1rem;
-      }
-      h3, .h3 {
-        font-size: 1.3rem;
-      }
-      h4, .h4 {
-        font-size: 1.2rem;
-      }
-      h5, .h5 {
-        font-size: 1.1rem;
-      }
-    }
-
-    &:hover {
-      color: @nav-dark-hover;
-      text-decoration: none;
-
-      background-color: rgba(@nav-dark-selected, .1);
-      background-image: linear-gradient(to right, #fff0 0%, #fff0 50%, #fff3 100%);
-      background-size: 200% 100%; 
-      background-repeat: no-repeat;
-
-      &::before {
-        border-color: @nav-dark-accent;
-      }
-
-      .newsline-content {
-        &-cta {
-          opacity: 1;
-        }
-
-        &-text {
-          color: @nav-dark-accent;
-        }
-      }
-    }
-  }
-}
diff --git a/pages/src/landing/landing.less b/pages/src/landing/landing.less
index b3144a9ec..fceccb695 100644
--- a/pages/src/landing/landing.less
+++ b/pages/src/landing/landing.less
@@ -2,5 +2,5 @@
 @import "./benefits/benefits.less";
 @import "./browser-support/browser-support.less";
 @import "./promo-banner/promo-banner.less";
-@import "./blogs/blogs.less";
+@import "./newsline/newsline.less";
 //@import "./overview/overview.less";
diff --git a/pages/src/landing/newsline/newsline.less b/pages/src/landing/newsline/newsline.less
new file mode 100644
index 000000000..6eea16be6
--- /dev/null
+++ b/pages/src/landing/newsline/newsline.less
@@ -0,0 +1,95 @@
+@import (reference) "../../common/variables.less";
+
+.newsline {
+  position: relative;
+  margin: 0 auto 10rem;
+
+  &-list {
+    display: flex;
+    flex-direction: column;
+  }
+
+  &-item {
+    position: relative;
+    list-style: none;
+  }
+
+  &-link {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    z-index: 1;
+  }
+
+  &-content {
+    padding: 1.5rem 5rem;
+
+    color: white;
+    border-left: 3px solid white;
+    transition: border-color .25s ease-in-out;
+
+    &::before {
+      content: '';
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      background-image: linear-gradient(to right, fade(@nav-dark-selected, 25%), fade(@nav-dark-selected, 0%));
+      pointer-events: none;
+      opacity: 0;
+      transition: opacity .25s ease-in-out;
+    }
+
+    & &-title {
+      font-size: 1.5rem;
+      margin-left: -1px;
+      margin-bottom: 1rem;
+    }
+    & &-emoji {
+      position: absolute;
+      transform: translateX(-100%);
+      margin-left: -.8rem;
+    }
+    & &-date {
+      display: block;
+      font-size: .85rem;
+      margin-top: .4rem;
+      opacity: .75;
+    }
+
+    & &-text {
+      font-size: 1rem;
+
+      a[href] {
+        position: relative;
+        z-index: 2;
+      }
+
+      // h1-h3 are not allowed in content of the newsline
+      h1, h2, h3 { display: none; }
+
+      h4, .h4 {
+        font-size: 1.2rem;
+      }
+      h5, .h5 {
+        font-size: 1.1rem;
+      }
+      p {
+        margin-bottom: .2rem;
+      }
+    }
+  }
+
+  &-item-highlighted &-content {
+    color: #fbf9a2;
+    border-color: #fbf9a2;
+  }
+
+  &-item &-link:hover + &-content {
+    border-color: @nav-dark-accent;
+    &::before { opacity: 1; }
+  }
+}
diff --git a/pages/views/_includes/landing/newsline.njk b/pages/views/_includes/landing/newsline.njk
index 3bbce3972..ade92be02 100644
--- a/pages/views/_includes/landing/newsline.njk
+++ b/pages/views/_includes/landing/newsline.njk
@@ -2,17 +2,31 @@
 {% if releasedNews.length %}
   <div class="newsline container">
     <h2>{{ landing.news.title }}</h2>
-    <esl-animate target="::next::child" group></esl-animate>
-    <ul class="newsline-container">
+    <ul class="newsline-list">
       {% for item in releasedNews | reverse | limit(3) %}
-        <li class="esl-animate-slide-down newsline-item">
-          <a class="newsline-content" href="{{ item.data.link or (item.url | url) }}">
-            <h4 class="newsline-content-name">{{ item.data.emoji }}{{ item.data.name }}</h4>
+        {% set isArticle = [].concat(item.data.tags).includes('blogs') %}
+        {% set isHighlighted = [].concat(item.data.tags).includes('highlight') %}
+
+        <li class="esl-animate-slide right newsline-item {{ 'newsline-item-highlighted' if isHighlighted }}"
+            esl-animate="{group: true}">
+          {% if item.data.link or isArticle %}
+            <a class="newsline-link"
+               aria-describedby="newsline-item-{{ loop.index }}"
+               href="{{ item.data.link or (item.url | url) }}"></a>
+          {% endif %}
+          <div id="newsline-item-{{ loop.index }}" class="newsline-content">
+            <h3 class="newsline-content-title"><span class="newsline-content-emoji" aria-hidden="true">{{ item.data.emoji }}</span>{{ item.data.title or item.data.name }}</h3>
+
+            {% if isArticle %}
+              <div class="newsline-content-text markdown-container">{{ item.templateContent | text | truncate(250) }}</div>
+            {% else %}
+              <div class="newsline-content-text markdown-container">{{ item.templateContent | safe }}</div>
+            {% endif %}
+
             {% if item.data.date %}
               <time class="newsline-content-date" datetime="{{ item.date.toISOString() }}">{{ item.date | date }}</time>
             {% endif %}
-            <div class="newsline-content-text markdown-container">{{ item.templateContent | safe }}</div>
-          </a>
+          </div>
         </li>
       {% endfor %}
     </ul>

From 6afbf9e167adadf8151fca60effd7bca27aec00c Mon Sep 17 00:00:00 2001
From: "ala'n (Alexey Stsefanovich)" <astsefanovich@exadel.com>
Date: Wed, 28 Jun 2023 20:32:24 +0200
Subject: [PATCH 13/18] docs(gh-pages): "contribute to documentation" note

Co-authored-by: liubou-masiuk <lmasiuk@exadel.com>
---
 pages/views/blogs/Contribution Needed - Docs.md | 9 +++++++++
 1 file changed, 9 insertions(+)
 create mode 100644 pages/views/blogs/Contribution Needed - Docs.md

diff --git a/pages/views/blogs/Contribution Needed - Docs.md b/pages/views/blogs/Contribution Needed - Docs.md
new file mode 100644
index 000000000..23caf8824
--- /dev/null
+++ b/pages/views/blogs/Contribution Needed - Docs.md	
@@ -0,0 +1,9 @@
+---
+name: Documentation
+title: Contribute to ESL documentation
+tags: [highlight, news]
+emoji: 💙
+---
+
+Found a typo? Have an interesting usage example to share? Want to help improve our documentation?
+You are very welcome to contribute to ESL. Check out our [documentation contribution guide](../introduction/index.njk).

From fe7a86d449955e575e398c269a800800ae037442 Mon Sep 17 00:00:00 2001
From: "ala'n (Alexey Stsefanovich)" <astsefanovich@exadel.com>
Date: Wed, 28 Jun 2023 23:28:29 +0200
Subject: [PATCH 14/18] chore(gh-pages): fix mobile version of newline
 component

---
 pages/src/landing/newsline/newsline.less | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

diff --git a/pages/src/landing/newsline/newsline.less b/pages/src/landing/newsline/newsline.less
index 6eea16be6..f9cf95285 100644
--- a/pages/src/landing/newsline/newsline.less
+++ b/pages/src/landing/newsline/newsline.less
@@ -24,7 +24,10 @@
   }
 
   &-content {
-    padding: 1.5rem 5rem;
+    padding: 1.5rem 1rem 1.5rem 3rem;
+    @media @sm-xl {
+      padding: 1.5rem 5rem;
+    }
 
     color: white;
     border-left: 3px solid white;
@@ -51,7 +54,10 @@
     & &-emoji {
       position: absolute;
       transform: translateX(-100%);
-      margin-left: -.8rem;
+      margin-left: -.4rem;
+      @media @sm-xl {
+        margin-left: -.8rem;
+      }
     }
     & &-date {
       display: block;

From 15cb7f88d94ce2952deeedac32c5428c13a0c80f Mon Sep 17 00:00:00 2001
From: "ala'n (Alexey Stsefanovich)" <astsefanovich@exadel.com>
Date: Thu, 29 Jun 2023 00:39:02 +0200
Subject: [PATCH 15/18] chore(gh-pages): fix filters to properly handle empty
 collections + alternative date sorter

---
 pages/11ty/hidden.filter.js                |  2 +-
 pages/11ty/released.filter.js              |  2 +-
 pages/11ty/sort.filter.js                  | 22 ++++++++++++++++------
 pages/views/_includes/landing/newsline.njk |  4 ++--
 pages/views/_layouts/collection-grid.njk   |  2 +-
 5 files changed, 21 insertions(+), 11 deletions(-)

diff --git a/pages/11ty/hidden.filter.js b/pages/11ty/hidden.filter.js
index f73e98c4b..9ab5e7b8f 100644
--- a/pages/11ty/hidden.filter.js
+++ b/pages/11ty/hidden.filter.js
@@ -1,6 +1,6 @@
 module.exports = (config) => {
   /** Filter items by hidden marker */
-  const notHiddenFilter = (collection) => collection.filter( item => !item.data.hidden );
+  const notHiddenFilter = (collection) => (collection || []).filter( item => !item.data.hidden );
 
   config.addFilter('notHidden', notHiddenFilter);
 };
diff --git a/pages/11ty/released.filter.js b/pages/11ty/released.filter.js
index 86f49fb1a..7c1aff392 100644
--- a/pages/11ty/released.filter.js
+++ b/pages/11ty/released.filter.js
@@ -2,7 +2,7 @@ const {isDev} = require('./env.config');
 
 const identical = (values) => values;
 const draftsFilter = (values) => {
-  return values.filter((item) => {
+  return (values || []).filter((item) => {
     const tags = [].concat(item.data.tags);
     return !tags.includes('draft');
   });
diff --git a/pages/11ty/sort.filter.js b/pages/11ty/sort.filter.js
index 96624b03f..b20cb6558 100644
--- a/pages/11ty/sort.filter.js
+++ b/pages/11ty/sort.filter.js
@@ -1,6 +1,6 @@
 module.exports = (config) => {
   /** Generic sort njk filter */
-  const sortFilter = (comparer) => (values) => {
+  const createSortFilter = (comparer) => (values) => {
     if (!values || !Array.isArray(values)) {
       console.error(`Unexpected values for sort filter: ${values}`);
       return values;
@@ -8,17 +8,27 @@ module.exports = (config) => {
     return [...values].sort(comparer);
   };
 
+  // Utils
+  const resoleDate = (item) => new Date(item.date).getTime();
+  const resoleDateStrict = (item) => item.data.date ? new Date(item.date).getTime() : Number.POSITIVE_INFINITY;
+
   /** Comparer composer */
-  const compose = (cmpA, cmpB) => (a, b) => cmpA(a, b) || cmpB(a, b);
+  const compose = (...cmps) => (a, b) => cmps.reduce((res, cmp) => res || cmp(a, b), 0);
 
   /** Name metadata comparer */
   const nameComparer = (a, b) => a.data.name.localeCompare(b.data.name);
   /** Order metadata comparer */
   const orderComparer = (a, b) => (a.data.order || 0) - (b.data.order || 0);
   /** Date metadata comparer */
-  const dateComparer = (a, b) => new Date(b.date).getTime() - new Date(a.date).getTime();
+  const dateComparer = (a, b) => resoleDate(a) - resoleDate(b);
+  /** Date metadata comparer (will not use file creation date) */
+  const dateComparerStrict = (a, b) => resoleDateStrict(a) - resoleDateStrict(b);
+
+  // Composed compares
+  const nameAndOrderComparer = compose(orderComparer, nameComparer);
 
-  config.addFilter('sortByName', sortFilter(nameComparer));
-  config.addFilter('sortByNameAndOrder', sortFilter(compose(orderComparer, nameComparer)));
-  config.addFilter('sortByDate', sortFilter(dateComparer));
+  config.addFilter('sortByName', createSortFilter(nameComparer));
+  config.addFilter('sortByNameAndOrder', createSortFilter(nameAndOrderComparer));
+  config.addFilter('sortByDate', createSortFilter(dateComparer));
+  config.addFilter('sortByDateStrict', createSortFilter(dateComparerStrict));
 };
diff --git a/pages/views/_includes/landing/newsline.njk b/pages/views/_includes/landing/newsline.njk
index 762142d29..a7c258aa4 100644
--- a/pages/views/_includes/landing/newsline.njk
+++ b/pages/views/_includes/landing/newsline.njk
@@ -1,9 +1,9 @@
-{% set releasedNews = collections.news | released %}
+{% set releasedNews = collections.news | released | sortByDateStrict | reverse %}
 {% if releasedNews.length %}
   <div class="newsline container">
     <h2>{{ landing.news.title }}</h2>
     <ul class="newsline-list">
-      {% for item in releasedNews | reverse | limit(3) %}
+      {% for item in releasedNews | limit(3) %}
         {% set isArticle = [].concat(item.data.tags).includes('blogs') %}
         {% set isHighlighted = [].concat(item.data.tags).includes('highlight') %}
 
diff --git a/pages/views/_layouts/collection-grid.njk b/pages/views/_layouts/collection-grid.njk
index 3cc9196ae..229797242 100644
--- a/pages/views/_layouts/collection-grid.njk
+++ b/pages/views/_layouts/collection-grid.njk
@@ -4,7 +4,7 @@ layout: content
 <link href="https://fonts.googleapis.com/css2?family=Ubuntu:wght@500&display=swap" rel="stylesheet">
 
 <ul class="collection-grid unstyled-list {{ 'collection-grid-column' if list }}">
-  {% for item in collections[collection] | notHidden | released | sortByNameAndOrder %}
+  {% for item in collections[collection] | released | notHidden | sortByNameAndOrder %}
     {% set isDraft = [].concat(item.data.tags).includes('draft') %}
     {% set isBeta = [].concat(item.data.tags).includes('beta') %}
     {% set isNew = [].concat(item.data.tags).includes('new') %}

From 9180770c52ddcfc16d93946d73acb2646944eaa7 Mon Sep 17 00:00:00 2001
From: "ala'n (Alexey Stsefanovich)" <astsefanovich@exadel.com>
Date: Thu, 29 Jun 2023 00:39:32 +0200
Subject: [PATCH 16/18] docs(gh-pages): replace content with a more realistic
 one

---
 pages/views/blogs/ESL v4.0.0.md          | 198 -----------------------
 pages/views/blogs/ESL v4.8.0.md          |  12 ++
 pages/views/blogs/ESL v5.0.0 Announce.md |  19 +++
 3 files changed, 31 insertions(+), 198 deletions(-)
 delete mode 100644 pages/views/blogs/ESL v4.0.0.md
 create mode 100644 pages/views/blogs/ESL v4.8.0.md
 create mode 100644 pages/views/blogs/ESL v5.0.0 Announce.md

diff --git a/pages/views/blogs/ESL v4.0.0.md b/pages/views/blogs/ESL v4.0.0.md
deleted file mode 100644
index 35f65459a..000000000
--- a/pages/views/blogs/ESL v4.0.0.md	
+++ /dev/null
@@ -1,198 +0,0 @@
----
-layout: content
-name: ESL v4.0.0
-title: ESL v4.0.0
-tags: [blogs, news, draft]
-date: 2022-10-01
-emoji: ⚡️
-containerCls: container markdown-container
----
-
-## ESL Core
-
-### Features:
-  - `ESLEventListener`s  functionality introduced
-  - `ESLMixinElement`s functionality introduced
-  - `ESLBaseElement` extended API 
-    - `ESLBaseElement.create` shortcut to create current custom element
-
-### Structural changes:
-  - Attribute decorators moved to the `esl-utils`
-  - All ESL modules migrated to `ESLEventListener`s
-  - Event names are now defined on the prototype level
-
-### BREAKING CHANGES
-  - `$$fire` no longer adds 'esl:' prefix to the fired events
-
----
-
-## ESL Media Query
-
-### Features:
-  - `ESLMediaQuery` now implements `EventTarget` interface
-  - `ESLMediaRuleList` API reworked with `EventTarget` interface and new calculation strategy
-
-### BREAKING CHANGES
-  - `ESLMediaRuleList.parseTuple` arguments order changed
-  - `ESLMediaRule` no longer supports default marker, now "default" is equal to "all" query
-  - `ESLMediaRuleList` observation callback signature changed, now it should be `EventListener`
-  - `ESLMediaRuleList.prototype.default` removed as no longer default rules
-  - `ESLMediaRuleList` no longer fires events on rule change, now it's based on active value change
-  - `ESLMediaRuleList` now uses merging of all active rules to define result value, however you were still able to get the last active rule value
-  - `ESLMediaRuleList.prototype.active` now returns an array of active rules
-
----
-
-## ESL Traversing Query
-
-### Features:
-  - add comma support to define multiple target ([#1120](https://github.com/exadel-inc/esl/issues/1120) / [#1129](https://github.com/exadel-inc/esl/issues/1129)) ([2890d7b](https://github.com/exadel-inc/esl/commit/2890d7b7667492b982b266048d23874c57b938ea)), closes [#1102](https://github.com/exadel-inc/esl/issues/1102)
-  - add ability to find closest element ([ada6fbb](https://github.com/exadel-inc/esl/commit/ada6fbb172a2fb2cf0d435420ad8fb0a46e7766f))
-
----
-  
-## ESL Utils
-
-### Features:
-  - ability to grow/shrink axis of the `Rect` ([1c58a1c](https://github.com/exadel-inc/esl/commit/1c58a1c19b0aa82abf7eb73c40781e9c4a4860ba))
-  - `SyntheticEventTarget` to implement `EventTarget` interface with more listeners control ([e4f3eb8](https://github.com/exadel-inc/esl/commit/e4f3eb89e0dd8227937d476a8d2090730342de64))
-  - simplify and extend `@prop` decorator API ([fd6ede3](https://github.com/exadel-inc/esl/commit/fd6ede34b0a3c7496083cb58aa9b726d4a692085))
-  - add `skipOneRender` RAF utility ([ddc3227](https://github.com/exadel-inc/esl/commit/ddc322798e6f8cf447874896786fe6d368bbe5ef))
-  - add ability to pass predicate to sequence finder ([dd8c3cb](https://github.com/exadel-inc/esl/commit/dd8c3cbb43ed529330c32459b9787949a0927a01))
-  - add `@decorate` decorator to bind and decorate method of the class
-  - `@attr` extended with ability to pass Serializer/Parser ([012eb83](https://github.com/exadel-inc/esl/commit/012eb83ebcbba8315a2766af090239774c21234e))
-  - create dom html sanitize method ([004642f](https://github.com/exadel-inc/esl/commit/004642f866ac1b2ed5278084963288d8c2fd17e0))
-  - create `extractValues` object utility ([8edd9e7](https://github.com/exadel-inc/esl/commit/8edd9e7b564b4ac78a4fc952ee58f76b6a54cf89))
-  - create cumulative imports for esl-utils submodules ([2e9d6ad](https://github.com/exadel-inc/esl/commit/2e9d6ad8f327ede991feef4ebc7c76fdd55726af))
-
-### BREAKING CHANGES
-  - `isMouseEvent`, `isTouchEvent` moved outside of `EventUtils`
-  - `normalizeTouchPoint` renamed to `touchPoint` and moved outside of `EventUtils`
-  - `normalizeCoordinates` removed. Use `getOffsetPoint` in combination with `getTouchPoint` instead
-  - `@prop` signature changed `prop(value?: any, prototypeConfig: OverrideDecoratorConfig = {})` instead
-  - `ScrollUtils.lock` no longer accessible. Use `lockScroll(document.documentElement, {strategy: '...'})` instead
-  - `ScrollUtils.unlock` no longer accessible. Use `unlockScroll(document.documentElement, {strategy: '...'})` instead
-  - `ScrollUtils.lockRequest` no longer accessible. Use `lockScroll(document.documentElement, {strategy: '...', initiatior})` instead
-  - `ScrollUtils.unlockRequest` no longer accessible. Use `unlockScroll(document.documentElement, {strategy: '...', initiatior})` instead
-
-### Bugfixes
-  - make attr decorators correctly strict typed
-  - `deepMerge` primitive values merging improved, undefined arguments now ignored ([5b7b730](https://github.com/exadel-inc/esl/commit/5b7b73003acd4d29250af12603ced5d58c40aff6))
-  - fix `@bind` decorator to save original function enumerable marker ([92c2086](https://github.com/exadel-inc/esl/commit/92c2086df610a5572143463302baf7aeea6174e9))
-  - update `@decorate` decorator to allow to save context properly (on instance level) ([0ac1b0c](https://github.com/exadel-inc/esl/commit/0ac1b0cb9c90648ae1e0a18a16a936971c4b4ee9))
-
----
-
-## ESL Toggleable and ESL Trigger
-
-### Features:
-  - migrate `esl-toggleable` and `esl-trigger` to ESLEventListeners
-  - `esl:show:request` additional data ([a121872](https://github.com/exadel-inc/esl/commit/a121872b6e69fd7fb7a71bdfa9058430e650f423))
-  - support of `esl:hide:request` ([8a0928b](https://github.com/exadel-inc/esl/commit/8a0928b2f2bda63c6fbbaf5e9b6453d660091ec1))
-  - add support of dynamic `aria-label` for `esl-trigger` ([5c18841](https://github.com/exadel-inc/esl/commit/5c188418720ad4a972caa7450563a29268d8ec97))
-  - add esc key event handler for `esl-trigger` ([3dab6da](https://github.com/exadel-inc/esl/commit/3dab6dad39259f7e920c9a108757271cb58a216d))
-  - add `ignore-esc` attribute for `esl-trigger` ([605b715](https://github.com/exadel-inc/esl/commit/605b715a29ef1a852e24ce5120ca30d394fc19c1))
-
-
-## ESL Panel and ESL Panel Group
-
-### Features:
-  - migrate `esl-panel` and `esl-panel-group` to ESLEventListeners
-  - add `refresh-strategy` attribute ([#1156](https://github.com/exadel-inc/esl/issues/1156)) ([36027ad](https://github.com/exadel-inc/esl/commit/36027ad2574c0c33df1b6370484448a6889a647a))
-  - add ability to control min/max open panels per media condition ([67ca2ba](https://github.com/exadel-inc/esl/commit/67ca2ba16e3fc4ee4300d1c79ca2e5d0da845af7))
-
-### BREAKING CHANGES
-  - `ESLPanelGroup.noCollapse` (with related attribute) renamed to `ESLPanelGroup.noAnimate` (`no-animate` attribute)
-  - `ESLPanelGroup.shouldCollapse` renamed to `ESLPanelGroup.shouldAnimate`
-  - `PanelActionParams.noCollapse` renamed to `PanelActionParams.noAnimate`
-  - `ESLPanelGroup` `view` attribute is no longer supported
-  - `open` mode of `ESLPanelGroup` is no longer supported, it should be replaced with a `min-open-items="all"`
-  - `accordion-group="single"` attribute of `ESLPanelGroup` is no longer supported, replaced with `max-open-items="1"`
-  - `accordion-group="single"` attribute of `ESLPanelGroup` is no longer supported, replaced with `max-open-items="all"`
-  - components inherited from `ESLPanelGroup` should use `@listen({inherit: true})` for proper subscription
-
-### Bugfixes
-  - add `capturedBy` and fix `after:show` dispatch ([9bdc98c](https://github.com/exadel-inc/esl/commit/9bdc98c98a2926fe42c7cd15007c31a19171027c))
-  - fix `esl:before:hide` bubbling from uncontrolled toggleables ([9212b6b](https://github.com/exadel-inc/esl/commit/9212b6beacd97d39d0410a464598e9e2e0bdb1c2))
-  - fix animation process capturing by `ESLPanel` component ([9a5b3a5](https://github.com/exadel-inc/esl/commit/9a5b3a576d5cb4dbd47d113d944932586155c7f6))
-  - change `no-animate` API ([dde3500](https://github.com/exadel-inc/esl/commit/dde35009268a92bae92a45f00d11cb29edee98fa))
-
-
-## ESL Tab and ESLTabs
-
-### Features:
-  - `esl-tab` and `esl-tabs` migrated to ESLEventListeners
-
-### Bugfixes:
-  - fix alignment behavior ([b5ebd66](https://github.com/exadel-inc/esl/commit/b5ebd668de7b4d1eea7311ae7d734c02abb537cf))
-
-### BREAKING CHANGES
-  - Listeners extended from `ESLTab` should now use `@listen` annotation to work correctly
-  - Listeners extended from `ESLTabs` should now use `@listen` annotation to work correctly
-
-## ESL Alert
-
-### Features:
-  - `esl-alert` migrated to ESLEventListeners, inner API updates
-
-### BREAKING CHANGES
-  - Listeners extended from `ESLAlert` should now use `@listen` annotation to work correctly
-  - `eventNs` is no longer supported, event is now defined directly on the prototype level
-
-
-## ESL Popup
-
-### Features:
-  - add configurable `rootMargin` for the popup activator observer ([5d647d6](https://github.com/exadel-inc/esl/commit/5d647d60673a65e7b27472c1b68a1e174fa40740))
-  - add extended `offsetContainer` configuration ([63cbc0a](https://github.com/exadel-inc/esl/commit/63cbc0a996a8578549360dadaa3bb17c53884bfe))
-
-### BREAKING CHANGES
-  - Listeners extended from `ESLPopup` should now use `@listen` annotation to work correctly
-
-
-## ESL Footnotes
-
-### Features:
-  - migrate `esl-notes` and `esl-footnotes` to ESLEventListeners
-  - add configurable `intersectionMargin`  for the note tooltip activator observer ([b9b1599](https://github.com/exadel-inc/esl/commit/b9b159942e3534965f43cac94c140d5680308548))
-
-### BREAKING CHANGES
-  - Listeners extended from `ESLNote` should now use `@listen` annotation to work correctly
-  - Listeners extended from `ESLFootnote` should now use `@listen` annotation to work correctly
-  - `eventNs` is no longer supported, event is now defined directly on the prototype level
-
-## ESL Image and ESL Media
-
-### Bugfixes:
-  - fix esl-image to prevent DOM XSS vulnerabilities ([4fd925d](https://github.com/exadel-inc/esl/commit/4fd925df8605994b0f7d345d77a425e0cdc487e8))
-  - fix wrong error status on svg images in FF ([cad6b40](https://github.com/exadel-inc/esl/commit/cad6b40ccce01aaea8b1869b2cd7d542939a4fd4))
-
-
-## ESL Scrollbar
-
-### Features:
-  - migrate `esl-scrollbar` to ESLEventListeners
-
-### Bugfixes
-  - remove unnecessary width ([6e18909](https://github.com/exadel-inc/esl/commit/6e18909c6768c259d76084b463404fe6b29c9af8))
-
-### BREAKING CHANGES
-  - Listeners extended from `ESLScrollbar` should now use `@listen` annotation to work correctly
-
-
-## ESL Select
-
-### Features:
-  - migrate `esl-select` to ESLEventListeners ([76ca947](https://github.com/exadel-inc/esl/commit/76ca9479090546cdf092d1c9c3f5d993263f0581))
-  - add `dropdown-class` param to specify dropdown additional CSS class(es) ([938357f](https://github.com/exadel-inc/esl/commit/938357fa6fb5db804f445f31eb4f73641dfbcccf))
-
-
-## ESL Polyfills
-
-### Features:
-  - `Event`, `CustomEvent`, `MouseEvent`, `KeyboardEvent`, `FocusEvent` extended polyfills ([9ca3c40](https://github.com/exadel-inc/esl/commit/9ca3c406ff1f6f99490fdf09d2f15bc450c7be57))
-  - `Object.assign` and `Array.from` extended polyfills ([590bca4](https://github.com/exadel-inc/esl/commit/590bca4fab39c566db68f7bc2440e5d84355a991))
-  - extended `es5-target-shim` ([ef53df9](https://github.com/exadel-inc/esl/commit/ef53df936dd2beda859a41e9f8a900199bb24f3e))
-
-### BREAKING CHANGES
-  - ES5 shim `shimES5ElementConstructor` replaced with `shimES5Constructor`
diff --git a/pages/views/blogs/ESL v4.8.0.md b/pages/views/blogs/ESL v4.8.0.md
new file mode 100644
index 000000000..f242b8af4
--- /dev/null
+++ b/pages/views/blogs/ESL v4.8.0.md	
@@ -0,0 +1,12 @@
+---
+name: ESL v4.8.0
+title: ESL v4.8.0 Released
+tags: [news, draft]
+date: 2023-06-22
+emoji: ⚡️
+link: https://github.com/exadel-inc/esl/releases/tag/v4.8.0
+---
+
+In `4.8.0` update we are introducing new `container-active-class` feature for `ESLToggleable`, `ESLPanel`, `ESLPopup`, and other `ESLToggleables`
+
+[Check out latest releases...](https://github.com/exadel-inc/esl/releases/)
diff --git a/pages/views/blogs/ESL v5.0.0 Announce.md b/pages/views/blogs/ESL v5.0.0 Announce.md
new file mode 100644
index 000000000..b656f575f
--- /dev/null
+++ b/pages/views/blogs/ESL v5.0.0 Announce.md	
@@ -0,0 +1,19 @@
+---
+name: ESL v5.0.0 Announce
+title: Our planes for July
+tags: [news, draft]
+date: 2023-07-01
+emoji: ⚡️
+containerCls: container markdown-container
+---
+
+ESL is going to have a  lot of interesting updates soon:
+- `ESLAnimate` will be finally available as a stable module under `4.9.0`
+- `ESLShare` is going to have final updates, `popup` version will be available in stable `4.9.0` and going to be accepted as 
+  a stale module in `5.0.0`. 
+- `ESLCarousel` module is already available under the beta channel and in the process of testing, refactoring and going
+  to
+  be a stable version soon.
+- `ESLModal` is going to be available for preview in the nearest beta releases
+- First ESL 5.0.0 versions are going to be available on beta branch soon: 
+  IE11 support dropped, event API improvements, styles distribution improvements. 

From c8dbcb3502c4acd0d33394ed763406736c64db64 Mon Sep 17 00:00:00 2001
From: "ala'n (Alexey Stsefanovich)" <astsefanovich@exadel.com>
Date: Thu, 29 Jun 2023 00:56:07 +0200
Subject: [PATCH 17/18] chore(gh-pages): simplify `createSortFilter` function

---
 pages/11ty/sort.filter.js | 7 ++-----
 1 file changed, 2 insertions(+), 5 deletions(-)

diff --git a/pages/11ty/sort.filter.js b/pages/11ty/sort.filter.js
index b20cb6558..0af36647f 100644
--- a/pages/11ty/sort.filter.js
+++ b/pages/11ty/sort.filter.js
@@ -1,7 +1,7 @@
 module.exports = (config) => {
   /** Generic sort njk filter */
   const createSortFilter = (comparer) => (values) => {
-    if (!values || !Array.isArray(values)) {
+    if (!Array.isArray(values)) {
       console.error(`Unexpected values for sort filter: ${values}`);
       return values;
     }
@@ -24,11 +24,8 @@ module.exports = (config) => {
   /** Date metadata comparer (will not use file creation date) */
   const dateComparerStrict = (a, b) => resoleDateStrict(a) - resoleDateStrict(b);
 
-  // Composed compares
-  const nameAndOrderComparer = compose(orderComparer, nameComparer);
-
   config.addFilter('sortByName', createSortFilter(nameComparer));
-  config.addFilter('sortByNameAndOrder', createSortFilter(nameAndOrderComparer));
+  config.addFilter('sortByNameAndOrder', createSortFilter(compose(orderComparer, nameComparer)));
   config.addFilter('sortByDate', createSortFilter(dateComparer));
   config.addFilter('sortByDateStrict', createSortFilter(dateComparerStrict));
 };

From a0267e91b677f8539e33b74e39fb9b6e9e71ab19 Mon Sep 17 00:00:00 2001
From: "ala'n (Alexey Stsefanovich)" <astsefanovich@exadel.com>
Date: Thu, 29 Jun 2023 16:01:49 +0200
Subject: [PATCH 18/18] chore(gh-pages): small corrections for rendering utils

---
 pages/11ty/sort.filter.js                       | 8 ++++----
 pages/src/landing/newsline/newsline.less        | 1 -
 pages/views/blogs/Contribution Needed - Docs.md | 3 ++-
 3 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/pages/11ty/sort.filter.js b/pages/11ty/sort.filter.js
index 0af36647f..58a32a721 100644
--- a/pages/11ty/sort.filter.js
+++ b/pages/11ty/sort.filter.js
@@ -9,8 +9,8 @@ module.exports = (config) => {
   };
 
   // Utils
-  const resoleDate = (item) => new Date(item.date).getTime();
-  const resoleDateStrict = (item) => item.data.date ? new Date(item.date).getTime() : Number.POSITIVE_INFINITY;
+  const resolveDate = (item) => new Date(item.date).getTime();
+  const resolveMetaDate = (item) => item.data.date ? new Date(item.date).getTime() : Number.POSITIVE_INFINITY;
 
   /** Comparer composer */
   const compose = (...cmps) => (a, b) => cmps.reduce((res, cmp) => res || cmp(a, b), 0);
@@ -20,9 +20,9 @@ module.exports = (config) => {
   /** Order metadata comparer */
   const orderComparer = (a, b) => (a.data.order || 0) - (b.data.order || 0);
   /** Date metadata comparer */
-  const dateComparer = (a, b) => resoleDate(a) - resoleDate(b);
+  const dateComparer = (a, b) => resolveDate(a) - resolveDate(b);
   /** Date metadata comparer (will not use file creation date) */
-  const dateComparerStrict = (a, b) => resoleDateStrict(a) - resoleDateStrict(b);
+  const dateComparerStrict = (a, b) => resolveMetaDate(a) - resolveMetaDate(b);
 
   config.addFilter('sortByName', createSortFilter(nameComparer));
   config.addFilter('sortByNameAndOrder', createSortFilter(compose(orderComparer, nameComparer)));
diff --git a/pages/src/landing/newsline/newsline.less b/pages/src/landing/newsline/newsline.less
index f9cf95285..af9624434 100644
--- a/pages/src/landing/newsline/newsline.less
+++ b/pages/src/landing/newsline/newsline.less
@@ -91,7 +91,6 @@
 
   &-item-highlighted &-content {
     color: #fbf9a2;
-    border-color: #fbf9a2;
   }
 
   &-item &-link:hover + &-content {
diff --git a/pages/views/blogs/Contribution Needed - Docs.md b/pages/views/blogs/Contribution Needed - Docs.md
index 23caf8824..bed56248a 100644
--- a/pages/views/blogs/Contribution Needed - Docs.md	
+++ b/pages/views/blogs/Contribution Needed - Docs.md	
@@ -3,7 +3,8 @@ name: Documentation
 title: Contribute to ESL documentation
 tags: [highlight, news]
 emoji: 💙
+link: ../introduction/index
 ---
 
 Found a typo? Have an interesting usage example to share? Want to help improve our documentation?
-You are very welcome to contribute to ESL. Check out our [documentation contribution guide](../introduction/index.njk).
+You are very welcome to contribute to ESL. Check out our [documentation contribution guide](../introduction/index).