Compare commits

..

No commits in common. "16d319a514edaf0ec4735363ad100dae5e8beb36" and "b46b2dc3e77c5b088d2543f8fcfdd6892f722089" have entirely different histories.

22 changed files with 7 additions and 75 deletions

1
.gitignore vendored
View file

@ -1 +0,0 @@
*.zip

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

View file

@ -1,67 +1 @@
/* Style sheet */
@font-face {
font-family: "Lobster";
src: url('fonts/Lobster/Lobster-Regular.ttf') format('truetype');
}
@font-face {
font-family: "Roboto";
src:
url('fonts/Roboto/Roboto-Regular.ttf') format('truetype'),
url('fonts/Roboto/Roboto-BlackItalic.ttf') format('truetype'),
url('fonts/Roboto/Roboto-Black.ttf') format('truetype'),
url('fonts/Roboto/Roboto-BoldItalic.ttf') format('truetype'),
url('fonts/Roboto/Roboto-Bold.ttf') format('truetype'),
url('fonts/Roboto/Roboto-LightItalic.ttf') format('truetype'),
url('fonts/Roboto/Roboto-Light.ttf') format('truetype'),
url('fonts/Roboto/Roboto-MediumItalic.ttf') format('truetype'),
url('fonts/Roboto/Roboto-Medium.ttf') format('truetype'),
url('fonts/Roboto/Roboto-ThinItalic.ttf') format('truetype'),
url('fonts/Roboto/Roboto-Thin.ttf') format('truetype');
}
body.style-1 {
font-family: "Roboto";
width: 80%;
margin: auto;
}
h1 { font-family: "Lobster"; }
p { color: #444; }
a { text-decoration: none; }
button {
margin: 4px 0px;
padding: 8px;
background-color: #3BAD5F;
color: #fff;
border-radius: 10px;
border: 0;
font-family: "Roboto";
font-size: 120%;
}
button:hover { box-shadow: 6px 6px; }
.name {
font-size: 200%;
padding: 12px;
background-color: #eee;
border: thin #ededed;
display: block;
clear: both;
margin-bottom: 20px;
font-family: "Lobster";
}
.blue { color: blue; }
.red { color: red; }
.green { color: green; }
.black { color: black; }
.bold { font-weight: bold; }
.italic { font-style: italic; }
.small-caps { font-variant: small-caps; }

View file

@ -12,7 +12,7 @@
<link rel="stylesheet" href="css/style.css">
</head>
<body class="style-1">
<body>
<h1>Digital Empowerment</h1>
<p>The purpose of these sessions is to show Chch South Karamata learners that they don't
have to be mere riders in their digital journey - they can become drivers.</p>
@ -22,15 +22,14 @@
<div class='app1'>
<p class='name'>Take charge!</p>
<div class='colors'>
<button onclick="changeColor('blue')">Change to <span class="blue">blue</span></button>
<button onclick="changeColor('red')">Change to <span class="red">red</span></button>
<button onclick="changeColor('green')">Change to <span class="green">green</span></button>
<button onclick="changeColor('black')">Change to <span class="black">black</span></button>
<button onclick="changeColor('blue')">Change to blue</button>
<button onclick="changeColor('red')">Change to red</button>
<button onclick="changeColor('green')">Change to green</button>
</div>
<div class='fonts'>
<button onclick="changeWeight()">Change to <span class="bold">bold</span></button>
<button onclick="changeStyle()">Change to <span class="italic">italics</span></button>
<button onclick="changeVariant()">Change to <span class="small-caps">small capital letters</span></button>
<button onclick="changeWeight()">Change to bold</button>
<button onclick="changeStyle()">Change to italics</button>
<button onclick="changeVariant()">Change to small capital letters</button>
</div>
<script src="js/script.js"></script>
</div>