Skip to content

Commit 02aed65

Browse files
WolframRavenwolfWolframRavenwolf
committed
AI-Hotkeys Version 1.4.0.20241106
1 parent 8872c91 commit 02aed65

10 files changed

+647
-175
lines changed

‎AI-Hotkeys-Help-de.png

-23.6 KB
Binary file not shown.

‎AI-Hotkeys-Help.png

-22.5 KB
Binary file not shown.

‎AI-Hotkeys-QueryEditor-de.png

2.91 KB
Loading

‎AI-Hotkeys-QueryEditor.png

3.35 KB
Loading

‎AI-Hotkeys-de.html

+329
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,329 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<style>
5+
body {
6+
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
7+
display: flex;
8+
flex-direction: column;
9+
align-items: center;
10+
justify-content: center;
11+
min-height: 100vh;
12+
margin: 0;
13+
background: #fff;
14+
padding: 2rem;
15+
}
16+
17+
.keyboard {
18+
background: #fff;
19+
padding: 2rem;
20+
border-radius: 0.5rem;
21+
width: fit-content;
22+
margin: 0 auto;
23+
}
24+
25+
.keyboard-content {
26+
border: 2px solid #ccc;
27+
border-radius: 1rem;
28+
padding: 0.5rem 2rem 2rem 2rem;
29+
margin-bottom: 2rem;
30+
}
31+
32+
.title {
33+
text-align: center;
34+
color: #1a1a1a;
35+
margin-bottom: 2rem;
36+
font-size: 2rem;
37+
}
38+
39+
.keyboard-row {
40+
display: flex;
41+
justify-content: flex-start;
42+
gap: 0.5rem;
43+
margin-bottom: 0.5rem;
44+
position: relative;
45+
}
46+
47+
.keyboard-row:nth-child(1) {
48+
margin-left: 4rem;
49+
}
50+
51+
.keyboard-row:nth-child(2) {
52+
padding-left: 6rem;
53+
}
54+
55+
.row-with-capslock {
56+
margin-left: 2.25rem;
57+
padding-left: 10rem;
58+
}
59+
60+
.row-y {
61+
margin-left: -2.25rem;
62+
padding-left: 14.5rem;
63+
}
64+
65+
.key {
66+
position: relative;
67+
background: linear-gradient(to bottom, #ffffff 0%, #f5f5f5 100%);
68+
border: 2px solid #000;
69+
border-radius: 0.5rem;
70+
padding: 0.5rem;
71+
width: 6.5rem;
72+
height: 6.5rem;
73+
display: grid;
74+
grid-template-rows: 2.5rem auto;
75+
align-items: center;
76+
text-align: center;
77+
justify-content: center;
78+
box-shadow:
79+
0 4px 6px rgba(0,0,0,0.1),
80+
0 1px 3px rgba(0,0,0,0.08),
81+
inset 0 1px 0 rgba(255,255,255,0.5);
82+
transform: translateY(0);
83+
transition: all 0.2s ease;
84+
}
85+
86+
.key:active {
87+
transform: translateY(2px);
88+
box-shadow:
89+
0 2px 4px rgba(0,0,0,0.1),
90+
0 1px 2px rgba(0,0,0,0.08),
91+
inset 0 1px 0 rgba(255,255,255,0.5);
92+
}
93+
94+
.key::before {
95+
content: '';
96+
position: absolute;
97+
top: 0;
98+
left: 0;
99+
right: 0;
100+
bottom: 0;
101+
border-radius: 0.4rem;
102+
background: linear-gradient(to bottom,
103+
rgba(255,255,255,0.8) 0%,
104+
rgba(255,255,255,0) 50%,
105+
rgba(0,0,0,0.05) 100%);
106+
pointer-events: none;
107+
}
108+
109+
.key-letter {
110+
font-size: 1.75rem;
111+
font-weight: bold;
112+
color: #d32f2f;
113+
text-shadow: 0 1px 1px rgba(0,0,0,0.1);
114+
display: flex;
115+
align-items: center;
116+
justify-content: center;
117+
margin-bottom: 0;
118+
}
119+
120+
.key-action {
121+
font-size: 0.95rem;
122+
line-height: 1.3;
123+
font-weight: 500;
124+
display: flex;
125+
align-items: center;
126+
justify-content: center;
127+
text-align: center;
128+
}
129+
130+
.caps-lock {
131+
width: 7rem;
132+
background: linear-gradient(to bottom, #fff5f5 0%, #ffe8e8 100%);
133+
border-color: #d32f2f;
134+
position: absolute;
135+
left: -2.75rem;
136+
font-weight: bold;
137+
z-index: 1;
138+
}
139+
140+
.legend {
141+
margin-top: 2rem;
142+
text-align: center;
143+
font-size: 1.1rem;
144+
line-height: 1.6;
145+
}
146+
147+
.main-instruction {
148+
font-weight: bold;
149+
margin-bottom: 0.5rem;
150+
}
151+
152+
.help-instruction {
153+
color: #d32f2f;
154+
}
155+
156+
[data-lang] {
157+
display: none;
158+
}
159+
160+
.controls {
161+
display: flex;
162+
justify-content: center;
163+
gap: 1rem;
164+
margin-top: 2rem;
165+
}
166+
167+
.control-button {
168+
background: none;
169+
border: none;
170+
font-size: 2rem;
171+
cursor: pointer;
172+
transition: transform 0.2s;
173+
padding: 0.5rem;
174+
}
175+
176+
.control-button:hover {
177+
transform: scale(1.1);
178+
}
179+
180+
@media print {
181+
body {
182+
padding: 0;
183+
}
184+
185+
.keyboard {
186+
box-shadow: none;
187+
}
188+
189+
.key {
190+
border: 2px solid #000 !important;
191+
print-color-adjust: exact;
192+
-webkit-print-color-adjust: exact;
193+
}
194+
}
195+
196+
.keyboard-rows {
197+
position: relative;
198+
margin-left: auto;
199+
margin-right: auto;
200+
width: fit-content;
201+
}
202+
</style>
203+
</head>
204+
<body>
205+
<div class="keyboard">
206+
<div class="keyboard-content">
207+
<h1 class="title">AI-Hotkeys</h1>
208+
209+
<div class="keyboard-rows">
210+
<div class="keyboard-row">
211+
<div class="key">
212+
<div class="key-letter">Q</div>
213+
<div class="key-action" data-lang="de">Perplexity…</div>
214+
<div class="key-action" data-lang="en">Query Perplexity…</div>
215+
</div>
216+
<div class="key">
217+
<div class="key-letter">W</div>
218+
<div class="key-action" data-lang="de">Was<br>ist</div>
219+
<div class="key-action" data-lang="en">What<br>is</div>
220+
</div>
221+
<div class="key">
222+
<div class="key-letter">E</div>
223+
<div class="key-action" data-lang="de">Erkläre<br>einfach</div>
224+
<div class="key-action" data-lang="en">Explain<br>simply</div>
225+
</div>
226+
<div class="key">
227+
<div class="key-letter">R</div>
228+
<div class="key-action" data-lang="de">Recherchiere</div>
229+
<div class="key-action" data-lang="en">Research</div>
230+
</div>
231+
<div class="key">
232+
<div class="key-letter">T</div>
233+
<div class="key-action" data-lang="de">Übersetze</div>
234+
<div class="key-action" data-lang="en">Translate</div>
235+
</div>
236+
</div>
237+
238+
<div class="keyboard-row row-with-capslock">
239+
<div class="key caps-lock">
240+
<div class="key-letter">⇪</div>
241+
<div class="key-action">CapsLock</div>
242+
</div>
243+
<div class="key">
244+
<div class="key-letter">A</div>
245+
<div class="key-action" data-lang="de">Verfasse Antwort</div>
246+
<div class="key-action" data-lang="en">Answer</div>
247+
</div>
248+
<div class="key">
249+
<div class="key-letter">S</div>
250+
<div class="key-action" data-lang="de">Fasse zusammen</div>
251+
<div class="key-action" data-lang="en">Summarize</div>
252+
</div>
253+
<div class="key">
254+
<div class="key-letter">D</div>
255+
<div class="key-action" data-lang="de">Definiere</div>
256+
<div class="key-action" data-lang="en">Define</div>
257+
</div>
258+
<div class="key">
259+
<div class="key-letter">F</div>
260+
<div class="key-action" data-lang="de">Formuliere besser</div>
261+
<div class="key-action" data-lang="en">Formulate better</div>
262+
</div>
263+
<div class="key">
264+
<div class="key-letter">G</div>
265+
<div class="key-action" data-lang="de">Prüfe Grammatik usw.</div>
266+
<div class="key-action" data-lang="en">Check grammar<br>etc.</div>
267+
</div>
268+
</div>
269+
270+
<div class="keyboard-row row-y">
271+
<div class="key">
272+
<div class="key-letter" data-lang="de">Y</div>
273+
<div class="key-letter" data-lang="en">Z</div>
274+
<div class="key-action" data-lang="de">Verfasse Zusage</div>
275+
<div class="key-action" data-lang="en">Accept</div>
276+
</div>
277+
<div class="key">
278+
<div class="key-letter">X</div>
279+
<div class="key-action" data-lang="de">Verfasse Absage</div>
280+
<div class="key-action" data-lang="en">Reject</div>
281+
</div>
282+
<div class="key">
283+
<div class="key-letter">C</div>
284+
<div class="key-action" data-lang="de">Prüfe Richtigkeit</div>
285+
<div class="key-action" data-lang="en">Check correctness</div>
286+
</div>
287+
<div class="key">
288+
<div class="key-letter">V</div>
289+
<div class="key-action" data-lang="de">Verdeutliche/<br>Vereinfache</div>
290+
<div class="key-action" data-lang="en">Clarify/<br>Simplify</div>
291+
</div>
292+
<div class="key">
293+
<div class="key-letter">B</div>
294+
<div class="key-action" data-lang="de">Berechne/<br>Konvertiere</div>
295+
<div class="key-action" data-lang="en">Calculate/<br>Convert</div>
296+
</div>
297+
</div>
298+
</div>
299+
300+
<div class="legend">
301+
<div class="main-instruction" data-lang="de">Alle Befehle werden mit <span style="color: #d32f2f">CapsLock+Taste</span> ausgeführt</div>
302+
<div class="main-instruction" data-lang="en">All commands are executed with <span style="color: #d32f2f">CapsLock+Key</span></div>
303+
<div class="help-instruction" data-lang="de"><span style="color: #d32f2f; font-weight: bold">CapsLock+F1</span> für vollständige Tastenkürzel-Übersicht</div>
304+
<div class="help-instruction" data-lang="en"><span style="color: #d32f2f; font-weight: bold">CapsLock+F1</span> for complete keyboard shortcut overview</div>
305+
<div class="help-instruction" data-lang="de">✨ <span style="color: #d32f2f; font-weight: bold">Win+Alt</span> öffnet den <span style="color: #000000; font-weight: bold">Query Editor</span> ✨</div>
306+
<div class="help-instruction" data-lang="en">✨ <span style="color: #d32f2f; font-weight: bold">Win+Alt</span> opens the <span style="color: #000000; font-weight: bold">Query Editor</span> ✨</div>
307+
</div>
308+
</div>
309+
310+
<div class="controls">
311+
<button class="control-button" onclick="toggleLanguage('de')">🇩🇪</button>
312+
<button class="control-button" onclick="window.print()">🖨️</button>
313+
<button class="control-button" onclick="toggleLanguage('en')">🇺🇸</button>
314+
</div>
315+
</div>
316+
317+
<script>
318+
document.addEventListener('DOMContentLoaded', () => {
319+
toggleLanguage('de');
320+
});
321+
322+
function toggleLanguage(lang) {
323+
document.querySelectorAll('[data-lang]').forEach(el => {
324+
el.style.display = el.dataset.lang === lang ? 'block' : 'none';
325+
});
326+
}
327+
</script>
328+
</body>
329+
</html>

‎AI-Hotkeys-de.ini

728 Bytes
Binary file not shown.

0 commit comments

Comments
 (0)