[рони]

Через css не получается

<style>
summary {
  color: #3b393d;
}

.dclose {
  background-color: transparent;
  background-clip: padding-box;
  border: none;
  color: #333;
  line-height: 1.5;
  margin-top: .2em;
  margin-bottom: .2em;
  padding: .375rem .75rem;
  position: relative;
}

.dclose:before{
      content: "▲";
      display: block;
      position: absolute;
      left: 0px;
      top: 5px;
      transition: .8s;
}
[open] + .dclose:before{
    transform: rotate(90deg);
}
</style>

<details id="details">
  <summary> open details</summary>
  Lorem Ipsum - это текст-"рыба", часто используемый в печати и вэб-дизайне. Lorem Ipsum является стандартной "рыбой" для текстов на латинице с начала XVI века. В то время некий безымянный печатник создал большую коллекцию размеров и форм шрифтов, используя
  Lorem Ipsum для распечатки образцов. Lorem Ipsum не только успешно пережил без заметных изменений пять веков, но и перешагнул в электронный дизайн. Его популяризации в новое время послужили публикация листов Letraset с образцами Lorem Ipsum в 60-х годах
  и, в более недавнее время, программы электронной вёрстки типа Aldus PageMaker, в шаблонах которых используется Lorem Ipsum.
</details>

<button class="text-right dclose" onclick="closeDetails()"><span class="en" lang="en"> Close details</span></button>
<script>
  function closeDetails() {
    document.getElementById("details").open = false;
  }

</script>