NHLOCAL commited on
Commit
033dc1e
·
1 Parent(s): 09f9edf

הודעת פרסום אלף בוט

Browse files
Files changed (3) hide show
  1. static/main.js +16 -0
  2. static/style.css +87 -0
  3. templates/index.html +18 -0
static/main.js CHANGED
@@ -1,4 +1,20 @@
1
  document.addEventListener('DOMContentLoaded', () => {
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
2
  const form = document.getElementById('transcribe-form');
3
  const apiKeyInput = document.getElementById('api-key-input');
4
  const audioFileInput = document.getElementById('audio-file-input');
 
1
  document.addEventListener('DOMContentLoaded', () => {
2
+ // --- Beta Banner Logic ---
3
+ const betaBanner = document.getElementById('beta-banner');
4
+ const closeBetaBannerBtn = document.getElementById('close-beta-banner');
5
+
6
+ if (betaBanner && closeBetaBannerBtn) {
7
+ if (localStorage.getItem('betaBannerDismissed') !== 'true') {
8
+ betaBanner.style.display = 'block';
9
+ }
10
+
11
+ closeBetaBannerBtn.addEventListener('click', () => {
12
+ betaBanner.style.display = 'none';
13
+ localStorage.setItem('betaBannerDismissed', 'true');
14
+ });
15
+ }
16
+ // --- End Beta Banner Logic ---
17
+
18
  const form = document.getElementById('transcribe-form');
19
  const apiKeyInput = document.getElementById('api-key-input');
20
  const audioFileInput = document.getElementById('audio-file-input');
static/style.css CHANGED
@@ -51,6 +51,93 @@ body {
51
  transition: background-color var(--transition-speed) ease;
52
  }
53
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
54
  .container {
55
  max-width: 800px;
56
  margin: 0 auto;
 
51
  transition: background-color var(--transition-speed) ease;
52
  }
53
 
54
+ /* --- Beta Banner --- */
55
+ .beta-banner {
56
+ display: none; /* Initially hidden, shown by JS */
57
+ background: linear-gradient(135deg, #EADDFF, #D0BCFF);
58
+ border: 1px solid var(--md-sys-color-primary);
59
+ border-radius: var(--border-radius);
60
+ padding: 1.5rem;
61
+ margin-bottom: 2rem;
62
+ position: relative;
63
+ box-shadow: 0 6px 20px rgba(var(--md-sys-color-primary-rgb), 0.15);
64
+ animation: fadeIn 0.5s ease-out;
65
+ }
66
+
67
+ @keyframes fadeIn {
68
+ from { opacity: 0; transform: translateY(-20px); }
69
+ to { opacity: 1; transform: translateY(0); }
70
+ }
71
+
72
+ .banner-content {
73
+ display: flex;
74
+ align-items: center;
75
+ gap: 1.5rem;
76
+ flex-wrap: wrap;
77
+ }
78
+
79
+ .banner-icon .material-symbols-outlined {
80
+ font-size: 48px;
81
+ color: var(--md-sys-color-primary);
82
+ }
83
+
84
+ .banner-text {
85
+ flex: 1;
86
+ min-width: 250px;
87
+ }
88
+
89
+ .banner-text h3 {
90
+ font-size: 1.4rem;
91
+ font-weight: 700;
92
+ color: var(--md-sys-color-on-primary-container);
93
+ margin-bottom: 0.25rem;
94
+ }
95
+
96
+ .banner-text p {
97
+ font-size: 1rem;
98
+ color: #49454F;
99
+ line-height: 1.5;
100
+ }
101
+
102
+ .banner-action .btn {
103
+ white-space: nowrap;
104
+ box-shadow: 0 4px 8px rgba(0,0,0,0.1);
105
+ }
106
+
107
+ .close-banner-btn {
108
+ position: absolute;
109
+ top: 12px;
110
+ left: 12px; /* For RTL layout */
111
+ background: transparent;
112
+ border: none;
113
+ cursor: pointer;
114
+ color: var(--md-sys-color-outline);
115
+ padding: 4px;
116
+ border-radius: 50%;
117
+ display: flex;
118
+ align-items: center;
119
+ justify-content: center;
120
+ transition: background-color var(--transition-speed) ease, color var(--transition-speed) ease;
121
+ }
122
+
123
+ .close-banner-btn:hover {
124
+ background-color: rgba(var(--md-sys-color-primary-rgb), 0.1);
125
+ color: var(--md-sys-color-primary);
126
+ }
127
+
128
+ @media (max-width: 768px) {
129
+ .banner-content {
130
+ flex-direction: column;
131
+ align-items: flex-start;
132
+ text-align: right;
133
+ }
134
+ .banner-action {
135
+ margin-top: 1rem;
136
+ align-self: center;
137
+ }
138
+ }
139
+
140
+
141
  .container {
142
  max-width: 800px;
143
  margin: 0 auto;
templates/index.html CHANGED
@@ -14,6 +14,24 @@
14
  </head>
15
  <body>
16
  <div class="container">
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
17
  <header>
18
  <h1><span class="material-symbols-outlined" style="font-size: 2.8rem;">transcribe</span> תמלול שיעורי תורה</h1>
19
  </header>
 
14
  </head>
15
  <body>
16
  <div class="container">
17
+ <div id="beta-banner" class="beta-banner">
18
+ <div class="banner-content">
19
+ <div class="banner-icon">
20
+ <span class="material-symbols-outlined">rocket_launch</span>
21
+ </div>
22
+ <div class="banner-text">
23
+ <h3>השקה חדשה: ברוכים הבאים ל"אלף בוט"!</h3>
24
+ <p>אנו משיקים אתר חדש, יציב ואמין יותר, עם חווית משתמש משופרת. רוצים להיות הראשונים שמנסים? הירשמו לגרסת הבטא וקבלו גישה בחינם.</p>
25
+ </div>
26
+ <div class="banner-action">
27
+ <a href="https://forms.gle/d8Yvv9qWEEMgeSg58" target="_blank" class="btn btn-primary">להרשמה לבטא</a>
28
+ </div>
29
+ </div>
30
+ <button id="close-beta-banner" class="close-banner-btn" title="סגור הודעה">
31
+ <span class="material-symbols-outlined">close</span>
32
+ </button>
33
+ </div>
34
+
35
  <header>
36
  <h1><span class="material-symbols-outlined" style="font-size: 2.8rem;">transcribe</span> תמלול שיעורי תורה</h1>
37
  </header>