<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Ranked!</title><style> body { font-family: Arial, sans-serif; text-align: center; background-color: #f4f4f9; padding: 20px; } h1 { font-size: 3em; margin-top: 50px; } .banner { font-size: 1.5em; color: #777; margin-bottom: 40px; } .logout-button { position: absolute; top: 20px; right: 20px; padding: 10px 20px; background-color: #f44336; color: white; border: none; border-radius: 4px; font-size: 1.2em; cursor: pointer; } .logout-button:hover { background-color: #e53935; }</style></head><body><h1>Welcome to Ranked!</h1><div class="banner">Share your passions</div><!-- Logout button --><form action="/logout" method="post"><button class="logout-button" type="submit">Logout</button></form><%= yield %></body></html>This is my layout.erb file and this is the very simple file I am trying to yield to.
<div class="sub-banner">Your Ranks</div><form action="/create_rank" method="get"><button class="create-button" type="submit">Create New Rank</button></form>When it renders however, it reads the second file in plain text and not HTML as intended. This is a sinatra based app.
I have tried running on multiple environments/machines, changing the content of the files, creating new files, and nothing helps.
I should add that this is the route in my controller.
get "/myranks" do erb :myranks, layout: :layoutend