lib/bhook/theme/page.erb in bhook-0.2.0 vs lib/bhook/theme/page.erb in bhook-0.2.1

- old
+ new

@@ -1,82 +1,111 @@ <!DOCTYPE html> <html lang="en"> - <head> - <meta charset="utf-8"> - <meta http-equiv="X-UA-Compatible" content="IE=edge"> - <meta name="viewport" content="width=device-width, initial-scale=1"> - <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags --> - <link href='https://fonts.googleapis.com/css?family=Fira+Sans' rel='stylesheet' type='text/css'> +<head> + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <meta name="viewport" content="width=device-width, initial-scale=1"> + <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags --> + <link href='https://fonts.googleapis.com/css?family=Fira+Sans' rel='stylesheet' type='text/css'> - <!-- Bootstrap --> - <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous"> - <style> - body { - font-family: 'Fira Sans', sans-serif; - color: #000000; - } - - h2, h5 { - margin-bottom: 0.5em; - } - - .after-h1 { - border-bottom: 1px solid #bbbbbb; - margin-bottom: 1.5em; - } - - .footer { - margin: 0.5em 0 1.5em 0; - } - - table { - margin: 0.5em 0 0.5em 0.5em; - } - - table thead tr { - background: #eeeeee; - } - - table td, table th { - padding: 0.1em 1em 0.1em 1em; - border: 1px solid #bbbbbb; - } + <!-- Bootstrap --> + <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous"> + <style> + body { + font-family: 'Fira Sans', sans-serif; + color: #000000; + } - blockquote { + h2, h3, h4, h5 { + margin-bottom: 0.5em; + margin-top: 0.5em; + } + + h2 { + border-bottom: 1px solid #eaeaea; + } + + h2 a.header-anchor, h3 a.header-anchor, + h4 a.header-anchor, h5 a.header-anchor { + float: left; + margin-left: -20px; + text-decoration: none; + outline: none; + position: relative; + } + + h2 a.header-anchor:after, h3 a.header-anchor:after, + h4 a.header-anchor:after, h5 a.header-anchor:after { + content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath fill='%23333' fill-rule='evenodd' d='M9.683 6.676l-.047-.048C8.27 5.26 6.07 5.243 4.726 6.588l-2.29 2.29c-1.344 1.344-1.328 3.544.04 4.91 1.366 1.368 3.564 1.385 4.908.04l1.753-1.752c-.695.074-1.457-.078-2.176-.444L5.934 12.66c-.634.634-1.67.625-2.312-.017-.642-.643-.65-1.677-.017-2.312L6.035 7.9c.634-.634 1.67-.625 2.312.017.024.024.048.05.07.075l.003-.002c.36.36.943.366 1.3.01.355-.356.35-.938-.01-1.3l-.027-.024zM6.58 9.586l.048.05c1.367 1.366 3.565 1.384 4.91.04l2.29-2.292c1.344-1.343 1.328-3.542-.04-4.91-1.366-1.366-3.564-1.384-4.908-.04L7.127 4.187c.695-.074 1.457.078 2.176.444l1.028-1.027c.635-.634 1.67-.624 2.313.017.643.644.652 1.678.018 2.312l-2.43 2.432c-.635.634-1.67.624-2.313-.018-.024-.024-.048-.05-.07-.075l-.003.004c-.36-.362-.943-.367-1.3-.01-.355.355-.35.937.01 1.3.01.007.018.015.027.023z'/%3E%3C/svg%3E"); + box-sizing: border-box; + font-size: medium; + visibility: hidden; + } + + h2:hover a.header-anchor:after, h3:hover a.header-anchor:after, + h4:hover a.header-anchor:after, h5:hover a.header-anchor:after { + visibility: visible; + } + + div.after-h1 { + border-bottom: 1px solid #bbbbbb; + margin-bottom: 1.5em; + } + + div.footer { + margin: 0.5em 0 1.5em 0; + } + + table { + margin: 0.5em 0 1em 0.5em; + } + + table thead tr { + background: #eeeeee; + } + + table td, table th { + padding: 0.1em 1em 0.1em 1em; + border: 1px solid #bbbbbb; + } + + blockquote { border-left: 10px solid #cccccc; background: #eeeeee; display: inline-block; padding: 1em; - } - </style> - <!-- Global site tag (gtag.js) - Google Analytics --> - <script async src="https://www.googletagmanager.com/gtag/js?id=G-CT9TWBW0WR"></script> - <script> - window.dataLayer = window.dataLayer || []; - function gtag(){dataLayer.push(arguments);} - gtag('js', new Date()); - - gtag('config', 'G-CT9TWBW0WR'); - </script> - <title><%= src_title -%></title> - </head> - <body> - <div class="body container"> - <div class="content row justify-content-center"> - <div class="col-10"> - <%= output %> - </div> - </div> - <div class="footer d-flex justify-content-center"> - <div> -<% short_sha = src_file_sha ? src_file_sha[0..7] : nil -%> -<% if file_url && short_sha -%> - v. <a href="<%= file_url -%>"><%= short_sha -%></a>, -<% elsif short_sha -%> - v. <%= short_sha -%>, -<% end -%> - <%= src_file_date -%> © <a href="https://sidu.in">Sidu Ponnappa</a> - </div> - </div> - </div> - </body> + } + </style> + <!-- Global site tag (gtag.js) - Google Analytics --> + <script async src="https://www.googletagmanager.com/gtag/js?id=G-CT9TWBW0WR"></script> + <script> + window.dataLayer = window.dataLayer || []; + function gtag() { dataLayer.push(arguments); } + gtag('js', new Date()); + gtag('config', 'G-CT9TWBW0WR'); + </script> + <title><%= src_title -%></title> +</head> +<body> +<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16"> + <path fill="#333" fill-rule="evenodd" d="M9.683 6.676l-.047-.048C8.27 5.26 6.07 5.243 4.726 6.588l-2.29 2.29c-1.344 1.344-1.328 3.544.04 4.91 1.366 1.368 3.564 1.385 4.908.04l1.753-1.752c-.695.074-1.457-.078-2.176-.444L5.934 12.66c-.634.634-1.67.625-2.312-.017-.642-.643-.65-1.677-.017-2.312L6.035 7.9c.634-.634 1.67-.625 2.312.017.024.024.048.05.07.075l.003-.002c.36.36.943.366 1.3.01.355-.356.35-.938-.01-1.3l-.027-.024zM6.58 9.586l.048.05c1.367 1.366 3.565 1.384 4.91.04l2.29-2.292c1.344-1.343 1.328-3.542-.04-4.91-1.366-1.366-3.564-1.384-4.908-.04L7.127 4.187c.695-.074 1.457.078 2.176.444l1.028-1.027c.635-.634 1.67-.624 2.313.017.643.644.652 1.678.018 2.312l-2.43 2.432c-.635.634-1.67.624-2.313-.018-.024-.024-.048-.05-.07-.075l-.003.004c-.36-.362-.943-.367-1.3-.01-.355.355-.35.937.01 1.3.01.007.018.015.027.023z"/> +</svg> +<div class="body container"> + <div class="content row justify-content-center"> + <div class="col-10"> + <%= output %> + </div> + </div> + <div class="footer d-flex justify-content-center"> + <div> + <% short_sha = src_file_sha ? src_file_sha[0..7] : nil -%> + <% if file_url && short_sha -%> + v. <a href="<%= file_url -%>"><%= short_sha -%></a>, + <% elsif short_sha -%> + v. <%= short_sha -%>, + <% end -%> + <%= src_file_date -%> © <a href="https://sidu.in">Sidu Ponnappa</a> + </div> + </div> +</div> +</body> </html>