Ticket #4674 - Studio: Layout changes.

modules/boonex/english/data/langs/system/en.xml

@@ -1794,7 +1794,7 @@
     
     
 
-	<string name="_adm_stg_cpt_type_system"><![CDATA[System]]></string>
+	<string name="_adm_stg_cpt_type_system"><![CDATA[Global]]></string>
 	<string name="_adm_stg_scs_save"><![CDATA[Settings were successfully saved]]></string>
 	<string name="_adm_stg_err_save_error_message"><![CDATA[Error in '{0}': {1}]]></string>
 	<string name="_adm_stg_err_cannot_perform"><![CDATA[Cannot perform the action.]]></string>

modules/boonex/russian/data/langs/system/ru.xml

@@ -1761,7 +1761,7 @@
     <string name="_adm_stg_cpt_option_sys_std_show_header_right_site"><![CDATA[Студия: Показывать ссылку 'сайт' в заголовке]]></string>
     <string name="_adm_stg_cpt_option_sys_std_show_launcher_left"><![CDATA[Студия: Показать левую область с меню в лаунчере]]></string>
     
-    <string name="_adm_stg_cpt_type_system"><![CDATA[Система]]></string>
+    <string name="_adm_stg_cpt_type_system"><![CDATA[Глобальные]]></string>
     <string name="_adm_stg_scs_save"><![CDATA[Настройки удачно сохранены]]></string>
     <string name="_adm_stg_err_save_error_message"><![CDATA[Ошибка в '{0}': {1}]]></string>
     <string name="_adm_stg_err_cannot_perform"><![CDATA[Не могу выполнить действие.]]></string>

modules/boonex/videos/template/images/icons/std-icon.svg

@@ -1,35 +1,14 @@
-<svg width="320" height="320" viewBox="0 0 320 320" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g clip-path="url(#clip0_1016_7375)">
-<path d="M160 0C281.326 0 320 38.6737 320 160C320 281.326 281.326 320 160 320C38.6736 320 0 281.326 0 160C0 38.6737 38.6736 0 160 0Z" fill="url(#paint0_linear_1016_7375)"/>
-<path d="M160 2C220.573 2 259.85 11.6833 284.083 35.9168C308.317 60.1504 318 99.4272 318 160C318 220.573 308.317 259.85 284.083 284.083C259.85 308.317 220.573 318 160 318C99.4272 318 60.1504 308.317 35.9168 284.083C11.6833 259.85 2 220.573 2 160C2 99.4272 11.6833 60.1504 35.9168 35.9168C60.1504 11.6833 99.4272 2 160 2Z" stroke="#F8FAFC" stroke-opacity="0.2" stroke-width="4"/>
-<g clip-path="url(#clip1_1016_7375)">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M115.252 242.422C111.558 241.913 108.51 245.401 110.428 248.598C117.64 260.617 132.759 265 160 265C187.24 265 202.359 260.617 209.571 248.598C211.489 245.401 208.441 241.913 204.747 242.422C191.854 244.197 177.01 245 159.999 245C142.989 245 128.145 244.197 115.252 242.422Z" fill="url(#paint1_linear_1016_7375)"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M270 150C270 85.5454 243.412 65 160 65C76.5881 65 50 85.5454 50 150C50 214.455 76.5881 235 160 235C243.412 235 270 214.455 270 150ZM145 201.962L205 167.321C218.333 159.623 218.333 140.377 205 132.679L145 98.0385C131.667 90.3405 115 99.963 115 115.359L115 184.641C115 200.037 131.667 209.66 145 201.962Z" fill="url(#paint2_linear_1016_7375)"/>
-<path d="M200 141.34C206.667 145.189 206.667 154.811 200 158.66L140 193.301C133.333 197.15 125 192.339 125 184.641L125 115.359C125 107.661 133.333 102.85 140 106.699L200 141.34Z" fill="url(#paint3_linear_1016_7375)"/>
-</g>
-</g>
+<svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect width="48" height="48" fill="url(#paint0_linear_274_424)"/>
+<path d="M9.75 16.75H38.25" stroke="white" stroke-width="2.25" stroke-linejoin="round"/>
+<path d="M31.5 9.25L27 16.75" stroke="white" stroke-width="2.25" stroke-linejoin="round"/>
+<path d="M21 9.25L16.5 16.75" stroke="white" stroke-width="2.25" stroke-linejoin="round"/>
+<path d="M9.75 23.5C9.75 16.7825 9.75 13.4237 11.8369 11.3369C13.9237 9.25 17.2825 9.25 24 9.25C30.7175 9.25 34.0763 9.25 36.1632 11.3369C38.25 13.4237 38.25 16.7825 38.25 23.5C38.25 30.2175 38.25 33.5763 36.1632 35.6632C34.0763 37.75 30.7175 37.75 24 37.75C17.2825 37.75 13.9237 37.75 11.8369 35.6632C9.75 33.5763 9.75 30.2175 9.75 23.5Z" stroke="white" stroke-width="2.25"/>
+<path d="M28.4297 27.8422C28.2024 28.7823 27.1286 29.4466 24.9809 30.7753C22.9046 32.0596 21.8666 32.7019 21.0299 32.4438C20.684 32.337 20.3689 32.1343 20.1147 31.855C19.5 31.1797 19.5 29.8698 19.5 27.25C19.5 24.6303 19.5 23.3203 20.1147 22.6449C20.3689 22.3657 20.684 22.1631 21.0299 22.0563C21.8666 21.7981 22.9046 22.4404 24.9809 23.7247C27.1286 25.0534 28.2024 25.7178 28.4297 26.6578C28.5234 27.0459 28.5234 27.4542 28.4297 27.8422Z" stroke="white" stroke-width="2.25" stroke-linejoin="round"/>
 <defs>
-<linearGradient id="paint0_linear_1016_7375" x1="160" y1="0" x2="160" y2="320" gradientUnits="userSpaceOnUse">
-<stop stop-color="#475569"/>
-<stop offset="1" stop-color="#1E293B"/>
+<linearGradient id="paint0_linear_274_424" x1="24" y1="0" x2="24" y2="48" gradientUnits="userSpaceOnUse">
+<stop stop-color="#0D9488"/>
+<stop offset="1" stop-color="#0F766E"/>
 </linearGradient>
-<linearGradient id="paint1_linear_1016_7375" x1="160" y1="242.372" x2="160" y2="265" gradientUnits="userSpaceOnUse">
-<stop stop-color="#94A3B8"/>
-<stop offset="1" stop-color="#475569"/>
-</linearGradient>
-<linearGradient id="paint2_linear_1016_7375" x1="160" y1="65" x2="160" y2="235" gradientUnits="userSpaceOnUse">
-<stop stop-color="#60A5FA"/>
-<stop offset="1" stop-color="#2563EB"/>
-</linearGradient>
-<linearGradient id="paint3_linear_1016_7375" x1="134" y1="90" x2="134" y2="206.25" gradientUnits="userSpaceOnUse">
-<stop stop-color="#FB923C"/>
-<stop offset="1" stop-color="#EA580C"/>
-</linearGradient>
-<clipPath id="clip0_1016_7375">
-<rect width="320" height="320" fill="white"/>
-</clipPath>
-<clipPath id="clip1_1016_7375">
-<rect width="240" height="240" fill="white" transform="translate(40 40)"/>
-</clipPath>
 </defs>
 </svg>

plugins_public/tailwind/css/tailwind.css

@@ -770,14 +770,18 @@
     }
 
     .bx-form-section.bx-form-section-header {
-        @apply border border-gray-200 dark:border-gray-900 rounded-2xl;
+        @apply border border-gray-300 dark:border-gray-900 rounded-2xl;
+        @apply bg-gray-100 dark:bg-gray-800;
         @apply overflow-hidden;
     }
     .bx-form-section.bx-form-section-header .bx-form-section-title:hover {
-        @apply bg-gray-100 dark:bg-gray-900;
+        @apply bg-white dark:bg-gray-900 bg-gradient-to-b from-gray-100 dark:from-gray-800;
     }
-    .bx-form-section.bx-form-section-header:not(.bx-form-collapsed) .bx-form-section-title {
-        @apply bg-gray-100 dark:bg-gray-900;
+    .bx-form-section.bx-form-section-header:not(.bx-form-collapsed) {
+        @apply bg-white dark:bg-gray-900;
+    }
+    .bx-form-section.bx-form-section-header .bx-form-section-content {
+        @apply bg-white dark:bg-gray-900;
     }
 
     /* Common elements: Forms: Text Input */
@@ -825,7 +829,7 @@
     /* Common elements: Forms: Checkbox Input */
     .bx-form-input-wrapper-checkbox,
     .bx-form-input-wrapper-radio {
-        @apply block w-4 h-5;
+        @apply block w-5 h-5 m-0.5;
         @apply border-2 border-transparent;
     }
 
@@ -1234,7 +1238,7 @@
         @apply text-gray-300 dark:text-gray-700;
     }
 
-    /* Studio */    
+    /* Studio */
     .bx-std #bx-std-pcap-menu-popup-help .bx-popup,
     .bx-std #bx-std-pcap-menu-popup-actions .bx-popup,
     .bx-std #bx-std-pcap-menu-popup-account .bx-popup,
@@ -1245,13 +1249,22 @@
     .bx-std .bx-menu-top-center .bx-menu-tab-active .bx-mi-icon {
         @apply ring ring-blue-600 ring-offset-2 ring-offset-black;
     }
-    
+    .bx-std .bx-menu-top-center .bx-menu-item-static,
+    .bx-std .bx-menu-top-center .bx-menu-item-dynamic {
+        @apply hidden md:flex;
+    }
+
     .bx-std .bx-stg-icon-gray-bg {
         @apply h-8 w-8;
         @apply bg-gray-200 bg-no-repeat bg-center;
         @apply rounded-lg;
     }
 
+    /* Studio: Launcher */
+    .bx-std-widgets .bx-std-widget {
+        @apply px-6 pt-6 pb-3 sm:px-10 sm:pt-10 sm:pb-4;
+    }
+
 
     /* Modules: Timeline */
     .bx-artificer .group\/item:hover .bx-tl-item-text .bx-tl-content.bx-tl-overflow .bx-tl-content-overflow {

studio/js/launcher.js

@@ -34,6 +34,7 @@ BxDolStudioLauncher.prototype.init = function() {
 
     $(document).ready(function() {
         var hammertime = new Hammer($('.bx-std-widgets').get(0));
+        hammertime.get('press').set({time: 1000});
         hammertime.on('press', function(oEvent) {
             if(!$this.bJitterMode)
                 $this.enableJitter();

studio/template/bp_block_panel_top.html

@@ -1,15 +1,15 @@
 <div class="bx-std-pt-cnt bx-clearfix">
 	<div class="bx-std-pt-pages">__selector__</div>
 	<div class="bx-std-pt-buttons">
-	    <button class="bx-btn bx-def-margin-sec-left" onclick="javascript:__js_object__.performAction('__action_page_create__');"><bx_text:_adm_bp_btn_create_new /></button>
+	    <button class="bx-btn bx-def-margin-thd-left" onclick="javascript:__js_object__.performAction('__action_page_create__');"><bx_text:_adm_bp_btn_create_new /></button>
 	    <bx_if:show_actions>
                 <bx_if:can_view>
-                    <button class="bx-btn bx-def-margin-sec-left" onclick="javascript:window.open('__url_view__','_blank');"><bx_text:_adm_bp_btn_view_page /></button>
+                    <button class="bx-btn bx-def-margin-thd-left" onclick="javascript:window.open('__url_view__','_blank');"><bx_text:_adm_bp_btn_view_page /></button>
                 </bx_if:can_view>
-	        <button class="bx-btn bx-def-margin-sec-left" onclick="javascript:__js_object__.performAction('__action_page_edit__')"><bx_text:_adm_bp_btn_settings /></button>
-	        <button class="bx-btn bx-def-margin-sec-left" onclick="javascript:__js_object__.performAction('__action_block_create__')"><bx_text:_adm_bp_btn_add_block /></button>
+	        <button class="bx-btn bx-def-margin-thd-left" onclick="javascript:__js_object__.performAction('__action_page_edit__')"><bx_text:_adm_bp_btn_settings /></button>
+	        <button class="bx-btn bx-def-margin-thd-left" onclick="javascript:__js_object__.performAction('__action_block_create__')"><bx_text:_adm_bp_btn_add_block /></button>
 	        <bx_if:can_delete>
-	            <button class="bx-btn bx-def-margin-sec-left" onclick="javascript:__js_object__.deletePage();"><bx_text:_adm_bp_btn_delete /></button>
+	            <button class="bx-btn bx-def-margin-thd-left" onclick="javascript:__js_object__.deletePage();"><bx_text:_adm_bp_btn_delete /></button>
 	        </bx_if:can_delete>
 	    </bx_if:show_actions>
 	</div>

studio/template/css/builder_page.css

@@ -239,6 +239,9 @@ div.adm-bp-epf-controls {
     border-style: solid;
     border-width: 1px 0px 0px 0px;
 }
+div.adm-bp-epf-controls .bx-def-margin-sec-left {
+    margin-left: 0.5rem;
+}
 div#adm-bp-settings-group-layout {
     margin: 0px -10px;
 }

studio/template/css/common.less

@@ -73,6 +73,9 @@ div.bx-db-note {
     -moz-box-shadow: 0px 3px 5px 1px rgba(0,0,0,0.1);
     box-shadow: 0px 3px 5px 1px rgba(0,0,0,0.1);
 }
+.bx-popup-applied.bx-popup-menu:not(.bx-popup-chain) .bx-popup {
+    .radius(16px);
+}
 .bx-popup-applied .bx-popup-gap .bx-popup {
     margin-left: 0;
     margin-right: 0;
@@ -124,10 +127,12 @@ div.bx-db-note {
     box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.08);
 
     text-shadow: none;
+    text-transform: uppercase;
+    letter-spacing: 0.1em;
 
     font-family: sans-serif;
-    font-size: 0,875rem;
-    font-weight: 500;
+    font-size: 0.875rem;
+    font-weight: 600;
 }
 .bx-btn {
     border: 1px solid rgba(228, 228, 231, 1);

studio/template/css/forms.css

@@ -18,14 +18,15 @@
 .bx-form-value .bx-form-input-text,
 .bx-form-value .bx-form-input-price,
 .bx-form-value .bx-form-input-wrapper-price span {
-    height: 36px;
-    height: 2.4rem;
+    height: 2.5rem;
+    padding: 0 0.75rem;
     box-sizing: border-box;
 
-    border-color: rgba(136, 143, 153, 1);
-    border-width: 1px;
-    
-    font-size: 1.075rem;
+    border: 1px solid rgba(107, 114, 128, 0.2);
+    border-radius: 0.5rem;
+
+    line-height: 1.25rem;
+    font-size: 1.0rem;
 }
 .bx-form-input-rgb-list{
     color:#fff;
@@ -62,8 +63,12 @@
 .bx-form-value .bx-form-input-text:focus,
 .bx-form-value .bx-form-input-price:focus,
 .bx-form-value .bx-form-input-wrapper-password.bx-form-input-focus {
-    border-color: rgba(136, 143, 153, 1);
+    outline: 2px solid rgba(59,130,246,.5);
+    outline-offset: 2px;
+
     background-color: rgba(255, 255, 255, 1);
+
+    transition-duration: .1s;
 }
 
 .bx-form-value .bx-form-input-select_multiple,

studio/template/css/general.css

@@ -14,6 +14,9 @@ div.bx-std-cb {
 /**
  * Page
  */
+.bx-def-color-bg-page.bx-std-bg {
+    background-color: rgba(229, 231, 235, 1.0);
+}
 
 /**
  * Page Content
@@ -122,10 +125,10 @@ div.bx-std-pcap-mp-right div.bx-std-pcap-action {
  */
 div.bx-std-pmen-item {
     position: relative;
-    height: 4.0rem;
+    height: 3.0rem;
     margin-top: 0.125rem;
 
-    border-radius: 1rem;
+    border-radius: 0.75rem;
 
     font-size: 1.0rem;
     font-weight: 500;
@@ -157,13 +160,13 @@ div.bx-std-pmen-item .bx-std-pmen-ic-icon {
     display: none;
     flex: 0 0 auto;
 
-    width: 3.0rem;
-    height: 3.0rem;
+    width: 2.0rem;
+    height: 2.0rem;
     box-sizing: border-box;
 
     margin-right: 1rem;
     
-    border-radius: 0.75rem;
+    border-radius: 0.375rem;
     background-repeat: no-repeat;
     background-position: center center;
 }
@@ -193,7 +196,7 @@ div.bx-std-pmen-item a {
 }
 
 div.bx-std-pmen-item .sys-icon {
-    font-size: 2rem;
+    font-size: 1.25rem;
     text-align: center;
 }
 

studio/template/css/launcher.css

@@ -81,7 +81,6 @@ div.bx-std-widgets-highlight {
 }
 div.bx-std-widget {
     position: relative;
-    padding: 24px 24px 12px 24px;
 }
 div.bx-std-widget-empty {
     width: 5.0rem;

studio/template/css/menu_top.css

@@ -208,6 +208,10 @@ div.bx-std-menu-top .bx-menu-toolbar li.bx-menu-tab-search {
 
     max-width: 24rem;
 }
+div.bx-std-menu-top .bx-menu-toolbar li.bx-menu-tab-search img {
+    height: 2rem;
+}
+
 div.bx-std-menu-top .bx-menu-toolbar li.bx-menu-tab-search .bx-form-input-text {
     height: 3rem;
     padding-left: 0.5rem;
@@ -265,24 +269,6 @@ body > .bx-popup-wrapper.bx-std-mod-popup-settings-wrapper,
 #bx-std-pcap-menu-popup-account {
     overflow: visible;
 }
-.bx-std-mod-popup-settings-wrapper::before,
-#bx-std-pcap-menu-popup-help:before,
-#bx-std-pcap-menu-popup-actions:before,
-#bx-std-pcap-menu-popup-account::before {
-    position: absolute;
-    display: block;
-    content: '';
-
-    top: 0.25rem;
-    right: 1.0rem;
-    width: 0.5rem;
-    height: 0.5rem;
-
-    box-shadow: inset 1px 1px 0px rgba(240, 240, 240, 0.2);
-    background-color: #001529;
-
-    transform: rotate(45deg);
-}
 .bx-std-mod-popup-settings-wrapper .bx-popup-gap,
 #bx-std-pcap-menu-popup-help .bx-popup-gap,
 #bx-std-pcap-menu-popup-actions .bx-popup-gap,
@@ -323,7 +309,7 @@ body > .bx-popup-wrapper.bx-std-mod-popup-settings-wrapper,
     align-items: center;
 }
 #bx-std-pcap-menu-popup-account .bx-popup li svg {
-    margin-right: 0.25rem;
+    margin-right: 0.75rem;
 }
 
 .bx-std-mod-popup-settings-wrapper,

studio/template/css/page.css

@@ -32,7 +32,7 @@ div.bx-std-blocks-line .bx-std-block-wrp {
  */
 div.bx-std-block {
     min-height: calc(100vh - 5rem);
-    background-color: rgba(255, 255, 255, 1.0);
+    background-color: rgba(229, 231, 235, 1.0);
 }
 div.bx-std-block-caption {
     position: relative;

studio/template/css/settings.css

@@ -4,10 +4,10 @@
 
 #adm-settings-form-categorized {
     position: relative;
-    padding-bottom: 5.5rem;
+    padding-bottom: 5.0rem;
 }
 #adm-settings-form-categorized .bx-form-advanced-wrapper {
-    height: calc(100vh - 10.5rem);
+    height: calc(100vh - 10.0rem);
     overflow-y: auto;
 }
 #adm-settings-form .bx-form-advanced-wrapper .bx-form-section-wrapper,
@@ -20,9 +20,10 @@
     width: 100%;
     
     margin: 0;
-    padding: 1.5rem;
+    padding: 1.25rem 1.5rem;
 
-    border-top: 1px solid rgb(228, 228, 231, 1);
+    border-top: 1px solid rgba(209, 213, 219, 1.0);
+    background-color: rgba(255, 255, 255, 1.0);
 }
 
 #adm-settings-form .bx-form-advanced-wrapper .bx-form-section-wrapper:first-child,

studio/template/images/icons/tmi-account.svg

@@ -1,12 +1,5 @@
 <svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g clip-path="url(#clip0_57_2072)">
 <path d="M5.33325 8H26.6666" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
 <path d="M5.33325 16H26.6666" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
 <path d="M5.33325 24H26.6666" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-</g>
-<defs>
-<clipPath id="clip0_57_2072">
-<rect width="32" height="32" fill="white"/>
-</clipPath>
-</defs>
-</svg>
+</svg>

studio/template/images/icons/tmi-help.svg

@@ -1,12 +1,5 @@
 <svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g clip-path="url(#clip0_57_2060)">
 <path d="M4 16C4 17.5759 4.31039 19.1363 4.91345 20.5922C5.5165 22.0481 6.40042 23.371 7.51472 24.4853C8.62902 25.5996 9.95189 26.4835 11.4078 27.0866C12.8637 27.6896 14.4241 28 16 28C17.5759 28 19.1363 27.6896 20.5922 27.0866C22.0481 26.4835 23.371 25.5996 24.4853 24.4853C25.5996 23.371 26.4835 22.0481 27.0866 20.5922C27.6896 19.1363 28 17.5759 28 16C28 12.8174 26.7357 9.76516 24.4853 7.51472C22.2348 5.26428 19.1826 4 16 4C12.8174 4 9.76516 5.26428 7.51472 7.51472C5.26428 9.76516 4 12.8174 4 16Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
 <path d="M16 21.3333V21.3467" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
 <path d="M16 17.3333C16.5997 17.3351 17.1824 17.1348 17.6542 16.7646C18.126 16.3944 18.4592 15.876 18.6001 15.2931C18.7409 14.7102 18.6812 14.0968 18.4306 13.5521C18.1799 13.0073 17.753 12.5629 17.2187 12.2907C16.6882 12.0189 16.0815 11.9347 15.4971 12.0516C14.9127 12.1685 14.385 12.4798 14 12.9347" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-</g>
-<defs>
-<clipPath id="clip0_57_2060">
-<rect width="32" height="32" fill="white"/>
-</clipPath>
-</defs>
-</svg>
+</svg>

studio/template/images/icons/tmi-search.svg

@@ -1,11 +1,4 @@
 <svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g clip-path="url(#clip0_57_1633)">
-<path d="M4 13.3333C4 14.559 4.24141 15.7727 4.71046 16.905C5.1795 18.0374 5.86699 19.0663 6.73367 19.933C7.60035 20.7997 8.62925 21.4872 9.76162 21.9562C10.894 22.4253 12.1077 22.6667 13.3333 22.6667C14.559 22.6667 15.7727 22.4253 16.905 21.9562C18.0374 21.4872 19.0663 20.7997 19.933 19.933C20.7997 19.0663 21.4872 18.0374 21.9562 16.905C22.4253 15.7727 22.6667 14.559 22.6667 13.3333C22.6667 12.1077 22.4253 10.894 21.9562 9.76162C21.4872 8.62925 20.7997 7.60035 19.933 6.73367C19.0663 5.86699 18.0374 5.1795 16.905 4.71046C15.7727 4.24141 14.559 4 13.3333 4C12.1077 4 10.894 4.24141 9.76162 4.71046C8.62925 5.1795 7.60035 5.86699 6.73367 6.73367C5.86699 7.60035 5.1795 8.62925 4.71046 9.76162C4.24141 10.894 4 12.1077 4 13.3333Z" stroke="#D1D5DB" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M28 28L20 20" stroke="#D1D5DB" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-</g>
-<defs>
-<clipPath id="clip0_57_1633">
-<rect width="32" height="32" fill="white"/>
-</clipPath>
-</defs>
-</svg>
+<path d="M4 13.3333C4 14.559 4.24141 15.7727 4.71046 16.905C5.1795 18.0374 5.86699 19.0663 6.73367 19.933C7.60035 20.7997 8.62925 21.4872 9.76162 21.9562C10.894 22.4253 12.1077 22.6667 13.3333 22.6667C14.559 22.6667 15.7727 22.4253 16.905 21.9562C18.0374 21.4872 19.0663 20.7997 19.933 19.933C20.7997 19.0663 21.4872 18.0374 21.9562 16.905C22.4253 15.7727 22.6667 14.559 22.6667 13.3333C22.6667 12.1077 22.4253 10.894 21.9562 9.76162C21.4872 8.62925 20.7997 7.60035 19.933 6.73367C19.0663 5.86699 18.0374 5.1795 16.905 4.71046C15.7727 4.24141 14.559 4 13.3333 4C12.1077 4 10.894 4.24141 9.76162 4.71046C8.62925 5.1795 7.60035 5.86699 6.73367 6.73367C5.86699 7.60035 5.1795 8.62925 4.71046 9.76162C4.24141 10.894 4 12.1077 4 13.3333Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M28 28L20 20" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

studio/template/images/icons/tmi-site.svg

@@ -1,12 +1,5 @@
 <svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g clip-path="url(#clip0_57_2066)">
 <path d="M12 20L20 12" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
 <path d="M14.6667 7.99999L15.2841 7.28532C16.5345 6.03509 18.2303 5.33279 19.9986 5.33292C21.7668 5.33304 23.4625 6.03558 24.7127 7.28599C25.963 8.5364 26.6653 10.2322 26.6652 12.0005C26.665 13.7687 25.9625 15.4644 24.7121 16.7147L24.0001 17.3333" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
 <path d="M17.3334 24L16.8041 24.712C15.5391 25.9629 13.8318 26.6645 12.0528 26.6645C10.2737 26.6645 8.56644 25.9629 7.30144 24.712C6.67792 24.0955 6.1829 23.3614 5.84506 22.5522C5.50721 21.743 5.33325 20.8749 5.33325 19.998C5.33325 19.1211 5.50721 18.253 5.84506 17.4438C6.1829 16.6346 6.67792 15.9005 7.30144 15.284L8.00011 14.6667" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-</g>
-<defs>
-<clipPath id="clip0_57_2066">
-<rect width="32" height="32" fill="currentColor"/>
-</clipPath>
-</defs>
-</svg>
+</svg>

studio/template/menu_top_toolbar.html

@@ -1,7 +1,10 @@
 <ul class="bx-menu-toolbar gap-x-4">
     <bx_if:show_search>
-        <li class="bx-menu-tab-search flex-auto">
-            <img class="ml-2" src="<bx_icon_url:tmi-search.svg />" />
+        <li class="bx-menu-tab-search flex-auto text-gray-400">
+            <svg class="ml-2" width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+                <path d="M4 13.3333C4 14.559 4.24141 15.7727 4.71046 16.905C5.1795 18.0374 5.86699 19.0663 6.73367 19.933C7.60035 20.7997 8.62925 21.4872 9.76162 21.9562C10.894 22.4253 12.1077 22.6667 13.3333 22.6667C14.559 22.6667 15.7727 22.4253 16.905 21.9562C18.0374 21.4872 19.0663 20.7997 19.933 19.933C20.7997 19.0663 21.4872 18.0374 21.9562 16.905C22.4253 15.7727 22.6667 14.559 22.6667 13.3333C22.6667 12.1077 22.4253 10.894 21.9562 9.76162C21.4872 8.62925 20.7997 7.60035 19.933 6.73367C19.0663 5.86699 18.0374 5.1795 16.905 4.71046C15.7727 4.24141 14.559 4 13.3333 4C12.1077 4 10.894 4.24141 9.76162 4.71046C8.62925 5.1795 7.60035 5.86699 6.73367 6.73367C5.86699 7.60035 5.1795 8.62925 4.71046 9.76162C4.24141 10.894 4 12.1077 4 13.3333Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+                <path d="M28 28L20 20" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+            </svg>
             <div class="bx-form-input-wrapper bx-form-input-wrapper-text">
                 <input type="text" name="search" value="" placeholder="<bx_text_attribute:_adm_tmi_cpt_search />" class="bx-def-font-inputs bx-form-input-text" onkeydown="return oBxDolStudioMenuTop.searchWidget(event)" />
             </div>