Hugging Face's logo

Spaces:
Rudrameher45
/
dwqqwd
Build error

App Files Community
1
Rudrameher45 commited on
Commit
16c170c
·
verified ·
1 Parent(s): 0fd6c17

Upload 2 files

Browse files
Files changed (2) hide show
  1. templates/index.html +175 -0
  2. templates/index1.html +175 -0
templates/index.html ADDED
@@ -0,0 +1,175 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Headline Generator</title>
7
+ <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap" rel="stylesheet">
8
+ <style>
9
+ body {
10
+ font-family: 'Inter', sans-serif;
11
+ margin: 0;
12
+ background-color: #1a1a2e;
13
+ color: #fff;
14
+ }
15
+
16
+ .navbar {
17
+ background-color: #e63946;
18
+ padding: 1rem;
19
+ display: flex;
20
+ justify-content: space-between;
21
+ align-items: center;
22
+ }
23
+
24
+ .navbar .logo {
25
+ font-size: 1.5rem;
26
+ font-weight: bold;
27
+ color: #fff;
28
+ }
29
+
30
+ .navbar .bulk-generator {
31
+ background-color: #fff;
32
+ color: #e63946;
33
+ padding: 0.5rem 1rem;
34
+ border-radius: 5px;
35
+ font-weight: bold;
36
+ text-decoration: none;
37
+ cursor: pointer;
38
+ }
39
+
40
+ .container {
41
+ text-align: center;
42
+ padding: 2rem;
43
+ }
44
+
45
+ .container h1 {
46
+ font-size: 2.5rem;
47
+ margin-bottom: 1rem;
48
+ }
49
+
50
+ .container p {
51
+ font-size: 1rem;
52
+ margin-bottom: 2rem;
53
+ }
54
+
55
+ .headline-box {
56
+ background-color: #2d2d44;
57
+ border-radius: 10px;
58
+ padding: 2rem;
59
+ width: 90%;
60
+ max-width: 600px;
61
+ margin: 0 auto 2rem auto;
62
+ box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
63
+ }
64
+
65
+ .headline-box input {
66
+ width: 100%;
67
+ padding: 0.8rem;
68
+ margin: 1rem 0;
69
+ border: none;
70
+ border-radius: 5px;
71
+ }
72
+
73
+ .headline-box button {
74
+ background-color: #e63946;
75
+ color: #fff;
76
+ border: none;
77
+ padding: 0.8rem 1.5rem;
78
+ border-radius: 5px;
79
+ font-size: 1rem;
80
+ cursor: pointer;
81
+ }
82
+
83
+ .headline-box button:hover {
84
+ background-color: #b4343a;
85
+ }
86
+
87
+ .predicted-headline {
88
+ margin-top: 2rem;
89
+ opacity: 0;
90
+ transform: translateY(20px);
91
+ transition: opacity 0.5s, transform 0.5s;
92
+ background-color: #2d2d44;
93
+ color: #ffdd57;
94
+ padding: 1rem;
95
+ border-radius: 10px;
96
+ width: 90%;
97
+ max-width: 600px;
98
+ margin: 2rem auto;
99
+ font-weight: bold;
100
+ text-align: center;
101
+ box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
102
+ }
103
+
104
+ .predicted-headline.visible {
105
+ opacity: 1;
106
+ transform: translateY(0);
107
+ }
108
+
109
+ .seo-score {
110
+ margin-top: 2rem;
111
+ background: #2d2d44;
112
+ padding: 1rem;
113
+ border-radius: 10px;
114
+ text-align: center;
115
+ }
116
+
117
+ .seo-score .score {
118
+ font-size: 2rem;
119
+ font-weight: bold;
120
+ color: #ffdd57;
121
+ }
122
+ .headline-box textarea {
123
+ width: 100%; /* Takes the full width of the container */
124
+ max-width: 600px; /* Optional: Set a maximum width */
125
+ height: auto; /* Adjusts height dynamically if needed */
126
+ padding: 0.8rem;
127
+ margin: 1rem 0;
128
+ border: none;
129
+ border-radius: 5px;
130
+ font-family: 'Inter', sans-serif;
131
+ font-size: 1rem;
132
+ resize: vertical; /* Allow users to resize vertically */
133
+ }
134
+
135
+ </style>
136
+ </head>
137
+ <body>
138
+ <div class="navbar">
139
+ <div class="logo">Avrotac Team_257</div>
140
+ <a href="#" class="bulk-generator">LogicLooM 3.0</a>
141
+
142
+ </div>
143
+
144
+ <div class="container">
145
+ <h1>Headline Generator</h1>
146
+ <p>Effortlessly generate eye-catching headlines with AI. All we need is a topic from you.</p>
147
+
148
+ <div class="headline-box">
149
+ <h2>AI-Powered Headline Generator</h2>
150
+ <form action="/" method="post">
151
+ <!-- <input type="" name="article" placeholder="Enter your article here" id="topic-input" required> -->
152
+ <textarea name="article" id="topic-input" placeholder="Enter your article here" rows="8" required></textarea>
153
+
154
+ <button type="submit">Generate</button>
155
+ </form>
156
+ </div>
157
+
158
+ {% if headline %}
159
+ <div class="predicted-headline visible">
160
+ {{ headline }}
161
+ </div>
162
+ {% else %}
163
+ <div class="predicted-headline" id="predicted-headline">
164
+ Your generated headline will appear here!
165
+ </div>
166
+ {% endif %}
167
+
168
+ <div class="seo-score">
169
+ <p>Desing and develop by Team_257 Avrotac</p>
170
+ <div class="score">LogicLooM 3.0</div>
171
+ <p>Generate Heading form News Article </p>
172
+ </div>
173
+ </div>
174
+ </body>
175
+ </html>
templates/index1.html ADDED
@@ -0,0 +1,175 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Headline Generator</title>
7
+ <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap" rel="stylesheet">
8
+ <style>
9
+ body {
10
+ font-family: 'Inter', sans-serif;
11
+ margin: 0;
12
+ background-color: #1a1a2e;
13
+ color: #fff;
14
+ }
15
+
16
+ .navbar {
17
+ background-color: #e63946;
18
+ padding: 1rem;
19
+ display: flex;
20
+ justify-content: space-between;
21
+ align-items: center;
22
+ }
23
+
24
+ .navbar .logo {
25
+ font-size: 1.5rem;
26
+ font-weight: bold;
27
+ color: #fff;
28
+ }
29
+
30
+ .navbar .bulk-generator {
31
+ background-color: #fff;
32
+ color: #e63946;
33
+ padding: 0.5rem 1rem;
34
+ border-radius: 5px;
35
+ font-weight: bold;
36
+ text-decoration: none;
37
+ cursor: pointer;
38
+ }
39
+
40
+ .container {
41
+ text-align: center;
42
+ padding: 2rem;
43
+ }
44
+
45
+ .container h1 {
46
+ font-size: 2.5rem;
47
+ margin-bottom: 1rem;
48
+ }
49
+
50
+ .container p {
51
+ font-size: 1rem;
52
+ margin-bottom: 2rem;
53
+ }
54
+
55
+ .headline-box {
56
+ background-color: #2d2d44;
57
+ border-radius: 10px;
58
+ padding: 2rem;
59
+ width: 90%;
60
+ max-width: 600px;
61
+ margin: 0 auto 2rem auto;
62
+ box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
63
+ }
64
+
65
+ .headline-box input {
66
+ width: 100%;
67
+ padding: 0.8rem;
68
+ margin: 1rem 0;
69
+ border: none;
70
+ border-radius: 5px;
71
+ }
72
+
73
+ .headline-box button {
74
+ background-color: #e63946;
75
+ color: #fff;
76
+ border: none;
77
+ padding: 0.8rem 1.5rem;
78
+ border-radius: 5px;
79
+ font-size: 1rem;
80
+ cursor: pointer;
81
+ }
82
+
83
+ .headline-box button:hover {
84
+ background-color: #b4343a;
85
+ }
86
+
87
+ .predicted-headline {
88
+ margin-top: 2rem;
89
+ opacity: 0;
90
+ transform: translateY(20px);
91
+ transition: opacity 0.5s, transform 0.5s;
92
+ background-color: #2d2d44;
93
+ color: #ffdd57;
94
+ padding: 1rem;
95
+ border-radius: 10px;
96
+ width: 90%;
97
+ max-width: 600px;
98
+ margin: 2rem auto;
99
+ font-weight: bold;
100
+ text-align: center;
101
+ box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
102
+ }
103
+
104
+ .predicted-headline.visible {
105
+ opacity: 1;
106
+ transform: translateY(0);
107
+ }
108
+
109
+ .seo-score {
110
+ margin-top: 2rem;
111
+ background: #2d2d44;
112
+ padding: 1rem;
113
+ border-radius: 10px;
114
+ text-align: center;
115
+ }
116
+
117
+ .seo-score .score {
118
+ font-size: 2rem;
119
+ font-weight: bold;
120
+ color: #ffdd57;
121
+ }
122
+ .headline-box textarea {
123
+ width: 100%; /* Takes the full width of the container */
124
+ max-width: 600px; /* Optional: Set a maximum width */
125
+ height: auto; /* Adjusts height dynamically if needed */
126
+ padding: 0.8rem;
127
+ margin: 1rem 0;
128
+ border: none;
129
+ border-radius: 5px;
130
+ font-family: 'Inter', sans-serif;
131
+ font-size: 1rem;
132
+ resize: vertical; /* Allow users to resize vertically */
133
+ }
134
+
135
+ </style>
136
+ </head>
137
+ <body>
138
+ <div class="navbar">
139
+ <div class="logo">Avrotac Team_257</div>
140
+ <a href="#" class="bulk-generator">LogicLooM 3.0</a>
141
+
142
+ </div>
143
+
144
+ <div class="container">
145
+ <h1>Headline Generator</h1>
146
+ <p>Effortlessly generate eye-catching headlines with AI. All we need is a topic from you.</p>
147
+
148
+ <div class="headline-box">
149
+ <h2>AI-Powered Headline Generator</h2>
150
+ <form action="/" method="post">
151
+ <!-- <input type="" name="article" placeholder="Enter your article here" id="topic-input" required> -->
152
+ <textarea name="article" id="topic-input" placeholder="Enter your article here" rows="8" required></textarea>
153
+
154
+ <button type="submit">Generate</button>
155
+ </form>
156
+ </div>
157
+
158
+ {% if headline %}
159
+ <div class="predicted-headline visible">
160
+ {{ headline }}
161
+ </div>
162
+ {% else %}
163
+ <div class="predicted-headline" id="predicted-headline">
164
+ Your generated headline will appear here!
165
+ </div>
166
+ {% endif %}
167
+
168
+ <div class="seo-score">
169
+ <p>Desing and develop by Team_257 Avrotac</p>
170
+ <div class="score">LogicLooM 3.0</div>
171
+ <p>Generate Heading form News Article </p>
172
+ </div>
173
+ </div>
174
+ </body>
175
+ </html>