zoxon

/**
 * Calculate password strength
 * @param value password
 * @returns password strength in range between 0 an 1
 */
export const getPasswordStrength = (value: string): number => {
  // Minimum 8 characters
  const REGEX_CHARACTER = /^.{8,}$/

  // Minimum 2 uppercase,

zoxon

Adding and Removing Classes, with simple cross-browser JavaScript

The standard JavaScript way to select an element is using document.getElementById("Id"), which is what the following examples use - you can of course obtain elements in other ways, and in the right situation may simply use this instead - however, going into detail on this is beyond the scope of the answer.

To change all classes for an element:

To replace all existing classes with one or more new classes, set the className attribute:

document.getElementById("MyElement").className = "MyClass";

zoxon

describe('arrayToKeyedObject', () => {
  it('should return empty object if array are empty', () => {
    type GenericItems = { code: string }
    const items: GenericItems[] = []
    const result = arrayToKeyedObject(items, (item) => item.code)

    expect(result).toEqual({})
  })

  it('should return keyed object', () => {

zoxon

Dates:

<time datetime="1914">  <!-- means the year 1914 -->
<time datetime="1914-12">  <!-- means December 1914 -->
<time datetime="1914-12-20">  <!-- means 20 December 1914 -->
<time datetime="12-20">  <!-- means 20 December any year -->
<time datetime="1914-W15">  <!-- means week 15 of year 1914 -->

Date and Times:

zoxon

function fakeRequest(data) {
  // eslint-disable-next-line unicorn/consistent-function-scoping
  const random = (min, max) => Math.floor(Math.random() * (max - min) + min)

  return new Promise((resolve) => {
    setTimeout(() => {
      return resolve({ isOk: true, data })
    }, random(500, 2000))
  })
}

zoxon

<template>
  <component :is="tag" :class="classes" :style="style"><slot></slot></component>
</template>

<script>
import { isNumber } from '@/helpers/is'
import { stringToModifiers } from '@/helpers/bem'

export default {
  name: 'BaseScrollbar',

zoxon

#b_ BEM CSS методология: Полное руководство

Главное: классы b-someblock__someelement__element__element-modificator - это не BEM! Как правильно верстать по BEM - читайте ниже.

1. Длинное необязательное вступление
2. Суть #b_

• Зачем это всё?
• Блок
• Элемент

zoxon

/* ----

 css custom properties to manipulate color
 MIT - 2017 - Soft Punch
 https://gist.github.com/softpunch/ 

 set initial "main" color via HSL values. 
 automatically calculate harmonies and variations of that color with pure css.

 harmonies are determined solely by hue. 

zoxon

//events - a super-basic Javascript (publish subscribe) pattern

var events = {
  events: {},
  on: function (eventName, fn) {
    this.events[eventName] = this.events[eventName] || [];
    this.events[eventName].push(fn);
  },
  off: function(eventName, fn) {
    if (this.events[eventName]) {

zoxon

const scrollBarGap = window.innerWidth - document.documentElement.clientWidth