yashsharma04

.rt-table::-webkit-scrollbar {
    display: none;
}

.rt-table{
    -ms-overflow-style: none;
    scrollbar-width: none;
}

yashsharma04

const paginationComp = document.querySelector(".footer-wrapper");
const ifInViewPort = isInViewport(paginationComp);
const scrollBar = document.getElementById("scroll-bar");
if (ifInViewPort) {
  scrollBar.style.position = "static";
} else {
  scrollBar.style.position = "fixed";
}

yashsharma04

function isInViewport(element) {
  const rect = element.getBoundingClientRect();
  return (
    rect.top >= 0 &&
    rect.left >= 0 &&
    rect.bottom - 62 <= (window.innerHeight || document.documentElement.clientHeight) &&
    rect.right <= (window.innerWidth || document.documentElement.clientWidth)
  );
}

yashsharma04

handleScroll = () => {
    const elm = document.getElementById("scroll-bar");
    const scrollLeft = elm.scrollLeft;
    const tableBody =  document.querySelector(".rt-table");
    tableBody.scrollLeft = scrollLeft;
  }

yashsharma04

  getTableBodyWidth = () => {
    const tableBody =  document.querySelector(".rt-table");
    if (tableBody) {return tableBody.scrollWidth;}
    return 0;
  }

yashsharma04

.scrollbarContainer {
  overflow: scroll;
  position: fixed;
  bottom: 0;
  width: 100%;
  z-index: 1;
}

.scrollbarChild {
  height: 1px;

yashsharma04

<div className="table"/>

<div id={"scroll-bar"} className={styles.scrollbarContainer} onScroll={this.handleScroll}>
  <div style={{ width: this.getTableBodyWidth()}} className={styles.scrollbarChild} />
</div>

yashsharma04

{
  "expo": {
    "name": "your app name",
    "description": "your app desc",
    ....,
    "ios": {
      "supportsTablet": true
    },
	
      "android": {