portfolio/debug.html at main · ATU-S/portfolio · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
<!doctype html>
<html lang="en">
<head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><link rel="stylesheet" href="styles.css" /></head>
<body>
  <button class="menu-toggle" type="button"><span class="sr-only">Open navigation</span><span></span><span></span></button>
  <section class="hero"><div class="hero-copy"><p class="eyebrow"><span class="status-dot"></span>Software engineering undergraduate · Calicut, Kerala</p><h1>Building <span>useful</span><br />systems <em>in motion.</em></h1></div></section>
  <pre id="output"></pre>
  <script>
    const button = document.querySelector('.menu-toggle');
    document.querySelector('#output').textContent = JSON.stringify({ width: innerWidth, media: matchMedia('(max-width: 720px)').matches, buttonDisplay: getComputedStyle(button).display, buttonRight: getComputedStyle(button).right, heroColumns: getComputedStyle(document.querySelector('.hero')).gridTemplateColumns, headingSize: getComputedStyle(document.querySelector('h1')).fontSize }, null, 2);
  </script>
</body>
</html>