Explorar el Código

Merge branch 'feature/docs' into develop

Add most of the styled documentation page.
tags/v1.0^2
Severyn Kozak hace 10 años
padre
commit
334f6493ff
Se han modificado 7 ficheros con 196 adiciones y 25 borrados
  1. +4
    -0
      app.py
  2. +18
    -0
      static/sass/_logo.sass
  3. +40
    -0
      static/sass/docs.sass
  4. +2
    -20
      static/sass/index.sass
  5. +126
    -0
      templates/docs.html
  6. +5
    -5
      templates/index.html
  7. +1
    -0
      templates/layout.html

+ 4
- 0
app.py Ver fichero

@@ -55,6 +55,10 @@ def about():
def developers():
return render_template("developers.html")

@app.route("/docs")
def docs():
return render_template("docs.html")

@app.errorhandler(404)
def error404(error):
return render_template("error404.html"), 404


+ 18
- 0
static/sass/_logo.sass Ver fichero

@@ -0,0 +1,18 @@
a#logo
letter-spacing: 0.3em
text-decoration: none

div#logo
font-size: 400%
padding-bottom: 0.2em
text-align: center

#logo-bit
color: $baseColor1

#logo-angle
color: $baseColor3

#logo-shift
color: $baseColor2
font-style: italic

+ 40
- 0
static/sass/docs.sass Ver fichero

@@ -0,0 +1,40 @@
@import variables
@import logo

h1
color: $baseColor1

span
color: $baseColor2

h2, h3
color: $baseColor2 * 0.8

p
line-height: 1.8em

ul
list-style: none
margin-bottom: 2%

li
margin-bottom: 2%

span
&#code
background-color: $baseColor3 * 1.2
font-family: monospace
padding: 5px

&#string
color: $baseColor1
font-family: monospace
font-size: 1.1em

&#title
color: $baseColor1
font-weight: bold

li#sec3 span#gasp
color: $baseColor2 * 0.8
font-style: italic

+ 2
- 20
static/sass/index.sass Ver fichero

@@ -4,6 +4,7 @@

@import mixins
@import variables
@import logo

$minSearchFieldsWidth: 490px
$codeWidth: 700px
@@ -84,25 +85,6 @@ div#search-field
top: 0
width: 40%

a#title
letter-spacing: 0.3em
text-decoration: none

div#title
font-size: 400%
padding-bottom: 0.2em
text-align: center

#title-bit
color: $baseColor1

#title-angle
color: $baseColor3

#title-shift
color: $baseColor2
font-style: italic

form#search-bar
min-width: $minSearchFieldsWidth

@@ -143,7 +125,7 @@ div#search-field
position: absolute
width: 100%

#title
#logo
position: absolute
top: -1%
left: 1%


+ 126
- 0
templates/docs.html Ver fichero

@@ -0,0 +1,126 @@
= extends "layout.html"

= block title
docs
= endblock

= block head
{{ assets.tag("docs.css") }}
= endblock

= block body
<a id="logo" href="/">
<div id="logo">
<span id="logo-bit">bit</span
><span id="logo-angle">&laquo;</span
><span id="logo-shift">shift</span>
</div>
</a>

<ul>
<li>
<h1><span>&raquo;</span> Usage</h1>
<p>
<span id="title">bitshift</span> is a search-engine optimized for source code: beyond supporting searches with the full range of ASCII
symbols, the engine <em>understands</em> code, allowing users to query for metadata, like time of creation/last
modification, programming language, and even symbols like function names and variables. Basic use boils down to
general and advanced searches.

<ul>
<li>
<h2>general search</h2>
<p>
To perform a "general search," simply place your cursor in the search bar on our home page and begin
entering text; when you stop typing for a short period of time, we'll automatically execute the query for you.
As you scroll down the results page, new codelets will be seamlessly downloaded from our server and
appended to the end.
</p>
</li>

<li>
<h2>advanced search</h2>
<p>
General searches, though, are limited. To allow users to make the best of our engine, we created an advanced
search form that allows the creation of complex queries with the following specifiers:

<ul>
<li>
<h3>search fields</h3>
<ul id="search-fields">
<li>
<span id="code">languages</span> : The programming languages to search for.
</li>
<li>
<span id="code">authors</span> : Search for code written/modified by a specific person.
</li>
<li>
<span id="code">date last modified</span> : Search for code last modified on a specific date (<span
id="code">mm/dd/yy</span> format).
</li>
<li>
<span id="code">date created</span> : Search for code created on a specific date (<span
id="code">mm/dd/yy</span> format).
</li>
<li>
<span id="code">symbols</span> : Search for specific symbols.
</li>
<li>
<span id="code">functions</span> : Search for functions with specific names.
</li>
<li>
<span id="code">classes</span> : Search for classes with specific names.
</li>
<li>
<span id="code">variables</span> : Search for variables with specific names.
</li>
</ul>

<p>
Each of the search fields allows for numerous values; just separate them with spaces. If you'd like
to search for a multi-word, space-delimited string, on the other hand, enclose it in double quotes.

A query for <span id="code">foo bar</span> will search for occurrences of both <span
id="string">"foo"</span> and <span id="string">"bar"</span>, while <span id="code">"foo bar"</span>
will search for occurrences of <span id="string">"foo bar"</span>.
</p>
</li>

<li>
<h3>search groups</h3>
<p>
Search groups facilitate even more robust queries: they're like a bunch of individual searches
grouped into one. A user searching for occurrenes of symbol <span id="string">"curses"</span> in the
language <span id="string">"Python"</span>, and <span id="string">"ncurses"</span> in <span
id="string">"C"</span>, won't get away with: <span id="code">symbols: "curses ncurses"</span> and
<span id="code">languages: "Python C"</span>. The engine might return results <span
id="string">"curses"</span> in <span id="string">"C"</span> and <span id="string">"ncurses"</span> in
<span id="string">"Python"</span>!

To work around that, you can use two search groups: one for <span id="string">"curses"</span> in
<span id="string">"Python"</span>, and another for <span id="string">"curses"</span> in <span
id="string">"C"</span>. <span id="title">bitshift</span> will return the union of both sets of search results.
</p>
</li>
</ul>
</p>
</li>
</ul>
</p>
</li>

<li>
<h1><span>&raquo;</span> Handwritten Queries</h1>
<p>
No content, yet.
</p>
</li>

<li id="sec3">
<h1><span>&raquo;</span> Get involved</h1>
<p>
<span id="title">bitshift</span> is <span id="gasp">(gasp)</span> open-source! The project is hosted on
<a href="https://github.com/earwig/bitshift">GitHub</a>; feel free to file an issue or submit a pull request!
</p>
</li>
</ul>
= endblock

+ 5
- 5
templates/index.html Ver fichero

@@ -19,11 +19,11 @@

= block body
<div id="search-field">
<a id="title" href="/">
<div id="title">
<span id="title-bit">bit</span
><span id="title-angle">&laquo;</span
><span id="title-shift">shift</span>
<a id="logo" href="/">
<div id="logo">
<span id="logo-bit">bit</span
><span id="logo-angle">&laquo;</span
><span id="logo-shift">shift</span>
</div>
</a>



+ 1
- 0
templates/layout.html Ver fichero

@@ -40,6 +40,7 @@
<div id="footer">
<a href="/">home</a>
<a href="/about">about</a>
<a href="/docs">docs</a>
<a href="/developers">developers</a>
</div>
</div>


Cargando…
Cancelar
Guardar