Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

sedona-blocks

Package Overview
Dependencies
Maintainers
3
Versions
43
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

sedona-blocks - npm Package Compare versions

Comparing version 3.13.0 to 3.13.1

2

package.json
{
"name": "sedona-blocks",
"version": "3.13.0",
"version": "3.13.1",
"description": "",

@@ -5,0 +5,0 @@ "repository": {

@@ -22,4 +22,4 @@ # Набор типовых блоков для составления структуры страниц

* [footer](https://github.com/constlab/sedona-blocks/tree/master/src/footer)
* [header](https://github.com/constlab/sedona-blocks/tree/master/src/header)
* [footer](https://github.com/constlab/sedona-blocks/tree/master/src/footer) ([пример](http://sedona.stage.constlab.ru/blocks/footer/))
* [header](https://github.com/constlab/sedona-blocks/tree/master/src/header) ([пример](http://sedona.stage.constlab.ru/blocks/header/))
* heading

@@ -26,0 +26,0 @@ * [notify](https://github.com/constlab/sedona-blocks/tree/master/src/notify) ([пример](http://sedona.stage.constlab.ru/blocks/notify/))

@@ -15,6 +15,16 @@ # Карточка

@card-padding: @indent;
@card-background-color: transparent;
@card-background-image: none;
@card-background-repeat: repeat;
@card-background-position: 0 0;
@card-background-size: auto auto;
@card-border-width: 1px;
@card-border-color: @base-divider;
@card-border-radius: @radius;
@card-padding: @indent;
@card-frame-opacity: 0.2;
@card-media-ratio: 56.25%;

@@ -24,5 +34,10 @@

@card-darken-color: @light-primary;
@card-darken-background: @dark-primary;
@card-darken-background-color: @dark-primary;
@card-darken-background-image: none;
@card-darken-background-repeat: repeat;
@card-darken-background-position: 0 0;
@card-darken-background-size: auto auto;
@card-darken-border-color: @light-divider;
@card-darken-frame-opacity: @card-frame-opacity;

@@ -32,5 +47,10 @@

@card-lighten-color: @dark-primary;
@card-lighten-background: @light-primary;
@card-lighten-background-color: @light-primary;
@card-lighten-background-image: none;
@card-lighten-background-repeat: repeat;
@card-lighten-background-position: 0 0;
@card-lighten-background-size: auto auto;
@card-lighten-border-color: @dark-divider;
@card-lighten-frame-opacity: @card-frame-opacity;

@@ -37,0 +57,0 @@ ```

@@ -15,1 +15,7 @@ # Файл

```
## Разметка
```html
<input type="file" class="file">
```
# Подвал
Шаблонный тип.
Шаблонный тип. [Пример](http://sedona.stage.constlab.ru/blocks/footer/).

@@ -9,3 +9,2 @@ ## Особенности

* По-умолчанию элементы идут друг под другом. Начиная с ширины `@footer-breakpoints-desktop`, выстраиваются на 100% ширину родителя с воздухом между (space-between)
* По-умолчанию имеет тон всего сайта. Может принудительно иметь светлый и темный тон

@@ -15,4 +14,2 @@ ## Настройка

```less
// Base
@footer-padding-top-smaller: 0;

@@ -27,19 +24,12 @@ @footer-padding-top-larger: 0;

@footer-color: inherit;
@footer-background: none;
@footer-link-color: @link-primary;
@footer-background-color: transparent;
@footer-background-image: none;
@footer-background-repeat: repeat;
@footer-background-position: 0 0;
@footer-background-size: auto auto;
@footer-breakpoints: @grid-breakpoints-md;
@footer-max-width: @grid-breakpoints-xl;
// Darken
@footer-darken-color: @light-primary;
@footer-darken-background: @dark-primary;
@footer-darken-link-color: @footer-link-color;
// Lighten
@footer-lighten-color: @dark-primary;
@footer-lighten-background: @light-primary;
@footer-lighten-link-color: @footer-link-color;
```

@@ -53,23 +43,8 @@

<div class="footer__content">
© «Рога и копыта», 2000–2018
</div>
<div class="footer__content">
<a href="#">Конфиденциальность</a>
<a href="#">Правила пользования</a>
</div>
<div class="footer__content">
Создано в&nbsp;<a href="https://constlab.ru" target="_blank">Const&nbsp;Lab</a> в&nbsp;2018&nbsp;году
</div>
</div>
</footer>
```
## Модификаторы
### `footer`
* `footer--darken` — делает подвал в темных тонах
* `footer--lighten` — делает подвал в светлых тонах

@@ -8,6 +8,5 @@ # Form

```less
// Proportions
// Base
@form-control-border-width: 1px;
@form-control-border-radius: @radius;
@form-control-height: (@line-height + @form-control-padding-top + @form-control-padding-bottom);

@@ -19,6 +18,5 @@ @form-control-padding-top: (@indent / 2);

@form-control-height: (@line-height + @form-control-padding-top + @form-control-padding-bottom);
@form-control-border-width: 1px;
@form-control-border-radius: @radius;
// Breakpoints
@form-breakpoints: @grid-breakpoints-md;

@@ -28,6 +26,2 @@

@form-control-color: @base-primary;
@form-control-border-color: @base-divider;
@form-control-background-color: @light-primary;

@@ -39,18 +33,20 @@ @form-control-background-image: none;

@form-control-border-color: @base-divider;
@form-control-hover-background-color: @form-control-background-color;
@form-control-hover-border-color: darken(@form-control-border-color, 15%);
@form-control-hover-background-color: @form-control-background-color;
@form-control-focus-background-color: @form-control-hover-background-color;
@form-control-focus-border-color: @form-control-hover-border-color;
@form-control-focus-outline-color: @form-control-border-color;
@form-control-focus-border-color: @form-control-hover-border-color;
@form-control-focus-background-color: @form-control-hover-background-color;
@form-control-danger-background-color: @form-control-background-color;
@form-control-danger-border-color: lighten(@alert-danger, 25%);
@form-control-danger-background-color: @form-control-background-color;
@form-control-danger-hover-background-color: @form-control-danger-background-color;
@form-control-danger-hover-border-color: darken(@form-control-danger-border-color, 10%);
@form-control-danger-hover-background-color: @form-control-danger-background-color;
@form-control-danger-focus-background-color: @form-control-danger-hover-background-color;
@form-control-danger-focus-border-color: @form-control-danger-hover-border-color;
@form-control-danger-focus-outline-color: @form-control-danger-border-color;
@form-control-danger-focus-border-color: @form-control-danger-hover-border-color;
@form-control-danger-focus-background-color: @form-control-danger-hover-background-color;

@@ -61,4 +57,2 @@ // Accent

@form-accent-border-color: @base-secondary;
@form-accent-background-color: @form-accent-border-color;

@@ -70,4 +64,6 @@ @form-accent-background-image: none;

@form-accent-border-color: @base-secondary;
@form-accent-hover-background-color: darken(@form-accent-background-color, 10%);
@form-accent-hover-border-color: darken(@form-accent-border-color, 10%);
@form-accent-hover-background-color: darken(@form-accent-background-color, 10%);

@@ -92,6 +88,2 @@ // Hint

@form-darken-control-color: @light-primary;
@form-darken-control-border-color: @light-divider;
@form-darken-control-background-color: @dark-primary;

@@ -103,18 +95,20 @@ @form-darken-control-background-image: none;

@form-darken-control-border-color: @light-divider;
@form-darken-control-hover-background-color: @form-darken-control-background-color;
@form-darken-control-hover-border-color: lighten(@form-darken-control-border-color, 15%);
@form-darken-control-hover-background-color: @form-darken-control-background-color;
@form-darken-control-focus-background-color: @form-darken-control-hover-background-color;
@form-darken-control-focus-border-color: @form-darken-control-hover-border-color;
@form-darken-control-focus-outline-color: @form-darken-control-border-color;
@form-darken-control-focus-border-color: @form-darken-control-hover-border-color;
@form-darken-control-focus-background-color: @form-darken-control-hover-background-color;
@form-darken-control-danger-background-color: @form-darken-control-background-color;
@form-darken-control-danger-border-color: lighten(@alert-danger, 5%);
@form-darken-control-danger-background-color: @form-darken-control-background-color;
@form-darken-control-danger-hover-background-color: @form-darken-control-danger-background-color;
@form-darken-control-danger-hover-border-color: darken(@form-darken-control-danger-border-color, 5%);
@form-darken-control-danger-hover-background-color: @form-darken-control-danger-background-color;
@form-darken-control-danger-focus-background-color: @form-darken-control-danger-hover-background-color;
@form-darken-control-danger-focus-border-color: @form-darken-control-danger-hover-border-color;
@form-darken-control-danger-focus-outline-color: @form-darken-control-danger-border-color;
@form-darken-control-danger-focus-border-color: @form-darken-control-danger-hover-border-color;
@form-darken-control-danger-focus-background-color: @form-darken-control-danger-hover-background-color;

@@ -125,4 +119,2 @@ // Darken accent

@form-darken-accent-border-color: @light-secondary;
@form-darken-accent-background-color: @form-darken-accent-border-color;

@@ -134,4 +126,6 @@ @form-darken-accent-background-image: none;

@form-darken-accent-border-color: @light-secondary;
@form-darken-accent-hover-background-color: lighten(@form-darken-accent-background-color, 20%);
@form-darken-accent-hover-border-color: lighten(@form-darken-accent-border-color, 20%);
@form-darken-accent-hover-background-color: lighten(@form-darken-accent-background-color, 20%);

@@ -153,6 +147,2 @@ // Darken hint

@form-lighten-control-color: @dark-primary;
@form-lighten-control-border-color: @dark-divider;
@form-lighten-control-background-color: @light-primary;

@@ -164,18 +154,20 @@ @form-lighten-control-background-image: none;

@form-lighten-control-border-color: @dark-divider;
@form-lighten-control-hover-background-color: @form-lighten-control-background-color;
@form-lighten-control-hover-border-color: darken(@form-lighten-control-border-color, 15%);
@form-lighten-control-hover-background-color: @form-lighten-control-background-color;
@form-lighten-control-focus-background-color: @form-lighten-control-hover-background-color;
@form-lighten-control-focus-border-color: @form-lighten-control-hover-border-color;
@form-lighten-control-focus-outline-color: @form-lighten-control-border-color;
@form-lighten-control-focus-border-color: @form-lighten-control-hover-border-color;
@form-lighten-control-focus-background-color: @form-lighten-control-hover-background-color;
@form-lighten-control-danger-background-color: @form-lighten-control-background-color;
@form-lighten-control-danger-border-color: lighten(@alert-danger, 25%);
@form-lighten-control-danger-background-color: @form-lighten-control-background-color;
@form-lighten-control-danger-hover-background-color: @form-lighten-control-danger-background-color;
@form-lighten-control-danger-hover-border-color: darken(@form-lighten-control-danger-border-color, 10%);
@form-lighten-control-danger-hover-background-color: @form-lighten-control-danger-background-color;
@form-lighten-control-danger-focus-background-color: @form-lighten-control-danger-hover-background-color;
@form-lighten-control-danger-focus-border-color: @form-lighten-control-danger-hover-border-color;
@form-lighten-control-danger-focus-outline-color: @form-lighten-control-danger-border-color;
@form-lighten-control-danger-focus-border-color: @form-lighten-control-danger-hover-border-color;
@form-lighten-control-danger-focus-background-color: @form-lighten-control-danger-hover-background-color;

@@ -186,4 +178,2 @@ // Lighten accent

@form-lighten-accent-border-color: @dark-secondary;
@form-lighten-accent-background-color: @form-lighten-accent-border-color;

@@ -195,4 +185,6 @@ @form-lighten-accent-background-image: none;

@form-lighten-accent-border-color: @dark-secondary;
@form-lighten-accent-hover-background-color: darken(@form-lighten-accent-background-color, 10%);
@form-lighten-accent-hover-border-color: darken(@form-lighten-accent-border-color, 10%);
@form-lighten-accent-hover-background-color: darken(@form-lighten-accent-background-color, 10%);

@@ -213,2 +205,17 @@ // Lighten hint

## Модификаторы
### `form`
* `form--darken`
* `form--lighten`
### `form__group`
* `form__group--columns`
### `form__control`
* `form__control--danger`
## Дополнительно

@@ -215,0 +222,0 @@

# Шапка
Шаблонный тип.
Шаблонный тип. [Пример](http://sedona.stage.constlab.ru/blocks/header/).

@@ -10,4 +10,2 @@ ## Особенности

* По-умолчанию имеет мобильный вид. Разворачивается, начиная с ширины `@header-breakpoints-desktop`
* Имеет встраиваемые дополнительные элементы и иконки (указаны в разметке)
* По-умолчанию имеет тон всего сайта. Может принудительно иметь светлый и темный тон

@@ -17,24 +15,16 @@ ## Настройка

```less
// Base
@header-height: (@line-height + @indent * 2);
@header-color: @base-primary;
@header-background: none;
@header-link-color: @link-primary;
@header-background-color: transparent;
@header-background-image: none;
@header-background-repeat: repeat;
@header-background-position: 0 0;
@header-background-size: auto auto;
@header-breakpoints: @grid-breakpoints-md;
@header-max-width: @grid-breakpoints-xl;
// Darken
@header-darken-color: @light-primary;
@header-darken-background: @dark-primary;
@header-darken-link-color: @header-link-color;
// Lighten
@header-lighten-color: @dark-primary;
@header-lighten-background: @light-primary;
@header-lighten-link-color: @header-link-color;
@header-gutter: @indent;
```

@@ -56,4 +46,4 @@

<li><a href="#">Вход</a></li>
<li class="header__icon header__icon--call"><a href="#">8 800 200-66-00</a></li>
<li class="header__icon header__icon--search"><a href="#">Поиск</a></li>
<li><a href="#">8 800 200-66-00</a></li>
<li><a href="#">Поиск</a></li>
<!-- / -->

@@ -91,4 +81,4 @@

<ul class="header__extra header__extra--hidden-mobile">
<li class="header__icon header__icon--call"><a href="#">8 800 200-66-00</a></li>
<li class="header__icon header__icon--search"><a href="#">Поиск</a></li>
<li><a href="#">8 800 200-66-00</a></li>
<li><a href="#">Поиск</a></li>
</ul>

@@ -103,7 +93,2 @@ <!-- / -->

### `header`
* `header--darken` — делает шапку в темных тонах
* `header--lighten` — делает шапку в светлых тонах
### `header__extra`

@@ -110,0 +95,0 @@

@@ -12,2 +12,11 @@ # Уведомление

```less
@notify-color: inherit;
@notify-link-color: @link-primary;
@notify-background-color: @base-divider;
@notify-background-image: none;
@notify-background-repeat: repeat;
@notify-background-position: 0 0;
@notify-background-size: auto auto;
@notify-border-width: 0;

@@ -17,6 +26,2 @@ @notify-border-color: transparent;

@notify-color: inherit;
@notify-background: @base-divider;
@notify-link-color: @link-primary;
@notify-max-width: 500px;

@@ -23,0 +28,0 @@ ```

@@ -14,6 +14,10 @@ # Диапазон

```less
// Base
@range-height: @form-control-height;
// Line
@range-line-height: 2px;
@range-line-border-radius: (@range-line-height / 2);
@range-line-background-color: @form-control-border-color;

@@ -25,2 +29,6 @@ @range-line-background-image: none;

@range-line-border-radius: (@range-line-height / 2);
// Bar
@range-bar-background-color: @form-accent-border-color;

@@ -32,7 +40,7 @@ @range-bar-background-image: none;

// Slider
@range-slider-width: @font-size;
@range-slider-height: @font-size;
@range-slider-border-width: 0;
@range-slider-border-color: transparent;
@range-slider-border-radius: 50%;
@range-slider-background-color: @range-bar-background-color;

@@ -44,5 +52,12 @@ @range-slider-background-image: none;

@range-hint-color: @form-hint-color;
@range-slider-border-width: 0;
@range-slider-border-color: transparent;
@range-slider-border-radius: 50%;
// Hint
@range-hint-font-size: @form-hint-font-size;
@range-hint-line-height: @form-hint-line-height;
@range-hint-color: @form-hint-color;
```

@@ -16,13 +16,29 @@ # Сцена

```less
// Base
@scene-background-color: transparent;
@scene-background-image: none;
@scene-background-repeat: repeat;
@scene-background-position: 0 0;
@scene-background-size: auto auto;
// Darken
@scene-darken-background-color: @dark-primary;
@scene-darken-background-image: none;
@scene-darken-background-repeat: repeat;
@scene-darken-background-position: 0 0;
@scene-darken-background-size: auto auto;
@scene-darken-color: @light-primary;
@scene-darken-background: @dark-primary;
@scene-darken-link-color: @link-primary;
// Lighten
@scene-lighten-background-color: @light-primary;
@scene-lighten-background-image: none;
@scene-lighten-background-repeat: repeat;
@scene-lighten-background-position: 0 0;
@scene-lighten-background-size: auto auto;
@scene-lighten-color: @dark-primary;
@scene-lighten-background: @light-primary;
@scene-lighten-link-color: @link-primary;
```

@@ -36,2 +52,4 @@

</section>
```

@@ -38,0 +56,0 @@

@@ -16,5 +16,6 @@ # Слайдер

```less
// Base
// Item
@slider-item-background-color: transparent;
@slider-item-background-image: none;
@slider-item-background-repeat: no-repeat;

@@ -24,13 +25,7 @@ @slider-item-background-position: 50%;

// Bullet
@slider-bullet-width: 7px;
@slider-bullet-height: 7px;
@slider-bullet-radius: 50%;
// Darken
@slider-item-darken-color: @light-primary;
// Lighten
@slider-item-lighten-color: @dark-primary;
```

@@ -37,0 +32,0 @@

@@ -15,33 +15,52 @@ # Социальные кнопки

@social-width: @line-height;
@social-height: @social-width;
@social-gutter: (@indent / 2);
@social-border-radius: 50%;
// Item
@social-item-width: @line-height;
@social-item-height: @social-item-width;
@social-item-color: @light-primary;
@social-item-background-color: transparent;
@social-item-background-image: none;
@social-item-background-repeat: repeat;
@social-item-background-position: 0 0;
@social-item-background-size: auto auto;
@social-item-border-radius: 50%;
@social-item-hover-color: @social-item-color;
@social-item-hover-background-color: @social-item-background-color;
// Icon
@social-icon-width: 18px;
@social-icon-height: @social-icon-width;
@social-color: @light-primary;
@social-background-color: transparent;
// Darken item
@social-hover-color: @social-color;
@social-hover-background-color: @social-background-color;
@social-darken-item-color: @light-primary;
// Darken
@social-darken-item-background-color: @dark-primary;
@social-darken-item-background-image: none;
@social-darken-item-background-repeat: repeat;
@social-darken-item-background-position: 0 0;
@social-darken-item-background-size: auto auto;
@social-darken-color: @light-primary;
@social-darken-background-color: @dark-primary;
@social-darken-item-hover-color: @social-darken-item-color;
@social-darken-item-hover-background-color: lighten(@social-darken-item-background-color, 10%);
@social-darken-hover-color: @social-darken-color;
@social-darken-hover-background-color: lighten(@social-darken-background-color, 10%);
// Lighten item
// Lighten
@social-lighten-item-color: @dark-primary;
@social-lighten-color: @dark-primary;
@social-lighten-background-color: @light-primary;
@social-lighten-item-background-color: @light-primary;
@social-lighten-item-background-image: none;
@social-lighten-item-background-repeat: repeat;
@social-lighten-item-background-position: 0 0;
@social-lighten-item-background-size: auto auto;
@social-lighten-hover-color: @social-lighten-color;
@social-lighten-hover-background-color: darken(@social-lighten-background-color, 20%);
@social-lighten-item-hover-color: @social-lighten-item-color;
@social-lighten-item-hover-background-color: darken(@social-lighten-item-background-color, 20%);
```

@@ -48,0 +67,0 @@

@@ -17,9 +17,12 @@ # Таблица

@table-divider: @base-divider;
// Head
@table-head-font-size: @font-size-smaller;
@table-head-line-height: @line-height-smaller;
@table-head-font-weight: normal;
@table-head-font-family: @font-family-primary;
@table-head-color: @base-secondary;
@table-divider: @base-divider;
// Tr

@@ -30,5 +33,9 @@ @table-tr-hover-background-color: @table-divider;

@table-darken-divider: @light-divider;
// Darken head
@table-darken-head-color: @light-secondary;
@table-darken-divider: @light-divider;
// Darken tr

@@ -39,5 +46,9 @@ @table-darken-tr-hover-background-color: @table-darken-divider;

@table-lighten-divider: @dark-divider;
// Lighten head
@table-lighten-head-color: @dark-secondary;
@table-lighten-divider: @dark-divider;
// Lighten tr

@@ -44,0 +55,0 @@ @table-lighten-tr-hover-background-color: @table-lighten-divider;

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc