Browse Source

Results styling

tags/v1.0^2
Benjamin Attal 10 years ago
parent
commit
4eb2cdda0c
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

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


//Add the bulk of the html //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 + '">' title.innerHTML = 'File <a href="' + codelet.code_url + '">'
+ codelet.filename + '</a>'; + 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; dateModified.innerHTML = 'Last modified ' + codelet.date_modified;
// Needs to be changed from int to string on the server // Needs to be changed from int to string on the server
language.innerHTML = codelet.language; language.innerHTML = codelet.language;
@@ -187,7 +185,6 @@ function createResult(codelet) {


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


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


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

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


/* TODO: /* 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 div.result
width: $resultWidth width: $resultWidth
height: 200px height: 200px
@@ -126,8 +140,8 @@ div#results
text-transform: capitalize text-transform: capitalize


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


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


#date-created #date-created
display: block display: block


+ 1
- 1
templates/index.html View File

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


= block head = block head
{{ assets.tag("index.css") }} {{ assets.tag("index.css") }}
{{ assets.tag("highlight.css") }}
{{ assets.tag("lib/highlight.css") }}
{{ assets.tag("jquery.min.js") }} {{ assets.tag("jquery.min.js") }}
= endblock = endblock




Loading…
Cancel
Save