RubyGems - cyberweb - Versions diffs - 0.4.174 → 0.5.225 - Mend

cyberweb 0.4.174 → 0.5.225

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Potentially problematic release.

This version of cyberweb might be problematic. Click here for more details.

Files changed (625) hide show

data/examples/html/column_width_example.html CHANGED Viewed

@@ -3,13 +3,13 @@
 <style>
 .newspaper
 {
-  column-width: 300px;
+  column-width: 250px;
 }
 </style>
 </head>
 <body>
-<h5>Testing Column Width</h5>
+<h5>Testing Column Width of 250px</h5>
 <div class="newspaper">
 Lorem ipsum dolor sit amet, consectetuer adipiscing elit,
 sed diam nonummy nibh euismod tincidunt ut laoreet dolore

data/examples/html/custom_cursor.html CHANGED Viewed

@@ -1,14 +1,17 @@
 <html>
 <title>Custom Cursor Example</title>
+<link href="../../lib/cyberweb/cascading_style_sheets/cursors.css" rel="stylesheet" type="text/css" />
 <style>
 body {
   margin: 0;
-  padding: 1em;
+  padding: 0.75em;
   height: 100vh;
   cursor: cell;
 }
 div {
-  padding: 2em;
+  padding: 0.75em;
 }
 .custom_cursor {
@@ -94,10 +97,10 @@ div {
   <div class="sw-resize">sw-resize</div>
   <div class="nesw-resize">nesw-resize</div>
   <div class="nwse-resize">nwse-resize</div>
-</div>
+  <div class="cursor_happy">happy</div>
+  <div class="cursor_sad">sad</div>
+</div>
 </body>
 </html>

data/examples/html/cyberweb_logo/README.md ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ The html file in this directory will show the logo of the
2	+ cyberweb project.

data/examples/html/cyberweb_logo/cyberweb_logo.html ADDED Viewed

@@ -0,0 +1,11 @@
+<html>
+<head>
+<title>Cyberweb Logo</title>
+</head>
+<body>
+<h2>Next showing the cyberweb logo</h2>
+<img src="data:image/png;base64,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">
+</body>
+</html>

data/examples/html/draggable_paragraph.html CHANGED Viewed

@@ -1,6 +1,5 @@
 <html>
-<title>Draggable paragraph</title>
+<title>Showcase a draggable paragraph</title>
 <body>

data/examples/html/email_popup_example/email_popup_example.html ADDED Viewed

@@ -0,0 +1,175 @@
+<html>
+<head>
+<style>
+body {
+  background: #323641;
+}
+.email_letter_image {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  width: 200px;
+  height: 200px;
+  transform: translate(-50%, -50%);
+  cursor: pointer;
+}
+.email_animated_mail {
+  position: absolute;
+  height: 150px;
+  width: 200px;
+  transition: 0.4s;
+}
+.email_animated_mail .email_body {
+  position: absolute;
+  bottom: 0;
+  width: 0;
+  height: 0;
+  border-style: solid;
+  border-width: 0 0 100px 200px;
+  border-color: transparent transparent #e95f55 transparent;
+  z-index: 2;
+}
+.email_animated_mail .email_top_fold {
+  position: absolute;
+  top: 50px;
+  width: 0;
+  height: 0;
+  border-style: solid;
+  border-width: 50px 100px 0 100px;
+  -webkit-transform-origin: 50% 0%;
+  -webkit-transition: transform 0.4s 0.4s, z-index 0.2s 0.4s;
+  -moz-transform-origin: 50% 0%;
+  -moz-transition: transform 0.4s 0.4s, z-index 0.2s 0.4s;
+  transform-origin: 50% 0%;
+  transition: transform 0.4s 0.4s, z-index 0.2s 0.4s;
+  border-color: #cf4a43 transparent transparent transparent;
+  z-index: 2;
+}
+.email_animated_mail .email_back_fold {
+  position: absolute;
+  bottom: 0;
+  width: 200px;
+  height: 100px;
+  background: #cf4a43;
+  z-index: 0;
+}
+.email_animated_mail .left-fold {
+  position: absolute;
+  bottom: 0;
+  width: 0;
+  height: 0;
+  border-style: solid;
+  border-width: 50px 0 50px 100px;
+  border-color: transparent transparent transparent #e15349;
+  z-index: 2;
+}
+.email_animated_mail .letter {
+  left: 20px;
+  bottom: 0px;
+  position: absolute;
+  width: 160px;
+  height: 60px;
+  background: white;
+  z-index: 1;
+  overflow: hidden;
+  transition: 0.4s 0.2s;
+}
+ .email_animated_mail .letter .email_letter_border {
+   height: 10px;
+   width: 100%;
+   background: repeating-linear-gradient(-45deg, #cb5a5e, #cb5a5e 8px, transparent 8px, transparent 18px);
+}
+.email_animated_mail .letter .email_letter_title {
+  margin-top: 10px;
+  margin-left: 5px;
+  height: 10px;
+  width: 40%;
+  background: #cb5a5e;
+}
+.email_animated_mail .letter .letter-context {
+  margin-top: 10px;
+  margin-left: 5px;
+  height: 10px;
+  width: 20%;
+  background: #cb5a5e;
+}
+.email_animated_mail .letter .letter-stamp {
+  margin-top: 30px;
+  margin-left: 120px;
+  border-radius: 100%;
+  height: 30px;
+  width: 30px;
+  background: #cb5a5e;
+  opacity: 0.3;
+}
+.email_shadow {
+   position: absolute;
+   top: 200px;
+   left: 50%;
+   width: 400px;
+   height: 30px;
+   transition: 0.4s;
+   transform: translateX(-50%);
+   -webkit-transition: 0.4s;
+   -webkit-transform: translateX(-50%);
+   -moz-transition: 0.4s;
+   -moz-transform: translateX(-50%);
+   border-radius: 100%;
+   background: radial-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.0), rgba(0, 0, 0, 0.0));
+}
+ .email_letter_image:hover .email_animated_mail {
+   transform: translateY(50px);
+   -webkit-transform: translateY(50px);
+   -moz-transform: translateY(50px);
+}
+.email_letter_image:hover .email_animated_mail .email_top_fold {
+   transition: transform 0.4s, z-index 0.2s;
+   transform: rotateX(180deg);
+   -webkit-transition: transform 0.4s, z-index 0.2s;
+   -webkit-transform: rotateX(180deg);
+   -moz-transition: transform 0.4s, z-index 0.2s;
+   -moz-transform: rotateX(180deg);
+   z-index: 0;
+}
+/*
+ * This indicates how much the email shall move
+ * upwards.
+ */
+.email_letter_image:hover .email_animated_mail .letter {
+  height: 170px;
+}
+/*
+ * The next CSS rule will expand the bottom-shadow of the email.
+ */
+.email_letter_image:hover .email_shadow {
+  width: 600px;
+}
+</style>
+</head>
+<body>
+<div class="email_letter_image">
+<div class="email_animated_mail">
+<div class="email_back_fold"></div>
+<div class="letter">
+<div class="email_letter_border"></div>
+<div class="email_letter_title"></div>
+<div class="letter-context"></div>
+<div class="letter-stamp">
+<div class="letter-stamp-inner"></div>
+</div>
+</div>
+<div class="email_top_fold"></div>
+<div class="email_body"></div>
+<div class="left-fold"></div>
+</div>
+<div class="email_shadow"></div>
+</div>
+</body>
+</html>

data/examples/html/fieldset_example.html CHANGED Viewed

@@ -7,7 +7,9 @@
 <form action="/foo.html" method="get">
 <fieldset>
-<legend style="font-size: larger; font-weight: bold">Personalia:</legend>
+<legend style="font-size: larger; font-weight: bold">
+Personalia - this is within the fieldset:
+</legend>
 <label for="fname">First name:</label>
 <input type="text" id="fname" name="fname"><br><br>
 <label for="lname">Last name:</label>

data/examples/html/font_examples/README.md ADDED Viewed

	@@ -0,0 +1 @@
1	+ This directory may contain some font-specific tests.

data/examples/html/font_examples/chancery_text.html ADDED Viewed

@@ -0,0 +1,19 @@
+<html>
+<head>
+</head>
+<style>
+body {
+  font-family: URW Chancery L, cursive;
+  font-size: 25px;
+}
+</style>
+<body>
+<h1>
+Hello world!
+</h1>
+</body>
+</html>

data/examples/html/font_examples/fantasy_text.html ADDED Viewed

@@ -0,0 +1,19 @@
+<html>
+<head>
+</head>
+<style>
+body {
+  font-family: fantasy;
+  font-size: 25px;
+}
+</style>
+<body>
+<h1>
+Hello world!
+</h1>
+</body>
+</html>

data/examples/html/font_examples/georgia_text.html ADDED Viewed

@@ -0,0 +1,19 @@
+<html>
+<head>
+</head>
+<style>
+body {
+  font-family: “Times New Roman”, Georgia, Serif;;
+  font-size: 25px;
+}
+</style>
+<body>
+<h1>
+Hello world!
+</h1>
+</body>
+</html>

data/examples/html/font_size_example/font_size_example.html ADDED Viewed

@@ -0,0 +1,85 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
+<html lang="en">
+<head>
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+<title>Font Size Example</title>
+<style>
+.fs10 {
+  font-family: arial, helvetica, sans-serif; font-size: 10px;
+}
+.fs11 {
+  font-family: arial, helvetica, sans-serif; font-size: 11px;
+}
+.fs12 {
+  font-family: arial, helvetica, sans-serif; font-size: 12px;
+}
+.fs13 {
+  font-family: arial, helvetica, sans-serif; font-size: 13px;
+}
+.fs14 {
+  font-family: arial, helvetica, sans-serif; font-size: 14px;
+}
+.fs15 {
+  font-family: arial, helvetica, sans-serif; font-size: 15px;
+}
+.fs16 {
+  font-family: arial, helvetica, sans-serif; font-size: 16px;
+}
+.fs17 {
+  font-family: arial, helvetica, sans-serif; font-size: 17px;
+}
+.fs18 {
+  font-family: arial, helvetica, sans-serif; font-size: 18px;
+}
+.fs19 {
+  font-family: arial, helvetica, sans-serif; font-size: 19px;
+}
+.fs20 {
+  font-family: arial, helvetica, sans-serif; font-size: 20px;
+}
+.raw_fs30 {
+  font-size: 30px;
+}
+.raw_fs40 {
+  font-size: 40px;
+}
+.raw_fs50 {
+  font-size: 50px;
+}
+</style>
+</head>
+<body style="margin: 2em; text-align: center">
+<span class="fs10">font-size: 10px</span><br>
+<span class="fs11">font-size: 11px</span><br>
+<span class="fs12">font-size: 12px</span><br>
+<span class="fs13">font-size: 13px</span><br>
+<span class="fs14">font-size: 14px</span><br>
+<span class="fs15">font-size: 15px</span><br>
+<span class="fs16">font-size: 16px</span><br>
+<span class="fs17">font-size: 17px</span><br>
+<span class="fs18">font-size: 18px</span><br>
+<span class="fs19">font-size: 19px</span><br>
+<span class="fs20">font-size: 20px</span><br>
+<span class="raw_fs30">font-size: 30px</span><br>
+<span class="raw_fs40">font-size: 40px</span><br>
+<span class="raw_fs50">font-size: 50px</span><br>
+</body>
+</html>

data/examples/html/glyph_example.html CHANGED Viewed

@@ -33,7 +33,6 @@
 </head>
 <body>
 <div id="chart">
 <div id="chart-shape">⬠</div>
  <div id="chart-value"></div>

data/examples/html/grayscale_filter_example/grayscale_filter_example.html ADDED Viewed

@@ -0,0 +1,15 @@
+<html>
+<head>
+<style>
+.grayscale {
+  -webkit-filter: grayscale(1);
+  filter: grayscale(1);
+}
+</style>
+</head>
+<body>
+<img src="../../../images/cyberweb_theme.png" class="grayscale">
+</body>
+</html>

data/examples/html/html_links_example.html ADDED Viewed

@@ -0,0 +1,61 @@
+<!DOCTYPE html>
+<html>
+<head>
+<title>HTML Links Example</title>
+<style>
+p {
+  font-size: 1.5em;
+}
+a {
+  outline: none;
+  text-decoration: none;
+  padding: 2px 1px 0;
+}
+a:link {
+  color: #265301;
+}
+a:visited {
+  color: #437A16;
+}
+a:focus {
+  border-bottom: 1px solid;
+  background: #BAE498;
+}
+a:hover {
+  border-bottom: 1px solid;
+  background: #CDFEAA;
+}
+a:active {
+  background: #265301;
+  color: #CDFEAA;
+}
+</style>
+</head>
+<body>
+<h1>HTML Links</h1>
+<p>
+  <a href="https://www.w3schools.com/">Visit W3Schools.com!</a>
+</p>
+<h2>Absolute URLs</h2>
+<p><a href="https://www.w3.org/">W3C</a></p>
+<p><a href="https://www.google.com/">Google</a></p>
+<h2>Relative URLs</h2>
+<p><a href="html_images.asp">HTML Images</a></p>
+<p><a href="/css/default.asp">CSS Tutorial</a></p>
+</body>
+</html>

data/examples/html/html_slider/html_slider.html ADDED Viewed

@@ -0,0 +1,39 @@
+<html>
+<head>
+<title>html_slider.html</title>
+<style>
+body {
+  padding: 50px 20px;
+}
+label {
+  display: block;
+}
+input[type=range] {
+  background: red;
+  width: 200px;
+  margin-bottom: 20px;
+}
+</style>
+</head>
+<body>
+<script>
+const volume = document.getElementById('volume');
+const result = document.getElementById('result');
+result.value = volume.value;
+volume.addEventListener('change', () => {
+  result.value = volume.value;
+});
+</script>
+<label for="volume">Volume: </label>
+<input type="range" id="volume" name="volume" min="0" max="20">
+<label for="result">Your choice: </label>
+<input type="number" id="result" name="result">
+</body>
+</html>

data/examples/html/input_autofocus_example.html CHANGED Viewed

@@ -4,13 +4,17 @@
 </head>
 <body>
-    <form action="/action_page.php">
-      <label for="fname">First name:</label>
-      <input type="text" id="fname" name="fname"><br>
-      <label for="lname">Last name:</label>
-      <input type="text" id="lname" name="lname" autofocus><br><br>
-      <input type="submit">
-    </form>
+<p>
+The second input-field makes use of <b>autofocus</b>.
+</p>
+   <form action="/action_page.php">
+     <label for="fname">First name:</label>
+     <input type="text" id="fname" name="fname"><br>
+     <label for="lname">Last name:</label>
+     <input type="text" id="lname" name="lname" autofocus><br><br>
+     <input type="submit">
+   </form>
 </body>
 </html>

data/examples/html/input_placeholder_example.html ADDED Viewed

@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<html>
+<body>
+<h1>The input placeholder attribute</h1>
+<form action="/foobar.php">
+  <label for="phone">Enter your phone number:</label><br><br>
+  <input type="tel" id="phone" name="phone" placeholder="123-45-678" pattern="[0-9]{3}-[0-9]{2}-[0-9]{3}"><br><br>
+  <small>Format: 123-45-678-912456</small><br><br>
+  <input type="submit">
+</form>
+</body>
+</html>

data/examples/html/larger_image_on_mouse_over_example.html CHANGED Viewed

@@ -23,7 +23,7 @@
 <body>
 <div class="enlarged">
-  <img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTS6XX_aJCzSJfuHZUes1xOsozH8KQjAB9VrA&usqp=CAU" style="border: 1px solid black"/>
+  <img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTS6XX_aJCzSJfuHZUes1xOsozH8KQjAB9VrA&usqp=CAU" style="border: 1px solid black" alt="This shows a cat."/>
 </div>
 </body>

data/examples/html/ordered_and_unordered_bulletsin.html CHANGED Viewed

@@ -1,28 +1,30 @@
 <html>
 <head>
 <title>Ordered Bulletins</title>
 <style>
 li.wide {
   padding: 1px;
-  margin-bottom: 5px;
+  margin-bottom: 8px;
 }
 </style>
 </head>
 <body>
+<h4>An unordered list:</h4>
 <ul>
 <li>Coffee 1</li>
 <li>Tea 1</li>
 <li>Milk 1</li>
 </ul>
+<h4>An unordered list with more spacing, thanks to margin-bottom: 8px:</h4>
 <ul>
 <li class="wide">Coffee 2</li>
 <li class="wide">Tea 2</li>
 <li class="wide">Milk 2</li>
 </ul>
+<h4>And now an ordered list:</h4>
 <ol>
 <li>Coffee 3</li>
 <li>Tea 3</li>