diff --git a/src/javascript/app/common/active_symbols.js b/src/javascript/app/common/active_symbols.js
index 0deb78f4c4a..f683c2451a7 100644
--- a/src/javascript/app/common/active_symbols.js
+++ b/src/javascript/app/common/active_symbols.js
@@ -33,7 +33,7 @@ const marketOrder = [
     'synthetics',
 ];
 
-const derived = ['baskets','synthetics'];
+const derived = ['baskets', 'synthetics'];
 
 const ActiveSymbols = (() => {
     const groupBy = (xs, key) => (
diff --git a/src/javascript/app/pages/bottom/data/explanation.js b/src/javascript/app/pages/bottom/data/explanation.js
index f6136c43cb5..763d42e143e 100644
--- a/src/javascript/app/pages/bottom/data/explanation.js
+++ b/src/javascript/app/pages/bottom/data/explanation.js
@@ -225,11 +225,11 @@ export const contractExplanationData = {
             content: [
                 localize('The [_1]high[_2] is the highest point ever reached by the market during the contract period.', ['<strong>', '</strong>']),
                 localize('The [_1]low[_2] is the lowest point ever reached by the market during the contract period.', ['<strong>', '</strong>']),
-                localize('The [_1]close[_2] is the latest tick at or before the [_1]end time[_2]. If you selected a specific [_1]end time,[_2] the [_1]end time[_2] is the selected time.',['<strong>', '</strong>']),
+                localize('The [_1]close[_2] is the latest tick at or before the [_1]end time[_2]. If you selected a specific [_1]end time,[_2] the [_1]end time[_2] is the selected time.', ['<strong>', '</strong>']),
             ],
             title_secondary  : localize('Contract period') ,
             content_secondary: [
-                localize('The [_1]contract period[_2] is the period between the [_1]first tick[_2] (after start time) and the [_1]end time[_2].',['<strong>', '</strong>']),
+                localize('The [_1]contract period[_2] is the period between the [_1]first tick[_2] (after start time) and the [_1]end time[_2].', ['<strong>', '</strong>']),
                 localize('The [_1]start time[_2] begins when the contract is processed by our servers.', ['<strong>', '</strong>']),
                 localize('The [_1]end time[_2] is the selected number of minutes/hours after the [_1]start time[_2].', ['<strong>', '</strong>']),
             ],
@@ -239,11 +239,11 @@ export const contractExplanationData = {
             content: [
                 localize('The [_1]high[_2] is the highest point ever reached by the market during the contract period.', ['<strong>', '</strong>']),
                 localize('The [_1]low[_2] is the lowest point ever reached by the market during the contract period.', ['<strong>', '</strong>']),
-                localize('The [_1]close[_2] is the latest tick at or before the [_1]end time[_2]. If you selected a specific [_1]end time,[_2] the [_1]end time[_2] is the selected time.',['<strong>', '</strong>']),
+                localize('The [_1]close[_2] is the latest tick at or before the [_1]end time[_2]. If you selected a specific [_1]end time,[_2] the [_1]end time[_2] is the selected time.', ['<strong>', '</strong>']),
             ],
             title_secondary  : localize('Contract period') ,
             content_secondary: [
-                localize('The [_1]contract period[_2] is the period between the [_1]first tick[_2] (after start time) and the [_1]end time[_2].',['<strong>', '</strong>']),
+                localize('The [_1]contract period[_2] is the period between the [_1]first tick[_2] (after start time) and the [_1]end time[_2].', ['<strong>', '</strong>']),
                 localize('The [_1]start time[_2] begins when the contract is processed by our servers.', ['<strong>', '</strong>']),
                 localize('The [_1]end time[_2] is the selected number of minutes/hours after the [_1]start time[_2].', ['<strong>', '</strong>']),
             ],
@@ -253,11 +253,11 @@ export const contractExplanationData = {
             content: [
                 localize('The [_1]high[_2] is the highest point ever reached by the market during the contract period.', ['<strong>', '</strong>']),
                 localize('The [_1]low[_2] is the lowest point ever reached by the market during the contract period.', ['<strong>', '</strong>']),
-                localize('The [_1]close[_2] is the latest tick at or before the [_1]end time[_2]. If you selected a specific [_1]end time,[_2] the [_1]end time[_2] is the selected time.',['<strong>', '</strong>']),
+                localize('The [_1]close[_2] is the latest tick at or before the [_1]end time[_2]. If you selected a specific [_1]end time,[_2] the [_1]end time[_2] is the selected time.', ['<strong>', '</strong>']),
             ],
             title_secondary  : localize('Contract period') ,
             content_secondary: [
-                localize('The [_1]contract period[_2] is the period between the [_1]first tick[_2] (after start time) and the [_1]end time[_2].',['<strong>', '</strong>']),
+                localize('The [_1]contract period[_2] is the period between the [_1]first tick[_2] (after start time) and the [_1]end time[_2].', ['<strong>', '</strong>']),
                 localize('The [_1]start time[_2] begins when the contract is processed by our servers.', ['<strong>', '</strong>']),
                 localize('The [_1]end time[_2] is the selected number of minutes/hours after the [_1]start time[_2].', ['<strong>', '</strong>']),
             ],
diff --git a/src/javascript/app/pages/bottom/explanation.jsx b/src/javascript/app/pages/bottom/explanation.jsx
index d069d64a9ad..5e8ddf5b4d2 100644
--- a/src/javascript/app/pages/bottom/explanation.jsx
+++ b/src/javascript/app/pages/bottom/explanation.jsx
@@ -22,7 +22,7 @@ export const Explanation = ({ explanationOnly = false }) => {
             setFormName(actualFormName);
         }, 500);
        
-    },[hasContractChanges]);
+    }, [hasContractChanges]);
 
     const language = Language.get();
     const image_path = Url.urlForStatic(
@@ -192,7 +192,7 @@ export const Explanation = ({ explanationOnly = false }) => {
         );
     }
     
-    if (explanationOnly){
+    if (explanationOnly) {
         return (
             <div className='explanation-container-loader'>
                 <Skeleton.Square width={250} height={50} rounded />
diff --git a/src/javascript/app/pages/loader.jsx b/src/javascript/app/pages/loader.jsx
index c37ac570a04..d3c66892ae1 100644
--- a/src/javascript/app/pages/loader.jsx
+++ b/src/javascript/app/pages/loader.jsx
@@ -47,11 +47,11 @@ const Loader = () => {
     useEffect(() => {
         const hidePageLoader = dataManager.getContract('hidePageLoader');
 
-        if (hidePageLoader){
+        if (hidePageLoader) {
             setLoading(false);
         }
            
-    },[hasContractChange]);
+    }, [hasContractChange]);
 
     useEffect(() => {
         const handleLoad = () => {
@@ -64,9 +64,9 @@ const Loader = () => {
         return () => {
             window.removeEventListener('load', handleLoad);
         };
-    },[]);
+    }, []);
 
-    if (loading){
+    if (loading) {
         return (
             <Portal>
                 <div className='quill-generic-popup'>
diff --git a/src/javascript/app/pages/trade/guide.jsx b/src/javascript/app/pages/trade/guide.jsx
index d103c071e44..6341cc49291 100644
--- a/src/javascript/app/pages/trade/guide.jsx
+++ b/src/javascript/app/pages/trade/guide.jsx
@@ -14,7 +14,7 @@ const GuideBtn = () => {
         Guide.init({
             script: 'trading',
         });
-    },[]);
+    }, []);
 
     return (
         <Button
diff --git a/src/javascript/app/pages/trade/markets/contracts-dropdown.jsx b/src/javascript/app/pages/trade/markets/contracts-dropdown.jsx
index 4a533e3f95c..cfaef047e1a 100644
--- a/src/javascript/app/pages/trade/markets/contracts-dropdown.jsx
+++ b/src/javascript/app/pages/trade/markets/contracts-dropdown.jsx
@@ -20,7 +20,7 @@ export const ContractDropdown = () => {
 
         const contractElement = data?.contractElement;
 
-        if (contractElement){
+        if (contractElement) {
             const event = new Event('change');
             contractElement.value = formName;
             contractElement.dispatchEvent(event);
diff --git a/src/javascript/app/pages/trade/markets/markets-dropdown.jsx b/src/javascript/app/pages/trade/markets/markets-dropdown.jsx
index 4a2a6786d22..bf1e9898a2d 100644
--- a/src/javascript/app/pages/trade/markets/markets-dropdown.jsx
+++ b/src/javascript/app/pages/trade/markets/markets-dropdown.jsx
@@ -45,13 +45,13 @@ export const getContractName = () => {
     data?.contractsTree?.forEach((contract) => {
         if (typeof contract === 'object') {
             contract[1].forEach((subtype) => {
-                if (subtype === data?.actualFormName){
+                if (subtype === data?.actualFormName) {
                     name =  data?.contracts[subtype];
                 }
             
             });
         
-        } else if (contract === data?.actualFormName){
+        } else if (contract === data?.actualFormName) {
             name = data?.contracts[contract];
         }
        
diff --git a/src/javascript/app/pages/trade/price.js b/src/javascript/app/pages/trade/price.js
index 054cc6d3bfe..266aae10fe0 100644
--- a/src/javascript/app/pages/trade/price.js
+++ b/src/javascript/app/pages/trade/price.js
@@ -461,14 +461,14 @@ const Price = (() => {
         Object.keys(position_is_visible).forEach(position => {
             const container = CommonFunctions.getElementById(`price_container_${position}`);
             if (position_is_visible[position]) {
-                if (position === 'middle'){
+                if (position === 'middle') {
                     dataManager.setPurchase({
                         showMidPurchase: true,
                     });
                 }
                 $(container).fadeIn(0);
             } else {
-                if (position === 'middle'){
+                if (position === 'middle') {
                     dataManager.setPurchase({
                         showMidPurchase: false,
                     });
diff --git a/src/javascript/app/pages/trade/process.js b/src/javascript/app/pages/trade/process.js
index c697e654e97..ef864e83263 100644
--- a/src/javascript/app/pages/trade/process.js
+++ b/src/javascript/app/pages/trade/process.js
@@ -63,7 +63,7 @@ const Process = (() => {
 
                 commonTrading.displayMarkets();
                 processMarket();
-            } else if (country === 'gb' || country === 'im'){
+            } else if (country === 'gb' || country === 'im') {
                 NotAvailable.init({ title: localize('SmartTrader is unavailable for this account'), body: localize('Sorry, options trading isn’t available in the United Kingdom and the Isle of Man.') });
             } else {
                 NotAvailable.init({ title: localize('SmartTrader is unavailable for this account'), body: localize('Unfortunately, this trading platform is not available for EU Deriv account. Please switch to a non-EU account to continue trading.') });
diff --git a/src/javascript/app/pages/trade/purchase/purchase.jsx b/src/javascript/app/pages/trade/purchase/purchase.jsx
index 1199e5fff11..30759edb445 100644
--- a/src/javascript/app/pages/trade/purchase/purchase.jsx
+++ b/src/javascript/app/pages/trade/purchase/purchase.jsx
@@ -49,11 +49,11 @@ const Purchase = () => {
     useEffect(() => {
         const formName = Defaults.get(PARAM_NAMES.FORM_NAME);
 
-        const lookbacks = ['lookbacklow','lookbackhigh','lookbackhighlow'];
+        const lookbacks = ['lookbacklow', 'lookbackhigh', 'lookbackhighlow'];
 
         setIsLookBack(lookbacks.includes(formName));
       
-    },[hasContractChange]);
+    }, [hasContractChange]);
 
     useEffect(() => {
         document.body.style.overflow = showPopup ? 'hidden' : '';
@@ -66,7 +66,7 @@ const Purchase = () => {
     const displayCurrency = (referenceField) => referenceField !== '-' ? data?.currency : '';
 
     const ButtonTooltipWrapper = (button,description) => {
-        if (!description || description === '' || data?.isPurchaseFormDisabled){
+        if (!description || description === '' || data?.isPurchaseFormDisabled) {
             return button;
         }
         return (
@@ -84,11 +84,11 @@ const Purchase = () => {
         );
     };
 
-    if (showPopup){
+    if (showPopup) {
         return <ContractDetails />;
     }
 
-    if (isloading() || (!data?.showPurchaseResults && data?.isPurchaseFormDisabled)){
+    if (isloading() || (!data?.showPurchaseResults && data?.isPurchaseFormDisabled)) {
         return (
             <div className='quill-purchase-section'>
                 <Skeleton.Square rounded fullWidth height={30} />
@@ -102,7 +102,7 @@ const Purchase = () => {
             </div>);
     }
   
-    if (!data?.showPurchaseResults && !data?.error){
+    if (!data?.showPurchaseResults && !data?.error) {
         return (
             <div className={`quill-purchase-section ${data?.isPurchaseFormDisabled && 'disabled'}`}>
                 {data?.showMidPurchase ? (
@@ -194,7 +194,7 @@ const Purchase = () => {
         );
     }
 
-    if (data?.error){
+    if (data?.error) {
         return (
             <div className='quill-purchase-section-results'>
                 <div className='top-box'>
@@ -232,7 +232,7 @@ const Purchase = () => {
                                             <Text size='sm'>{data?.error?.message}</Text>
                                             <Text size='sm'>{
                                                 parse(
-                                                    localize('Do you want to top up for another [_1]? If not, you can do this later on the [_2]Cashier page[_3], too.',['$10,000.00', '<a id=\'top_up_cashier_redirect\' href=\'\'>', '</a>'])
+                                                    localize('Do you want to top up for another [_1]? If not, you can do this later on the [_2]Cashier page[_3], too.', ['$10,000.00', '<a id=\'top_up_cashier_redirect\' href=\'\'>', '</a>'])
                                                 )}
                                             </Text>
                                             <Button
diff --git a/src/javascript/app/pages/user/view_popup/view_popup.js b/src/javascript/app/pages/user/view_popup/view_popup.js
index 5705bec1178..330281843b0 100644
--- a/src/javascript/app/pages/user/view_popup/view_popup.js
+++ b/src/javascript/app/pages/user/view_popup/view_popup.js
@@ -883,7 +883,7 @@ const ViewPopup = (() => {
             if ($loading.length) {
                 $loading.show();
             }
-        } else if ($loading){
+        } else if ($loading) {
             dataManager.setContract({
                 hidePageLoader: true,
             });
diff --git a/src/sass/_common/common.scss b/src/sass/_common/common.scss
index c93a2ce2aea..b9cca2161a0 100755
--- a/src/sass/_common/common.scss
+++ b/src/sass/_common/common.scss
@@ -437,7 +437,7 @@ label {
     flex: 1 1 auto;
     margin-top: 48px;
 
-    @media(max-width: 880px){
+    @media(max-width: 880px) {
         margin-top: 40px;
     }
 }
diff --git a/src/sass/_common/reskin.scss b/src/sass/_common/reskin.scss
index 52639b20f19..0e073b064ea 100644
--- a/src/sass/_common/reskin.scss
+++ b/src/sass/_common/reskin.scss
@@ -3,7 +3,7 @@ body {
         .quill-purchase-section {
             .purchase-box {
                 .purchase-header {
-                    .purchase-icon-box{ 
+                    .purchase-icon-box { 
                         .contract_heading {
                             background-size: 35% !important;
                         }
@@ -55,7 +55,7 @@ body {
     margin: 0 auto;
     padding-block: 40px;
 
-    @media(max-width: 940px){
+    @media(max-width: 940px) {
         padding-inline: 16px;
     }
 }
@@ -70,12 +70,12 @@ body {
     flex-wrap: wrap;
     gap: var(--core-size-800);
 
-    @media(max-width: 768px){
+    @media(max-width: 768px) {
         flex-direction: column-reverse;
     }
 
     div#markets-dropdown-container {
-        @media(max-width: 768px){
+        @media(max-width: 768px) {
             width: 100%;
         }
     }
@@ -84,7 +84,7 @@ body {
         flex-direction: column;
         transform: scale(0.88);
 
-        @media(max-width: 768px){
+        @media(max-width: 768px) {
            flex-direction: row;
         }
 
@@ -106,7 +106,7 @@ body {
         flex-grow: 1;
         align-items: center;
 
-        @media(max-width: 768px){
+        @media(max-width: 768px) {
             width: 100%;
         }
     }
@@ -133,7 +133,7 @@ body {
     max-width: 462px;
     width: 100%;
 
-    @media (max-width: 940px){
+    @media (max-width: 940px) {
         max-width: none;
         width: 100%;
     }
@@ -147,7 +147,7 @@ body {
         position: relative;
         z-index: 100;
 
-        @media(max-width: 768px){
+        @media(max-width: 768px) {
            gap: var(--core-size-800);
         }
     }
@@ -157,7 +157,7 @@ body {
         margin: 0 10px 0 0;
         flex: none;
 
-        @media(max-width: 768px){
+        @media(max-width: 768px) {
             max-width: 100% !important;
 
             .quill-custom-dropdown__container {
@@ -177,7 +177,7 @@ body {
         border: 1px solid rgba(0, 0, 0, 0.04);
         box-shadow: var(--component-dropdownList-elevation-shadow);
 
-        @media(max-width: 768px){
+        @media(max-width: 768px) {
             width: 100%;
             margin: 0px;
         }
@@ -199,7 +199,7 @@ body {
         scrollbar-color: rgba(0, 0, 0, 0.08) transparent;
         border-radius: var(--core-borderRadius-500);
 
-        @media(max-width: 768px){
+        @media(max-width: 768px) {
             max-height: unset;
         }
 
@@ -227,7 +227,7 @@ body {
         &.market-item-container {
             max-height: 320px;
 
-            @media(max-width: 768px){
+            @media(max-width: 768px) {
                 max-height: calc(100vh - 300px);
             }
         }
@@ -245,7 +245,7 @@ div#contract-injection-container {
     #contract_component {
         display: block;
 
-        @media(max-width: 768px){
+        @media(max-width: 768px) {
            width: 100%;
            max-height: none;
            
@@ -541,7 +541,7 @@ div#contract-injection-container {
             gap: var(--core-spacing-1200);
             flex-direction: column;
             padding: var(--core-spacing-1200) 0;
-            @media (max-width: 940px){
+            @media (max-width: 940px) {
                 padding: var(--core-spacing-1200) var(--core-spacing-800);
             
             }
@@ -790,7 +790,7 @@ html.test {
         gap: 16px;
         min-height: 290px;
 
-        @media(max-width: 940px){
+        @media(max-width: 940px) {
             padding: 32px 16px;
         }
 
@@ -806,7 +806,7 @@ html.test {
         flex-direction: column;
         gap: 16px;
 
-        @media(max-width: 768px){
+        @media(max-width: 768px) {
             gap: 8px;
         }
     }
@@ -814,7 +814,7 @@ html.test {
         display: flex;
         gap: 8px;
 
-        @media(max-width: 768px){
+        @media(max-width: 768px) {
             flex-direction: column;
             gap: 8px;
         }
@@ -826,7 +826,7 @@ html.test {
                 padding-bottom: 20px;
             }
 
-            @media(max-width: 768px){
+            @media(max-width: 768px) {
                 width: 100%;
             }
 
@@ -906,7 +906,7 @@ html.test {
     min-height: 400px;
     padding: 16px;
 
-    @media(max-width: 768px){
+    @media(max-width: 768px) {
         min-height: fit-content;
     }