"Demo release"
This commit is contained in:
parent
e0eb103c7a
commit
42393a60cd
@ -182,3 +182,7 @@ input[type="image"]:hover {
|
|||||||
background-color: var(--coloured-bg);
|
background-color: var(--coloured-bg);
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
strong {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|||||||
64
tetawebapp/templates/articles.html
Normal file
64
tetawebapp/templates/articles.html
Normal file
@ -0,0 +1,64 @@
|
|||||||
|
{% extends "index.html" %}
|
||||||
|
{% block main %}
|
||||||
|
<article class='right'>
|
||||||
|
<h3>This is the title</h3>
|
||||||
|
<img src='/static/images/dummy_pic.png' alt='dummy pic' title='dummy pic'/>
|
||||||
|
<p>
|
||||||
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore
|
||||||
|
et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
|
||||||
|
aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum
|
||||||
|
dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui
|
||||||
|
officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit,
|
||||||
|
sed do eiusmod tempor incididunt ut labore
|
||||||
|
</p>
|
||||||
|
<p>This <a href='/plop.html'>link</a> will lead to an error page</p>
|
||||||
|
<p>
|
||||||
|
et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
|
||||||
|
aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum
|
||||||
|
dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui
|
||||||
|
officia desers unt mollit anim id est laborum.
|
||||||
|
</p>
|
||||||
|
<ul>
|
||||||
|
<li>plop</li>
|
||||||
|
<li>plap</li>
|
||||||
|
<li>plip</li>
|
||||||
|
</ul>
|
||||||
|
<ol>
|
||||||
|
<li>plop</li>
|
||||||
|
<li>plap</li>
|
||||||
|
<li>plip</li>
|
||||||
|
</ol>
|
||||||
|
<p>
|
||||||
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore
|
||||||
|
et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
|
||||||
|
aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum
|
||||||
|
dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui
|
||||||
|
officia deserunt mollit anim id est laborum.
|
||||||
|
</p>
|
||||||
|
</article>
|
||||||
|
<article class='left'>
|
||||||
|
<h3>The title is back again and is angry</h3>
|
||||||
|
<img src='/static/images/dummy_pic.png' alt='dummy pic' title='dummy pic'/>
|
||||||
|
<p>
|
||||||
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore
|
||||||
|
et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
|
||||||
|
aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum
|
||||||
|
dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui
|
||||||
|
officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit,
|
||||||
|
sed do eiusmod tempor incididunt ut labore
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
|
||||||
|
aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum
|
||||||
|
dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui
|
||||||
|
officia deserunt mollit anim id est laborum.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore
|
||||||
|
et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
|
||||||
|
aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum
|
||||||
|
dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui
|
||||||
|
officia deserunt mollit anim id est laborum.
|
||||||
|
</p>
|
||||||
|
</article>
|
||||||
|
{% endblock %}
|
||||||
54
tetawebapp/templates/basics.html
Normal file
54
tetawebapp/templates/basics.html
Normal file
@ -0,0 +1,54 @@
|
|||||||
|
{% extends "index.html" %}
|
||||||
|
{% block main %}
|
||||||
|
<article class='right'>
|
||||||
|
<h3>Basics</h3>
|
||||||
|
<p>
|
||||||
|
Thanks to <a href='http://flask.pocoo.org/'>Python/Flask</a> with <strong>TetaWebApp</strong> most of the output things come to life via
|
||||||
|
<a href='http://jinja.pocoo.org/docs/2.10/'>Jinja2 HTML templates</a>
|
||||||
|
and is 100% <strong title='Bulshit inside'>HTML5 ready©</strong>.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
Colors and fonts are managed from a separated CSS files letting you easily
|
||||||
|
change the default theme to your favorite colors and icon set.
|
||||||
|
</p>
|
||||||
|
<pre>
|
||||||
|
@font-face {
|
||||||
|
font-family: "Roboto Condensed";
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 400;
|
||||||
|
src: var(--font-normal);
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: "Roboto Condensed";
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 700;
|
||||||
|
src: var(--font-bold);
|
||||||
|
}
|
||||||
|
</pre>
|
||||||
|
<pre>
|
||||||
|
:root {
|
||||||
|
--coloured-bg: #FF5D00;
|
||||||
|
--light-coloured-bg: #FFB387;
|
||||||
|
--clear-bg: #E5E5E5;
|
||||||
|
--mid-bg: #BBBBBB;
|
||||||
|
--dark-bg: #2B2B2B;
|
||||||
|
--dark-border: #888888;
|
||||||
|
--text-color: #555555;
|
||||||
|
--white: #FFFFFF;
|
||||||
|
--black: #000000;
|
||||||
|
--font-normal: url("/static/fonts/RobotoCondensed-Regular.ttf") format("truetype");
|
||||||
|
--font-bold: url("/static/fonts/RobotoCondensed-Bold.ttf") format("truetype");
|
||||||
|
--banner-logo: url(/static/images/logo.png);
|
||||||
|
--add_icon: url(/static/images/add.png);
|
||||||
|
--edit_icon: url(/static/images/edit.png);
|
||||||
|
--login_icon: url(/static/images/login.png);
|
||||||
|
--logout_icon: url(/static/images/logout.png);
|
||||||
|
--refresh_icon: url(/static/images/refresh.png);
|
||||||
|
--save_icon: url(/static/images/save.png);
|
||||||
|
--search_icon: url(/static/images/search.png);
|
||||||
|
--trash_icon: url(/static/images/trash.png);
|
||||||
|
}
|
||||||
|
</pre>
|
||||||
|
</article>
|
||||||
|
{% endblock %}
|
||||||
11
tetawebapp/templates/database.html
Normal file
11
tetawebapp/templates/database.html
Normal file
@ -0,0 +1,11 @@
|
|||||||
|
{% extends "index.html" %}
|
||||||
|
{% block main %}
|
||||||
|
<article class='right'>
|
||||||
|
<h3>Accessing database</h3>
|
||||||
|
<p>
|
||||||
|
Even if using <a href='http://flask-sqlalchemy.pocoo.org/2.3/'>Flask-SQLAlchemy</a> to retrieve data
|
||||||
|
stored in <strong>Postgres</strong> databases is the recommended way to use <strong>TetaWebApp</strong>,
|
||||||
|
you're free to use the database connector that suit your need.
|
||||||
|
</p>
|
||||||
|
</article>
|
||||||
|
{% endblock %}
|
||||||
@ -30,100 +30,28 @@
|
|||||||
<main>
|
<main>
|
||||||
{% block main %}
|
{% block main %}
|
||||||
<article class='right'>
|
<article class='right'>
|
||||||
<h3>Le putain de titre</h3>
|
<h3>TetaWebApp demo</h3>
|
||||||
<img src='/static/images/dummy_pic.png' alt='dummy pic' title='dummy pic'/>
|
|
||||||
<p>
|
<p>
|
||||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore
|
Welcome to the <strong>TetaWebApp</strong> demo
|
||||||
et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
|
|
||||||
aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum
|
|
||||||
dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui
|
|
||||||
officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit,
|
|
||||||
sed do eiusmod tempor incididunt ut labore
|
|
||||||
</p>
|
|
||||||
<p>This <a href='/plop.html'>link</a> may lead to an error page</p>
|
|
||||||
<p>
|
|
||||||
et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
|
|
||||||
aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum
|
|
||||||
dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui
|
|
||||||
officia deserunt mollit anim id est laborum.
|
|
||||||
</p>
|
</p>
|
||||||
<p>
|
<p>
|
||||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore
|
TetaWebApp is a basic web application template based on Python/Flask made by <a href='https://www.tetalab.org'>Tetalab</a>.
|
||||||
et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
|
|
||||||
aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum
|
|
||||||
dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui
|
|
||||||
officia deserunt mollit anim id est laborum.
|
|
||||||
</p>
|
|
||||||
</article>
|
|
||||||
<article class='left'>
|
|
||||||
<h3>Le putain de titre 2</h3>
|
|
||||||
<img src='/static/images/dummy_pic.png' alt='dummy pic' title='dummy pic'/>
|
|
||||||
<p>
|
|
||||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore
|
|
||||||
et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
|
|
||||||
aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum
|
|
||||||
dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui
|
|
||||||
officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit,
|
|
||||||
sed do eiusmod tempor incididunt ut labore
|
|
||||||
</p>
|
</p>
|
||||||
<p>
|
<p>
|
||||||
et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
|
The goal of this project is to provide a canvas to make any web application you need.
|
||||||
aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum
|
|
||||||
dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui
|
|
||||||
officia deserunt mollit anim id est laborum.
|
|
||||||
</p>
|
</p>
|
||||||
<p>
|
<p>
|
||||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore
|
You can <strong title='bullshit inside'>virtually</strong> do any app you want with TetaWebApp.
|
||||||
et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
|
|
||||||
aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum
|
|
||||||
dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui
|
|
||||||
officia deserunt mollit anim id est laborum.
|
|
||||||
</p>
|
</p>
|
||||||
</article>
|
<p>
|
||||||
<article>
|
But be sure that you <strong>still</strong> need work to make it work ;-)
|
||||||
<h3>Inputs demo</h3>
|
</p>
|
||||||
<ul>
|
<p>
|
||||||
<li>plop</li>
|
Get a copy of <strong>TetaWebApp</strong>:<br/>
|
||||||
<li>plap</li>
|
|
||||||
<li>plip</li>
|
|
||||||
</ul>
|
|
||||||
<ol>
|
|
||||||
<li>plop</li>
|
|
||||||
<li>plap</li>
|
|
||||||
<li>plip</li>
|
|
||||||
</ol>
|
|
||||||
<input type='text'/>
|
|
||||||
<button>Click me</button>
|
|
||||||
<br/>
|
|
||||||
<textarea cols='25'></textarea>
|
|
||||||
<br/>
|
|
||||||
<select>
|
|
||||||
{% for item in menu %}
|
|
||||||
<option>{{ item[0] }}</option>
|
|
||||||
{% endfor %}
|
|
||||||
</select>
|
|
||||||
<input type='submit' value='Click me too'/>
|
|
||||||
<br/>
|
|
||||||
<input type='button' value='And me !' />
|
|
||||||
<br/>
|
|
||||||
<input type='image' value='' src='/static/images/add.png' title='add' alt='add'/>
|
|
||||||
<input type='image' value='' src='/static/images/edit.png' title='edit' alt='edit'/>
|
|
||||||
<input type='image' value='' src='/static/images/login.png' title='login' alt='login'/>
|
|
||||||
<input type='image' value='' src='/static/images/logout.png' title='logout' alt='logout'/>
|
|
||||||
<input type='image' value='' src='/static/images/refresh.png' title='refresh' alt='refresh'/>
|
|
||||||
<input type='image' value='' src='/static/images/save.png' title='save' alt='save'/>
|
|
||||||
<input type='image' value='' src='/static/images/search.png' title='search' alt='search'/>
|
|
||||||
<input type='image' value='' src='/static/images/trash.png' title='trash' alt='trash'/>
|
|
||||||
<br/>
|
|
||||||
<pre>
|
<pre>
|
||||||
#!/bin/sh
|
git clone git://tetalab.org/tetalab/tetawebapp
|
||||||
# This is code sample
|
|
||||||
while [ 1 ]
|
|
||||||
do
|
|
||||||
echo "Tits or GTFO !"
|
|
||||||
sleep .1
|
|
||||||
done
|
|
||||||
</pre>
|
</pre>
|
||||||
|
</p>
|
||||||
</article>
|
</article>
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
</main>
|
</main>
|
||||||
|
|||||||
41
tetawebapp/templates/inputs.html
Normal file
41
tetawebapp/templates/inputs.html
Normal file
@ -0,0 +1,41 @@
|
|||||||
|
{% extends "index.html" %}
|
||||||
|
{% block main %}
|
||||||
|
<article class='right'>
|
||||||
|
<h3>The input collection</h3>
|
||||||
|
<p>
|
||||||
|
Have a look to the input collection:
|
||||||
|
</p>
|
||||||
|
<input type='text'/>
|
||||||
|
<button>Click me</button>
|
||||||
|
<br/>
|
||||||
|
<textarea cols='25'></textarea>
|
||||||
|
<br/>
|
||||||
|
<select>
|
||||||
|
{% for item in menu %}
|
||||||
|
<option>{{ item[0] }}</option>
|
||||||
|
{% endfor %}
|
||||||
|
</select>
|
||||||
|
<input type='submit' value='Click me too'/>
|
||||||
|
<br/>
|
||||||
|
<input type='button' value='And me !' />
|
||||||
|
<br/>
|
||||||
|
<input type='image' src='/static/images/add.png' title='add' alt='add'/>
|
||||||
|
<input type='image' src='/static/images/edit.png' title='edit' alt='edit'/>
|
||||||
|
<input type='image' src='/static/images/login.png' title='login' alt='login'/>
|
||||||
|
<input type='image' src='/static/images/logout.png' title='logout' alt='logout'/>
|
||||||
|
<input type='image' src='/static/images/refresh.png' title='refresh' alt='refresh'/>
|
||||||
|
<input type='image' src='/static/images/save.png' title='save' alt='save'/>
|
||||||
|
<input type='image' src='/static/images/search.png' title='search' alt='search'/>
|
||||||
|
<input type='image' src='/static/images/trash.png' title='trash' alt='trash'/>
|
||||||
|
<br/>
|
||||||
|
<pre>
|
||||||
|
#!/bin/sh
|
||||||
|
# This is code sample
|
||||||
|
while [ 1 ]
|
||||||
|
do
|
||||||
|
echo "Tits or GTFO !"
|
||||||
|
sleep .1
|
||||||
|
done
|
||||||
|
</pre>
|
||||||
|
</article>
|
||||||
|
{% endblock %}
|
||||||
11
tetawebapp/templates/todo.html
Normal file
11
tetawebapp/templates/todo.html
Normal file
@ -0,0 +1,11 @@
|
|||||||
|
{% extends "index.html" %}
|
||||||
|
{% block main %}
|
||||||
|
<article class='right'>
|
||||||
|
<h3>TODO list</h3>
|
||||||
|
<ul>
|
||||||
|
<li>Menu management</li>
|
||||||
|
<li>Installation wizard</li>
|
||||||
|
<li>Back office for basic content management</li>
|
||||||
|
</ul>
|
||||||
|
</article>
|
||||||
|
{% endblock %}
|
||||||
@ -24,16 +24,6 @@ app.secret_key = 'ce1d1c9ff0ff388a838b3a1e3207dd27'
|
|||||||
# Feel free to use SQLAlchemy (or not)
|
# Feel free to use SQLAlchemy (or not)
|
||||||
db = SQLAlchemy(app)
|
db = SQLAlchemy(app)
|
||||||
|
|
||||||
app.menu = [('accueil', '/plap.html', 0),
|
|
||||||
('Motherfuckisme', '/plap.html', 1 ),
|
|
||||||
('We make porn', '/plap.html', 0 ),
|
|
||||||
('mes couilles sur la comode3', '/plap.html', 0 ),
|
|
||||||
('mes couilles sur la comode4', '/plap.html', 0 ),
|
|
||||||
('mes couilles sur la comode5', '/plap.html', 0 ),
|
|
||||||
('mes couilles sur la comode6', '/plap.html', 0 ),
|
|
||||||
('mes couilles sur la comode7', '/plap.html', 0 )
|
|
||||||
]
|
|
||||||
|
|
||||||
########################################################################
|
########################################################################
|
||||||
# Routes
|
# Routes
|
||||||
########################################################################
|
########################################################################
|
||||||
@ -45,8 +35,71 @@ def page_not_found(e):
|
|||||||
|
|
||||||
@app.route("/", methods=['GET', 'POST'])
|
@app.route("/", methods=['GET', 'POST'])
|
||||||
def index():
|
def index():
|
||||||
|
app.menu = [('Accueil', '/', 1),
|
||||||
|
('Articles', '/articles', 0),
|
||||||
|
('Basics', '/basics', 0),
|
||||||
|
('Inputs', '/inputs', 0),
|
||||||
|
('Database', '/database', 0),
|
||||||
|
('Todo', '/todo', 0),
|
||||||
|
]
|
||||||
return render_template('index.html', menu=app.menu)
|
return render_template('index.html', menu=app.menu)
|
||||||
|
|
||||||
|
@app.route("/articles", methods=['GET', 'POST'])
|
||||||
|
def articles():
|
||||||
|
app.menu = [('Accueil', '/', 0),
|
||||||
|
('Articles', '/articles', 1),
|
||||||
|
('Basics', '/basics', 0),
|
||||||
|
('Inputs', '/inputs', 0),
|
||||||
|
('Database', '/database', 0),
|
||||||
|
('Todo', '/todo', 0),
|
||||||
|
]
|
||||||
|
return render_template('articles.html', menu=app.menu)
|
||||||
|
|
||||||
|
@app.route("/basics", methods=['GET', 'POST'])
|
||||||
|
def basics():
|
||||||
|
app.menu = [('Accueil', '/', 0),
|
||||||
|
('Articles', '/articles', 0),
|
||||||
|
('Basics', '/basics', 1),
|
||||||
|
('Inputs', '/inputs', 0),
|
||||||
|
('Database', '/database', 0),
|
||||||
|
('Todo', '/todo', 0),
|
||||||
|
]
|
||||||
|
return render_template('basics.html', menu=app.menu)
|
||||||
|
|
||||||
|
|
||||||
|
@app.route("/inputs", methods=['GET', 'POST'])
|
||||||
|
def inputs():
|
||||||
|
app.menu = [('Accueil', '/', 0),
|
||||||
|
('Articles', '/articles', 0),
|
||||||
|
('Basics', '/basics', 0),
|
||||||
|
('Inputs', '/inputs', 1),
|
||||||
|
('Database', '/database', 0),
|
||||||
|
('Todo', '/todo', 0),
|
||||||
|
]
|
||||||
|
return render_template('inputs.html', menu=app.menu)
|
||||||
|
|
||||||
|
@app.route("/database", methods=['GET', 'POST'])
|
||||||
|
def database():
|
||||||
|
app.menu = [('Accueil', '/', 0),
|
||||||
|
('Articles', '/articles', 0),
|
||||||
|
('Basics', '/basics', 0),
|
||||||
|
('Inputs', '/inputs', 0),
|
||||||
|
('Database', '/database', 1),
|
||||||
|
('Todo', '/todo', 0),
|
||||||
|
]
|
||||||
|
return render_template('database.html', menu=app.menu)
|
||||||
|
|
||||||
|
@app.route("/todo", methods=['GET', 'POST'])
|
||||||
|
def todo():
|
||||||
|
app.menu = [('Accueil', '/', 0),
|
||||||
|
('Articles', '/articles', 0),
|
||||||
|
('Basics', '/basics', 0),
|
||||||
|
('Inputs', '/inputs', 0),
|
||||||
|
('Database', '/database', 0),
|
||||||
|
('Todo', '/todo', 1),
|
||||||
|
]
|
||||||
|
return render_template('todo.html', menu=app.menu)
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
########################################################################
|
########################################################################
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user