Javascript-форум (https://javascript.ru/forum/)
-   Оффтопик (https://javascript.ru/forum/offtopic/)
-   -   Тема посвященная stylus (https://javascript.ru/forum/offtopic/44145-tema-posvyashhennaya-stylus.html)

kobezzza 08.01.2014 22:16

http://learnboost.github.io/stylus/try.html
Смотришь как сделано здесь

cyber 08.01.2014 22:25

kobezzza, я не могу у них в репозитории найти stylus.min.js, хочу найти не сжатый файл

Maxmaxmaximus7 08.01.2014 22:26

>> Vendor prefixing it is task for another tool (use autoprefixer for example).

я >> No, not true, stylus, too, need to do this. And do not just ignore this matter, cuz it is difficult to make feature that I asked..... ALL preprocessors is both autoprefixers


ВОТ ЧО ОН МОРОЗИТСЯ А!!! Мне еще и это говно форкать надо будет и переделывать? Мало мне ангуляра???

cyber 08.01.2014 22:34

Цитата:

Сообщение от Maxmaxmaximus7
говно форкать надо будет и переделывать

форкни его полностью))
Есть модуль для префиксов.

Maxmaxmaximus7 08.01.2014 22:38

Тут другое, тут именно синтаксис, наддо иметь доступ к селектору из которого вызванна функция.

kobezzza 08.01.2014 22:40

Используй
http://www.myth.io/

PS: вместо тысячи слов, которые ты там написал достаточно было сказать: нужна возможно перегрузки селекторов, для написания полифилов, также как это уже сделано с миксинами.

cyber 08.01.2014 22:47

Цитата:

Сообщение от cyber
я не могу у них в репозитории найти stylus.min.js, хочу найти не сжатый файл

не ужели ни кто не знает что где можно его скачать?
ладно фиг с ним пошел искать другой препроцессор.

monolithed 08.01.2014 22:50

Цитата:

Сообщение от Maxmaxmaximus7
Мне еще и это говно форкать надо будет и переделывать?

Префиксы это задачи отдельного инструмента типа nib

Ну или юзать Styl

Можно и самому за час накидал эти миксины:
// -*- coding: utf-8 indent-tabs-mode: nil tab-width: 4 c-basic-offset: 4 -*-

// ::selection
/*
+selection((moz webkit)) {
	color red
}
*/
selection(vendors)
	for vendor in vendors
		input::-{vendor}-selection
			{block}

	input::selection
		{block}


vendor-property(property, value, vendors)
	for vendor in vendors
		-{vendor}-{property} value

	{property} value


// transform
transform(value...)
	vendor-property('transform', value, (webkit moz o ms))

transform-origin(value...)
	vendor-property('transform-origin', value, (webkit moz o ms))

transform-style(value...)
	vendor-property('transform-style', value, (webkit moz))


// transition
transition(value...)
	vendor-property('transition', value, (webkit moz o))

transition-delay(value...)
	vendor-property('transition-delay', value, (webkit moz o))

transition-duration(value...)
	vendor-property('transition-duration', value, (webkit moz o))

transition-property(value...)
	vendor-property('transition-property', value, (webkit moz o))

transition-timing-function(value...)
	vendor-property('transition-timing-function', value, (webkit moz o))


// animation
animation-name(value...)
	vendor-property('animation-name', value, (webkit moz o ms))

animation-duration(value...)
	vendor-property('animation-duration', value, (webkit moz o ms))

animation-timing-function(value...)
	vendor-property('animation-timing-function', value, (webkit moz o ms))

animation-delay(value...)
	vendor-property('animation-delay', value, (webkit moz o ms))

animation-iteration-count(value...)
	vendor-property('animation-iteration-count', value, (webkit moz o ms))

animation-fill-mode(value...)
	vendor-property('animation-fill-mode', value, (webkit moz o ms))

animation-direction(value...)
	vendor-property('animation-direction', value, (webkit moz o ms))

animation-play-state(value...)
	vendor-property('animation-play-state', value, (webkit moz o ms))


// perspective
perspective(value...)
	vendor('perspective', value, (webkit moz))

perspective-origin(value...)
	vendor('perspective-origin', value, (webkit moz))


backface-visibility(value...)
	vendor('backface-visibility', value, (webkit moz))


background-size(value...)
	vendor-property('background-size', value, (webkit moz o))

// border
border-radius(value...)
	vendor-property('border-radius', value, (webkit moz))

border-bottom-left-radius(value...)
	vendor-property('border-bottom-left-radius', value, (webkit moz))

border-bottom-right-radius(value...)
	vendor-property('border-bottom-right-radius', value, (webkit moz))

border-top-left-radius(value...)
	vendor-property('border-top-left-radius', value, (webkit moz))

border-top-right-radius(value...)
	vendor-property('border-top-right-radius', value, (webkit moz))


// box
box-sizing(value...)
	vendor-property('box-sizing', value, (webkit moz))

box-shadow(value...)
	vendor-property('box-shadow', value, (webkit moz))


user-select(value...)
	vendor-property('user-select', value, (webkit moz ms))


text-shadow(value...)
	text-shadow value


text-overflow(value...)
	vendor-property('text-overflow', value, (o))


font-smoothing(value...)
	vendor-property('font-smoothing', value, (webkit))


appearance(value...)
	vendor-property('appearance', value, (webkit moz))


opacity(opacity)
	-ms-filter 'progid:DXImageTransform.Microsoft.Alpha(%d)' % (opacity * 100)
	opacity     opacity


gradient-to-top(value, multiple = 'none')
	background-image: -webkit-linear-gradient(bottom, split-value(value)), unquote(multiple)
	background-image: -moz-linear-gradient(bottom, split-value(value)), unquote(multiple)
	background-image: -o-linear-gradient(bottom, split-value(value)), unquote(multiple)
	background-image: -ms-linear-gradient(bottom, split-value(value)), unquote(multiple)
	background-image: linear-gradient(to top, split-value(value)), unquote(multiple)


gradient-to-bottom(value, multiple = 'none')
	background-image: -webkit-linear-gradient(top, split-value(value)), unquote(multiple)
	background-image: -moz-linear-gradient(top, split-value(value)), unquote(multiple)
	background-image: -o-linear-gradient(top, split-value(value)), unquote(multiple)
	background-image: -ms-linear-gradient(top, split-value(value)), unquote(multiple)
	background-image: linear-gradient(to bottom, split-value(value)), unquote(multiple)


gradient-top-bottom-rgba(start, end)
	background-color: end
	background-image: -webkit-gradient(linear, left top, left bottom, from(start), to(end))
	background-image: -webkit-linear-gradient(top, start, end)
	background-image:    -moz-linear-gradient(top, start, end)
	background-image:     -ms-linear-gradient(top, start, end)
	background-image:      -o-linear-gradient(top, start, end)
	background-image:         linear-gradient(to bottom, start, end)


gradient-top-bottom-rgba-without-bg(start, end)
	background-image: -webkit-gradient(linear, left top, left bottom, from(start), to(end))
	background-image: -webkit-linear-gradient(top, start, end)
	background-image:    -moz-linear-gradient(top, start, end)
	background-image:     -ms-linear-gradient(top, start, end)
	background-image:      -o-linear-gradient(top, start, end)
	background-image:         linear-gradient(to bottom, start, end)


gradient-top-bottom(start, end)
	gradient-top-bottom-rgba(start, end)
	-ms-filter: 'progid:DXImageTransform.Microsoft.gradient(startColorstr=%s, endColorstr=%s)' % (start end)

kobezzza 08.01.2014 22:50

Цитата:

Сообщение от cyber (Сообщение 291100)
не ужели ни кто не знает что где можно его скачать?
ладно фиг с ним пошел искать другой препроцессор.

Ну как, клонишь репозитарий и собираешь код. Для сборки модулей ноды под браузер есть либы.

cyber 08.01.2014 22:52

Цитата:

Сообщение от kobezzza
Ну как, клонишь репозитарий и собираешь код. Для сборки модулей ноды под браузер есть либы.

чет новенькое, пошел гуглить, спасибо :thanks:


Часовой пояс GMT +3, время: 02:29.