Skip to content

E
etersoft.com
Commit 3711ecf7 authored by Davyd Dobryakov's avatar Davyd Dobryakov
Browse files
Options

Initial commit

parents
Expand all Show whitespace changes
Inline Side-by-side
Showing with 979 additions and 0 deletions
.babelrc 0 → 100644
View file @ 3711ecf7
{
"presets": [
"@babel/preset-env"
]
}
.gitignore 0 → 100644
View file @ 3711ecf7
_Store
node_modules/
/dist/
npm-debug.log*
yarn-debug.log*
yarn-error.log*
# Editor directories and files
.idea
.vscode
*.suo
*.ntvs*
*.njsproj
*.sln
.index.html.swp 0 → 100644
View file @ 3711ecf7
File added
de/index.html 0 → 100644
View file @ 3711ecf7
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<title>Eterlanding</title>
<link rel="stylesheet" href="../dist/app.css">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
</head>
<body>
<header>
<nav>
<div class="logo">
<a href="./">
<img src="../src/images/logo.png" alt="">
</a>
</div>
<ul class="menu-right">
<li><a href="#about">Über uns</a></li>
<li><a href="#products">Produkt</a></li>
<li><a href="#services">Dienstleistungen</a></li>
<li><a href="#contact-us">Kontaktieren Sie uns</a></li>
<select id="changeLanguage" name="change-language">
<option value="ru"><img src="../src/image/ru.png" alt=""> Ru</option>
<option value="en"><img src="../src/image/uk.png" alt=""> En</option>
<option value="de"><img src="../src/image/de.png" alt=""> De</option>
</select>
<div class="menu-button" id="menuButton">
<span class="burger-icon"></span>
</div>
</ul>
</nav>
</header>
<menu id="menu">
<a href="#about"><span>Über uns</span></a>
<a href="#products"><span>Produkt</span></a>
<a href="#services"><span>Dienstleistungen</span></a>
<a href="#contact-us"><span>Kontaktieren Sie uns</span></a>
</menu>
<div class="hello-banner">
<div class="hello-banner__gradient"></div>
<div class="hello-banner__img"></div>
<div class="hello-banner__text">
<h1>
Разработка программных решений на базе Linux и свободных программ для бизнеса, государственных организаций и частных пользователей.
</h1>
<p class="pt-2">Делаём всё.</p>
<p>Лучше всех.</p>
</div>
</div>
<section id="about">
<div class="left-column">
<h1>Über uns</h1>
<div class="description">
<p>
Компания Etersoft занимается разработкой программных решений на базе Linux и свободных программ для бизнеса, государственных организаций и частных пользователей. Компания была основана в 2003 году. С того времени мы приобрели большой опыт в разработке кроссплатформенных решений. Сегодня они используются в самых разных организациях: от небольших магазинов до крупных производственных предприятий, от школ и детских садов до Мариинского театра. Наши продукты внедряются партнёрами по всей России и в странах СНГ.
</p>
<br/>
<p>
<strong>Миссия Etersoft</strong> - популяризация свободного ПО в любых областях, где применяется компьютерная техника. Продукты Etersoft призваны устранить препятствия и сложности, которые могут возникнуть при переходе на СПО, чтобы как можно больше организаций уже сегодня смогли успешно работать с Linux и свободными программами. Мы помогаем людям использовать преимущества свободного ПО для решения их задач, грамотно комбинировать свободные и проприетарные продукты, экономить значительные средства на покупке лицензий. Мы благодарны нашим клиентам и партнёрам за ценные предложения и замечания. Ведь именно для них мы работаем и стремимся учитывать пожелания пользователей при разработке продуктов Etersoft.
</p>
</div>
</div>
<div class="right-column">
<div class="banner">
<img src="../src/images/about.png" alt="">
</div>
</div>
</section>
<section id="products">
<div class="right-column">
<div class="banner">
<img src="../src/images/about.png" alt="">
</div>
</div>
<div class="left-column">
<h1>Produkt:</h1>
<div class="description">
<ol class="default-list">
<li>WINE@Etersoft – программное решение, позволяющее работать с Windows-приложениями (1С:Предприятие, Консультант, Гарант, КОМПАС-3D и др.) на операционных системах семейства GNU/Linux</li>
<li>SELTA@Etersoft – транслятор SQL-запросов, помогает использовать свободную СУБД PostgreSQL в программах, ориентированных на коммерческую MS SQL</li>
<li>Postgre@Etersoft– версия PostgreSQL, которая содержит все необходимые настройки для надёжной и высокопроизводительной работы 1С: Предприятие со свободной СУБД</li>
<li>RX@Etersoft – терминальный сервер, поможет организовать режим работы, при котором приложения выполняются на сервере, а на рабочие станции передаётся только изображение</li>
<li>UniOffice@Etersoft – транслятор COM-объектов MS Office, позволяет работать с OpenOffice в приложениях, использующих выгрузку в MS Office</li>
<li>LINUX@Etersoft — дистрибутив Linux, основанный на ALTLinux и включающий в себя продукты компании</li>
</ol>
</div>
</div>
</section>
<section id="services">
<div class="left-column">
<h1>Dienstleistungen</h1>
<div class="description">
<ol class="default-list">
<li>Внедрение: работы по установке и настройке, обеспечивающие надёжную работу серверов и рабочих мест</li>
<li>Доработка ПО: включение вашего приложения в поддержку WINE@Etersoft, SELTA@Etersoft и UniOffice@Etersoft</li>
<li>Разработка различного ПО под заказ</li>
<li>Разработка сайтов</li>
<li>Разработка автоматизированных систем управления промышленными объектами</li>
<li>Техническая поддержка</li>
</ol>
</div>
</div>
<div class="right-column">
<div class="banner">
<img src="../src/images/about.png" alt="">
</div>
</div>
</section>
<section id="contact-us">
<div class="right-column">
<div class="banner">
<img src="../src/images/about.png" alt="">
</div>
</div>
<div class="left-column">
<h1>Kontaktieren Sie uns</h1>
<div class="description">
<p><strong>Adresse:</strong> г. Санкт-Петербург, наб. Обводного канала, 24а, офис 12 </p>
<p><strong>Büro-öffnungszeiten:</strong> 11:00-18:00</p>
<p><strong>Telefon Sekretärin:</strong> <a href="tel:+78126486178">+7(812)648-61-78</a></p>
<p><strong>E-mail:</strong></p>
<ul class="btn-menu">
<li><a class="btn btn-default" href="mailto:info@etersoft.ru">Общие вопросы</a></li>
<li><a href="mailto:suppot@etersoft.ru" class="btn btn-default">Служба поддержки</a></li>
<li><a href="mailto:sales@etersoft.ru" class="btn btn-default">Отдел продаж</a></li>
<li><a href="maito:job@etersoft.ru" class="btn btn-default">Отдел кадров</a></li>
<li><a href="mailto:junkado@etersoft.ru" class="btn btn-danger">Сюда не пишите!</a></li>
<li><a href="mailto:security@etersoft.ru" class="btn btn-default">Служба безопасности</a></li>
</ul>
</div>
</div>
</section>
<footer>
ООО «Этерсофт»
<br/>
Россия, Санкт-Петербург
<br/>
+7 (812) 648-61-78
</footer>
<script type="text/javascript" src="../dist/app.js"></script>
</body>
</html>
en/index.html 0 → 100644
View file @ 3711ecf7
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Eterlanding</title>
<link rel="stylesheet" href="../dist/app.css">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
</head>
<body>
<header>
<nav>
<div class="logo">
<a href="./">
<img src="../src/images/logo.png" alt="">
</a>
</div>
<ul class="menu-right">
<li><a href="#about">About us</a></li>
<li><a href="#products">Products</a></li>
<li><a href="#services">Services</a></li>
<li><a href="#contact-us">Contact us</a></li>
<select id="changeLanguage" name="change-language">
<option value="ru"><img src="../src/image/ru.png" alt=""> Ru</option>
<option value="en"><img src="../src/image/uk.png" alt=""> En</option>
<option value="de"><img src="../src/image/de.png" alt=""> De</option>
</select>
<div class="menu-button" id="menuButton">
<span class="burger-icon"></span>
</div>
</ul>
</nav>
</header>
<menu id="menu">
<a href="#about"><span>About us</span></a>
<a href="#products"><span>Products</span></a>
<a href="#services"><span>Services</span></a>
<a href="#contact-us"><span>Contact us</span></a>
</menu>
<div class="hello-banner">
<div class="hello-banner__gradient"></div>
<div class="hello-banner__img"></div>
<div class="hello-banner__text">
<h1>
Разработка программных решений на базе Linux и свободных программ для бизнеса, государственных организаций и частных пользователей.
</h1>
<p class="pt-2">Делаём всё.</p>
<p>Лучше всех.</p>
</div>
</div>
<section id="about">
<div class="left-column">
<h1>About us</h1>
<div class="description">
<p>
Компания Etersoft занимается разработкой программных решений на базе Linux и свободных программ для бизнеса, государственных организаций и частных пользователей. Компания была основана в 2003 году. С того времени мы приобрели большой опыт в разработке кроссплатформенных решений. Сегодня они используются в самых разных организациях: от небольших магазинов до крупных производственных предприятий, от школ и детских садов до Мариинского театра. Наши продукты внедряются партнёрами по всей России и в странах СНГ.
</p>
<br/>
<p>
<strong>Миссия Etersoft</strong> - популяризация свободного ПО в любых областях, где применяется компьютерная техника. Продукты Etersoft призваны устранить препятствия и сложности, которые могут возникнуть при переходе на СПО, чтобы как можно больше организаций уже сегодня смогли успешно работать с Linux и свободными программами. Мы помогаем людям использовать преимущества свободного ПО для решения их задач, грамотно комбинировать свободные и проприетарные продукты, экономить значительные средства на покупке лицензий. Мы благодарны нашим клиентам и партнёрам за ценные предложения и замечания. Ведь именно для них мы работаем и стремимся учитывать пожелания пользователей при разработке продуктов Etersoft.
</p>
</div>
</div>
<div class="right-column">
<div class="banner">
<img src="../src/images/about.png" alt="">
</div>
</div>
</section>
<section id="products">
<div class="right-column">
<div class="banner">
<img src="../src/images/about.png" alt="">
</div>
</div>
<div class="left-column">
<h1>Products@Etersoft:</h1>
<div class="description">
<ol class="default-list">
<li>WINE@Etersoft – программное решение, позволяющее работать с Windows-приложениями (1С:Предприятие, Консультант, Гарант, КОМПАС-3D и др.) на операционных системах семейства GNU/Linux</li>
<li>SELTA@Etersoft – транслятор SQL-запросов, помогает использовать свободную СУБД PostgreSQL в программах, ориентированных на коммерческую MS SQL</li>
<li>Postgre@Etersoft– версия PostgreSQL, которая содержит все необходимые настройки для надёжной и высокопроизводительной работы 1С: Предприятие со свободной СУБД</li>
<li>RX@Etersoft – терминальный сервер, поможет организовать режим работы, при котором приложения выполняются на сервере, а на рабочие станции передаётся только изображение</li>
<li>UniOffice@Etersoft – транслятор COM-объектов MS Office, позволяет работать с OpenOffice в приложениях, использующих выгрузку в MS Office</li>
<li>LINUX@Etersoft — дистрибутив Linux, основанный на ALTLinux и включающий в себя продукты компании</li>
</ol>
</div>
</div>
</section>
<section id="services">
<div class="left-column">
<h1>Services:</h1>
<div class="description">
<ol class="default-list">
<li>Внедрение: работы по установке и настройке, обеспечивающие надёжную работу серверов и рабочих мест</li>
<li>Доработка ПО: включение вашего приложения в поддержку WINE@Etersoft, SELTA@Etersoft и UniOffice@Etersoft</li>
<li>Разработка различного ПО под заказ</li>
<li>Разработка сайтов</li>
<li>Разработка автоматизированных систем управления промышленными объектами</li>
<li>Техническая поддержка</li>
</ol>
</div>
</div>
<div class="right-column">
<div class="banner">
<img src="../src/images/about.png" alt="">
</div>
</div>
</section>
<section id="contact-us">
<div class="right-column">
<div class="banner">
<img src="../src/images/about.png" alt="">
</div>
</div>
<div class="left-column">
<h1>Contact us</h1>
<div class="description">
<p><strong>Address:</strong> г. Санкт-Петербург, наб. Обводного канала, 24а, офис 12 </p>
<p><strong>Office hours:</strong> 11:00-18:00</p>
<p><strong>Secretary's phone number:</strong> <a href="tel:+78126486178">+7(812)648-61-78</a></p>
<p><strong>E-mail:</strong></p>
<ul class="btn-menu">
<li><a class="btn btn-default" href="mailto:info@etersoft.ru">Общие вопросы</a></li>
<li><a href="mailto:suppot@etersoft.ru" class="btn btn-default">Служба поддержки</a></li>
<li><a href="mailto:sales@etersoft.ru" class="btn btn-default">Отдел продаж</a></li>
<li><a href="maito:job@etersoft.ru" class="btn btn-default">Отдел кадров</a></li>
<li><a href="mailto:junkado@etersoft.ru" class="btn btn-danger">Сюда не пишите!</a></li>
<li><a href="mailto:security@etersoft.ru" class="btn btn-default">Служба безопасности</a></li>
</ul>
</div>
</div>
</section>
<footer>
ООО «Этерсофт»
<br/>
Россия, Санкт-Петербург
<br/>
+7 (812) 648-61-78
</footer>
<script type="text/javascript" src="../dist/app.js"></script>
</body>
</html>
index.html 0 → 100644
View file @ 3711ecf7
This diff is collapsed. Click to expand it.
package-lock.json 0 → 100644
View file @ 3711ecf7
This source diff could not be displayed because it is too large. You can view the blob instead.
package.json 0 → 100644
View file @ 3711ecf7
{
"name": "eterlanding",
"version": "1.0.0",
"description": "Test landing for Etersoft",
"main": "index.js",
"scripts": {
"dev": "webpack-dev-server --open --host 91.232.225.11 --port 17001 --mode development",
"build": "webpack --mode production"
},
"browserslist": [
"> 1%",
"last 3 version"
],
"author": "kantegory",
"license": "ISC",
"devDependencies": {
"@babel/core": "^7.8.4",
"@babel/preset-env": "^7.8.4",
"autoprefixer": "^9.7.4",
"babel-loader": "^8.0.6",
"css-loader": "^3.4.2",
"css-mqpacker": "^7.0.0",
"cssnano": "^4.1.10",
"file-loader": "^5.0.2",
"mini-css-extract-plugin": "^0.9.0",
"node-sass": "^4.13.1",
"path": "^0.12.7",
"postcss-loader": "^3.0.0",
"sass-loader": "^8.0.2",
"style-loader": "^1.1.3",
"webpack": "^4.41.5",
"webpack-cli": "^3.3.10",
"webpack-dev-server": "^3.10.2"
}
}
src/css/main.css 0 → 100644
View file @ 3711ecf7
.wrapper {
display: flex;
}
src/css/main.css~ 0 → 100644
View file @ 3711ecf7
.wrapper {
display: flex;
}
src/index.js 0 → 100644
View file @ 3711ecf7
import './js/common'
import './css/main.css'
import './scss/main.scss'
src/js/common.js 0 → 100644
View file @ 3711ecf7
let menuButton = document.getElementById('menuButton');
let menu = document.getElementById('menu');
let menuItems = Array.from(menu.querySelectorAll('a'));
menuButton.addEventListener('click', function (e) {
menuButton.classList.toggle('is-active');
menu.classList.toggle('visually-visible');
e.preventDefault();
});
menuItems.map((item) => item.addEventListener('click', function (e) {
menuButton.classList.toggle('is-active');
menu.classList.toggle('visually-visible');
}));
menuItems.map((item) => item.addEventListener('touch', function (e) {
menuButton.classList.toggle('is-active');
menu.classList.toggle('visually-visible');
}));
let changeLanguage = document.getElementById('changeLanguage');
let pageLanguage = document.querySelector('html').lang;
let userLanguage = navigator.language.slice(0, 2);
let currentLanguage = localStorage.language === undefined ? userLanguage : localStorage.language;
if (changeLanguage.value !== currentLanguage) {
let languageOptions = changeLanguage.getElementsByTagName('option');
for (let i = 0; i < languageOptions.length; i++) {
if (languageOptions[i].value === currentLanguage) {
languageOptions[i].selected = true;
}
}
}
changeLanguage.addEventListener('change', function(e) {
e.preventDefault();
let languageValue = changeLanguage.value;
let languagePath = getLanguagePath(languageValue);
localStorage.setItem('language', languageValue);
currentLanguage = localStorage.language;
window.location = languagePath;
});
function getLanguagePath(languageValue) {
let languagePath = languageValue === 'ru' ? '../' : '../' + languageValue;
if (pageLanguage === 'ru') {
languagePath = './' + languageValue;
}
return languagePath;
};
window.addEventListener('load', function() {
console.log('page lang', pageLanguage, 'current lang', currentLanguage);
if (pageLanguage !== currentLanguage) {
let languagePath = getLanguagePath(currentLanguage);
window.location = languagePath;
};
});
let scrollment = document.getElementById('scrollment');
let lastScroll = 0;
let header = document.getElementsByTagName('header')[0];
function scroll(pageY) {
if (pageY > lastScroll) {
header.classList.remove('top-0');
} else {
header.classList.add('top-0');
}
lastScroll = pageY;
}
window.addEventListener('scroll', function(event) {
scroll(window.scrollY);
});
var multiItemSlider = (function() {
return function(selector, config) {
var _mainElement = document.querySelector(selector), // основный элемент блока
_sliderWrapper = _mainElement.querySelector(".slider__wrapper"), // обертка для .slider-item
_sliderItems = _mainElement.querySelectorAll(".slider__item"), // элементы (.slider-item)
_sliderControls = _mainElement.querySelectorAll(".slider__control"), // элементы управления
_sliderControlLeft = _mainElement.querySelector(".slider__control_left"), // кнопка "LEFT"
_sliderControlRight = _mainElement.querySelector(
".slider__control_right"
), // кнопка "RIGHT"
_wrapperWidth = parseFloat(getComputedStyle(_sliderWrapper).width), // ширина обёртки
_itemWidth = parseFloat(getComputedStyle(_sliderItems[0]).width), // ширина одного элемента
_positionLeftItem = 0, // позиция левого активного элемента
_transform = 0, // значение транфсофрмации .slider_wrapper
_step = (_itemWidth / _wrapperWidth) * 100, // величина шага (для трансформации)
_items = [], // массив элементов
_interval = 0,
_config = {
isCycling: false, // автоматическая смена слайдов
direction: "right", // направление смены слайдов
interval: 5000, // интервал между автоматической сменой слайдов
pause: true // устанавливать ли паузу при поднесении курсора к слайдеру
};
for (var key in config) {
if (key in _config) {
_config[key] = config[key];
}
}
// наполнение массива _items
_sliderItems.forEach(function(item, index) {
_items.push({ item: item, position: index, transform: 0 });
});
var position = {
getItemMin: function() {
var indexItem = 0;
_items.forEach(function(item, index) {
if (item.position < _items[indexItem].position) {
indexItem = index;
}
});
return indexItem;
},
getItemMax: function() {
var indexItem = 0;
_items.forEach(function(item, index) {
if (item.position > _items[indexItem].position) {
indexItem = index;
}
});
return indexItem;
},
getMin: function() {
return _items[position.getItemMin()].position;
},
getMax: function() {
return _items[position.getItemMax()].position;
}
};
var _transformItem = function(direction) {
var nextItem;
if (direction === "right") {
_positionLeftItem++;
if (
_positionLeftItem + _wrapperWidth / _itemWidth - 1 >
position.getMax()
) {
nextItem = position.getItemMin();
_items[nextItem].position = position.getMax() + 1;
_items[nextItem].transform += _items.length * 100;
_items[nextItem].item.style.transform =
"translateX(" + _items[nextItem].transform + "%)";
}
_transform -= _step;
}
if (direction === "left") {
_positionLeftItem--;
if (_positionLeftItem < position.getMin()) {
nextItem = position.getItemMax();
_items[nextItem].position = position.getMin() - 1;
_items[nextItem].transform -= _items.length * 100;
_items[nextItem].item.style.transform =
"translateX(" + _items[nextItem].transform + "%)";
}
_transform += _step;
}
_sliderWrapper.style.transform = "translateX(" + _transform + "%)";
};
var _cycle = function(direction) {
if (!_config.isCycling) {
return;
}
_interval = setInterval(function() {
_transformItem(direction);
}, _config.interval);
};
function handleKeyboard(e) {
let key = e.key;
console.log(key);
if (key === "ArrowRight") {
_transformItem("right");
} else if (key === "ArrowLeft") {
_transformItem("left");
} else if (key === " ") {
e.preventDefault();
pauseSlider();
}
}
function pauseSlider() {
_mainElement.classList.toggle("start");
if (_mainElement.classList.contains("start")) {
clearInterval(_interval);
} else {
_cycle(_config.direction);
}
}
// обработчик события click для кнопок "назад" и "вперед"
var _controlClick = function(e) {
if (e.target.classList.contains("slider__control")) {
e.preventDefault();
var direction = e.target.classList.contains("slider__control_right")
? "right"
: "left";
_transformItem(direction);
clearInterval(_interval);
_cycle(_config.direction);
}
};
var _setUpListeners = function() {
// добавление к кнопкам "назад" и "вперед" обрботчика _controlClick для событя click
_mainElement.onkeydown = handleKeyboard;
_sliderControls.forEach(function(item) {
item.addEventListener("click", _controlClick);
});
if (_config.pause && _config.isCycling) {
_mainElement.addEventListener("mouseenter", function() {
clearInterval(_interval);
});
_mainElement.addEventListener("mouseleave", function() {
clearInterval(_interval);
_cycle(_config.direction);
});
}
};
// инициализация
_setUpListeners();
_cycle(_config.direction);
return {
right: function() {
// метод right
_transformItem("right");
},
left: function() {
// метод left
_transformItem("left");
},
stop: function() {
// метод stop
_config.isCycling = false;
clearInterval(_interval);
},
cycle: function() {
// метод cycle
_config.isCycling = true;
clearInterval(_interval);
_cycle();
}
};
};
})();
var slider = multiItemSlider(".slider", {
isCycling: true
});
\ No newline at end of file
src/js/postcss.config.js 0 → 100644
View file @ 3711ecf7
module.exports = {
plugins: [
require('autoprefixer'),
require('css-mqpacker'),
require('cssnano')({
preset: [
'default', {
discardComments: {
removeAll: true
}
}
]
})
]
}
src/scss/utils/mixins.scss 0 → 100644
View file @ 3711ecf7
@function rem($pixels, $context: $mainFontSize) {
@if (unitless($pixels)) {
$pixels: $pixels * 1px;
}
@if (unitless($context)) {
$context: $context * 1px;
}
@return $pixels / $context * 1rem;
}
@mixin size($width, $height: $width) {
width: $width;
height: $height;
}
@mixin placeholder {
::-webkit-input-placeholder {@content}
:-moz-placeholder {@content}
::-moz-placeholder {@content}
:-ms-input-placeholder {@content}
}
// Burger parts
//
// (---) top -> &:before
// [---] middle -> &
// (---) bottom -> &:after
// Vendor prefixes
$sass-burger-add-vendor-prefixes: true !default;
// Burger
@mixin burger($width: 30px, $height: 5px, $gutter: 3px, $color: #000, $border-radius: 0, $transition-duration: .3s) {
$burger-height: $height !global;
$burger-gutter: $gutter !global;
position: relative;
margin-top: $height + $gutter;
margin-bottom: $height + $gutter;
@if $sass-burger-add-vendor-prefixes {
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
}
user-select: none;
&, &:before, &:after {
display: block;
width: $width;
height: $height;
background-color: $color;
@if $border-radius != 0 {
border-radius: $border-radius;
}
@if $sass-burger-add-vendor-prefixes {
-webkit-transition-property: background-color, -webkit-transform;
-moz-transition-property: background-color, -moz-transform;
-o-transition-property: background-color, -o-transform;
}
transition-property: background-color, transform;
@if $sass-burger-add-vendor-prefixes {
-webkit-transition-duration: $transition-duration;
-moz-transition-duration: $transition-duration;
-o-transition-duration: $transition-duration;
}
transition-duration: $transition-duration;
}
&:before, &:after {
position: absolute;
content: "";
}
&:before {
top: -($height + $gutter);
}
&:after {
top: $height + $gutter;
}
}
// Select parts of the burger
@mixin burger-parts {
&, &:before, &:after {
@content;
}
}
@mixin burger-top {
&:before {
@content;
}
}
@mixin burger-middle {
& {
@content;
}
}
@mixin burger-bottom {
&:after {
@content;
}
}
// Burger animations
@mixin burger-to-cross {
& {
background-color: transparent;
}
&:before {
@if $sass-burger-add-vendor-prefixes {
-webkit-transform: translateY($burger-gutter + $burger-height) rotate(45deg);
-moz-transform: translateY($burger-gutter + $burger-height) rotate(45deg);
-ms-transform: translateY($burger-gutter + $burger-height) rotate(45deg);
-o-transform: translateY($burger-gutter + $burger-height) rotate(45deg);
}
transform: translateY($burger-gutter + $burger-height) rotate(45deg);
}
&:after {
@if $sass-burger-add-vendor-prefixes {
-webkit-transform: translateY(-($burger-gutter + $burger-height)) rotate(-45deg);
-moz-transform: translateY(-($burger-gutter + $burger-height)) rotate(-45deg);
-ms-transform: translateY(-($burger-gutter + $burger-height)) rotate(-45deg);
-o-transform: translateY(-($burger-gutter + $burger-height)) rotate(-45deg);
}
transform: translateY(-($burger-gutter + $burger-height)) rotate(-45deg);
}
}
\ No newline at end of file
src/scss/utils/reset.scss 0 → 100644
View file @ 3711ecf7
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
font-size: 100%;
vertical-align: baseline;
}
// Links
a {
text-decoration: none;
&:active, &:hover {
outline: 0;
}
}
// List
ul, li {
list-style-type: none;
margin: 0;
padding: 0;
}
// Headlines
h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: normal; }
// Default
html { box-sizing: border-box; }
*, *:before, *:after { box-sizing: border-box; }
:focus { outline: 0; }
img, audio, video { max-width: 100%; height: auto; }
audio, canvas, iframe, video, img, svg { vertical-align: middle; }
iframe { border: 0 }
// From
textarea {
resize: none; /*remove the resize handle on the bottom right*/
overflow: auto;
vertical-align: top;
box-shadow: none;
-webkit-box-shadow: none;
-moz-box-shadow: none;
}
input, textarea, select, button { outline: none; border: none; font-size: 100%; margin: 0;}
button, input { line-height: normal; }
// Table
table { border-collapse: collapse; border-spacing: 0; }
td, th { padding: 0; text-align: left; }
\ No newline at end of file
src/scss/utils/vars.scss 0 → 100644
View file @ 3711ecf7
// Font
$mainFont : 'Montserrat', Helvetica, Arial, sans-serif;
// Size
$mainFontColor : #101010;
$mainFontSize : 18px;
$mainFontWeight : 400;
$mainLineHeight : 1.4;
$lgDesktopWidth : 1537px;
$desktopWidth : 1281px;
$smDesktopWidth : 1025px;
$tableWidth : 769px;
$smTableWidth : 641px;
$phoneWidth : 481px;
$smPhoneWidth : 321px;
$desktopWidthNumber : 1280;
$smDesktopWidthNumber : 1024;
$tableWidthNumber : 768;
$smTableWidthNumber : 640;
$phoneWidthNumber : 480;
$smPhoneWidthNumber : 320;
// Main color
$default-color : #ffffff;
$primary-color : #444ce0;
$success-color : #26de81;
$danger-color : #fc5c65;
$warning-color : #fed330;
$light-color : #999999;
$purple-color : #8854d0;
// Neutral Color
$neutral-primary : #303133;
$neutral-regular : #606266;
$neutral-secondary : #909399;
$neutral-placeholder : #C0C4CC;
// Border Color
$border-base : #DCDFE6;
$border-light : #E4E7ED;
$border-lighter : #EBEEF5;
$border-lightex : #F2F6FC;
webpack.config.js 0 → 100644
View file @ 3711ecf7
const path = require('path')
const MiniCssExtractPlugin = require('mini-css-extract-plugin')
module.exports = {
entry: {
app: './src/index.js'
},
output: {
filename: '[name].js',
path: path.resolve(__dirname, './dist'),
publicPath: 'dist'
},
module: {
rules: [
{
test: /\.js$/,
loader: 'babel-loader',
exclude: '/node_modules/'
},
{
test: /\.(png|jpe?g|gif)$/i,
use: [
{
loader: 'file-loader',
options: {
publicPath: '.',
name: '/images/[name].[ext]'
}
}
]
},
{
test: /\.scss$/,
use: [
'style-loader',
MiniCssExtractPlugin.loader,
{
loader: 'css-loader',
options: {
sourceMap: true
}
},
{
loader: 'postcss-loader',
options: {
sourceMap: true,
config: {
path: 'src/js/postcss.config.js'
}
}
},
{
loader: 'sass-loader',
options: {
sourceMap: true
}
}
]
},
{
test: /\.css$/,
use: [
'style-loader',
MiniCssExtractPlugin.loader,
{
loader: 'css-loader',
options: {
sourceMap: true
}
},
{
loader: 'postcss-loader',
options: {
sourceMap: true,
config: {
path: 'src/js/postcss.config.js'
}
}
}
]
}
]
},
devServer: {
overlay: true,
port: 17001,
allowedHosts: ['kantegory.sandbox.eterhost.ru']
},
plugins: [
new MiniCssExtractPlugin({
filename: '[name].css'
})
]
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment