Fix performance killer, minor design changes to the cards (#135) · IBM/ibm.github.io@c85d5bf · GitHub | Latest TMZ Celebrity News & Gossip | Watch TMZ Live
Skip to content
This repository was archived by the owner on Nov 4, 2020. It is now read-only.

Commit c85d5bf

Browse files
Nitairstevemart
authored andcommitted
Fix performance killer, minor design changes to the cards (#135)
1 parent 8bd6fb1 commit c85d5bf

File tree

2 files changed

+17
-37
lines changed

2 files changed

+17
-37
lines changed

css/style.css

Lines changed: 10 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -422,18 +422,23 @@ label.search span {
422422
.card h4 {
423423
overflow: hidden;
424424
color: #00649c;
425-
font-size: 1.25em;
425+
/* font-size: 1.25em; */
426426
font-weight: 200;
427427
width: 100%;
428428
text-overflow: ellipsis;
429429
line-height: 1.5;
430430
margin-bottom: 0;
431431
}
432432

433-
.card h5 {
433+
.card p {
434434
color: #00b1ef;
435-
font-size: 1em;
435+
font-size: 0.85em;
436436
margin-top: 0;
437+
padding: 0px;
438+
}
439+
440+
.card small {
441+
font-size: .85em;
437442
}
438443

439444
.org {
@@ -508,14 +513,14 @@ label.search span {
508513
margin-bottom: 5px;
509514
}
510515

511-
.pin p {
516+
/* .pin p {
512517
font: 12px/18px Arial, sans-serif;
513518
color: #333;
514519
font-size: 0.75em;
515520
height: 55px;
516521
overflow: hidden;
517522
margin: 0;
518-
}
523+
} */
519524

520525
@media (min-width: 960px) {
521526
#columns {
@@ -537,22 +542,3 @@ label.search span {
537542
opacity: 0.4;
538543
}
539544

540-
.scrollbar-outer {
541-
width: 100%;
542-
height: 100%;
543-
overflow: hidden;
544-
margin: 0;
545-
box-sizing: content-box;
546-
-moz-box-sizing: content-box;
547-
-webkit-box-sizing: content-box;
548-
}
549-
550-
.scrollbar-inner {
551-
width: 100%;
552-
height: 100%;
553-
overflow: auto;
554-
margin: 0;
555-
box-sizing: content-box;
556-
-moz-box-sizing: content-box;
557-
-webkit-box-sizing: content-box;
558-
}

js/repos.js

Lines changed: 7 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -26,32 +26,26 @@ var progress = 0;
2626
function RenderRepo($index) {
2727
repo = allrepos[$index];
2828
var $item = $("<div>").addClass("card pin col-sm-5 col-md-4 col-lg-3 item " + (repo.language || '').toLowerCase() + " " + repo.name.toLowerCase());
29-
var $scrollbarOuter = $("<div>").addClass("scrollbar-outer").appendTo($item);
30-
var $scrollbarInner = $("<div>").addClass("scrollbar-inner").appendTo($scrollbarOuter);
31-
var scrollbarOuter = document.createElement('div');
32-
var $link = $("<a>").attr("href", repoUrl(repo)).appendTo($scrollbarInner);
29+
var $link = $("<a>").attr("href", repoUrl(repo)).appendTo($item);
3330
$link.append($("<h4>").html(repo.name + "<div class='org'><a href='" + repo.owner.html_url + "'>(" + repo.owner.login + ")"));
34-
$link.append($("<h5>").text((repo.language != null) ? repo.language : ""));
35-
$scrollbarInner.append($("<p>").text(repo.description != null) ? repo.description : "");
31+
$link.append($("<p>").text((repo.language != null) ? repo.language : ""));
32+
$item.append($("<small>").text((repo.description != null) ? repo.description : ""));
3633
htag = "#allrepos";
3734
$item.appendTo(htag);
38-
$scrollbarInner.css("padding-right", ($scrollbarInner[0].offsetWidth - $scrollbarInner[0].clientWidth));
3935
return;
4036
}
4137

4238
function RenderUpdatedRepo($index) {
4339
repo = updated[$index];
4440
var $uitem = $("<div>").addClass("updated-card col-sm-5 col-md-4 col-lg-3");
4541
var $item = $("<div>").addClass("card pin " + (repo.language || '').toLowerCase() + " " + repo.name.toLowerCase());
46-
var $scrollbarOuter = $("<div>").addClass("scrollbar-outer").appendTo($item);
47-
var $scrollbarInner = $("<div>").addClass("scrollbar-inner").appendTo($scrollbarOuter);
48-
var $link = $("<a>").attr("href", repoUrl(repo)).appendTo($scrollbarInner);
42+
var $link = $("<a>").attr("href", repoUrl(repo)).appendTo($item);
4943
$link.append($("<h4>").text(repo.name));
50-
$link.append($("<h5>").text((repo.language != null) ? repo.language : ""));
51-
$scrollbarInner.append($("<p>").text(repo.description != null) ? repo.description : "");
44+
$link.append($("<p>").text((repo.language != null) ? repo.language : ""));
45+
$item.append($("<small>").text((repo.description != null) ? repo.description : ""));
46+
$("<small>").attr("style", "font-size: 10px;");
5247
$item.appendTo($uitem);
5348
$uitem.appendTo("#updated");
54-
$scrollbarInner.css("padding-right", ($scrollbarInner[0].offsetWidth - $scrollbarInner[0].clientWidth));
5549
}
5650

5751
function addUpdated() {

0 commit comments

Comments
 (0)

TMZ Celebrity News – Breaking Stories, Videos & Gossip

Looking for the latest TMZ celebrity news? You've come to the right place. From shocking Hollywood scandals to exclusive videos, TMZ delivers it all in real time.

Whether it’s a red carpet slip-up, a viral paparazzi moment, or a legal drama involving your favorite stars, TMZ news is always first to break the story. Stay in the loop with daily updates, insider tips, and jaw-dropping photos.

🎥 Watch TMZ Live

TMZ Live brings you daily celebrity news and interviews straight from the TMZ newsroom. Don’t miss a beat—watch now and see what’s trending in Hollywood.