xxxxxxxx

by velo_ninja

HTML

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Read XLSM File Example</title>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.17.0/xlsx.full.min.js"></script>
    <style>
      body {
        display: flex;
        justify-content: space-evenly;
        align-items: center;
        padding: 5px;
        overflow-y: auto;
        font-family: Arial, sans-serif;
        margin: 20px;
        background: yellow;
      }
      
      #divMain {
        width: 100%;
        height: 90vh;
        color: black;
        background-color: grey;
        border: 2px solid blue; /* Example additional styling */
        border-radius: 10px;    /* Rounded corners */
        box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.5); /* Shadow effect */
        flex-direction: column;
    }
    </style>
    
    <script>
        function init_Body() {console.log('BODY init...');
            const BODY = document.body; return BODY; 
        }
        
        function style_Sections() {
        	let allDivs = document.querySelectorAll('div');
          allDivs.forEach(div => {console.log('DIV-ID: ', div.id);
            div.style.position = 'relative';
            div.style.display = 'flex';
            div.style.justifyContent = 'space-evenly';
            div.style.alignItems = 'center';
            //div.style.flex = '1'; // Flex 1 to maintain equal size across all divs 
            div.style.padding = '1px';
            div.style.margin = '1px';
            div.style.borderRadius = '10px';
            div.style.textAlign = 'center';
            div.style.fontFamily = 'Roboto, sans-serif';
            div.style.minHeight = 'auto';
            if(div.id==='sectionMain') {div.maxWidth = '1920px';}
          }); 
        }
        
        function createNewDiv(target, divID, options = {}) {
            let parentDiv;
            const newDiv =...