|
@@ -1,69 +0,0 @@
|
|
|
-<!-- templates/index.html -->
|
|
|
-
|
|
|
-<!DOCTYPE html>
|
|
|
-<html lang="zh-CN">
|
|
|
-<head>
|
|
|
- <meta charset="UTF-8">
|
|
|
- <meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
|
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
|
- <title>短网址生成器</title>
|
|
|
- <link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.3.0-alpha1/css/bootstrap.min.css" rel="stylesheet">
|
|
|
- <style>
|
|
|
- body {
|
|
|
- font-family: Arial, sans-serif;
|
|
|
- margin: 20px;
|
|
|
- }
|
|
|
-
|
|
|
- h1, h2, p {
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
-
|
|
|
- form {
|
|
|
- max-width: 400px;
|
|
|
- margin: 20px auto;
|
|
|
- }
|
|
|
-
|
|
|
- input {
|
|
|
- width: 100%;
|
|
|
- padding: 10px;
|
|
|
- margin: 8px 0;
|
|
|
- box-sizing: border-box;
|
|
|
- }
|
|
|
-
|
|
|
- button {
|
|
|
- background-color: #4CAF50;
|
|
|
- color: white;
|
|
|
- padding: 10px 15px;
|
|
|
- border: none;
|
|
|
- border-radius: 5px;
|
|
|
- cursor: pointer;
|
|
|
- width: 100%;
|
|
|
- }
|
|
|
-
|
|
|
- button:hover {
|
|
|
- background-color: #45a049;
|
|
|
- }
|
|
|
-
|
|
|
- .result {
|
|
|
- margin: 20px;
|
|
|
- padding: 20px;
|
|
|
- border: 1px solid #ddd;
|
|
|
- border-radius: 5px;
|
|
|
- }
|
|
|
- </style>
|
|
|
-</head>
|
|
|
-<body>
|
|
|
- <div class="container">
|
|
|
- <h1 class="mt-5">短网址生成器</h1>
|
|
|
- <form class="mt-4" action="/shorten" method="post">
|
|
|
- <div class="mb-3">
|
|
|
- <label for="url" class="form-label">输入原始网址:</label>
|
|
|
- <input type="url" id="url" name="url" class="form-control" placeholder="https://example.com" required>
|
|
|
- </div>
|
|
|
- <button type="submit" class="btn btn-primary">生成短网址</button>
|
|
|
- </form>
|
|
|
- {% block content %}{% endblock %}
|
|
|
- </div>
|
|
|
- <script src="https://cdn.bootcdn.net/ajax/libs/bootstrap/5.3.0/js/bootstrap.bundle.min.js"></script>
|
|
|
-</body>
|
|
|
-</html>
|