How-To-make-mockups.html
HTML document, ASCII text, with very long lines (1266)
1
<!DOCTYPE html>
2
<html lang="en">
3
4
<head>
5
6
7
<meta charset="UTF-8" />
8
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
9
<title>How to make mockups - S0G</title>
10
<link rel="stylesheet" href="/src/global.css" />
11
12
<link rel="stylesheet" href="/src/pygments-friendly.css" />
13
14
</head>
15
16
<body>
17
<header>
18
<h2><a href="/">Steve0Greatness</a></h2>
19
<nav>
20
<a href="/blog">Blog</a>
21
<a href="/link-tree.html">Link Tree</a>
22
</nav>
23
</header>
24
25
<ol role="navigation" class="breadcrumbs" aria-roledescription="Site breadcrumb">
26
<li>
27
<a href="/">Index</a>
28
</li>
29
30
<li >
31
<a href="/blog">
32
Blog Index
33
</a>
34
</li>
35
36
<li aria-current="location">
37
38
How to make mockups
39
40
</li>
41
42
</ol>
43
<main>
44
<article>
45
<h2 id="blog-post-titled">How to make mockups</h2>
46
<time>2021 Apr 22</time>
47
<p><div class="notice">This post isn't very good, and I'm not proud of it.</div>The first step to making a mockup is to open up the inpect menu, you may be able to do this using <t>ctrl+shifT+i</t>(or <t>f12</t>)<div class="Notice">this will be different from browser to browser.</div>once you see inspect element open, simply go to the page you're making a mockup for(ex. <a href="https://Scratch.mit.edu/mystuff">MyStuff</a>; or if you're making a new page, go to the page that looks the closest.), and press <t>ctrl+shifT+c</t>, and click on the area that you want to change(ex. the <t>+ New Project</t> button.<p>now that you've selected the element, let's learn how to edit it! You should see the element that you clicked on(using the <t>ctrl+shifT+c</t> command) highlighted in blue. Inside of the element(if you selected text, or even an image), you should see a darker area, that isn't red, <t>double click</t> on it, it should now be hilighted, now type in whatever you want(if it's an image, make sure to put in an image link, ex. https://imagehoster.com/png/png.png; if you clicked on a link(in the "" in "a href=''", unselect it and select the part "<a href='link'>"here"</a>").</p>anyways... if you don't have the monna lisa yet, just give up /s</p>
48
49
</article>
50
</main>
51
<footer role="group">
52
<div class="footer-link-list-holder">
53
<span aria-hidden="true" id="footer-label-social-accounts" class="footer-link-list-label">Social Accounts</span>
54
<ol class="footer-link-list" aria-labelledby="footer-label-social-accounts">
55
<li><a href="https://mastodon.social/@S0G" rel="me">Mastodon</a></li>
56
<li><a href="https://youtube.com/@s0g">YouTube</a></li>
57
</ol>
58
</div>
59
</footer>
60
</body>
61
62
</html>