crunk
/
distribusi-verse
2
0
Fork 1
Code Issues Pull Requests Projects Releases 1 Wiki Activity
Browse Source

help page where distribusi is explained a bit

current_wdka_release
crunk 3 years ago
parent
36039fceed
commit
fd32d87509
3 changed files with 85 additions and 7 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. 11
      verse/static/css/style.css
  2. 79
      verse/templates/help.html
  3. 2
      verse/templates/index.html

11
verse/static/css/style.css
View File

@ -251,6 +251,17 @@ div.maincontent{
visibility: visible; visibility: visible;
opacity: 1; opacity: 1;
} }
.code-example {
width: 100%;
color: black;
padding: 1em;
box-sizing: border-box;
background: #E0B0FF;
outline: none;
font-family: Courier, sans-serif;
font-size: 16px;
}
/* /*
Project colors so far. Project colors so far.
light light

79
verse/templates/help.html
View File

@ -1,6 +1,11 @@
{% extends "base.html" %} {% extends "base.html" %}
{% block main %} {% block main %}
<div id="buttons"> <div id="buttons">
<div class="overview">
<a href="/">
<input type="button" name="button" value="Main page"></input>
</a>
</div>
{% if not current_user.is_authenticated %} {% if not current_user.is_authenticated %}
<div class="signin"> <div class="signin">
<a href="/login"> <a href="/login">
@ -39,12 +44,74 @@
{% endif %} {% endif %}
<div class="maincontent"> <div class="maincontent">
<h2>Distribusi-verse</h2> <h2>Distribusi-verse</h2>
<h3>Zipfiles become websites</h3> <h3>1. Zipfiles become websites</h3>
<h3>Folders become links and pages</h3> <p>Distribusi is a content management system for the web that produces static
<h3>Media files become visible</h3> index pages based on folders in the files system. For distrubisverse this means
<h3>Text files become readable</h3> that you can upload a zip file <em>(".zip file extension")</em> with content and have
<h3>Use Css to style your page</h3> distrubsi turn it into a webpage for you. Making a zip file is very easy for all
desktop operating systems (Windows, Mac OS and Linux)</p>
<h4>Windows 10</h4>
<h4>Mac OS</h4>
<hr>
<h3>2. Media files become visible</h3>
<p>Whenever Distribusi discovers media files in your zipfile it turns them
into the appropriate html tags. image files become img tags, audio files become
audio tags and so on. Currently distribusi supports images, videos, audio,
pdf and textfiles <em>(only ".txt" see 4. Text files become readable)</em>
</p>
<h4>Example:</h4>
<p>If your zipfile contains the image <strong>"cover.png"</strong> it becomes
the following html in your distribusi page:</p>
<pre class="code-example">&lt;div&nbsp;id=&quot;cover&quot;&nbsp;class=&quot;png&quot;&gt;
&nbsp;&nbsp;&lt;figure&gt;
&nbsp;&nbsp;&nbsp;&nbsp;&lt;img&nbsp;class=&quot;image&quot;&nbsp;src=&quot;cover.png&quot;&gt;
&nbsp;&nbsp;&nbsp;&nbsp;&lt;figcaption&gt;cover.png&lt;/figcaption&gt;
&nbsp;&nbsp;&lt;/figure&gt;
&lt;/div&gt;</pre>
<p>The encapsulating <strong>div</strong> tag gets an id that is the same as the
<em>file name.</em> The <strong>img</strong> tag gets a class attribute <em>image</em>
This is handy for styling your files with css (See 5.)</p>
<hr>
<h3>3. Folders become links and pages</h3>
<p>When you make your zipfile, this zipfile can contain folders with more
content. Distribusi turns these automatically into links and behind those links
a new page! These pages look identical to your main page because they share the
same style. </p>
<h4>Example:</h4>
<pre class="code-example">&lt;div&nbsp;id=&quot;folder&quot;&nbsp;class=&quot;dir&quot;&gt;
&nbsp;&nbsp;&lt;a&nbsp;href=&#39;new_folder/index.html&#39;&gt;new_folder&lt;/a&gt;
&lt;/div&gt;</pre>
<p>The encapsulating <strong>div</strong> tag gets an id
<em>folder.</em> and a class attribute <em>dir</em>
This is handy for styling your files with css (See 5.)</p>
<p>the anchor <em>(a)</em> tag will get an href attribute pointing to the
subfolder</p>
<hr>
<h3>4. Text files become readable</h3>
<p>When distribusi discovers a text file <em>(".txt file extension")</em> it
turns it into a pre tag with the text from the file in it. This enables users to
add simple text elements to their pages.</p>
<h4>Example:</h4>
<pre class="code-example">&lt;div&nbsp;id=&quot;my_textfile&quot;&nbsp;class=&quot;plain&quot;&gt;
&nbsp;&nbsp;&lt;pre&gt;
&nbsp;&nbsp;&nbsp;&nbsp;contents&nbsp;of&nbsp;my_textfile.txt&nbsp;gets&nbsp;rendered&nbsp;inside&nbsp;a&nbsp;pre&nbsp;tag.
&nbsp;&nbsp;&lt;/pre&gt;
&nbsp;&nbsp;&lt;span&nbsp;class=&quot;filename&quot;&gt;my_textfile.txt&lt;/span&gt;
&lt;/div&gt;</pre>
<p>The encapsulating <strong>div</strong> tag gets an id that is the same as the
<em>file name.</em> and a class attribute <em>plain</em>
This is handy for styling your files with css (See 5.)</p>
<hr>
<h3>5. Use Css to style your page</h3>
<p>Distribusi offers almost full support for styling your page with CSS.
Because all content is auto generated your Distribusi Css will be places in a
style tag in the head of each HTML file.</p>
<p>Distrbusi-verse allows its users to skip this step by just selecting a basic
theme or by selecting one of the themes other users have made <em>public.</em>
<p>Alternatively a user can opt to make their own custom theme, either in a
simple online editor or by uploading their own Css file.</p>
</p>
<hr>
</div> </div>
<!-- a div with all the distribusis listed in the distribusiverse --> <!-- a div with all the distribusis listed in the distribusiverse -->
{% endblock %} {% endblock %}

2
verse/templates/index.html
View File

@ -48,7 +48,7 @@
</p> </p>
<hr> <hr>
<p> <p>
This particular work in progress project is an attempt to make distribusi into a webinterface that can be operated remotely without any knowlegde of CLI. Trying to combine the ideas of distribusi with the ideas of a <a href="https://tildeverse.org/">Tildeverse</a> and <a href="https://tilde.club/">Tilde club</a>, but also be neither of these ideas. See a full list of tildeverse members <a href="https://tildeverse.org/members/">here</a>.</p> This particular work in progress project <strong>Distribusi-verse</strong> is an attempt to make distribusi into a webinterface that can be operated remotely without any knowlegde of CLI. Attempting to combine the ideas of distribusi with the ideas of a <a href="https://tildeverse.org/">Tildeverse</a> and <a href="https://tilde.club/">Tilde club</a>, but also be neither of these ideas. See a full list of tildeverse members <a href="https://tildeverse.org/members/">here</a>.</p>
<hr> <hr>
<p>This project is made for <a href="https://www.wdka.nl/practices/autonomous-practices/">Autonomous Practices </a>at the <a href="https://www.wdka.nl/">WDKA</a> in Rotterdam.</p> <p>This project is made for <a href="https://www.wdka.nl/practices/autonomous-practices/">Autonomous Practices </a>at the <a href="https://www.wdka.nl/">WDKA</a> in Rotterdam.</p>
</div> </div>

Write Preview
Loading…
Cancel
Save