form-select

TODO

 ☐ Добавить сексуальную стилизацию страницы библиотеки компонентов
 ☐ Сделать: таблицы — адаптивные таблицы — добавлять дата-атрибуты JS-ом
-☐ Сделать: Селект с идентичными везде уголками и одинаковой высотой на win и osx
 ☐ Сделать: Кнопки: группа, в т.ч. с выпадающими элементами
 ☐ Сделать: Флажки и радиокнопки, выглядящеи как обычные кнопки
 ☐ Сделать: Кнопка с иконкой
@@ -42,3 +41,4 @@
 ✔ Добавить задачу публикации build/ в ветку gh-pages @done (29.02.2016 16:43)
 ✔ Вынести SVG-спрайты в отдельный компонент @done (05.03.2016 00:19)
 ✔ Сделать: Флажок-свитчер, радиокнопку-свитчер @done (16-03-05 12:44)
+✔ Сделать: Селект с идентичными везде уголками и одинаковой высотой на win и osx @done (05.03.2016 20:18)

gulpfile.js

@@ -105,7 +105,7 @@ gulp.task('img', function () {
     .pipe(gulp.dest(dirs.build + '/img'));
 });
 
-// Оптимизация изображений
+// Оптимизация изображений // folder=src/blocks/block-name/img_to_bg/ npm start img:opt
 const folder = process.env.folder;
 gulp.task('img:opt', function (callback) {
   if(folder){

src/blocks/field-select/field-select.less

@@ -19,7 +19,11 @@
     appearance: none;
     background-image: data-uri('image/svg+xml;charset=UTF-8', './src/blocks/field-select/img_to_bg/select-down.svg');
     background-repeat: no-repeat;
-    background-position: 100% 50%;
+    background-position: right 0.3em center;
+
+    &::-ms-expand {
+        display: none;
+    }
   }
 
   &__help-text {

src/blocks/field-select/img_to_bg/select-down.svg

-<svg xmlns="http://www.w3.org/2000/svg" viewBox="-292 388 26 17"><path d="M-266.4 392.5l-11.9 12.2c-.2.2-.4.3-.7.3s-.5-.1-.7-.3l-11.9-12.2c-.2-.2-.3-.4-.3-.7 0-.3.1-.5.3-.7l2.7-2.7c.2-.2.4-.3.7-.3s.5.1.7.3l8.5 8.7 8.5-8.7c.2-.2.4-.3.7-.3s.5.1.7.3l2.7 2.7c.2.2.3.4.3.7.1.3 0 .5-.3.7z"/></svg>
\ No newline at end of file
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 17 11" width="17" height="11"><path d="M.202 1.97L1.956.204A.61.61 0 0 1 2.43 0a.61.61 0 0 1 .47.204L8.5 5.84 14.1.204A.61.61 0 0 1 14.57 0a.61.61 0 0 1 .474.204l1.754 1.766a.618.618 0 0 1 .202.473.62.62 0 0 1-.202.476l-7.826 7.875A.61.61 0 0 1 8.5 11a.61.61 0 0 1-.472-.204L.202 2.92A.618.618 0 0 1 0 2.444c0-.203.067-.34.202-.475z"/></svg>

src/blocks/field-select/img_to_bg/select-up.svg

-<svg id="Layer_1" xmlns="http://www.w3.org/2000/svg" viewBox="-289.6 390.5 25.2 16.2"><style>.st0{fill:#444}</style><path class="st0" d="M-264.7 403.8l-2.6 2.6c-.2.2-.4.3-.7.3s-.5-.1-.7-.3l-8.3-8.3-8.3 8.3c-.2.2-.4.3-.7.3s-.5-.1-.7-.3l-2.6-2.6c-.2-.2-.3-.4-.3-.7s.1-.5.3-.7l11.6-11.6c.2-.2.4-.3.7-.3s.5.1.7.3l11.6 11.6c.2.2.3.4.3.7s-.1.5-.3.7z"/></svg>
\ No newline at end of file