-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathrLoremIpsumGenerator.html
executable file
·101 lines (83 loc) · 2.52 KB
/
rLoremIpsumGenerator.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
<!DOCTYPE html>
<html>
<head>
<title>Random Sentence</title>
<script src="https://unpkg.com/[email protected]/dist/react.js" ></script>
<script src="https://unpkg.com/[email protected]/dist/react-dom.js" ></script>
<script src="https://unpkg.com/[email protected]/babel.min.js" ></script>
<link href="https://fonts.googleapis.com/css?family=Fredericka+the+Great" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Love+Ya+Like+A+Sister" rel="stylesheet">
<script type="text/babel" >
/*
This logic is deliberately naive. It has no capitalization, punctuation, or realistic word-length.
*/
function Write() {
const letts = ["a","b","c","d","e","f","g","h","i","j","k","l","m","n","o","p","r","s","t","u","v","w","y","z"," "," "," "," "," "," "," "," "," "," "," "];
let totalLetts = 282; // like a tweet
let sentence = "";
while (totalLetts) {
sentence = sentence + letts[ Math.floor(35 * Math.random()) ];
totalLetts = totalLetts - 1;
}
return <p> {sentence} </p>;
}
ReactDOM.render( <Write />, document.getElementById("app"));
// ReactDOM.render( <h1>Hely.</h1> , document.getElementById("app"));
</script>
</head>
<body>
<div class="hold">
<h1 class="font1">naive@ipsum-generator says:</h1>
<div id="app" class="skinny out-box"></div>
<img src="images/twitter-logo_361x350.png" alt="Made for Twitter" style="max-width: 110px">
<a href="https://atom-box.github.io/codingBatJS/rLoremIpsumGenerator.html"> <button class="blue-button" href="https://example.com" >again</button></a>
</div>
<style type="text/css">
body {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
}
.font1 {
font-family: "Love Ya Like A Sister";
color: rgb(47, 155, 238);
}
.out-box {
box-shadow: 2px 2px 5px black;
margin-bottom: 1.3rem;
border-radius: 0.8rem;
padding-left: 2.2rem;
padding-right: 2.2rem;
}
.hold {
display: flex;
flex-direction: column;
align-items: center;
}
.skinny {
width: 40rem;
}
.blue-button {
box-shadow: 0px 10px 14px -7px #276873;
background:linear-gradient(to bottom, #0000df 5%, #00009f 100%);
background-color:#0000df;
border-radius:8px;
display:inline-block;
cursor:pointer;
color:#ffffff;
font-family:Arial;
font-size:14px;
font-weight:bold;
padding:5px 19px;
text-decoration:none;
text-shadow:0px 1px 0px #3d768a;
}
.blue-button:hover {
background-color: #black;
color: yellow;
}
.blue-button:active {
position:relative;
bottom:1px;
}
</style>
</body>
</html>