search

divriots / code.to.design

The only API for HTML to Figma
1 stars 0 forks source link

Text orientation + rotation #16

Closed adamgiebl closed 11 months ago

adamgiebl commented 11 months ago

Describe the bug image

To Reproduce

<div class="card">
  <div class="date-time-container">
    <time class="date-time" datetime="2022-10-10">
      <span>2022</span>
      <span class="separator"></span>
      <span>Oct 10</span>
    </time>
  </div>
  <div class="content"></div>
</div>

.card {
  box-sizing: border-box;
  display: flex;
  background-color: rgba(255, 255, 255, 1);
}

.date-time-container {
  writing-mode: vertical-lr;
  transform: rotate(180deg);
  padding: 0.5rem;
}

.date-time {
  display: flex;
  align-items: center;
  justify-content: space-between;
  grid-gap: 1rem;
  gap: 1rem;
  font-weight: 700;
  text-transform: uppercase;
  color: rgba(17, 24, 39, 1);
}
gluck commented 11 months ago

Fixed in today's release (we rotate the Figma text blocks when writing-mode is vertical). Thanks !