* weitere Spielereien mit dem Layout
This commit is contained in:
parent
7eb3e063d8
commit
9ada9f6953
7 changed files with 209 additions and 28 deletions
Binary file not shown.
|
Before Width: | Height: | Size: 5.3 KiB After Width: | Height: | Size: 5 KiB |
|
|
@ -15,12 +15,32 @@ h1, h2, h3, h4 {
|
|||
color: #7fb945;
|
||||
}
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
color: #f57900;
|
||||
background: none;
|
||||
}
|
||||
|
||||
a:visited {
|
||||
color: #ce5c00;
|
||||
}
|
||||
|
||||
a:active {
|
||||
color: Orange;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: #fcaf3e;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/*
|
||||
a:link, a:visited {
|
||||
color: #7fb945;
|
||||
}
|
||||
a:hover {
|
||||
color: #3f8915;
|
||||
}
|
||||
}*/
|
||||
|
||||
hr {
|
||||
height: 1px;
|
||||
|
|
@ -45,7 +65,7 @@ hr {
|
|||
}
|
||||
|
||||
#titlebar {
|
||||
background: #336699;
|
||||
background-color: #33436a;
|
||||
color: white;
|
||||
font-size: 44px;
|
||||
text-shadow: 2px 2px 3px gray;
|
||||
|
|
@ -53,6 +73,7 @@ hr {
|
|||
padding-top: 1px;
|
||||
padding-left: 16px;
|
||||
padding-right: 16px;
|
||||
border-bottom: 6px solid #f57900;
|
||||
}
|
||||
|
||||
#titlebar .right {
|
||||
|
|
@ -64,12 +85,18 @@ hr {
|
|||
/* #### Menue #### */
|
||||
#nav {
|
||||
float: left;
|
||||
width: 20%;
|
||||
padding: 0;
|
||||
border: 1px solid silver;
|
||||
margin-top: 40px;
|
||||
color: rgb(80,80,80);
|
||||
background-color: transparent;
|
||||
text-align: left;
|
||||
/*position: absolute;
|
||||
top: 130px;
|
||||
right: 10px;*/
|
||||
width: 180px;
|
||||
margin: 0 0 0.5em 2em;
|
||||
padding: 0.75em;
|
||||
font-size: 90%;
|
||||
border:1px solid #ccc;
|
||||
background-color: #f6f6f6;
|
||||
line-height: normal;
|
||||
}
|
||||
|
||||
#nav a {
|
||||
|
|
@ -94,6 +121,10 @@ hr {
|
|||
|
||||
/* Hauptteil einer Seite */
|
||||
|
||||
#toctitle {
|
||||
color: #888;
|
||||
}
|
||||
|
||||
#main {
|
||||
margin-left: 25%;
|
||||
padding: 0 1em;
|
||||
|
|
@ -133,6 +164,22 @@ hr {
|
|||
padding-right: 15px;
|
||||
}
|
||||
|
||||
|
||||
/* #selection - Formatiert die Buttons der Startseite */
|
||||
#selection a {
|
||||
text-decoration: none;
|
||||
font-size: 110%;
|
||||
}
|
||||
|
||||
#selection td {
|
||||
vertical-align: middle;
|
||||
padding: 0.6em 0.6em 0.9em 0;
|
||||
}
|
||||
|
||||
#selection img {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/* Zitate */
|
||||
blockquote {
|
||||
font-style:italic;
|
||||
|
|
@ -161,8 +208,8 @@ caption {
|
|||
|
||||
#footer {
|
||||
clear: left;
|
||||
border-top: 1px solid #B7B7B7;
|
||||
background: rgb(233,238,249);
|
||||
border-top: 3px solid #B7B7B7;
|
||||
background-color: #33436a;
|
||||
margin-top: 30px;
|
||||
padding: 15px 15px 0 15px;
|
||||
color: #777777;
|
||||
|
|
|
|||
Binary file not shown.
|
Before Width: | Height: | Size: 7.7 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 12 KiB |
|
|
@ -56,6 +56,17 @@ begin{rawhtml}
|
|||
|
||||
\begin_layout Standard
|
||||
|
||||
<div id="titlebar">
|
||||
\end_layout
|
||||
|
||||
\begin_layout Standard
|
||||
|
||||
<div class="right">Die CryptoCD</div>
|
||||
\end_layout
|
||||
|
||||
\begin_layout Standard
|
||||
|
||||
</div>
|
||||
\end_layout
|
||||
|
||||
\begin_layout Standard
|
||||
|
|
@ -71,7 +82,7 @@ end{rawhtml}
|
|||
\end_layout
|
||||
|
||||
\begin_layout Standard
|
||||
\begin_inset Include \input{menue.inc}
|
||||
\begin_inset Include \input{/home/phil/daten/sao/svn/cryptocd/trunk/documents/menue/menue.inc}
|
||||
preview false
|
||||
|
||||
\end_inset
|
||||
|
|
@ -124,27 +135,139 @@ end{rawhtml}
|
|||
|
||||
\end_layout
|
||||
|
||||
\begin_layout Title
|
||||
Die CryptoCD
|
||||
\begin_layout Standard
|
||||
\begin_inset ERT
|
||||
status collapsed
|
||||
|
||||
\begin_layout Standard
|
||||
|
||||
|
||||
\backslash
|
||||
begin{rawhtml}
|
||||
\end_layout
|
||||
|
||||
\begin_layout Standard
|
||||
Die CryptoCD ist ein Projekt mit einem klaren Ziel: Verschlüsselung für
|
||||
die Massen.
|
||||
|
||||
<table id="selection">
|
||||
\end_layout
|
||||
|
||||
\begin_layout Standard
|
||||
Die folgenden Beschreibungen werden dich in die Lage versetzen, durch Verschlüss
|
||||
elung deine Privatsphäre zu schützen.
|
||||
Auf der linken Seite siehst du ein Navigationsmenü, welches dich durch
|
||||
die Materie begleitet.
|
||||
Fang' einfach oben an und klick dich nach unten durch.
|
||||
|
||||
<tr>
|
||||
\end_layout
|
||||
|
||||
\begin_layout Standard
|
||||
Bist du die wichtigsten Texte durchgegangen, dann brauchst du nur noch deine
|
||||
GesprächspartnerInnen dazu animieren, es dir gleich zu tun, und schon kann
|
||||
es losgehen.
|
||||
|
||||
<td><a href="einfuehrung.html"><img src="einfuehrung.png" alt="Einführung
|
||||
" /></a></td>
|
||||
\end_layout
|
||||
|
||||
\begin_layout Standard
|
||||
|
||||
<td><a href="einfuehrung.html">Einführung</a><br/>
|
||||
\end_layout
|
||||
|
||||
\begin_layout Standard
|
||||
|
||||
Die Einführung erläutert, warum Verschlüsselung
|
||||
wichtig ist und wie sie funktioniert.</td>
|
||||
\end_layout
|
||||
|
||||
\begin_layout Standard
|
||||
|
||||
</tr>
|
||||
\end_layout
|
||||
|
||||
\begin_layout Standard
|
||||
|
||||
<tr>
|
||||
\end_layout
|
||||
|
||||
\begin_layout Standard
|
||||
|
||||
<td><a href="e-mail.html"><img src="email.png" alt="E-Mail" /></a></td>
|
||||
\end_layout
|
||||
|
||||
\begin_layout Standard
|
||||
|
||||
<td><a href="e-mail.html">E-Mail</a><br/>
|
||||
\end_layout
|
||||
|
||||
\begin_layout Standard
|
||||
|
||||
E-Mails verschlüsselt verschicken und empfangen.</td>
|
||||
\end_layout
|
||||
|
||||
\begin_layout Standard
|
||||
|
||||
</tr>
|
||||
\end_layout
|
||||
|
||||
\begin_layout Standard
|
||||
|
||||
<tr>
|
||||
\end_layout
|
||||
|
||||
\begin_layout Standard
|
||||
|
||||
<td><a href="chat.html"><img src="chat.png" alt="Chat" /></a></td>
|
||||
\end_layout
|
||||
|
||||
\begin_layout Standard
|
||||
|
||||
<td><a href="chat.html">Chat</a><br/>
|
||||
\end_layout
|
||||
|
||||
\begin_layout Standard
|
||||
|
||||
Chat-Nachrichten verschlüsseln.</td>
|
||||
\end_layout
|
||||
|
||||
\begin_layout Standard
|
||||
|
||||
</tr>
|
||||
\end_layout
|
||||
|
||||
\begin_layout Standard
|
||||
|
||||
</table>
|
||||
\end_layout
|
||||
|
||||
\begin_layout Standard
|
||||
|
||||
|
||||
\backslash
|
||||
end{rawhtml}
|
||||
\end_layout
|
||||
|
||||
\end_inset
|
||||
|
||||
|
||||
\end_layout
|
||||
|
||||
\begin_layout Standard
|
||||
Diese CD enthält eine Zusammenstellung von einfach formulierten Anleitungen
|
||||
und Programmen, die dir das Verschlüsseln deiner Kommunikation ermöglichen.
|
||||
Die CryptoCD ist
|
||||
\begin_inset ERT
|
||||
status collapsed
|
||||
|
||||
\begin_layout Standard
|
||||
|
||||
|
||||
\backslash
|
||||
htmladdnormallink{Freie Software}{about.html#lizenz}
|
||||
\end_layout
|
||||
|
||||
\end_inset
|
||||
|
||||
.
|
||||
Du kannst sie also an deine Gesprächspartner und -partnerinnen weitergeben
|
||||
und sie dazu animieren ihre Kommunikation ebenfalls zu verschlüsseln.
|
||||
\end_layout
|
||||
|
||||
\begin_layout Standard
|
||||
Zum Starten klicke einfach eines der Themen oben oder im Menü an.
|
||||
\end_layout
|
||||
|
||||
\begin_layout Standard
|
||||
|
|
|
|||
|
|
@ -1,10 +1,11 @@
|
|||
\begin{rawhtml}
|
||||
<div id="nav">
|
||||
<div id="toctitle"><h2>Navigation</h2></div
|
||||
<ul>
|
||||
<li><a href="" title="">Einführung ins Thema</li>
|
||||
<li><a href="" title="">E-Mail verschlüsseln</a></li>
|
||||
<li><a href="" title="">Chat-Nachrichten verschüsseln</a></li>
|
||||
<li><a href="" title="">Über die CD</a></li>
|
||||
<li><a href="einfuehrung.html" title="Thematischer Einstieg">Einführung ins Thema</li>
|
||||
<li><a href="e-mail.html" title="E-Mail Verschlüsselung">E-Mails verschlüsseln</a></li>
|
||||
<li><a href="chat.html" title="Chat Verschlüsselung">Chats verschüsseln</a></li>
|
||||
<li><a href="about.html" title="Informationen zur CD">Über die CD</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
\end{rawhtml}
|
||||
10
documents/menue/menue.inc
Normal file
10
documents/menue/menue.inc
Normal file
|
|
@ -0,0 +1,10 @@
|
|||
\begin{rawhtml}
|
||||
<div id="nav">
|
||||
<ul>
|
||||
<li><a href="" title="">Einführung ins Thema</li>
|
||||
<li><a href="" title="">E-Mail verschlüsseln</a></li>
|
||||
<li><a href="" title="">Chat-Nachrichten verschüsseln</a></li>
|
||||
<li><a href="" title="">Über die CD</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
\end{rawhtml}
|
||||
Loading…
Reference in a new issue