<div class="card">
<div class="card-divider">
<h4>Orientation</h4>
</div>
<%= if @data_ready do %>
<div class="card-section">
<div class="grid-x">
<div class="cell small-6"><strong>Pitch</strong></div>
<div class="cell small-6 text-right"><%= Float.round(@pitch, 2) %>°</div>
<div class="cell small-6"><strong>Roll</strong></div>
<div class="cell small-6 text-right"><%= Float.round(@roll, 2) %>°</div>
<div class="cell small-6"><strong>Yaw</strong></div>
<div class="cell small-6 text-right"><%= Float.round(@yaw, 2) %>°</div>
<% else %>
<p>No data available</p>
<% end %>