[comment]: # translation:outdated

[comment]: # aside:4

[comment]: # ({3c100212-cd954d56})

# Ресурсы

Каталог *assets* может содержать любые файлы и подкаталоги, которые не принадлежат другим директориям. Вы можете использовать её для:

- JavaScript стилей (должны находиться внутри  *[assets/js](#assetsjs)*);
- CSS стилей (должны находиться внутри *[assets/css](#assetscss)*);
- Изображений;
- Шрифтов;
- Всего, что вам нужно добавить.

[comment]: # ({/3c100212-cd954d56})

[comment]: # ({2b4831f8-08585fb9})

### assets/js

Каталог *assets/js* зарезервирован и должен содержать только JavaScript-файлы. Чтобы использовать их в виджете, укажите эти файлы в *[manifest.json](/devel/modules/file_structure/manifest)*.

Например:

```json
"assets": {
    "js": ["class.widget.js"]
}
```

[comment]: # ({/2b4831f8-08585fb9})

[comment]: # ({1da3de82-18641225})

### assets/css

*assets/css* зарезервирован и должен содержать только файлы CSS стилей. Чтобы использовать их в виджете, укажите эти файлы в *[manifest.json](/devel/modules/file_structure/manifest)*.

Пример:

```json
"assets": {
    "css": ["mywidget.css"]
}
```

[comment]: # ({/1da3de82-18641225})

[comment]: # ({fcb10dd9-aedbe0c5})

##### CSS стили

Файлы CSS могут содержать настраиваемый атрибут «тема», определяющий другой стиль для определенных тем внешнего интерфейса.

Доступные темы и значения их атрибутов:

- **Синий** - [theme='blue-theme']
- **Темный** - [theme='dark-theme']
- **Высококонтрастный свет** - [theme='hc-light']
- **Высококонтрастный темный** - [theme='hc-dark']

Пример:

``` css
.widget {
    background-color: red;
}
 
[theme='dark-theme'] .widget {
    background-color: green;
}
```

[comment]: # ({/fcb10dd9-aedbe0c5})