From d2328c405128d8eb5d7c18cfe96c5592021503c9 Mon Sep 17 00:00:00 2001
From: Giteabot <teabot@gitea.io>
Date: Wed, 26 Apr 2023 05:42:00 -0400
Subject: [PATCH] Fix Monaco IOS keyboard button (#24341) (#24347)

Backport #24341 by @silverwind

Fix https://github.com/go-gitea/gitea/issues/16188. Turns out the
element was completely misaligned by fomantic styles. Add most of the
original styles in `!important` form to fix.

Tapping the button doesn't do anything useful in Simulator.app, but I
guess it's still better to not outright hide it in case it has a
possiblity to work.

<img width="121" alt="image"
src="https://user-images.githubusercontent.com/115237/234379685-4e67f8cd-7e91-4bcc-8e17-9d5b2ebed6cd.png">

Co-authored-by: silverwind <me@silverwind.io>
---
 web_src/css/features/codeeditor.css | 15 +++++++++++++++
 1 file changed, 15 insertions(+)

diff --git a/web_src/css/features/codeeditor.css b/web_src/css/features/codeeditor.css
index f7e7777409..8666ad2f85 100644
--- a/web_src/css/features/codeeditor.css
+++ b/web_src/css/features/codeeditor.css
@@ -31,3 +31,18 @@
 .monaco-scrollable-element > .scrollbar > .slider:active {
   background: var(--color-primary-dark-2) !important;
 }
+
+/* fomantic styles destroy this element only visible on IOS, restore it */
+.monaco-editor .iPadShowKeyboard {
+  border: none !important;
+  width: 58px !important;
+  min-width: 0 !important;
+  height: 36px !important;
+  min-height: 0 !important;
+  margin: 0 !important;
+  padding: 0 !important;
+  position: absolute !important;
+  resize: none !important;
+  overflow: hidden !important;
+  border-radius: 4px !important;
+}