Вывести свойства в отдельный контейнер

[madeas]

Задачу решил, но пришлось применить библиотеку, убрать <br> из скрипта и заменить div.result на textarea.result https://jsfiddle.net/madeas/6og583b8/ - генерирует сразу css файл
Отсюда вылезли другие проблемы.

void(),
подскажите, пожалуйста. Можно ли настроить ваш код на переход по новым строкам для textarea? В ином случае он выводит все с сплошным текстом и показывает <br>
Я убрал из кода перенос, получилось вот так:

// выводим нажатые блоки в поле result
		window.onload = function(){
			var items = document.querySelectorAll('.flex div.block');
			var result = document.querySelector('.result');

			for(var i = 0; i < items.length; i++){
				items[i].addEventListener("click", getShadow);
			}

			function getShadow(e){
				var styleItem = getComputedStyle(e.target);
				result.innerHTML += 
				'.' +e.target.classList[1]+'{' +
				'-webkit-box-shadow:' + styleItem.boxShadow + ';' +
				'-moz-box-shadow:' + styleItem.boxShadow + ';' +
				'box-shadow:' + styleItem.boxShadow + ';}';
			}
		}

[void()]

madeas,
Неплохо

Сохранять файлы можно. Я когда-то делал такую возможность для своего текстового редактора. Используется API в HTML5. Есть готовые библиотеки для работы с этим API в щадящем для мозга виде и разными фишками.
Но в целом типа того - https://codepen.io/davidelrizzo/pen/cxsGb
-----
Если я правильно понял задачу, то перенос строки в textarea осуществляется с помощью символов



Или - \n

[madeas]

Ну да, примерно на этом и реализовал.
Спасибо, все получилось https://madeas.github.io/box-shadows. Заменил <br>, все работает.

[madeas]

void(),
еще немного помучаю, если не против.

я тут собрал такой код:

<textarea id=get_date>
Здесь какой-то текст (тут дата и время) здесь продолжение текста без пробелов и отступов.
</textarea>
<script>
var d=new Date();
var day=d.getDate();
var month=d.getMonth() + 1;
var year=d.getFullYear();
var hours=d.getHours();
var minutes=d.getMinutes();
document.write(year + '' + month + '' + day + '' + hours + '' + minutes);
get_date.innerHTML+=day+''+month+''+year+''+hours+''+minutes;
</script>

Надо чтобы в определенном месте textarea выводились указанные скриптом данные, т.е. текущие дата и время. Или после указанного слова. Это возможно? Сейчас, если убрать

document.write(year + '' + month + '' + day + '' + hours + '' + minutes);

получится просто текст с краю.

[madeas]

Решил. Оставлю тут, может пригодится кому. В примере ниже генерируется нынешнее время в указанном скриптом месте. Между текстом.

<textarea class="result" id="result"></textarea>

var d=new Date();
		var day=d.getDate();
		var month=d.getMonth() + 1;
		var year=d.getFullYear();
		var hours=d.getHours();
		var minutes=d.getMinutes();
			result.innerHTML+= '/*!\n'+' * box-shadows.min.css v1.0.1'+'g' + day+''+month+''+hours+''+minutes+' - https://github.com/madeas/box-shadows.css\n'+' * \n'+' * Copyright (c) 2018 Andrej Sharapov\n'+' * Licensed under MIT (https://github.com/madeas/box-shadows.css/blob/master/LICENSE)\n'+' */\n'+'\n';

[Nexus]

Я бы так сделал:

<textarea style="width:100%;min-height:100px;" id="result">/*!
 * box-shadows.min.css v1.0.1g#DAY#MONTH#HOURS#MONUTES - https://github.com/madeas/box-shadows.css
 * 
 * Copyright (c) 2018 Andrej Sharapov
 * Licensed under MIT (https://github.com/madeas/box-shadows.css/blob/master/LICENSE)
 */
</textarea>
<script>
const date=new Date();
result.value=result.value
	.replace('#DAY',date.getDate())
	.replace('#MONTH',date.getMonth()+1)
	.replace('#HOURS',date.getHours())
	.replace('#MONUTES',date.getMinutes());
</script>

[madeas]

Nexus,
Я пробовал сделать подобным образом. Это чуть проще, но не эффективно, поскольку ниже надо еще вывести данные нажатых блоков, а при заполненном содержимом поля, они не добавляются. Я вообще в скриптах не шарю, собственная "хотелка" заставила выкручиваться. Может если доработать ваш код, все и получится, но моих знаний не достаточно) Так что, пусть пока будет так.

[Dilettante_Pro]

надо еще вывести данные нажатых блоков, а при заполненном содержимом поля, они не добавляются.

<textarea style="width:100%;min-height:150px;" id="result">/*!
 * box-shadows.min.css v1.0.1g#DAY#MONTH#HOURS#MONUTES - https://github.com/madeas/box-shadows.css
 * 
 * Copyright (c) 2018 Andrej Sharapov
 * Licensed under MIT (https://github.com/madeas/box-shadows.css/blob/master/LICENSE)
 */
</textarea>
<div id="press">
  Содержание, которое надо еще добавить
</div>
<script>
const date=new Date();
result.value=result.value
	.replace('#DAY',date.getDate())
	.replace('#MONTH',date.getMonth()+1)
	.replace('#HOURS',date.getHours())
	.replace('#MONUTES',date.getMinutes());
press.onclick = function() {
   result.value=result.value + this.textContent;
}
</script>