ghopp
/
weird-web-workers.org
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

add more content...currently this has not much structure

master
Georg Hopp 10 years ago
parent
a4e765861e
commit
f64244c8e6
6 changed files with 233 additions and 109 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. BIN
      app/assets/images/GodfreyKneller-IsaacNewton-1689.jpg
  2. BIN
      app/assets/images/resized/robin.jpg
  3. BIN
      app/assets/images/resized/robin_save.jpg
  4. BIN
      app/assets/images/richard_stallman-620x465-100590280-orig.jpg
  5. 89
      app/assets/stylesheets/welcome.scss
  6. 253
      app/views/welcome/index.html.erb

BIN
app/assets/images/GodfreyKneller-IsaacNewton-1689.jpg
View File

Side by Side

After

Width: 407  |  Height: 559  |  Size: 198 KiB

BIN
app/assets/images/resized/robin.jpg
View File

Side by Side Swipe Overlay

Before

Width: 1920  |  Height: 1440  |  Size: 1.8 MiB

After

Width: 1920  |  Height: 1200  |  Size: 1.6 MiB

BIN
app/assets/images/resized/robin_save.jpg
View File

Side by Side

After

Width: 1920  |  Height: 1440  |  Size: 1.8 MiB

BIN
app/assets/images/richard_stallman-620x465-100590280-orig.jpg
View File

Side by Side

After

Width: 620  |  Height: 465  |  Size: 38 KiB

89
app/assets/stylesheets/welcome.scss
View File

@ -78,7 +78,6 @@ p {
left: 30px; left: 30px;
top: 50%; top: 50%;
transform: translate(0, -50%); transform: translate(0, -50%);
} }
#logo img { #logo img {
border: 2px solid white; border: 2px solid white;
@ -124,19 +123,21 @@ p {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
#section1 {
background: image_url("resized/blown.jpg") fixed;
background-position: center top;
}
#section1,#section3 .content {
#section1 .content ,#section3, .content, #section5 .content {
color: rgb(214,206,204); color: rgb(214,206,204);
background-position: center top;
} }
#section2,#section4 {
#section2, #section4, #section6 {
background-color: rgb(255,255,255); background-color: rgb(255,255,255);
} }
#section1 {
background: image_url("resized/blown.jpg") fixed;
}
#section3 { #section3 {
background: image_url("resized/beach3.jpg") fixed; background: image_url("resized/beach3.jpg") fixed;
background-position: center top;
}
#section5 {
background: image_url("resized/robin.jpg") fixed;
} }
#footer { #footer {
@ -171,12 +172,27 @@ p {
overflow: hidden; overflow: hidden;
box-shadow: 10px 10px 10px rgba(0,0,0,0.7); box-shadow: 10px 10px 10px rgba(0,0,0,0.7);
} }
#weird {
position: relative;
width: 70%;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
#weird .textbox {
overflow: hidden;
box-shadow: 10px 10px 10px rgba(0,0,0,0.7);
text-align: justify;
}
.textbox { .textbox {
display: inline-block; display: inline-block;
border-color: rgba(100,190,12,0.7); border-color: rgba(100,190,12,0.7);
background-color: rgba(255,255,255,0.7); background-color: rgba(255,255,255,0.7);
} }
.textbox h1 {
text-align: center;
}
.projectspace { .projectspace {
display: inline-block; display: inline-block;
@ -269,6 +285,63 @@ p {
border-width: 3px; border-width: 3px;
} }
.separator {
position: relative;
border-bottom: 1px dotted black;
height: 0px;
width: 20%;
left: 50%;
transform: translate(-50%, 0);
margin-top: 10px;
margin-bottom: 10px;
}
.dictionary {
position: relative;
width: 70%;
left: 50%;
transform: translate(-50%, 0);
font-size: small;
}
.dictionary .headword {
display: inline-block;
color: red;
font-weight: bold;
text-decoration: underline;
}
.dictionary .headword i {
color: inherit;
}
.dictionary .pronounciation {
display: inline-block;
font-family: monospace;
}
.dictionary .conjugation {
display: inline-block;
font-weight: bold;
}
.dictionary ol li {
margin-left: 10px;
}
.dictionary ol li:before {
font-weight: bold;
}
.dictionary .sense .example {
font-style: italic;
}
.dictionary .sense .reference {
text-decoration: underline;
font-family: serif;
}
.dictionary ol {
counter-reset: section;
list-style-type: none;
}
.dictionary li::before {
counter-increment: section;
content: counters(section,".") " ";
}
/* /*
#title { #title {
position: fixed; position: fixed;

253
app/views/welcome/index.html.erb
View File

@ -74,107 +74,43 @@
</div> </div>
<div id="section3" class="section"> <div id="section3" class="section">
<div class="content"> <div class="content">
<h1>Dictionary</h1>
<p>
<b>weird</b> / 'wɪəd /<br/>
<i>adj.</i> weird·er, weird·est
<ol>
<li>
Strikingly odd or unusual, especially in an unsettling way; strange:
<i>
<b>
He lives in a weird old house on a dark street. Your neighbor is
said to be a little weird. I felt a little weird after drinking
that tea.
</b>
</i>
</li>
<li>
Suggestive of the supernatural:
<i><b>weird stories about ghosts.</b></i>
</li>
<li>
<i>Archaic</i> Of or relating to fate or the Fates.
</li>
</ol>
</p>
<p>
<b>web</b> / web /<br/>
<i>n.</i>
<ol>
<li>
<ol>
<li>
A woven fabric, especially one on a loom or just removed from
it.
</li>
<li>The structural part of cloth.</li>
</ol>
</li>
<li>
A latticed or woven structure:
<i><b>A web of palm branches formed the roof of the hut.</b></i>
</li>
<li>
A structure of delicate, threadlike filaments characteristically
spun by spiders or certain insect larvae.
</li>
<li>
Something intricately contrived, especially something that ensnares
or entangles: <i><b>caught in a web of lies.</b></i>
</li>
<li>
A complex, interconnected structure or arrangement:
<i><b>a web of telephone wires.</b></i>
</li>
<li>
often Web The World Wide Web.
</li>
<li>
A radio or television network.
</li>
<li>
A membrane or fold of skin connecting the toes, as of certain
amphibians, birds, and mammals.
</li>
<li>
The barbs on each side of the shaft of a bird's feather; a vane.
</li>
<li>
<i>Baseball</i> A piece of leather or leather mesh that fills the
space between the thumb and forefinger of a baseball glove. Also
called <i>trap</i>, <i>webbing</i>.
</li>
<li>
<i>Architecture</i> A space or compartment between the ribs or
groins of a vault. Also called <i>cell</i>.
</li>
<li>
A metal sheet or plate connecting the heavier sections, ribs, or
flanges of a structural element.
</li>
<li>
A thin metal plate or strip, as the bit of a key or the blade of a
saw.
</li>
<li>
A large continuous roll of paper, such as newsprint, either in the
process of manufacture or as it is fed into a web press.
</li>
</ol>
</p>
<p>
<b>workers</b> / 'wɜ:kəz /<br/>
See: personnel</br>
<b>personnel</b> / ˌpɜːsəˈnel /<br/>
band of employees, body of employees, cast, clerical staff, company,
corps of employyes, coworkers, crew, factotums, fellow workers, help,
labor supply, laborers, laboring force, manpower, members, office force,
servantry, servants, staff, team of emmloyees, work force, work party,
workers, working people
</p>
Take from
<a href="http://www.thefreedictionary.com/">"The free dictionary"</a>
<div id="weird">
<div class="textbox">
<h1>WEIRD</h1>
<div class="separator"></div>
<div class="dictionary">
<div class="headword">weird <i>adj.</i></div>
<div class="pronounciation">/'wɪəd/</div>
<div class="conjugation">weird·er, weird·est</div>
<ol class="sense">
<li>
Strikingly odd or unusual, especially in an unsettling way;
strange:
<span class="example">
He lives in a weird old house on a dark street. Your neighbor
is said to be a little weird. I felt a little weird after
drinking that tea.
</span>
</li>
<li>
Suggestive of the supernatural:
<span class="example">weird stories about ghosts.</span>
</li>
<li>
<span class="reference">Archaic</span> Of or relating to fate or
the Fates.
</li>
</ol>
</div>
<div class="separator"></div>
Taken from
<a href="http://www.thefreedictionary.com/">"The free dictionary"</a>
Phonetics from
<a href="http://www.photransedit.com/online/text2phonetics.aspx">
PhoTransEdit
</a>
</div>
</div>
</div> </div>
</div> </div>
<div id="section4" class="section"> <div id="section4" class="section">
@ -202,4 +138,119 @@
<% end -%> <% end -%>
</div> </div>
</div> </div>
<div id="section5" class="section">
<div class="content">
<div id="weird">
<div class="textbox">
<h1>WEB</h1>
<div class="separator"></div>
<div class="dictionary">
<div class="headword">web <i>n.</i></div>
<div class="pronounciation">/web/</div>
<ol class="sense">
<li>&nbsp;
<ol>
<li>
A woven fabric, especially one on a loom or just removed from
it.
</li>
<li>The structural part of cloth.</li>
</ol>
</li>
<li>
A latticed or woven structure:
<span class="example">
A web of palm branches formed the roof of the hut.
</span>
</li>
<li>
A structure of delicate, threadlike filaments characteristically
spun by spiders or certain insect larvae.
</li>
<li>
Something intricately contrived, especially something that ensnares
or entangles: <span class="example">caught in a web of lies.</span>
</li>
<li>
A complex, interconnected structure or arrangement:
<span class="example">a web of telephone wires.</span>
</li>
<li>
often Web The World Wide Web.
</li>
<li>
A radio or television network.
</li>
<li>
A membrane or fold of skin connecting the toes, as of certain
amphibians, birds, and mammals.
</li>
<li>
The barbs on each side of the shaft of a bird's feather; a vane.
</li>
<li>
<span class="reference">Baseball</span> A piece of leather or
leather mesh that fills the space between the thumb and forefinger
of a baseball glove. Also called
<span class="reference">trap</span>,
<span class="reference">webbing</span>.
</li>
<li>
<span class="reference">Architecture</span> A space or compartment
between the ribs or groins of a vault. Also called
<span class="reference">cell</span>.
</li>
<li>
A metal sheet or plate connecting the heavier sections, ribs, or
flanges of a structural element.
</li>
<li>
A thin metal plate or strip, as the bit of a key or the blade of a
saw.
</li>
<li>
A large continuous roll of paper, such as newsprint, either in the
process of manufacture or as it is fed into a web press.
</li>
</ol>
</div>
<div class="separator"></div>
Taken from
<a href="http://www.thefreedictionary.com/">"The free dictionary"</a>
Phonetics from
<a href="http://www.photransedit.com/online/text2phonetics.aspx">
PhoTransEdit
</a>
</div>
</div>
</div>
</div>
<div id="section6" class="section">
<%= image_tag "dogs2.svg", class: "watermark" %>
<div class="content">
<h1>Dictionary</h1>
<div class="separator"></div>
<div class="separator"></div>
<div class="dictionary">
<div class="headword">workers <i>n.</i></div>
<div class="pronounciation">/'wɜ:kəz/</div>
<div class="sense">See: personnel</div>
<div class="headword">personnel <i>n.</i></div>
<div class="pronounciation">/ˌpɜːsəˈnel/</div>
<div class="sense">
band of employees, body of employees, cast, clerical staff, company,
corps of employyes, coworkers, crew, factotums, fellow workers, help,
labor supply, laborers, laboring force, manpower, members, office force,
servantry, servants, staff, team of emmloyees, work force, work party,
workers, working people
</div>
Taken from
<a href="http://www.thefreedictionary.com/">"The free dictionary"</a>
Phonetics from
<a href="http://www.photransedit.com/online/text2phonetics.aspx">
PhoTransEdit
</a>
</div>
</div>
</div>
<!-- vim: set ts=2 sw=2: --> <!-- vim: set ts=2 sw=2: -->
Write Preview
Loading…
Cancel
Save