The Work Environment and Facilities

Size
5,849 Kb
Views
24,288

How do I make an the work environment and facilities?

What is a the work environment and facilities? How do you make a the work environment and facilities? This script and codes were developed by Marcus Macmillan on 23 September 2022, Friday.

The Work Environment and Facilities Previews

The Work Environment and Facilities - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>The Work Environment and Facilities</title> <link rel='stylesheet prefetch' href='https://www.education.tas.gov.au/documentcentre/Documents/HazardsRisksPagesStyle_1.css'>
<link rel='stylesheet prefetch' href='https://www.education.tas.gov.au/documentcentre/Documents/Menu.css'> <link rel="stylesheet" href="css/style.css">
</head>
<body> <body> <!--DIV CONTAINER FOR MEDIA QUERY--> <div id="Container"> <!--DIV LEFT PADDING FOR WEB PAGE--> <div id="PageMargin"> <!--Hazards and Risks Header!--> <img id="Header" src="https://www.education.tas.gov.au/documentcentre/Documents/(2)Hazards%20and%20Risks.PNG" /> <!--Menu Container--> <div id="MenuContainer" onclick="openNav()"> <div id="NewHeader">The Work Environment &amp; Facilities</div> <div class="Menu1"></div> <div class="Menu2"></div> <div class="Menu3"></div> </div> <!--End of div Menu Container--> <!--Side Navigation Bar Menu--> <div id="mySidenav" class="sidenav"> <a href="javascript:void(0)" class="closebtn" onclick="closeNav()">x</a> <a href="https://www.education.tas.gov.au/intranet/CSD/HR/whs/SitePages/Home.aspx">Home</a> <a href="https://www.education.tas.gov.au/documentcentre/Documents/(1)%20Managing%20Health%20and%20Safety_1.html">Managing Work Health &amp; Safety</a> <a href="https://www.education.tas.gov.au/documentcentre/Documents/(2)Hazards%20and%20Risks_1.html"> Hazards &amp; Risks</a> <a href="https://www.education.tas.gov.au/documentcentre/Documents/(4)%20WHS%20Alerts_1.html">Work Health &amp; Safety Alerts</a> <a href="https://www.education.tas.gov.au/documentcentre/Documents/(5)%20WHS%20Resources%20Page.html">WHS Resources Page</a> <a href="https://www.education.tas.gov.au/documentcentre/Documents/(6)%20WHS%20Events_1.html">WHS Events</a> <a href="https://www.education.tas.gov.au/documentcentre/Documents/(7)Emergency%20Management_1.html">Emergency Management</a> <a href="https://www.education.tas.gov.au/documentcentre/Documents/(8)Training%20and%20Development_1.html">Training &amp; Development</a> <a href="https://www.education.tas.gov.au/documentcentre/Documents/(9)%20WHS%20Management%20System_1.html">Work Health &amp; Safety Management System</a> <a href="https://www.education.tas.gov.au/documentcentre/Documents/(10)%20Incident%20Notification%20Procedures_1.html">Incident Notification Procedures</a> </div> <!-- End of SideNav div--> <!--Intro text section!--> <p>The Code of Practice &ndash; Managing the Work Environment and Facilities applies to all types of work and all workplaces covered by the WHS Act, including workplaces that are mobile, temporary and remote. It provides practical guidance for managers and others on how to provide and maintain a physical work environment that is without risks to health and safety.</p> <p>The code covers: <!--Unordered List!--> <ul> <li>The physical work environment, such as workspace, lighting and ventilation.</li> <li>Facilities for workers, including toilets, drinking water, washing and dining areas, change rooms, personal storage and shelter.</li> <li>Remote and isolated work.</li> <li>Emergency plans.</li> </ul> <p></p> <div class="Border2"> <p><a href="https://www.safeworkaustralia.gov.au/sites/SWA/about/Publications/Documents/626/Managing_Work_Environment_and_Facilities2.pdf">Code of Practice &ndash; Managing the Work Environment and Facilities</a></p> <p><a href="https://www.safeworkaustralia.gov.au/sites/SWA/about/Publications/Documents/695/managing-risks-of-plant-in-workplace-cop-21032016.pdf">Code of Practice &ndash; Managing the Risks of Plant in the Workplace</a></p> </div> <p></p> <p>The Department Of Education also has a number of policies, plans and procedures to manage work environments and these too should be consulted:</p> <!--BUTTON CONTAINER FOR ACCORDION MENUS--> <div id="ButtonContainer"> <!--ACCORDION DROP DOWN MENU--> <button class="accordion"><img class = "image" src = "https://www.education.tas.gov.au/documentcentre/Documents/Clipboard2_Icon.png"</img>Policies &amp; procedures <span class = "span">A - L</span></button> <!--CONTAINER FOR DIV PANEL FOR DROP DOWN LIST ITEMS--> <div class="panel"> <p><a href="https://www.education.tas.gov.au/documentcentre/Documents/WHS%20-%20Building%20Inspection%20Checklist.docx">Building Inspection Checklist</a></p> <p><a href="https://www.education.tas.gov.au/documentcentre/Documents/Community-Use-of-School-Facilities-and-Resources-Guideline.pdf">Community Use of School Facilities<span class = "hide1"> and Resources</span></a></p> <p><a href="https://www.education.tas.gov.au/documentcentre/Documents/Equipment%20Lockout_Tagout%20procedure.pdf">Equipment Lockout/Tagout Procedure</a></p> <p><a href="https://www.education.tas.gov.au/documentcentre/Documents/Mobile%20Phone%20Guidelines.pdf">Mobile Phone Use Guidelines</a></p> <p><a href="https://www.vwa.vic.gov.au/__data/assets/pdf_file/0016/3634/Officewise_web.pdf">Officewise &ndash; <span class = "hide1">a Guide to</span> Health &amp; Safety in the Office</span></a></p> <p><a href="https://www.education.tas.gov.au/documentcentre/Documents/Personal%20Equipment%20on%20Worksites%20WHS%20guidelines.pdf">Personal Equipment on Worksites</a></p> <p><a href="https://www.education.tas.gov.au/documentcentre/Documents/Playground-Equipment-Guideline.pdf">Playground Equipment</a></p> <!--END OF CONTAINER FOR DIV PANEL FOR DROP DOWN LIST ITEMS--> </div> <!--ACCORDION DROP DOWN MENU--> <button class="accordion"><img class = "image" src = "https://www.education.tas.gov.au/documentcentre/Documents/Clipboard2_Icon.png"</img>Policies &amp; procedures <span class = "span">M - W</span></button> <!--CONTAINER FOR DIV PANEL FOR DROP DOWN LIST ITEMS--> <div class="panel"> <p><a href="https://www.education.tas.gov.au/documentcentre/Documents/Playground-Checklist.docx">Playground Checklist</a></p> <p><a href="https://www.education.tas.gov.au/documentcentre/Documents/Smokefree-Workplaces%20Statement.pdf">Smokefree Workplaces Statement</a></p> <p><a href="https://www.education.tas.gov.au/documentcentre/Documents/Tree-Management-Guideline.pdf">Tree Management Guidelines</a></p> <p><a href="https://www.education.tas.gov.au/documentcentre/Documents/Working-in-heat.pdf">Working in Heat &ndash; Guidance Note</a></p> <p><a href="https://worksafe.tas.gov.au/__data/assets/pdf_file/0005/199139/nhp004.pdf">Working in Heat &ndash; WorkSafe Tasmania</a></p> <p><a href="https://www.education.tas.gov.au/documentcentre/Documents/WHS%20Basics%20for%20Cleaners.pdf"><span class = "hide1">Workplace Health And Safety</span><span class = "hide2">WHS </span> Basics for Cleaners</span></a></p> <p><a href="https://www.education.tas.gov.au/documentcentre/Documents/Health-and-Safety-Overview.pdf"><span class = "hide1">Work Health and Safety</span><span class = "hide2">WHS </span> Overview Infosheet</span></a></p> <!--END OF CONTAINER FOR DIV PANEL FOR DROP DOWN LIST ITEMS--> </div> <!--END OF BUTTON CONTAINER FOR ACCORDION MENUS--> </div> <br> <div id="Header2">Rain Water Tanks</div> <div class="Border2"> <p><a href="https://www.health.gov.au/internet/main/publishing.nsf/content/D3E8C00F3041304BCA257BF0001C685A/%24File/env_rainwater.pdf">Guidance on the Use of Rain Water Tanks</a></p> <p><a href="https://www.communitywaterplanner.gov.au/login?return=">Community Water Planner</a></p> </div> <!--No padding for footer!--> </div> <img id="Footer" src="https://www.education.tas.gov.au/documentcentre/Documents/WHS%20Footer.PNG" /> <!--END OF CONTAINER FOR PAGE MEDIA FORMATTING--> </div> <!--JAVACRIPT FOR MENU & NAVBAR--> <script src="Menu.js"></script>
</body> <script src='https://www.education.tas.gov.au/documentcentre/Documents/Menu.js'></script> <script src="js/index.js"></script>
</body>
</html>

The Work Environment and Facilities - Script Codes CSS Codes

/* THE WORK ENVIRONMENT & FACILITIES CSS */ ul { list-style-type: square; list-style-position: inside; padding-top: 20px; padding-right: 10px; padding-bottom: 20px; background-color: #cccccc; border-radius: 40px; line-height: 40px; padding-left: 50px; margin-left: 20px; margin-right: 20px; } /*CSS FOR ACCORDION MENUS CHECKLISTS MENU ACCORDION
CODES OF PRACTICE MENU ACCORDION*/ /*CONTAINER FOR BUTTON MENU*/ #ButtonContainer { margin: auto; width: 65%; margin-top: 40px; } /*Style the menu button panel that is used to open and close the Checkllists accordion panel*/ button.accordion { font-size: 24px; font-weight: bold; background-color: #cccccc; color: white; cursor: pointer; padding: 18px; width: 100%; text-align: left; border-radius: 20px; border-style: none; outline: none; transitiion: 0.4s; } /*Add a background colour to the menu button panel if is clicked on (add the .active class with JS), and when you move the mouse over it (hover)*/ button.accordion.active, button.accordion:hover { background-color: #bfbfbf; } /*Style the drop down list panel. Note: hidden by default*/ div.panel { padding: 1%; background-color: #d9d9d9; text-indent: 6%; line-height: 20px; font-weight: bold; border-radius: 20px; transition: 0.6s ease-in-out; max-height: 0; overflow: hidden; opacity: 0; } div.panel a:link { color: #808080; font-weight: bold; } div.panel a:hover { text-decoration: underline; } div.panel a:visited { color: #808080; } /*Color every 2nd panel of drop down list*/ div.panel p:nth-child(even) { background-color: white; padding: 20px 0px; } /*The 'show' class is addded to the drop down list panel when the user clicks on one of the buttons. This will show the panel content*/ div.panel.show { opacity: 1; max-height: 450px; } /*Button symbols to indicate whether the collapsable content is open or closed*/ button.accordion:after { content: '\02795'; /*Unicode character for'plus' sign(+)*/ font-size: 16px; color: white; float: right; margin-left: 5px; margin-top: 5px; } button.accordion.active:after { content: "\2796"; /*Unicode character for 'minus' sign (-)*/ } .span { padding-left: 20px; font-size: 26px; font-weight: 900; color: white; } .image { padding-right: 10px; margin-bottom: -5px; height: 35px; width: 45px; color: white; } .hide1 { display: inline; } .hide2 { display: none; }
}
/*FIRST MEDIA SCREEN SIZE SET CONTAINER WIDTH TO 100% FOR SIZING */
/*MEDIA SCREEN SIZE FOR LARGE SCREENS*/
@media screen and (max-width: 1820px) { #Container { width: 100%; } #Header { width: 100%; height: 200px; } #Footer { width: 100%; height: 120px; }
}
/*MEDIA SCREEN SIZE FOR MINIMIZED LARGE SCREEN DESKTOPS AND LAPTOPS*/
@media screen and (max-width: 1500px) { #Container { width: 100%; } p { font-size: 20px; } ul { font-size: 20px; } #Header { width: 100%; height: 150px; } #Footer { width: 100%; height: 75px; } #PageMargin { margin-left: 20px; } #Header2 { font-size: 20px; } ul { padding-top: 20px; padding-bottom: 20px; border-radius: 35px; line-height: 35px; padding-left: 40px; margin-left: 15px; margin-right: 15px; } /*Container for button menu*/ #ButtonContainer { margin: auto; width: 65%; margin-top: 30px; } /* Style the buttons that are used to open and close the accordion panel */ button.accordion { font-size: 22px; padding: 16px; border-radius: 18px; } /* Style the accordion panel. Note: hidden by default */ div.panel { text-indent: 50px; line-height: 16px; border-radius: 18px; } div.panel p:nth-child(even) { padding-top: 16px; padding-bottom: 16px; line-height: 16px; } /* The "show" class is added to the accordion panel when the user clicks on one of the buttons. This will show the panel content */ div.panel.show { opacity: 1; max-height: 500px; } /*Button symbols to indicate whether the collapsable content is open or closed*/ button.accordion:after { font-size: 14px; margin-left: 5px; } .span { padding-left: 18px; font-size: 24px; }
}
/*MEDIA SCREEN SIZE FOR IPADS - LANDSCAPE*/
@media screen and (max-width: 1024px) { #Container { width: 100%; } p { font-size: 18px; } ul { font-size: 18px; } #Header { width: 100%; height: 120px; } #Footer { width: 100%; height: 75px; } #PageMargin { margin-left: 15px; } #Header2 { font-size: 18px; border-width: 4px; border-radius: 5px; padding: 5px; box-shadow: 5px 5px 2px #B5B5B5; } ul { padding-top: 15px; padding-bottom: 15px; border-radius: 30px; line-height: 30px; padding-left: 30px; margin-left: 10px; margin-right: 10px; } /* Style the buttons that are used to open and close the accordion panel */ button.accordion { font-size: 20px; padding: 14px; border-radius: 16px; } /* Style the accordion panel. Note: hidden by default */ div.panel { text-indent: 30px; line-height: 14px; border-radius: 16px; } div.panel p:nth-child(even) { padding-top: 14px; padding-bottom: 14px; line-height: 14px; } /* The "show" class is added to the accordion panel when the user clicks on one of the buttons. This will show the panel content */ div.panel.show { opacity: 1; max-height: 420px; } /*Button symbols to indicate whether the collapsable content is open or closed*/ button.accordion:after { font-size: 12px; margin-left: 5px; margin-top: 8px; } .span { padding-left: 16px; font-size: 22px; } .image { padding-right: 10px; margin-bottom: -4px; height: 30px; width: 40px; }
}
/*MEDIA SCREEN SIZE FOR MIPADS - PORTRAIT*/
@media screen and (max-width: 768px) { #Container { width: 100%; } p { font-size: 14px; } ul { font-size: 14px; } #Header { width: 100%; height: 75px; } #Footer { width: 100%; height: 50px; } #PageMargin { margin-left: 10px; } #Header2 { font-size: 14px; border-width: 2px; border-radius: 5px; padding: 4px; box-shadow: 5px 5px 2px #B5B5B5 } ul { padding-top: 10px; padding-bottom: 10px; border-radius: 30px; line-height: 30px; padding-left: 20px; margin-left: 10px; margin-right: 10px; } /*Container for button menu*/ #ButtonContainer { margin: auto; width: 65%; margin-top: 40px; border-radius: 14px; } /* Style the buttons that are used to open and close the accordion panel */ button.accordion { font-size: 14px; padding: 12px; border-radius: 14px; } /* Style the accordion panel. Note: hidden by default */ div.panel { text-indent: 20px; line-height: 12px; border-radius: 14px; } div.panel p:nth-child(even) { padding-top: 12px; padding-bottom: 12px; line-height: 12px; } /* The "show" class is added to the accordion panel when the user clicks on one of the buttons. This will show the panel content */ div.panel.show { opacity: 1; max-height: 360px; } /*Button symbols to indicate whether the collapsable content is open or closed*/ button.accordion:after { font-size: 10px; margin-left: 5px; } .span { padding-left: 14px; font-size: 20px; } .image { padding-right: 8px; margin-bottom: -3px; height: 25px; width: 35px; }
}
/*MEDIA SCREEN FOR NEWHEADER*/
@media screen and (max-width: 550px) { #Container { width: 100%; } p { font-size: 11px; } #PageMargin { margin-left: 0px; } #Header { width: 100%; height: 50px; } #Footer { width: 100%; height: 25px; } /*Container for button menu*/ #ButtonContainer { margin: auto; width: 75%; margin-top: 20px; } /* Style the buttons that are used to open and close the accordion panel */ button.accordion { font-size: 12px; padding: 8px; border-radius: 12px; } /* Style the accordion panel. Note: hidden by default */ div.panel { text-indent: 8px; line-height: 8px; border-radius: 12px; } div.panel p:nth-child(even) { padding-top: 8px; padding-bottom: 8px; line-height: 8px; } /* The "show" class is added to the accordion panel when the user clicks on one of the buttons. This will show the panel content */ div.panel.show { opacity: 1; max-height: 360px; } /*Button symbols to indicate whether the collapsable content is open or closed*/ button.accordion:after { font-size: 10px; margin-left: 5px; margin-top: 7px; } .span { padding-left: 8px; font-size: 14px; } .image { padding-right: 2px; margin-bottom: -1px; height: 20px; width: 30px; } #NewHeader { font-size: 16px; padding-top: 0.2%; padding-left: 25%; }
}
/*MEDIA SCREEN FOR NEWHEADER*/
@media screen and (max-width: 450px) { #NewHeader { font-size: 14px; padding-top: 0.2%; padding-left: 20%; }
}
/*Accordion Menu adjustment for screen*/
@media screen and (max-width: 400px) { .span { padding-left: 4px; font-size: 14px; } .image { padding-right: 0px; margin-bottom: -1px; height: 20px; width: 30px; } .hide1 { display: none; } .hide2 { display: inline-block; }
}
/*SET SMALLEST SCREEN SIZE ALLOWABLE*/
@media screen and (max-width: 360px) { #Container { width: 320px; } p { font-size: 12px; } ul { font-size: 12px; } #Header { width: 100%; height: 75px; } #Footer { width: 100%; height: 25px; } #PageMargin { margin-left: 5px; } #NewHeader { font-size: 12px; padding-top: 0.4%; padding-left: 20%; } #Header2 { font-size: 12px; border-width: 2px; border-radius: 5px; padding: 2px; box-shadow: 5px 5px 2px #B5B5B5; } ul { padding-top: 5px; padding-bottom: 5px; border-radius: 30px; line-height: 25px; padding-left: 15px; margin-left: 5px; margin-right: 5px; }
}

The Work Environment and Facilities - Script Codes JS Codes

/*Accordion for Checklists Menus*/
var acc = document.getElementsByClassName("accordion");
var i;
for (i = 0; i < acc.length; i++) { acc[i].onclick = function() { this.classList.toggle("active"); this.nextElementSibling.classList.toggle("show"); }
}
The Work Environment and Facilities - Script Codes
The Work Environment and Facilities - Script Codes
Home Page Home
Developer Marcus Macmillan
Username Marcus666
Uploaded September 23, 2022
Rating 3
Size 5,849 Kb
Views 24,288
Do you need developer help for The Work Environment and Facilities?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Marcus Macmillan (Marcus666) Script Codes
Create amazing marketing copy with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!