Merge pull request #4 from rezigned/add-screenshots

rezigned · web-flow · commit 7c4a939ab597 · 2025-08-11T22:35:46.000+07:00
chore: add screenshots
diff --git a/.github/assets/tur-tui.png b/.github/assets/tur-tui.png
diff --git a/.github/assets/tur-web.png b/.github/assets/tur-web.png
diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
@@ -23,7 +23,6 @@ on:
 jobs:
   test:
     name: Test
-    if: false
     runs-on: ubuntu-latest
     steps:
       - uses: actions/checkout@v4
diff --git a/README.md b/README.md
@@ -8,6 +8,25 @@
 
 **Tur** is a language for defining and executing Turing machines, complete with parser, interpreter, and multi-platform visualization tools.
 
+<table>
+  <thead>
+    <tr>
+      <th width="500px">Web</th>
+      <th width="500px">TUI</th>
+    </tr>
+  </thead>
+  <tbody>
+    <tr>
+      <td>
+        <a href="https://rezigned.com/tur"><img src=".github/assets/tur-web.png" /></a>
+      </td>
+      <td>
+        <img src=".github/assets/tur-tui.png" />
+      </td>
+    </tr>
+  </tbody>
+</table>
+
 ## Language Overview
 
 Tur (`.tur` files) provides a clean, readable syntax for defining both single-tape and multi-tape Turing machines. The language includes:
diff --git a/platforms/tui/src/app.rs b/platforms/tui/src/app.rs
@@ -4,7 +4,7 @@ use ratatui::{
     layout::{Alignment, Constraint, Direction, Layout, Margin, Rect},
     style::{Color, Modifier, Style},
     text::{Line, Span, Text},
-    widgets::{Block, Borders, List, ListItem, Padding, Paragraph, Wrap},
+    widgets::{Block, BorderType, Borders, List, ListItem, Padding, Paragraph, Wrap},
     Frame,
 };
 use tur::{
@@ -490,6 +490,7 @@ fn section<'a>(title: &'a str, content: Vec<Line<'a>>) -> Paragraph<'a> {
 fn block(title: &str) -> Block {
     Block::default()
         .borders(Borders::ALL)
+        .border_type(BorderType::Rounded)
         .title(format!(" {title} "))
         .padding(BLOCK_PADDING)
 }
diff --git a/platforms/web/index.html b/platforms/web/index.html
@@ -29,12 +29,28 @@
     <!-- Custom Turing Machine Syntax Highlighter -->
     <script data-trunk src="turing-editor.js"></script>
     <link data-trunk rel="copy-file" href="../../.github/tur-logo-small.png" />
+    <link data-trunk rel="copy-file" href="../../.github/assets/tur-web.png" />
+
+    <meta property="og:title" content="Tur - Turing Machine Language Simulator">
+    <meta property="og:description" content="Bringing Alan Turing's foundational concepts to life through interactive visualization.">
+    <meta property="og:image" content="tur-web.png">
+
+    <!-- SEO Meta Tags -->
+    <meta name="description" content="An interactive simulator for Tur, a Turing machine language. It brings Alan Turing's concepts to life. Design, visualize, and run Turing machine programs right in your browser.">
+    <meta name="keywords" content="Tur, Turing machine, simulator, computer science, computation, Alan Turing, interactive, visualization, programming, educational tool">
+    <meta name="author" content="rezigned">
+
+    <!-- Twitter Card Meta Tags -->
+    <meta name="twitter:card" content="summary_large_image">
+    <meta name="twitter:title" content="Tur - Turing Machine Language Simulator">
+    <meta name="twitter:description" content="Bringing Alan Turing's foundational concepts to life through interactive visualization.">
+    <meta name="twitter:image" content="tur-web.png">
 </head>
 
 <body>
     <div class="socials">
         <a class="github-stars" href="https://github.com/rezigned/tur" target="_blank"><img src="https://img.shields.io/github/stars/rezigned/tur?style=social" alt="GitHub stars"></a>
-        <a class="github-forks" href="https://github.com/rezigned/tur" target="_blank"><img src="https://img.shields.io/github/forks/rezigned/tur?style=social" alt="GitHub forks"></a>
+        <a class="github-user" href="https://github.com/rezigned" target="_blank"><img alt="Static Badge" src="https://img.shields.io/badge/-grey?style=social&label=%40rezigned&link=https%3A%2F%2Fgithub.com%2Frezigned"></a>
     </div>
     <header class="header">
         <p align="center">
diff --git a/platforms/web/styles.css b/platforms/web/styles.css
@@ -81,7 +81,7 @@ body {
 }
 
 .header h1 {
-    font-size: 2rem;
+    font-size: 1.6rem;
     font-weight: 500;
     letter-spacing: 0.5px;
     background: linear-gradient(45deg, var(--color-success), var(--color-primary));

Original file line number	Diff line number	Diff line change
`@@ -81,7 +81,7 @@ body {`
`81`	`81`	`}`
`82`	`82`
`83`	`83`	`.header h1 {`
`84`		`- font-size: 2rem;`
	`84`	`+ font-size: 1.6rem;`
`85`	`85`	`font-weight: 500;`
`86`	`86`	`letter-spacing: 0.5px;`
`87`	`87`	`background: linear-gradient(45deg, var(--color-success), var(--color-primary));`