initial sample code from luminus

5 years ago · d474603508
commit d474603508
6 changed files with 128 additions and 0 deletions
--- a/index.html
+++ b/index.html
@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <title>My Sample Pages</title>
+    <link rel="stylesheet" href="mystyle.css">
+    <script src="myscript.js"></script>
+    <!-- My sample pages -->
+  </head>
+  <body>
+    
+    <h1 id="h1ref"> Welcome to Fintech@NUS course </h1>
+
+    <button onclick="myFunction()">click me</button>
+
+  </body>
+</html>
--- a/index2.html
+++ b/index2.html
@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <title>My Sample Pages</title>
+    <link rel="stylesheet" href="mystyle2.css">
+    <script src="myscripts2.js"></script>
+    <!-- My sample pages -->
+  </head>
+  <body>
+    
+    <h1 id="largeGreen"> MY COMPANY </h1>
+    <h2 id="h1ref"> Welcome to DevToolKit 1 course </h2>
+    <p> This is our first class! </p>
+    <p class = "info"> Follow my code!</p>
+    <a id="myLink" href="http://www.anuflora.com">Game Analytics</a>
+    <p class = "info button"> My Bank Pte Ltd </p> 
+    <!--
+    <button class = "button" onclick="myFunction()">click me1</button>
+    <button class = "button" onclick="changeContent()">click me2</button>
+    -->
+
+    <!--fancy buttons    -->
+    
+    <button class = "button button1" onclick="myFunction()">click me</button>
+    <button class = "button button2" onclick="changeContent()">click me</button>
+    
+  </body>
+</html>
+
+
--- a/myscript.js
+++ b/myscript.js
@ -0,0 +1,6 @@
+//alert ('hello world'); 
+             
+function myFunction() {
+    document.getElementById("h1ref").style.backgroundColor = "green";
+    
+}
--- a/myscripts2.js
+++ b/myscripts2.js
@ -0,0 +1,20 @@
+//alert ('hello world'); 
+function myFunction() {
+    
+    document.getElementById("h1ref").style.backgroundColor = "greenyellow";
+    //document.querySelector(".info").style.color = "green";
+    myArray = document.querySelectorAll(".info");
+    myArray.forEach(function(items) {
+         items.style.color ="green";
+      });
+}
+
+function changeContent(){
+        //document.body.innerHTML = "<p>Test</p>"
+        document.getElementById("h1ref").innerHTML = "You are doing excellent job in Dev Tool Kit 1";
+        document.getElementById("h1ref").style.backgroundColor = "yellow";
+        var myLinkVar = document.getElementById("myLink");
+        myLinkVar.href ="http://www.globalcert.cloud/";
+        myLinkVar.innerHTML ="Global Certificates"; 
+
+    }
--- a/mystyle.css
+++ b/mystyle.css
@ -0,0 +1,3 @@
+h1 { color: red; font-size:28px;} 
+/* MY commnet */
+
--- a/mystyle2.css
+++ b/mystyle2.css
@ -0,0 +1,49 @@
+p { color: blueviolet; font-size:16px;} 
+
+#largeGreen { color:green; font-size:50px;} 
+
+.info {color: blue;}
+
+/*
+.button {
+    background-color: red;
+}
+*/
+
+
+.button {
+    background-color: #4CAF50;
+    border: none;
+    color: white;
+    padding: 16px 32px;
+    text-align: center;
+    text-decoration: none;
+    display: inline-block;
+    font-size: 16px;
+    margin: 4px 2px;
+    transition-duration: 0.4s;
+    cursor: pointer;
+  }
+  
+  .button1 {
+    background-color: white; 
+    color: black; 
+    border: 2px solid #4CAF50;
+  }
+  
+  .button1:hover {
+    background-color: #4CAF50;
+    color: white;
+  }
+  
+  .button2 {
+    background-color: white; 
+    color: black; 
+    border: 2px solid #008CBA;
+  }
+  
+  .button2:hover {
+    background-color: #008CBA;
+    color: white;
+  }
+