Added code editor changes mobile design handling

diff --git a/resources/sass/_components.scss b/resources/sass/_components.scss
index fe04784b2d33b115a017b2f69eac8bd3186c4b7e..4509c2b9a4b8a610e424eddfc54493d073b509a6 100644 (file)
--- a/resources/sass/_components.scss
+++ b/resources/sass/_components.scss
@@ -705,6 +705,18 @@ body.flexbox-support #entity-selector-wrap .popup-body .form-group {
   }
 }
 
   }
 }
 

+@include smaller-than($s) {
+  .code-editor .lang-options {
+    display: none;
+  }
+  .code-editor-body-wrap {
+    flex-direction: column;
+  }
+  .code-editor-language-list, .code-editor-language-list input {
+    width: 100%;
+  }
+}
+

 .comment-box {
   border-radius: 4px;
   border: 1px solid #DDD;
 .comment-box {
   border-radius: 4px;
   border: 1px solid #DDD;

diff --git a/resources/views/pages/parts/code-editor.blade.php b/resources/views/pages/parts/code-editor.blade.php
index 9c10456cec391358cadf21abcc721543b24f1d07..4ac688692ef81619dc6c6b6962fc24b217d2bdf4 100644 (file)
--- a/resources/views/pages/parts/code-editor.blade.php
+++ b/resources/views/pages/parts/code-editor.blade.php
@@ -14,7 +14,7 @@
                 <button class="popup-header-close" refs="popup@hide">@icon('close')</button>
             </div>
 
                 <button class="popup-header-close" refs="popup@hide">@icon('close')</button>
             </div>
 

-            <div class="flex-container-row flex-fill">
+            <div class="code-editor-body-wrap flex-container-row flex-fill">

                 <div class="code-editor-language-list flex-container-column flex-fill">
                     <label for="code-editor-language">{{ trans('components.code_language') }}</label>
                     <input refs="code-editor@languageInput" id="code-editor-language" type="text">
                 <div class="code-editor-language-list flex-container-column flex-fill">
                     <label for="code-editor-language">{{ trans('components.code_language') }}</label>
                     <input refs="code-editor@languageInput" id="code-editor-language" type="text">