Deepl Translate Popup/Icon verschieben Tampermonkey?

[FrontEndler]

Hi, ich habe wieder ein kleines Anliegen.

Und zwar: Da ich sehr viel auf Twitch tv unterwegs bin und manchmal auch in anderen Channels die andere Sprachen sprechen, benötige ich einen Übersetzer.
Deepl kann alles in dem Chatfenster von Twitch direkt übersetzen ohne auf eine andere Seite zu müssen oder whatever.
Allerdings is dieses Popup oder Icon, direkt unter dem Emote Button, sodass ich da nicht dran komme.
Und jedes mal einen Keybind ausführen, wollte ich nun auch nicht.
Daher möchte ich einfach nur dieses Icon hier verschieben sobald ich auf twitch tv bin:


Wie man sieht ist es nicht zugänglich und kaum zu sehen, wodurch ich es direkt über die Texteingabe haben wollte.

Was ich jedes mal gefunden habe:

Code:

container svelte-1brvt9n

icon-container svelte-1brvt9n

class="dl-icon dl-icon-logo svelte-1brvt9n dl-dark-mode"
<div class="dl-icon dl-icon-logo svelte-1brvt9n dl-dark-mode" data-qa="deepl-input-icon"></div>

Hoffe mir kann damit jemand helfen.
Ich danke vielmals.

Greetz

[admin]

Kann man das irgendwie Live sehen?
Das Icon wird vom anderen Script eingebunden oder wie?
Falls es durch ein Add-on oder Drittanbieter Script eingebunden wird , wird das verschieben etwas schwerer,.
Brauchst du den emote Button den?
Was macht der Button überhaupt?


Wahrscheinlicher ist es einfacher den zu verschieben mit margin , oder einfach, ausblenden, wenn man ihn nicht brauch.

Ohne das selber Live zu testen ist es etwas schwer da was da zuzusagen

[FrontEndler]

Kann man das irgendwie Live sehen?
Das Icon wird vom anderen Script eingebunden oder wie?
Brauchst du den emote Button den?
Was macht der Button überhaupt?

Wahrscheinlicher ist es einfacher den zu verschieben mit margin , oder einfach, ausblenden, wenn man ihn nicht brauch.

Ohne das selber Live zu testen ist es etwas schwer da was da zuzusagen

Live sehen geht nur wenn du die Erweiterung bei Chrome installierst: https://chrome.google.com/webstore/detai...cekinflcnj
Das Smiley Icon ist immer da und das Icon von Deepl was ich unterstrichen habe, wird von der Erweiterung dort eingebunden.
Meist brauch man den Smiley Button, deswegen muss das Deepl verschoben werden.
Man kann aber auch den Smiley Button verschieben, is ja fast das selbe .

Das Deepl Button / Icon öffnet nach wünschen eine schnell Option in welche Sprache es übersetzt werden soll und ob es angezeigt werden soll.

Ja, habs auch mit CSS probiert, aber das dann in Tampermonkey umzuschreiben, da bin ich dann bei mir an der falschen Adresse xD

Twitch kann man ohne Account nutzen, man müsste nur kurz das Addon installieren, man kann das Chat Fenster auch nutzen, nur halt nicht absenden. 
Denke aber das reicht zur Live probe.

[admin]

Wenn ich nachher zuhause bin installiere ich das addon mal und teste es. Denke das man mit den verschieben des emote Button einfacher ans ziel kommt als wie das Icon von addon zu verschieben

[FrontEndler]

Wenn ich nachher zuhause bin installiere ich das addon mal und teste es. Denke das man mit den verschieben des emote Button einfacher ans ziel kommt als wie das Icon von addon zu verschieben

Das denke ich auch.
Danke dir.

[admin]

Was muss ich jetzt bei twitch machen?
Einen Kanal suchen, der nicht deutsch ist , der Live ist und den Chat anhat oder wie geht das jetzt?

[admin]

Habe jetzt einen englischen Kanal gefunden mit englischen Chat , aber das Add-on zeigt nicht mal das icon an . Irgendwas scheint hier nicht zu laufen

[FrontEndler]

Was muss ich jetzt bei twitch machen?
Einen Kanal suchen, der nicht deutsch ist , der Live ist und den Chat anhat oder wie geht das jetzt?

Ist egal welchen Kanal, sobald du deepl installiert hast und in irgendeinen channel gehst, sollte wenn die Seite geladen wurde, rechts im Chatfenster unten dann das Deepl Icon popup erscheinen.

Sprache ist da egal.

Bisher bin ich soweit gekommen das ich den Smiley etwas verschieben oder weg machen kann, komisch ist nur, das dann dennoch der Button unsichtbar anklickbar ist :S

Code:

// @grant        GM_addStyle
// @run-at       document-start

(function() {
    'use strict';

GM_addStyle(`
     .crbrgc.Layout-sc-1xcs6mc-0 > .fsJutT.ScButtonIcon-sc-9yap0r-0.ibtYyW.ScCoreButton-sc-ocjdkq-0 > .bxQRSJ.ButtonIconFigure-sc-1emm8lf-0 > .cMWGQu.ScIconLayout-sc-1q25cff-0 > .tw-aspect.hTTohL.ScAspectRatio-sc-18km980-1 > .dSicFr.ScIconSVG-sc-1q25cff-1 {
     color: green; !important;
     height: 220%; !important;
     }
`)
})();

Habe das Icon erstmal Grün gemacht damit ich Veränderungen direkt sehe.
Mit Height hab ichs verschoben, aber dennoch is dahinter der Emote Botton in unsichtbar :S

[admin]

komisch ist nur, das dann dennoch der Button unsichtbar anklickbar ist :S

das kannst du mit pointer-event:none weg machen

[FrontEndler]

Habe jetzt einen englischen Kanal gefunden mit englischen Chat , aber das Add-on zeigt nicht mal das icon an . Irgendwas scheint hier nicht zu laufen

Schau mal ob du das Popup aktiviert hast oder ist?
chrome-extension://cofdbpoegempjloogbagkncekinflcnj/settings.html

---

komisch ist nur, das dann dennoch der Button unsichtbar anklickbar ist :S

das kannst du mit pointer-event:none weg machen

Gerade probiert, funzt nicht, vllt kriegst du es besser hin, den Anfang habe ich geebnet
Hab auch nochmal paar Zeilen ganz oben die nötig sind zum Code hinzugefügt.