tabexseriescomponents 0.0.707 → 0.0.708

package/{srcoriginal → srcoman}/TabexComponents/Headers/Simpleheader/Simpleheader.jsx

@@ -359,7 +359,6 @@ const Simpleheader = (props) => {
             {templateproperties_context.showsocialmedia == 'Show' && (
                 <SocialMediaSection sectionpropertiesprops={sectionproperties} templateproperties_contextprops={templateproperties_context} actions={actions} />
             )}
-            {/* Show when logged in */}
             {sectionproperties.showfloatingbtn == 'Show' && (
                 <div
                     style={{
@@ -369,7 +368,6 @@ const Simpleheader = (props) => {
                         zIndex: 2000,
                         transition: 'all 0.3s ease-out',
                         width: '100%',
-                        display: sectionproperties.showfloatingbtn == 'Show when logged in' ? 'none' : 'flex',
                     }}
                     class="text-end"
                 >
@@ -377,42 +375,7 @@ const Simpleheader = (props) => {
                         class={header_cssstyles.floatingbtn + ' allcentered '}
                         style={{}}
                         onClick={() => {
-                            if (sectionproperties.btnlinktype == 'Website Link') {
-                                routingcountext(sectionproperties.floatingbtnlink, false, '');
-                            } else {
-                                window.open(sectionproperties.floatingbtnlink, '_blank');
-
-                                // routingcountext(sectionproperties.floatingbtnlink, true, '');
-                            }
-                        }}
-                    >
-                        <p class="m-0 p-0">{langdetect == 'en' ? sectionproperties.floatingbtntxten : sectionproperties.floatingbtntxtar}</p>
-                    </div>
-                </div>
-            )}
-            {sectionproperties.showfloatingbtn == 'Show when logged in' && authdetailsContext.loggedin && (
-                <div
-                    style={{
-                        position: 'fixed',
-                        bottom: 15,
-                        right: 15,
-                        zIndex: 2000,
-                        transition: 'all 0.3s ease-out',
-                        width: '100%',
-                    }}
-                    class="text-end"
-                >
-                    <div
-                        class={header_cssstyles.floatingbtn + ' allcentered '}
-                        style={{}}
-                        onClick={() => {
-                            if (sectionproperties.btnlinktype == 'Website Link') {
-                                routingcountext(sectionproperties.floatingbtnlink, false, '');
-                            } else {
-                                window.open(sectionproperties.floatingbtnlink, '_blank');
-
-                                // routingcountext(sectionproperties.floatingbtnlink, true, '');
-                            }
+                            routingcountext(sectionproperties.floatingbtnlink, false, '');
                         }}
                     >
                         <p class="m-0 p-0">{langdetect == 'en' ? sectionproperties.floatingbtntxten : sectionproperties.floatingbtntxtar}</p>
@@ -620,7 +583,7 @@ const Simpleheader = (props) => {
                                                 </i>
                                             </div>
                                         )}
-                                        {sectionproperties.userbtnstyle == 'Style 2' && !authdetailsContext.loggedin && (
+                                        {sectionproperties.userbtnstyle == 'Style 2' && !authdetailsContext.loggedin && sectionproperties.ShowUserBtn == 'Show' && (
                                             <div
                                                 class={`${header_cssstyles.user_btn}` + ' allcentered '}
                                                 onClick={() => {
@@ -639,7 +602,7 @@ const Simpleheader = (props) => {
                                                 </p>
                                             </div>
                                         )}
-                                        {sectionproperties.userbtnstyle == 'Style 2' && authdetailsContext.loggedin && (
+                                        {sectionproperties.userbtnstyle == 'Style 2' && authdetailsContext.loggedin && sectionproperties.ShowUserBtn == 'Show' && (
                                             <Dropdown>
                                                 <Dropdown.Toggle>
                                                     <div className={header_cssstyles.userBtnLoggedinContainer + ' allcentered '} sytle={{ position: 'relative' }}>
@@ -741,7 +704,7 @@ const Simpleheader = (props) => {
                                                 </Dropdown.Menu>
                                             </Dropdown>
                                         )}
-                                        {sectionproperties.userbtnstyle == 'Style 1' && (
+                                        {sectionproperties.userbtnstyle == 'Style 1' && sectionproperties.ShowUserBtn == 'Show' && (
                                             <Dropdown>
                                                 <Dropdown.Toggle>
                                                     {!authdetailsContext.loggedin && (

package/{srcoriginal → srcoman}/TabexComponents/Headers/SocialMediaSection/SocialMediaSection.jsx

@@ -5,7 +5,6 @@ import { FaWhatsapp } from '@react-icons/all-files/fa/FaWhatsapp';
 import { AiFillInstagram } from '@react-icons/all-files/ai/AiFillInstagram';
 import { AiFillYoutube } from '@react-icons/all-files/ai/AiFillYoutube';
 import { IoLogoTiktok } from '@react-icons/all-files/io5/IoLogoTiktok';
-import { FaLinkedinIn } from '@react-icons/all-files/fa/FaLinkedinIn';
 
 const SocialMediaSection = (props) => {
     const actions = props.actions;
@@ -94,23 +93,6 @@ const SocialMediaSection = (props) => {
                 </div>
             )}
 
-            {authdetailsContext?.instinfo?.linkedinlink != null && (
-                <div
-                    class={`${header_cssstyles.socialmediaicon}` + '  allcentered mx-2 cursor-pointer '}
-                    onClick={() => {
-                        if (authdetailsContext?.instinfo?.linkedinlink != null) {
-                            window.open(authdetailsContext?.instinfo?.linkedinlink, '_blank');
-                        }
-                    }}
-                >
-                    <FaLinkedinIn
-                        style={{
-                            fontSize: parseFloat(templateproperties_context.socialmediasectioniconfontsize) + 2 + 'px',
-                        }}
-                    />
-                </div>
-            )}
-
             {authdetailsContext?.instinfo?.tiktoklink != null && (
                 <div
                     class={`${header_cssstyles.socialmediaicon}` + '  allcentered mx-2 cursor-pointer '}

package/{srcoriginal → srcoman}/TabexComponents/Headers/TwoTieredHeader/TwoTieredHeader.jsx

@@ -2,7 +2,6 @@ import React, { useEffect, useState } from 'react';
 import { Link } from 'react-router-dom';
 import { css } from 'glamor';
 import Dropdown from 'react-bootstrap/Dropdown';
-import HeaderresponsiveStyle2 from '../Headerresponsive/HeaderresponsiveStyle2.jsx';
 import Searchlist from '../../StaticPages/Searchlist/Searchlist.jsx';
 import Headerresponsive from '../Headerresponsive/Headerresponsive.jsx';
 import Subheader from '../Subheader/Subheader.jsx';
@@ -1082,10 +1081,7 @@ const TwoTieredHeader = (props) => {
                 </div>
             </div>
             <div class="col-lg-12 p-0">
-                {sectionproperties.responsiveheaderstyle == 'Style 1' && <Headerresponsive sectionpropertiesprops={sectionproperties} actions={actions} />}
-                {sectionproperties.responsiveheaderstyle == 'Style 1 With Canvas' && <Headerresponsive sectionpropertiesprops={sectionproperties} actions={actions} />}
-                {sectionproperties.responsiveheaderstyle == 'Style 2' && <HeaderresponsiveStyle2 sectionpropertiesprops={sectionproperties} actions={actions} />}
-                {sectionproperties.responsiveheaderstyle == 'Style 2 With Subheader' && <HeaderresponsiveStyle2 sectionpropertiesprops={sectionproperties} actions={actions} />}
+                <Headerresponsive sectionpropertiesprops={sectionproperties} actions={actions} />
             </div>
         </div>
     );

package/{srcoriginal → srcoman}/TabexComponents/Headers/TwoTieredWithCenteredLogoHeader/TwoTieredWithCenteredLogoHeader.jsx

@@ -2,10 +2,9 @@ import React, { useEffect, useState } from 'react';
 import headerstyles from '../../../styles/headers/NewHeader.module.css';
 import { css } from 'glamor';
 import Dropdown from 'react-bootstrap/Dropdown';
+import { Imagekitimagecomp } from '../../../Imagekitconfig.jsx';
 import Searchlist from '../../StaticPages/Searchlist/Searchlist.jsx';
 import Headerresponsive from '../Headerresponsive/Headerresponsive.jsx';
-import HeaderresponsiveStyle2 from '../Headerresponsive/HeaderresponsiveStyle2.jsx';
-import { Imagekitimagecomp } from '../../../Imagekitconfig.jsx';
 import Subheader from '../Subheader/Subheader.jsx';
 import { BiSearch } from '@react-icons/all-files/bi/BiSearch';
 import { FiGlobe } from '@react-icons/all-files/fi/FiGlobe';
@@ -421,6 +420,7 @@ const TwoTieredWithCenteredLogoHeader = (props) => {
                 )
                 // <MarqueeHeader sectionpropertiesprops={sectionproperties} actions={actions} />
             }
+
             <div class={` ${header_cssstyles.headercontainer}` + ' d-flex d-md-none align-items-center m-0 pl-lg-2 pr-lg-2 '}>
                 <div class="row m-0 w-100 ">
                     <div class={' col-lg-12 d-flex align-items-center p-0 '}>
@@ -927,10 +927,8 @@ const TwoTieredWithCenteredLogoHeader = (props) => {
                     )}
                 </div>
             </div>
-            {sectionproperties.responsiveheaderstyle == 'Style 1' && <Headerresponsive sectionpropertiesprops={sectionproperties} actions={actions} />}
-            {sectionproperties.responsiveheaderstyle == 'Style 1 With Canvas' && <Headerresponsive sectionpropertiesprops={sectionproperties} actions={actions} />}
-            {sectionproperties.responsiveheaderstyle == 'Style 2' && <HeaderresponsiveStyle2 sectionpropertiesprops={sectionproperties} actions={actions} />}
-            {sectionproperties.responsiveheaderstyle == 'Style 2 With Subheader' && <HeaderresponsiveStyle2 sectionpropertiesprops={sectionproperties} actions={actions} />}{' '}
+
+            <Headerresponsive sectionpropertiesprops={sectionproperties} actions={actions} />
         </div>
     );
 };

package/{srcoriginal → srcoman}/TabexComponents/Sections/BackgroundImages/DynamicForm/DynamicForm.jsx

@@ -7,9 +7,8 @@ import { IoMdClose } from '@react-icons/all-files/io/IoMdClose';
 import { BsChevronLeft } from '@react-icons/all-files/bs/BsChevronLeft';
 import { BsChevronRight } from '@react-icons/all-files/bs/BsChevronRight';
 // 49
-import PhoneInput from 'react-phone-input-2';
-
 import { Modal } from 'react-bootstrap';
+import { fontSize } from '@mui/system';
 const DynamicForm = (props) => {
     const lang = props.actions.lang;
     const langdetect = props.actions.langdetect;
@@ -126,8 +125,6 @@ const DynamicForm = (props) => {
             type = 'number';
         } else if (item.type == 'text') {
             type = 'text';
-        } else if (item.type == 'phone number') {
-            type = 'phonenumber';
         }
         if (item.type == 'date') {
             return (
@@ -190,37 +187,6 @@ const DynamicForm = (props) => {
             );
         }
     };
-    const phonenumber = (item, index) => {
-        return (
-            <div class={'col-md-12 col-lg-' + sectionproperties.numberofcolsperrow}>
-                <div class="row m-0 w-100 mb-3">
-                    <div class="col-lg-12 text-start mb-2 p-0">
-                        <p class={form_cssstyles.formlabel + ' m-0 p-0 '} style={{}}>
-                            {langdetect == 'en' ? item.title_en : item.title_ar} <sup class="text-danger">{item.isrequired == 1 ? '*' : ''}</sup>
-                        </p>
-                    </div>
-                    <PhoneInput
-                        className={`${formstyles.form_control} ${form_cssstyles.form_control}`}
-                        country={'eg'}
-                        enableSearch={true}
-                        autoFormat={true}
-                        value={item.value}
-                        inputStyle={{
-                            color: sectionproperties.inputfieldcolor,
-                        }}
-                        onChange={(event, country) => {
-                            updateformfield(event, index);
-                            // var temp = { ...payloadobj };
-                            // temp.mobile = event;
-                            // temp.countrydialcode = country.dialCode;
-                            // setpayloadobj({ ...temp });
-                        }}
-                        style={{ direction: 'ltr', color: sectionproperties.inputfieldcolor }}
-                    />
-                </div>
-            </div>
-        );
-    };
     const textareaitem = (item, index) => {
         return (
             <div class={'col-md-12 col-lg-12'}>
@@ -309,11 +275,10 @@ const DynamicForm = (props) => {
             width: sectionproperties.generalbtn_width + '%',
             height: sectionproperties.generalbtn_height + 'px',
             backgroundColor: sectionproperties.generalbtn_bgColor,
-            borderRadius: sectionproperties.generalbtn_bgColor,
+            borderRadius: sectionproperties.generalbtnborderradius + 'px',
             color: sectionproperties.generalbtn_textColor,
             fontSize: sectionproperties.generalbtn_fontsize,
             fontWeight: sectionproperties.generalbtn_fontweight,
-            borderRadius: sectionproperties.generalbtnborderradius + 'px',
             ':hover': {
                 transition: '.3s',
                 color: sectionproperties.generalbtn_textColoronhover,
@@ -351,6 +316,14 @@ const DynamicForm = (props) => {
                 backgroundColor: '#044da6',
             },
         }),
+        sectiontitle: css({
+            color: sectionproperties.sectionTitleColor,
+            fontSize: sectionproperties.sectionTitleFontSize + 'px',
+            fontWeight: sectionproperties.sectionTitleFontWeight,
+            '@media (max-width: 800px)': {
+                fontSize: sectionproperties.sectionTitleFontSizeresp,
+            },
+        }),
     };
     return (
         <div
@@ -398,14 +371,7 @@ const DynamicForm = (props) => {
                                 marginBottom: sectionproperties.sectionTitleMarginBottom + 'px',
                             }}
                         >
-                            <p
-                                class="m-0 p-0"
-                                style={{
-                                    color: sectionproperties.sectionTitleColor,
-                                    fontSize: sectionproperties.sectionTitleFontSize + 'px',
-                                    fontWeight: sectionproperties.sectionTitleFontWeight,
-                                }}
-                            >
+                            <p class={form_cssstyles.sectiontitle + ' m-0 p-0 '} style={{}}>
                                 {langdetect == 'en' ? formtitleen : formtitlear}
                             </p>
                         </div>
@@ -563,14 +529,7 @@ const DynamicForm = (props) => {
                             marginBottom: sectionproperties.sectionTitleMarginBottom + 'px',
                         }}
                     >
-                        <p
-                            class="m-0 p-0"
-                            style={{
-                                color: sectionproperties.sectionTitleColor,
-                                fontSize: sectionproperties.sectionTitleFontSize + 'px',
-                                fontWeight: sectionproperties.sectionTitleFontWeight,
-                            }}
-                        >
+                        <p class={form_cssstyles.sectiontitle + ' m-0 p-0 '} style={{}}>
                             {langdetect == 'en' ? formtitleen : formtitlear}
                         </p>
                     </div>
@@ -581,8 +540,6 @@ const DynamicForm = (props) => {
                                     {dynamicform?.fields?.map(function (item, index) {
                                         if (item.type == 'text' || item.type == 'date' || item.type == 'number') {
                                             return inputitem(item, index);
-                                        } else if (item.type == 'phone number') {
-                                            return phonenumber(item, index);
                                         } else if (item.type == 'textarea') {
                                             return textareaitem(item, index);
                                         } else if (item.type == 'selectbox') {
@@ -650,23 +607,16 @@ const DynamicForm = (props) => {
                             <IoMdClose size={20} class="" color={'#fff'} />
                         </i>
                     </div>
-                    <div
-                        class="row m-0 w-100 py-4"
-                        style={{
-                            background: sectionproperties.popupbackgroundcolor,
-                        }}
-                    >
-                        <div class="col-lg-12 allcentered py-4">
-                            <p
-                                class="m-0 p-0"
-                                style={{
-                                    fontSize: 20,
-                                    color: sectionproperties.popuptextcolor,
-                                }}
-                            >
-                                {confirmationtext}
-                            </p>
-                        </div>
+                    <div class="col-lg-12 allcentered my-4 py-4">
+                        <p
+                            class="m-0 p-0"
+                            style={{
+                                fontSize: 20,
+                                color: '#000',
+                            }}
+                        >
+                            {confirmationtext}
+                        </p>
                     </div>
                 </Modal.Body>
                 <Modal.Footer></Modal.Footer>

package/{srcoriginal → srcoman}/TabexComponents/Sections/BackgroundImages/Twobgimages/Twobgimages.jsx

@@ -1,4 +1,4 @@
-// import Categoriesdropdown from '../../../StaticPages/Categoriesdropdown/Categoriesdropdown.js';
+import Categoriesdropdown from '../../../StaticPages/Categoriesdropdown/Categoriesdropdown.jsx';
 import React, { useEffect, useState, useContext } from 'react';
 import { css } from 'glamor';
 import { serverbaselink } from '../../../../../Env.js';
@@ -207,8 +207,8 @@ const Twobgimages = (props) => {
                                         className={
                                             bgimagearrayofobjs[index].bg1_numberofcols != 12
                                                 ? sectionproperties.imagepadding != 0
-                                                    ? ' d-flex align-items-stretch col-md-4 col-sm-12 pr-sm-2 pl-sm-2 mb-md-3 mt-md-3 col-lg-' + bgimagearrayofobjs[index].bg1_numberofcols
-                                                    : ' d-flex align-items-stretch col-md-4 col-sm-12 p-sm-0 col-lg-' + bgimagearrayofobjs[index].bg1_numberofcols
+                                                    ? ' d-flex align-items-stretch col-md-6 col-sm-12 pr-sm-2 pl-sm-2 mb-md-3 mt-md-3 col-lg-' + bgimagearrayofobjs[index].bg1_numberofcols
+                                                    : ' d-flex align-items-stretch col-md-6 col-sm-12 p-sm-0 col-lg-' + bgimagearrayofobjs[index].bg1_numberofcols
                                                 : ' d-flex align-items-stretch col-md-12 col-sm-12 pr-md-0 pl-md-0 col-lg-' + bgimagearrayofobjs[index].bg1_numberofcols
                                         }
                                         style={{
@@ -222,6 +222,7 @@ const Twobgimages = (props) => {
                                                 if (item.place_clickable == 'General') {
                                                     if (item.externallink == 'Yes') {
                                                         window.open(item.clickable_page_route, '_blank');
+
                                                         // history.push(item.clickable_page_route);
                                                     } else if (item.clickable_page_route && item.clickable_page_route.length != 0) {
                                                         routingcountext(item.clickable_page_route, false, '');

package/{srcoriginal → srcoman}/TabexComponents/Sections/BackgroundImages/VideosSection/VideosSection.jsx

@@ -67,9 +67,9 @@ const VideosSection = (props) => {
             borderTopRightRadius: langdetect == 'en' ? sectionproperties.image_bordertoprightradius + 'px' : sectionproperties.image_bordertopleftradius + 'px',
             borderBottomLeftRadius: langdetect == 'en' ? sectionproperties.image_borderBottomLeftRadius + 'px' : sectionproperties.image_borderBottomRightRadius + 'px',
             borderBottomRightRadius: langdetect == 'en' ? sectionproperties.image_borderBottomRightRadius + 'px' : sectionproperties.image_borderBottomLeftRadius + 'px',
-            height: sectionproperties.image_height == 0 ? '100%' : sectionproperties.image_height + 'px',
+            height: sectionproperties.image_height + 'px',
             '@media (max-width: 800px)': {
-                height: sectionproperties.image_height == 0 ? '100%' : sectionproperties.height_responsive + 'px',
+                height: sectionproperties.height_responsive + 'px',
             },
         }),
         lau: css({
@@ -345,7 +345,7 @@ const VideosSection = (props) => {
                     <div class="row m-0 w-100 d-flex">
                         {sectionproperties.view_as_slider_vertical == 'Slider (Horizontal)' && (
                             <div class="col-lg-12 p-0">
-                                <ScrollMenu transitionBehavior={'auto'} wrapperClassName={''} itemClassName={''} scrollContainerClassName={'scrollmenuclasssubscrollbar'}>
+                                <ScrollMenu transitionBehavior={'auto'} wrapperClassName={''} itemClassName={'videoscard'} scrollContainerClassName={'scrollmenuclasssubscrollbar'}>
                                     {Object.keys(videosarrayofobjs).length != 0 &&
                                         videosarrayofobjs.map((item, index) => {
                                             return (

package/{srcoriginal/TabexComponents/Sections/Cards/CardsSection/CardsSection21-11beforeform.jsx → srcoman/TabexComponents/Sections/Cards/CardsSection/CardsSection.jsx}

@@ -352,11 +352,6 @@ const CardsSection = (props) => {
                 } else {
                     cardobj.description = arrayItem.productinfo.description_ar;
                 }
-                if (langdetect == 'en') {
-                    cardobj.shortdescription = arrayItem.short_description_ar;
-                } else {
-                    cardobj.shortdescription = arrayItem.productinfo.description_ar;
-                }
                 if (langdetect == 'en') {
                     cardobj.shortdescription = arrayItem.short_description_en;
                 } else {
@@ -719,11 +714,12 @@ const CardsSection = (props) => {
     const SectionTitle = () => {
         return (
             <div
-                class="d-flex align-items-center flex-row"
+                class="d-flex align-items-center"
                 style={{
                     position: 'relative',
                     justifyContent: sectionproperties.sectiontitleposition == 'Centered' ? 'center' : '',
                     width: sectionproperties.sectiontitlestyle == 'Line Before Text' ? '100%' : '',
+                    flexDirection: sectionproperties.sectiontitlestyle == 'Line Under Text' ? 'column' : 'row',
                 }}
             >
                 {sectionproperties.sectiontitlestyle == 'Line Before Text' && <span class={section_cssstyles.line_left}></span>}
@@ -754,6 +750,17 @@ const CardsSection = (props) => {
                     {langdetect == 'en' ? sectionproperties.sectionTitleContent : sectionproperties.sectionTitleContent_ar}
                 </p>
                 {sectionproperties.sectiontitlestyle == 'Line Before Text' && <span class={section_cssstyles.line_right}></span>}
+                {sectionproperties.sectiontitlestyle == 'Line Under Text' && (
+                    <span
+                        style={{
+                            width: '50%',
+                            background: sectionproperties.linebgcolor,
+                            height: 3,
+                            borderRadius: 10,
+                            marginTop: 5,
+                        }}
+                    ></span>
+                )}
             </div>
         );
     };