Browse Source

Results styling

tags/v1.0^2
Benjamin Attal 10 years ago
parent
commit
6edb6d754c
3 changed files with 22 additions and 10 deletions
  1. +2
    -5
      static/js/index.js
  2. +19
    -4
      static/sass/index.sass
  3. +1
    -1
      templates/index.html

+ 2
- 5
static/js/index.js View File

@@ -44,6 +44,7 @@ var testCodelet = {
[17, -1, 17, -1] ]]
]
},
'origin': ['GitHub', 'https://github.com', ''],
'authors': ['sevko', 'earwig'],
'html_code': codeExample
};
@@ -172,12 +173,9 @@ function createResult(codelet) {
authors.id = 'authors';

//Add the bulk of the html
var hostUrl = codelet.code_url.match(/htt(p|ps):\/\/\w+\.\w+/)[0],
hostName = hostUrl.split('://')[1].split('.')[0];

title.innerHTML = 'File <a href="' + codelet.code_url + '">'
+ codelet.filename + '</a>';
site.innerHTML = 'on <a href="' + hostUrl + '">' + hostName +'</a>';
site.innerHTML = 'on <a href="' + codelet.origin[1] + '">' + codelet.origin[0] +'</a>';
dateModified.innerHTML = 'Last modified ' + codelet.date_modified;
// Needs to be changed from int to string on the server
language.innerHTML = codelet.language;
@@ -205,7 +203,6 @@ function createResult(codelet) {

displayInfo.appendChild(title);
displayInfo.appendChild(site);
displayInfo.appendChild(dateModified);

hiddenInfo.appendChild(dateCreated);
hiddenInfo.appendChild(language);


+ 19
- 4
static/sass/index.sass View File

@@ -287,8 +287,22 @@ div#results
width: 80%

/* TODO:
1) On the side
- add way to cycle through hits in the code.*/
1) Sidebar
- Add way to cycle through hits in the code.
2) Hidden info
- Use effect to make it transition into view.
- Add date modified.
- Get rid of symbols matches.
- Don't use monospace.
- Add links for authors.
- Cross out search terms based on what's in the codelet.
3) Header
- Remove date modified.
- Make the title bigger.
- Add an icon for the website.
- Change the spacing.
4) Code body
- Add highlighting.*/
div.result
width: $resultWidth
height: 200px
@@ -309,8 +323,8 @@ div#results
text-transform: capitalize

#date-modified
font-family: monospace
color: #333
font-style: italic
color: #777
display: block

table
@@ -351,6 +365,7 @@ div#results
width: $hiddenInfoWidth
text-align: center
font-size: 1.2em
font-family: monospace

#date-created
display: block


+ 1
- 1
templates/index.html View File

@@ -9,9 +9,9 @@
{{ assets.tag("lib/jquery.min.js") }}
{{ assets.tag("lib/jquery-ui.min.js") }}
{{ assets.tag("lib/typeahead.bundle.min.js") }}
{{ assets.tag("lib/highlight.css") }}

{{ assets.tag("index.css") }}
{{ assets.tag("highlight.css") }}

<script>
AUTOCOMPLETE_LANGUAGES = {{ autocomplete_languages | safe }};


Loading…
Cancel
Save