mirror of
https://github.com/neocities/neocities.git
synced 2025-04-24 17:22:35 +02:00
Tutorial page 1 part 2 mockup, error mockup
This commit is contained in:
parent
b98d982e5b
commit
1e46191684
5 changed files with 23 additions and 3 deletions
BIN
public/img/tutorial/ch1pg1_2.png
Normal file
BIN
public/img/tutorial/ch1pg1_2.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 76 KiB |
|
@ -13,6 +13,8 @@
|
|||
background-color: #1D1F21;
|
||||
color: white;
|
||||
font: 16px/normal 'Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', 'source-code-pro', monospace;
|
||||
margin-bottom: 0;
|
||||
border: 0;
|
||||
}
|
||||
h3 {
|
||||
margin-top: 10px;
|
||||
|
@ -25,6 +27,12 @@
|
|||
.btn {
|
||||
float: right;
|
||||
}
|
||||
.error {
|
||||
background: #93771b;
|
||||
color: #fff;
|
||||
padding: 5px 10px;
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
.lesson {
|
||||
h1, .subtitle {
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
<div class="comic" style="height: 967px; background-image: url(/img/tutorial/ch1pg1.png);">
|
||||
<div class="comic" style="height: 967px; background-image: url(/img/tutorial/ch1pg1.png); background-size: 839px;">
|
||||
<div class="dialogue" style="left: 270px; top:374px;">
|
||||
Oh, a new student!
|
||||
</div>
|
||||
|
@ -17,6 +17,17 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div class="comic" style="height: 300px; background-image: url(/img/tutorial/ch1pg1_2.png);background-size: 839px;">
|
||||
<div class="dialogue" style="left: 200px; top:30px;">
|
||||
Welcome, [NAME]! You're about to embark on a very exciting challenge: creating your first website!
|
||||
</div>
|
||||
<div class="dialogue" style="left: 640px; top:20px;">
|
||||
You've already made the first important step of starting this lesson, so here's a badge for your profile.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<a href="./2">Next >></a>
|
||||
|
||||
<script>
|
||||
$('#checkButton').on('click', function(button) {
|
||||
checkHomework($('#nameInput').val())
|
||||
|
|
|
@ -9,8 +9,6 @@
|
|||
<p>You'll see the results here.</p>
|
||||
<p>Make sure to check the green boxes below for important bonus info!</p>
|
||||
</div>
|
||||
<div class="dialogue">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="welcome">
|
||||
|
|
|
@ -27,6 +27,9 @@
|
|||
</body>
|
||||
</html>
|
||||
</textarea>
|
||||
<div class="error">
|
||||
<i class="fa fa-exclamation-triangle"></i> Try again: make sure you change Hello World to something else.
|
||||
</div>
|
||||
|
||||
<h3>Site Preview</h3>
|
||||
<iframe class="preview" style="background: white"></iframe>
|
||||
|
|
Loading…
Add table
Reference in a new issue