tqt
/
Ghost-Admin
mirror of https://github.com/TryGhost/Ghost-Admin.git
1
0
Fork 0
Code Issues Releases Wiki Activity

Merge pull request #5374 from JohnONolan/betterflex 

Better flexbox grids
This commit is contained in:
Hannah Wolfe 2015-06-08 12:33:06 +01:00
parent 43c2cab368 a81eb2d1c6
commit 26a809a949
3 changed files with 557 additions and 473 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

512
app/html/apps.html
View File

@ -11,253 +11,295 @@
<body class="ember-application settings settings-view-general" data-apps="false" data-filestorage="true" data-blogurl="http://127.0.0.1:2368">
<div id="ember725" class="ember-view gh-app"><a class="sr-only sr-only-focusable" href="#gh-main">Skip to main content</a>
<div id="ember725" class="ember-view gh-app"><a class="sr-only sr-only-focusable" href="#gh-main">Skip to main content</a>
<aside id="ember749" class="ember-view gh-alerts"><!----></aside>
<aside id="ember749" class="ember-view gh-alerts"><!----></aside>
<div class="gh-viewport">
<div class="gh-viewport">
<nav class="gh-nav">
<header id="ember783" class="ember-view gh-nav-menu closed" role="button"> <div class="gh-nav-menu-icon" style="background-image: url(https://s3.amazonaws.com/f.cl.ly/items/3I0g431b2b3q00253K1V/d16dc430c9c4f5c09d6ca09be3e5c72fdb21c1ac.png)"></div>
<div class="gh-nav-menu-details">
<div class="gh-nav-menu-details-blog">Ghost</div>
<div class="gh-nav-menu-details-user">John Thing</div>
</div>
<i class="icon-arrow"></i>
</header><div id="ember792" class="ember-view ghost-dropdown dropdown closed fade-out"> <ul class="dropdown-menu dropdown-triangle-top js-user-menu-dropdown-menu" role="menu" style="right:-50%;left:auto;margin-right:40px">
<li role="presentation"><a id="ember810" class="ember-view gh-nav-menu-about dropdown-item js-nav-item" href="/ghost/settings/about/" tabindex="-1"><i class="icon-gh"></i> About Ghost</a></li>
<li class="divider"></li>
<li role="presentation"><a id="ember811" class="ember-view dropdown-item user-menu-profile js-nav-item" href="/ghost/settings/users/john/" tabindex="-1"><i class="icon-user"></i> Your Profile</a></li>
<li class="divider"></li>
<li role="presentation"><a id="ember812" class="ember-view dropdown-item user-menu-signout" href="/ghost/signout/" tabindex="-1"><i class="icon-signout"></i> Sign Out</a></li>
</ul>
</div> <section class="gh-nav-body">
<section class="gh-nav-search">
<input class="gh-nav-search-input gh-input" type="text" placeholder="Search">
<button class="gh-nav-search-button"><i class="icon-search"></i><span class="sr-only">Search</span></button>
</section>
<ul class="gh-nav-list gh-nav-main">
<li><a id="ember796" class="ember-view gh-nav-main-editor" href="/ghost/editor/"><i class="icon-pen"></i>New Post</a></li>
<li><a id="ember797" class="ember-view gh-nav-main-content" href="/ghost/"><i class="icon-content"></i>Content</a></li>
<li><a id="ember798" class="ember-view gh-nav-main-users" href="/ghost/settings/users/"><i class="icon-team"></i>Team</a></li>
</ul>
<ul class="gh-nav-list gh-nav-settings">
<li class="gh-nav-list-h">Settings</li>
<li><a id="ember799" class="ember-view gh-nav-settings-general" href="/ghost/settings/general/"><i class="icon-settings"></i>General</a></li>
<li><a id="ember800" class="ember-view gh-nav-settings-navigation" href="/ghost/settings/navigation/"><i class="icon-compass"></i>Navigation</a></li>
<li><a id="ember801" class="ember-view gh-nav-settings-tags" href="/ghost/settings/tags/"><i class="icon-tag"></i>Tags</a></li>
<li><a id="ember802" class="ember-view gh-nav-settings-code-injection" href="/ghost/settings/code-injection/"><i class="icon-code"></i>Code Injection</a></li>
<li><a id="ember803" class="ember-view gh-nav-settings-labs" href="/ghost/settings/labs/"><i class="icon-apps"></i>Labs</a></li>
<li><a id="ember804" class="ember-view gh-nav-settings-apps active" href="/ghost/settings/apps/"><i class="icon-box"></i>Apps</a></li>
</ul>
<nav class="gh-nav">
<header id="ember783" class="ember-view gh-nav-menu closed" role="button"> <div class="gh-nav-menu-icon" style="background-image: url(https://s3.amazonaws.com/f.cl.ly/items/3I0g431b2b3q00253K1V/d16dc430c9c4f5c09d6ca09be3e5c72fdb21c1ac.png)"></div>
<div class="gh-nav-menu-details">
<div class="gh-nav-menu-details-blog">Ghost</div>
<div class="gh-nav-menu-details-user">John Thing</div>
</div>
<i class="icon-arrow"></i>
</header><div id="ember792" class="ember-view ghost-dropdown dropdown closed fade-out"> <ul class="dropdown-menu dropdown-triangle-top js-user-menu-dropdown-menu" role="menu" style="right:-50%;left:auto;margin-right:40px">
<li role="presentation"><a id="ember810" class="ember-view gh-nav-menu-about dropdown-item js-nav-item" href="/ghost/settings/about/" tabindex="-1"><i class="icon-gh"></i> About Ghost</a></li>
<li class="divider"></li>
<li role="presentation"><a id="ember811" class="ember-view dropdown-item user-menu-profile js-nav-item" href="/ghost/settings/users/john/" tabindex="-1"><i class="icon-user"></i> Your Profile</a></li>
<li class="divider"></li>
<li role="presentation"><a id="ember812" class="ember-view dropdown-item user-menu-signout" href="/ghost/signout/" tabindex="-1"><i class="icon-signout"></i> Sign Out</a></li>
</ul>
</div> <section class="gh-nav-body">
<section class="gh-nav-search">
<input class="gh-nav-search-input gh-input" type="text" placeholder="Search">
<button class="gh-nav-search-button"><i class="icon-search"></i><span class="sr-only">Search</span></button>
</section>
<footer class="gh-nav-footer">
<div class="gh-autonav-toggle">
<i class="icon-minimise"></i>
</div>
<a class="gh-nav-footer-sitelink" target="_blank" href="http://localhost:2368/">View blog <i class="icon-external"></i></a>
<div class="gh-help-menu">
<div id="ember804" class="ember-view closed" role="button"> <div class="gh-help-button">
<i class="icon-question"><span class="hidden">Help</span></i>
</div>
</div><div id="ember805" class="ember-view ghost-dropdown dropdown closed fade-out"> <ul class="dropdown-menu dropdown-triangle-bottom" role="menu">
<li role="presentation"><a class="dropdown-item help-menu-support" role="menuitem" tabindex="-1" href="http://support.ghost.org/" target="_blank"><i class="icon-ambulance"></i> Support Center</a></li>
<li role="presentation"><a class="dropdown-item help-menu-tweet" role="menuitem" tabindex="-1" href="https://twitter.com/intent/tweet?text=%40TryGhost+Hi%21+Can+you+help+me+with+&amp;related=TryGhost" target="_blank" onclick="window.open(this.href, 'twitter-share', 'width=550,height=235');return false;"><i class="icon-twitter"></i> Tweet @TryGhost!</a></li>
<li class="divider"></li>
<li role="presentation"><a class="dropdown-item help-menu-how-to" role="menuitem" tabindex="-1" href="http://support.ghost.org/how-to-use-ghost/" target="_blank"><i class="icon-book"></i> How to Use Ghost</a></li>
<li role="presentation"><a class="dropdown-item help-menu-markdown" role="menuitem" tabindex="-1" href="" data-ember-action="1036"><i class="icon-markdown"></i> Markdown Help</a></li>
<li class="divider"></li>
<li role="presentation"><a class="dropdown-item help-menu-wishlist" role="menuitem" tabindex="-1" href="http://ideas.ghost.org/" target="_blank"><i class="icon-idea"></i> Wishlist</a></li>
</ul>
</div> </div>
</footer>
</nav>
<main id="gh-main" class="gh-main" role="main" data-notification-count="0">
<section id="ember1308" class="ember-view gh-view js-settings-content"><header class="view-header">
<h2 class="view-title">Apps</h2>
<section class="view-actions">
<input id="blog-title" class="gh-input package-filter" type="text" name="general[title]" placeholder="Filter apps by name">
</section>
</header>
<section class="view-content">
<div class="package-grid package-grid-apps">
<article class="package-card-app" data-href="/app/">
<div class="package-card-content">
<figure class="package-card-app-icon" style="background-image:url(https://pbs.twimg.com/profile_images/439941058404028416/3nRmjK6v.jpeg)"></figure>
<div class="package-card-meta">
<h3 class="package-card-app-title">Ghost</h3>
<div class="package-card-stats">
<div class="package-downloads">
<i class="icon-download"></i>
<span class="package-download-count">14,301</span>
</div>
</div>
<p class="package-card-app-desc">A UI theme that offers endless possibilities: one Atom, many Isotopes ;) Isotope adapts to match any syntax theme.</p>
</div>
<ul class="gh-nav-list gh-nav-main">
<li><a id="ember796" class="ember-view gh-nav-main-editor" href="/ghost/editor/"><i class="icon-pen"></i>New Post</a></li>
<li><a id="ember797" class="ember-view gh-nav-main-content" href="/ghost/"><i class="icon-content"></i>Content</a></li>
<li><a id="ember798" class="ember-view gh-nav-main-users" href="/ghost/settings/users/"><i class="icon-team"></i>Team</a></li>
</ul>
<ul class="gh-nav-list gh-nav-settings">
<li class="gh-nav-list-h">Settings</li>
<li><a id="ember799" class="ember-view gh-nav-settings-general" href="/ghost/settings/general/"><i class="icon-settings"></i>General</a></li>
<li><a id="ember800" class="ember-view gh-nav-settings-navigation" href="/ghost/settings/navigation/"><i class="icon-compass"></i>Navigation</a></li>
<li><a id="ember801" class="ember-view gh-nav-settings-tags" href="/ghost/settings/tags/"><i class="icon-tag"></i>Tags</a></li>
<li><a id="ember802" class="ember-view gh-nav-settings-code-injection" href="/ghost/settings/code-injection/"><i class="icon-code"></i>Code Injection</a></li>
<li><a id="ember803" class="ember-view gh-nav-settings-labs" href="/ghost/settings/labs/"><i class="icon-apps"></i>Labs</a></li>
<li><a id="ember804" class="ember-view gh-nav-settings-apps active" href="/ghost/settings/apps/"><i class="icon-box"></i>Apps</a></li>
</ul>
</section>
<footer class="gh-nav-footer">
<div class="gh-autonav-toggle">
<i class="icon-minimise"></i>
</div>
<a class="gh-nav-footer-sitelink" target="_blank" href="http://localhost:2368/">View blog <i class="icon-external"></i></a>
<div class="gh-help-menu">
<div id="ember804" class="ember-view closed" role="button"> <div class="gh-help-button">
<i class="icon-question"><span class="hidden">Help</span></i>
</div>
<footer class="package-card-footer">
<a class="package-developer" href="#" target="_blank">
<img src="https://pbs.twimg.com/profile_images/439941058404028416/3nRmjK6v.jpeg" alt="developer" />
<span class="package-developer-name">GhostFoundation1</span>
</a>
<div class="package-controls">
<a class="package-settings package-controls-button" href="#"><i class="icon-settings"></i>Settings</a>
<a class="package-uninstall package-controls-button" href="#"><i class="icon-trash"></i>Uninstall</a>
<a class="package-disable package-controls-button" href="#"><i class="icon-pause"></i>Disable</a>
</div>
</footer>
</article>
</div><div id="ember805" class="ember-view ghost-dropdown dropdown closed fade-out"> <ul class="dropdown-menu dropdown-triangle-bottom" role="menu">
<li role="presentation"><a class="dropdown-item help-menu-support" role="menuitem" tabindex="-1" href="http://support.ghost.org/" target="_blank"><i class="icon-ambulance"></i> Support Center</a></li>
<li role="presentation"><a class="dropdown-item help-menu-tweet" role="menuitem" tabindex="-1" href="https://twitter.com/intent/tweet?text=%40TryGhost+Hi%21+Can+you+help+me+with+&amp;related=TryGhost" target="_blank" onclick="window.open(this.href, 'twitter-share', 'width=550,height=235');return false;"><i class="icon-twitter"></i> Tweet @TryGhost!</a></li>
<li class="divider"></li>
<li role="presentation"><a class="dropdown-item help-menu-how-to" role="menuitem" tabindex="-1" href="http://support.ghost.org/how-to-use-ghost/" target="_blank"><i class="icon-book"></i> How to Use Ghost</a></li>
<li role="presentation"><a class="dropdown-item help-menu-markdown" role="menuitem" tabindex="-1" href="" data-ember-action="1036"><i class="icon-markdown"></i> Markdown Help</a></li>
<li class="divider"></li>
<li role="presentation"><a class="dropdown-item help-menu-wishlist" role="menuitem" tabindex="-1" href="http://ideas.ghost.org/" target="_blank"><i class="icon-idea"></i> Wishlist</a></li>
</ul>
</div> </div>
</footer>
</nav>
<article class="package-card-app" data-href="/app/">
<div class="package-card-content">
<figure class="package-card-app-icon" style="background-image:url(https://pbs.twimg.com/profile_images/439941058404028416/3nRmjK6v.jpeg)"></figure>
<div class="package-card-meta">
<h3 class="package-card-app-title">Ghost</h3>
<div class="package-card-stats">
<div class="package-downloads">
<i class="icon-download"></i>
<span class="package-download-count">14,301</span>
</div>
</div>
<p class="package-card-app-desc">A UI theme that offers endless possibilities: one Atom, many Isotopes ;) Isotope adapts to match any syntax theme.</p>
</div>
</div>
<footer class="package-card-footer">
<a class="package-developer" href="#" target="_blank">
<img src="https://pbs.twimg.com/profile_images/439941058404028416/3nRmjK6v.jpeg" alt="developer" />
<span class="package-developer-name">GhostFoundation1</span>
</a>
<div class="package-controls">
<a class="package-settings package-controls-button" href="#"><i class="icon-settings"></i>Settings</a>
<a class="package-uninstall package-controls-button" href="#"><i class="icon-trash"></i>Uninstall</a>
<a class="package-enable package-controls-button" href="#"><i class="icon-play"></i>Enable</a>
</div>
</footer>
</article>
<article class="package-card-app" data-href="/app/">
<div class="package-card-content">
<figure class="package-card-app-icon" style="background-image:url(https://pbs.twimg.com/profile_images/439941058404028416/3nRmjK6v.jpeg)"></figure>
<div class="package-card-meta">
<h3 class="package-card-app-title">Ghost</h3>
<div class="package-card-stats">
<div class="package-downloads">
<i class="icon-download"></i>
<span class="package-download-count">14,301</span>
</div>
</div>
<p class="package-card-app-desc">A UI theme that offers endless possibilities: one Atom, many Isotopes ;) Isotope adapts to match any syntax theme.</p>
</div>
</div>
<footer class="package-card-footer">
<a class="package-developer" href="#" target="_blank">
<img src="https://pbs.twimg.com/profile_images/439941058404028416/3nRmjK6v.jpeg" alt="developer" />
<span class="package-developer-name">GhostFoundation1</span>
</a>
<div class="package-controls">
<a class="package-settings package-controls-button" href="#"><i class="icon-settings"></i>Settings</a>
<a class="package-uninstall package-controls-button" href="#"><i class="icon-trash"></i>Uninstall</a>
<a class="package-disable package-controls-button" href="#"><i class="icon-pause"></i>Disable</a>
</div>
</footer>
</article>
<article class="package-card-app" data-href="/app/">
<div class="package-card-content">
<figure class="package-card-app-icon" style="background-image:url(https://pbs.twimg.com/profile_images/439941058404028416/3nRmjK6v.jpeg)"></figure>
<div class="package-card-meta">
<h3 class="package-card-app-title">Ghost</h3>
<div class="package-card-stats">
<div class="package-downloads">
<i class="icon-download"></i>
<span class="package-download-count">14,301</span>
</div>
</div>
<p class="package-card-app-desc">A UI theme that offers endless possibilities: one Atom, many Isotopes ;) Isotope adapts to match any syntax theme.</p>
</div>
</div>
<footer class="package-card-footer">
<a class="package-developer" href="#" target="_blank">
<img src="https://pbs.twimg.com/profile_images/439941058404028416/3nRmjK6v.jpeg" alt="developer" />
<span class="package-developer-name">GhostFoundation1</span>
</a>
<div class="package-controls">
<a class="package-settings package-controls-button" href="#"><i class="icon-settings"></i>Settings</a>
<a class="package-uninstall package-controls-button" href="#"><i class="icon-trash"></i>Uninstall</a>
<a class="package-disable package-controls-button" href="#"><i class="icon-pause"></i>Disable</a>
</div>
</footer>
</article>
<article class="package-card-app" data-href="/app/">
<div class="package-card-content">
<figure class="package-card-app-icon" style="background-image:url(https://pbs.twimg.com/profile_images/439941058404028416/3nRmjK6v.jpeg)"></figure>
<div class="package-card-meta">
<h3 class="package-card-app-title">Ghost</h3>
<div class="package-card-stats">
<div class="package-downloads">
<i class="icon-download"></i>
<span class="package-download-count">14,301</span>
</div>
</div>
<p class="package-card-app-desc">A UI theme that offers endless possibilities: one Atom, many Isotopes ;) Isotope adapts to match any syntax theme.</p>
</div>
</div>
<footer class="package-card-footer">
<a class="package-developer" href="#" target="_blank">
<img src="https://pbs.twimg.com/profile_images/439941058404028416/3nRmjK6v.jpeg" alt="developer" />
<span class="package-developer-name">GhostFoundation1</span>
</a>
<div class="package-controls">
<a class="package-uninstall package-controls-button" href="#"><i class="icon-trash"></i>Uninstall</a>
<a class="package-disable package-controls-button" href="#"><i class="icon-pause"></i>Disable</a>
</div>
</footer>
</article>
<article class="package-card-app" data-href="/app/">
<div class="package-card-content">
<figure class="package-card-app-icon" style="background-image:url(https://pbs.twimg.com/profile_images/439941058404028416/3nRmjK6v.jpeg)"></figure>
<div class="package-card-meta">
<h3 class="package-card-app-title">Ghost</h3>
<div class="package-card-stats">
<div class="package-downloads">
<i class="icon-download"></i>
<span class="package-download-count">14,301</span>
</div>
</div>
<p class="package-card-app-desc">A UI theme that offers endless possibilities: one Atom, many Isotopes ;) Isotope adapts to match any syntax theme.</p>
</div>
</div>
<footer class="package-card-footer">
<a class="package-developer" href="#" target="_blank">
<img src="https://pbs.twimg.com/profile_images/439941058404028416/3nRmjK6v.jpeg" alt="developer" />
<span class="package-developer-name">GhostFoundation1</span>
</a>
<div class="package-controls">
<a class="package-settings package-controls-button" href="#"><i class="icon-settings"></i>Settings</a>
<a class="package-uninstall package-controls-button" href="#"><i class="icon-trash"></i>Uninstall</a>
<a class="package-disable package-controls-button" href="#"><i class="icon-pause"></i>Disable</a>
</div>
</footer>
</article>
</div>
<main id="gh-main" class="gh-main" role="main" data-notification-count="0">
<section id="ember1308" class="ember-view gh-view js-settings-content"><header class="view-header">
<h2 class="view-title">Apps</h2>
<section class="view-actions">
<input id="blog-title" class="gh-input package-filter" type="text" name="general[title]" placeholder="Filter apps by name">
</section>
</main>
</header>
<aside id="ember766" class="ember-view gh-notifications"><!----></aside>
<section class="view-content">
<!---->
<!---->
<div class="package-grid package-grid-apps">
</div></div>
<div class="package-grid-cell">
<article class="package-card-app" data-href="/app/">
<div class="package-card-content">
<figure class="package-card-app-icon" style="background-image:url(https://pbs.twimg.com/profile_images/439941058404028416/3nRmjK6v.jpeg)"></figure>
<div class="package-card-meta">
<h3 class="package-card-app-title">Ghost</h3>
<div class="package-card-stats">
<div class="package-downloads">
<i class="icon-download"></i>
<span class="package-download-count">14,301</span>
</div>
</div>
<p class="package-card-app-desc">A UI theme that offers endless possibilities: one Atom, many Isotopes ;) Isotope adapts to match any syntax theme.</p>
</div>
</div>
<footer class="package-card-footer">
<a class="package-developer" href="#" target="_blank">
<img src="https://pbs.twimg.com/profile_images/439941058404028416/3nRmjK6v.jpeg" alt="developer" />
<span class="package-developer-name">GhostFoundation1</span>
</a>
<div class="package-controls">
<a class="package-settings package-controls-button" href="#"><i class="icon-settings"></i>Settings</a>
<a class="package-uninstall package-controls-button" href="#"><i class="icon-trash"></i>Uninstall</a>
<a class="package-disable package-controls-button" href="#"><i class="icon-pause"></i>Disable</a>
</div>
</footer>
</article>
</div>
<div class="package-grid-cell">
<article class="package-card-app" data-href="/app/">
<div class="package-card-content">
<figure class="package-card-app-icon" style="background-image:url(https://pbs.twimg.com/profile_images/439941058404028416/3nRmjK6v.jpeg)"></figure>
<div class="package-card-meta">
<h3 class="package-card-app-title">Ghost</h3>
<div class="package-card-stats">
<div class="package-downloads">
<i class="icon-download"></i>
<span class="package-download-count">14,301</span>
</div>
</div>
<p class="package-card-app-desc">A UI theme that offers endless possibilities: one Atom, many Isotopes ;) Isotope adapts to match any syntax theme.</p>
</div>
</div>
<footer class="package-card-footer">
<a class="package-developer" href="#" target="_blank">
<img src="https://pbs.twimg.com/profile_images/439941058404028416/3nRmjK6v.jpeg" alt="developer" />
<span class="package-developer-name">GhostFoundation1</span>
</a>
<div class="package-controls">
<a class="package-settings package-controls-button" href="#"><i class="icon-settings"></i>Settings</a>
<a class="package-uninstall package-controls-button" href="#"><i class="icon-trash"></i>Uninstall</a>
<a class="package-enable package-controls-button" href="#"><i class="icon-play"></i>Enable</a>
</div>
</footer>
</article>
</div>
<div class="package-grid-cell">
<article class="package-card-app" data-href="/app/">
<div class="package-card-content">
<figure class="package-card-app-icon" style="background-image:url(https://pbs.twimg.com/profile_images/439941058404028416/3nRmjK6v.jpeg)"></figure>
<div class="package-card-meta">
<h3 class="package-card-app-title">Ghost</h3>
<div class="package-card-stats">
<div class="package-downloads">
<i class="icon-download"></i>
<span class="package-download-count">14,301</span>
</div>
</div>
<p class="package-card-app-desc">A UI theme that offers endless possibilities: one Atom, many Isotopes ;) Isotope adapts to match any syntax theme.</p>
</div>
</div>
<footer class="package-card-footer">
<a class="package-developer" href="#" target="_blank">
<img src="https://pbs.twimg.com/profile_images/439941058404028416/3nRmjK6v.jpeg" alt="developer" />
<span class="package-developer-name">GhostFoundation1</span>
</a>
<div class="package-controls">
<a class="package-settings package-controls-button" href="#"><i class="icon-settings"></i>Settings</a>
<a class="package-uninstall package-controls-button" href="#"><i class="icon-trash"></i>Uninstall</a>
<a class="package-disable package-controls-button" href="#"><i class="icon-pause"></i>Disable</a>
</div>
</footer>
</article>
</div>
<div class="package-grid-cell">
<article class="package-card-app" data-href="/app/">
<div class="package-card-content">
<figure class="package-card-app-icon" style="background-image:url(https://pbs.twimg.com/profile_images/439941058404028416/3nRmjK6v.jpeg)"></figure>
<div class="package-card-meta">
<h3 class="package-card-app-title">Ghost</h3>
<div class="package-card-stats">
<div class="package-downloads">
<i class="icon-download"></i>
<span class="package-download-count">14,301</span>
</div>
</div>
<p class="package-card-app-desc">A UI theme that offers endless possibilities: one Atom, many Isotopes ;) Isotope adapts to match any syntax theme.</p>
</div>
</div>
<footer class="package-card-footer">
<a class="package-developer" href="#" target="_blank">
<img src="https://pbs.twimg.com/profile_images/439941058404028416/3nRmjK6v.jpeg" alt="developer" />
<span class="package-developer-name">GhostFoundation1</span>
</a>
<div class="package-controls">
<a class="package-settings package-controls-button" href="#"><i class="icon-settings"></i>Settings</a>
<a class="package-uninstall package-controls-button" href="#"><i class="icon-trash"></i>Uninstall</a>
<a class="package-disable package-controls-button" href="#"><i class="icon-pause"></i>Disable</a>
</div>
</footer>
</article>
</div>
<div class="package-grid-cell">
<article class="package-card-app" data-href="/app/">
<div class="package-card-content">
<figure class="package-card-app-icon" style="background-image:url(https://pbs.twimg.com/profile_images/439941058404028416/3nRmjK6v.jpeg)"></figure>
<div class="package-card-meta">
<h3 class="package-card-app-title">Ghost</h3>
<div class="package-card-stats">
<div class="package-downloads">
<i class="icon-download"></i>
<span class="package-download-count">14,301</span>
</div>
</div>
<p class="package-card-app-desc">A UI theme that offers endless possibilities: one Atom, many Isotopes ;) Isotope adapts to match any syntax theme.</p>
</div>
</div>
<footer class="package-card-footer">
<a class="package-developer" href="#" target="_blank">
<img src="https://pbs.twimg.com/profile_images/439941058404028416/3nRmjK6v.jpeg" alt="developer" />
<span class="package-developer-name">GhostFoundation1</span>
</a>
<div class="package-controls">
<a class="package-uninstall package-controls-button" href="#"><i class="icon-trash"></i>Uninstall</a>
<a class="package-disable package-controls-button" href="#"><i class="icon-pause"></i>Disable</a>
</div>
</footer>
</article>
</div>
<div class="package-grid-cell">
<article class="package-card-app" data-href="/app/">
<div class="package-card-content">
<figure class="package-card-app-icon" style="background-image:url(https://pbs.twimg.com/profile_images/439941058404028416/3nRmjK6v.jpeg)"></figure>
<div class="package-card-meta">
<h3 class="package-card-app-title">Ghost</h3>
<div class="package-card-stats">
<div class="package-downloads">
<i class="icon-download"></i>
<span class="package-download-count">14,301</span>
</div>
</div>
<p class="package-card-app-desc">A UI theme that offers endless possibilities: one Atom, many Isotopes ;) Isotope adapts to match any syntax theme.</p>
</div>
</div>
<footer class="package-card-footer">
<a class="package-developer" href="#" target="_blank">
<img src="https://pbs.twimg.com/profile_images/439941058404028416/3nRmjK6v.jpeg" alt="developer" />
<span class="package-developer-name">GhostFoundation1</span>
</a>
<div class="package-controls">
<a class="package-settings package-controls-button" href="#"><i class="icon-settings"></i>Settings</a>
<a class="package-uninstall package-controls-button" href="#"><i class="icon-trash"></i>Uninstall</a>
<a class="package-disable package-controls-button" href="#"><i class="icon-pause"></i>Disable</a>
</div>
</footer>
</article>
</div>
<div class="package-grid-cell">
<article class="package-card-app" data-href="/app/">
<div class="package-card-content">
<figure class="package-card-app-icon" style="background-image:url(https://pbs.twimg.com/profile_images/439941058404028416/3nRmjK6v.jpeg)"></figure>
<div class="package-card-meta">
<h3 class="package-card-app-title">Ghost</h3>
<div class="package-card-stats">
<div class="package-downloads">
<i class="icon-download"></i>
<span class="package-download-count">14,301</span>
</div>
</div>
<p class="package-card-app-desc">A UI theme that offers endless possibilities: one Atom, many Isotopes ;) Isotope adapts to match any syntax theme.</p>
</div>
</div>
<footer class="package-card-footer">
<a class="package-developer" href="#" target="_blank">
<img src="https://pbs.twimg.com/profile_images/439941058404028416/3nRmjK6v.jpeg" alt="developer" />
<span class="package-developer-name">GhostFoundation1</span>
</a>
<div class="package-controls">
<a class="package-settings package-controls-button" href="#"><i class="icon-settings"></i>Settings</a>
<a class="package-uninstall package-controls-button" href="#"><i class="icon-trash"></i>Uninstall</a>
<a class="package-disable package-controls-button" href="#"><i class="icon-pause"></i>Disable</a>
</div>
</footer>
</article>
</div>
</div>
</section>
</main>
<aside id="ember766" class="ember-view gh-notifications"><!----></aside>
<!---->
<!---->
</div></div>
</body>
</html>

482
app/html/themes.html
View File

@ -11,249 +11,263 @@
<body class="ember-application settings settings-view-general" data-apps="false" data-filestorage="true" data-blogurl="http://127.0.0.1:2368">
<div id="ember725" class="ember-view gh-app"><a class="sr-only sr-only-focusable" href="#gh-main">Skip to main content</a>
<div id="ember725" class="ember-view gh-app"><a class="sr-only sr-only-focusable" href="#gh-main">Skip to main content</a>
<aside id="ember749" class="ember-view gh-alerts"><!----></aside>
<aside id="ember749" class="ember-view gh-alerts"><!----></aside>
<div class="gh-viewport">
<nav class="gh-nav">
<header id="ember783" class="ember-view gh-nav-menu closed" role="button"> <div class="gh-nav-menu-icon" style="background-image: url(https://s3.amazonaws.com/f.cl.ly/items/3I0g431b2b3q00253K1V/d16dc430c9c4f5c09d6ca09be3e5c72fdb21c1ac.png)"></div>
<div class="gh-nav-menu-details">
<div class="gh-nav-menu-details-blog">Ghost</div>
<div class="gh-nav-menu-details-user">John Thing</div>
</div>
<i class="icon-arrow"></i>
</header><div id="ember792" class="ember-view ghost-dropdown dropdown closed fade-out"> <ul class="dropdown-menu dropdown-triangle-top js-user-menu-dropdown-menu" role="menu" style="right:-50%;left:auto;margin-right:40px">
<li role="presentation"><a id="ember810" class="ember-view gh-nav-menu-about dropdown-item js-nav-item" href="/ghost/settings/about/" tabindex="-1"><i class="icon-gh"></i> About Ghost</a></li>
<li class="divider"></li>
<li role="presentation"><a id="ember811" class="ember-view dropdown-item user-menu-profile js-nav-item" href="/ghost/settings/users/john/" tabindex="-1"><i class="icon-user"></i> Your Profile</a></li>
<li class="divider"></li>
<li role="presentation"><a id="ember812" class="ember-view dropdown-item user-menu-signout" href="/ghost/signout/" tabindex="-1"><i class="icon-signout"></i> Sign Out</a></li>
</ul>
</div> <section class="gh-nav-body">
<section class="gh-nav-search">
<input class="gh-nav-search-input gh-input" type="text" placeholder="Search">
<button class="gh-nav-search-button"><i class="icon-search"></i><span class="sr-only">Search</span></button>
</section>
<ul class="gh-nav-list gh-nav-main">
<li><a id="ember796" class="ember-view gh-nav-main-editor" href="/ghost/editor/"><i class="icon-pen"></i>New Post</a></li>
<li><a id="ember797" class="ember-view gh-nav-main-content" href="/ghost/"><i class="icon-content"></i>Content</a></li>
<li><a id="ember798" class="ember-view gh-nav-main-users" href="/ghost/settings/users/"><i class="icon-team"></i>Team</a></li>
</ul>
<ul class="gh-nav-list gh-nav-settings">
<li class="gh-nav-list-h">Settings</li>
<li><a id="ember799" class="ember-view gh-nav-settings-general" href="/ghost/settings/general/"><i class="icon-settings"></i>General</a></li>
<li><a id="ember800" class="ember-view gh-nav-settings-navigation" href="/ghost/settings/navigation/"><i class="icon-compass"></i>Navigation</a></li>
<li><a id="ember801" class="ember-view gh-nav-settings-tags" href="/ghost/settings/tags/"><i class="icon-tag"></i>Tags</a></li>
<li><a id="ember802" class="ember-view gh-nav-settings-code-injection" href="/ghost/settings/code-injection/"><i class="icon-code"></i>Code Injection</a></li>
<li><a id="ember803" class="ember-view gh-nav-settings-labs" href="/ghost/settings/labs/"><i class="icon-apps"></i>Labs</a></li>
<li><a id="ember804" class="ember-view gh-nav-settings-apps active" href="/ghost/settings/apps/"><i class="icon-design"></i>Themes</a></li>
</ul>
</section>
<footer class="gh-nav-footer">
<div class="gh-autonav-toggle">
<i class="icon-minimise"></i>
</div>
<a class="gh-nav-footer-sitelink" target="_blank" href="http://localhost:2368/">View blog <i class="icon-external"></i></a>
<div class="gh-help-menu">
<div id="ember804" class="ember-view closed" role="button"> <div class="gh-help-button">
<i class="icon-question"><span class="hidden">Help</span></i>
</div>
</div><div id="ember805" class="ember-view ghost-dropdown dropdown closed fade-out"> <ul class="dropdown-menu dropdown-triangle-bottom" role="menu">
<li role="presentation"><a class="dropdown-item help-menu-support" role="menuitem" tabindex="-1" href="http://support.ghost.org/" target="_blank"><i class="icon-ambulance"></i> Support Center</a></li>
<li role="presentation"><a class="dropdown-item help-menu-tweet" role="menuitem" tabindex="-1" href="https://twitter.com/intent/tweet?text=%40TryGhost+Hi%21+Can+you+help+me+with+&amp;related=TryGhost" target="_blank" onclick="window.open(this.href, 'twitter-share', 'width=550,height=235');return false;"><i class="icon-twitter"></i> Tweet @TryGhost!</a></li>
<li class="divider"></li>
<li role="presentation"><a class="dropdown-item help-menu-how-to" role="menuitem" tabindex="-1" href="http://support.ghost.org/how-to-use-ghost/" target="_blank"><i class="icon-book"></i> How to Use Ghost</a></li>
<li role="presentation"><a class="dropdown-item help-menu-markdown" role="menuitem" tabindex="-1" href="" data-ember-action="1036"><i class="icon-markdown"></i> Markdown Help</a></li>
<li class="divider"></li>
<li role="presentation"><a class="dropdown-item help-menu-wishlist" role="menuitem" tabindex="-1" href="http://ideas.ghost.org/" target="_blank"><i class="icon-idea"></i> Wishlist</a></li>
</ul>
</div> </div>
</footer>
</nav>
<main id="gh-main" class="gh-main" role="main" data-notification-count="0">
<section id="ember1308" class="ember-view gh-view js-settings-content"><header class="view-header">
<h2 class="view-title">Themes</h2>
<section class="view-actions">
<input id="blog-title" class="gh-input package-filter" type="text" name="general[title]" placeholder="Filter themes by name">
</section>
</header>
<section class="view-content">
<form>
<div class="form-group for-select">
<label for="activeTheme">Active Theme</label>
<span class="gh-select" tabindex="0" data-select-text="CodingHorror - 1.0.0">
<select id="activeTheme" class="ember-view ember-select" name="general[activeTheme]"><!---->
<option id="ember1360" class="ember-view" value="Casper-master">CasperPR - 1.0.1</option>
<option id="ember1363" class="ember-view" value="blogdotghost">Blog - 1.0</option>
<option id="ember1366" class="ember-view" value="casper">Casper - 1.2.4</option><option id="ember1369" class="ember-view" value="codinghorror">CodingHorror - 1.0.0</option>
<option id="ember1372" class="ember-view" value="codinghorror.zip">codinghorror.zip</option>
<option id="ember1375" class="ember-view" value="john">john</option>
</select>
</span>
<p>Select a theme for your blog</p>
</div>
</form>
<div class="package-grid package-grid-themes">
<article class="package-card-theme">
<div class="package-card-content">
<a class="package-card-theme-image" href="/theme/">
<img src="http://cl.ly/b4FN/casper2.jpg" alt="theme" />
<div class="package-card-theme-overlay">
<h3 class="package-card-theme-title">Casper and a Really Long Name</h3>
</div>
</a>
</div>
<footer class="package-card-footer">
<a class="package-developer" href="#" target="_blank">
<img src="https://pbs.twimg.com/profile_images/439941058404028416/3nRmjK6v.jpeg" alt="developer" />
<span class="package-developer-name">GhostFoundation1</span>
</a>
<div class="package-controls">
<a class="package-uninstall package-controls-button" href="#"><i class="icon-trash"></i>Uninstall</a>
</div>
</footer>
</article>
<article class="package-card-theme">
<div class="package-card-content">
<a class="package-card-theme-image" href="/theme/">
<img src="http://cl.ly/b4FN/casper2.jpg" alt="theme" />
<div class="package-card-theme-overlay">
<h3 class="package-card-theme-title">Casper and a Really Long Name</h3>
</div>
</a>
</div>
<footer class="package-card-footer">
<a class="package-developer" href="#" target="_blank">
<img src="https://pbs.twimg.com/profile_images/439941058404028416/3nRmjK6v.jpeg" alt="developer" />
<span class="package-developer-name">GhostFoundation1</span>
</a>
<div class="package-controls">
<a class="package-uninstall package-controls-button" href="#"><i class="icon-trash"></i>Uninstall</a>
</div>
</footer>
</article>
<article class="package-card-theme">
<div class="package-card-content">
<a class="package-card-theme-image" href="/theme/">
<img src="http://cl.ly/b4FN/casper2.jpg" alt="theme" />
<div class="package-card-theme-overlay">
<h3 class="package-card-theme-title">Casper and a Really Long Name</h3>
</div>
</a>
</div>
<footer class="package-card-footer">
<a class="package-developer" href="#" target="_blank">
<img src="https://pbs.twimg.com/profile_images/439941058404028416/3nRmjK6v.jpeg" alt="developer" />
<span class="package-developer-name">GhostFoundation1</span>
</a>
<div class="package-controls">
<a class="package-uninstall package-controls-button" href="#"><i class="icon-trash"></i>Uninstall</a>
</div>
</footer>
</article>
<article class="package-card-theme">
<div class="package-card-content">
<a class="package-card-theme-image" href="/theme/">
<img src="http://cl.ly/b4FN/casper2.jpg" alt="theme" />
<div class="package-card-theme-overlay">
<h3 class="package-card-theme-title">Casper and a Really Long Name</h3>
</div>
</a>
</div>
<footer class="package-card-footer">
<a class="package-developer" href="#" target="_blank">
<img src="https://pbs.twimg.com/profile_images/439941058404028416/3nRmjK6v.jpeg" alt="developer" />
<span class="package-developer-name">GhostFoundation1</span>
</a>
<div class="package-controls">
<a class="package-uninstall package-controls-button" href="#"><i class="icon-trash"></i>Uninstall</a>
</div>
</footer>
</article>
<article class="package-card-theme">
<div class="package-card-content">
<a class="package-card-theme-image" href="/theme/">
<img src="http://cl.ly/b4FN/casper2.jpg" alt="theme" />
<div class="package-card-theme-overlay">
<h3 class="package-card-theme-title">Casper and a Really Long Name</h3>
</div>
</a>
</div>
<footer class="package-card-footer">
<a class="package-developer" href="#" target="_blank">
<img src="https://pbs.twimg.com/profile_images/439941058404028416/3nRmjK6v.jpeg" alt="developer" />
<span class="package-developer-name">GhostFoundation1</span>
</a>
<div class="package-controls">
<a class="package-uninstall package-controls-button" href="#"><i class="icon-trash"></i>Uninstall</a>
</div>
</footer>
</article>
<article class="package-card-theme">
<div class="package-card-content">
<a class="package-card-theme-image" href="/theme/">
<img src="http://cl.ly/b4FN/casper2.jpg" alt="theme" />
<div class="package-card-theme-overlay">
<h3 class="package-card-theme-title">Casper and a Really Long Name</h3>
</div>
</a>
</div>
<footer class="package-card-footer">
<a class="package-developer" href="#" target="_blank">
<img src="https://pbs.twimg.com/profile_images/439941058404028416/3nRmjK6v.jpeg" alt="developer" />
<span class="package-developer-name">GhostFoundation1</span>
</a>
<div class="package-controls">
<a class="package-uninstall package-controls-button" href="#"><i class="icon-trash"></i>Uninstall</a>
</div>
</footer>
</article>
<article class="package-card-theme">
<div class="package-card-content">
<a class="package-card-theme-image" href="/theme/">
<img src="http://cl.ly/b4FN/casper2.jpg" alt="theme" />
<div class="package-card-theme-overlay">
<h3 class="package-card-theme-title">Casper and a Really Long Name</h3>
</div>
</a>
</div>
<footer class="package-card-footer">
<a class="package-developer" href="#" target="_blank">
<img src="https://pbs.twimg.com/profile_images/439941058404028416/3nRmjK6v.jpeg" alt="developer" />
<span class="package-developer-name">GhostFoundation1</span>
</a>
<div class="package-controls">
<a class="package-uninstall package-controls-button" href="#"><i class="icon-trash"></i>Uninstall</a>
</div>
</footer>
</article>
<div class="gh-viewport">
<nav class="gh-nav">
<header id="ember783" class="ember-view gh-nav-menu closed" role="button"> <div class="gh-nav-menu-icon" style="background-image: url(https://s3.amazonaws.com/f.cl.ly/items/3I0g431b2b3q00253K1V/d16dc430c9c4f5c09d6ca09be3e5c72fdb21c1ac.png)"></div>
<div class="gh-nav-menu-details">
<div class="gh-nav-menu-details-blog">Ghost</div>
<div class="gh-nav-menu-details-user">John Thing</div>
</div>
<i class="icon-arrow"></i>
</header><div id="ember792" class="ember-view ghost-dropdown dropdown closed fade-out"> <ul class="dropdown-menu dropdown-triangle-top js-user-menu-dropdown-menu" role="menu" style="right:-50%;left:auto;margin-right:40px">
<li role="presentation"><a id="ember810" class="ember-view gh-nav-menu-about dropdown-item js-nav-item" href="/ghost/settings/about/" tabindex="-1"><i class="icon-gh"></i> About Ghost</a></li>
<li class="divider"></li>
<li role="presentation"><a id="ember811" class="ember-view dropdown-item user-menu-profile js-nav-item" href="/ghost/settings/users/john/" tabindex="-1"><i class="icon-user"></i> Your Profile</a></li>
<li class="divider"></li>
<li role="presentation"><a id="ember812" class="ember-view dropdown-item user-menu-signout" href="/ghost/signout/" tabindex="-1"><i class="icon-signout"></i> Sign Out</a></li>
</ul>
</div> <section class="gh-nav-body">
<section class="gh-nav-search">
<input class="gh-nav-search-input gh-input" type="text" placeholder="Search">
<button class="gh-nav-search-button"><i class="icon-search"></i><span class="sr-only">Search</span></button>
</section>
<ul class="gh-nav-list gh-nav-main">
<li><a id="ember796" class="ember-view gh-nav-main-editor" href="/ghost/editor/"><i class="icon-pen"></i>New Post</a></li>
<li><a id="ember797" class="ember-view gh-nav-main-content" href="/ghost/"><i class="icon-content"></i>Content</a></li>
<li><a id="ember798" class="ember-view gh-nav-main-users" href="/ghost/settings/users/"><i class="icon-team"></i>Team</a></li>
</ul>
<ul class="gh-nav-list gh-nav-settings">
<li class="gh-nav-list-h">Settings</li>
<li><a id="ember799" class="ember-view gh-nav-settings-general" href="/ghost/settings/general/"><i class="icon-settings"></i>General</a></li>
<li><a id="ember800" class="ember-view gh-nav-settings-navigation" href="/ghost/settings/navigation/"><i class="icon-compass"></i>Navigation</a></li>
<li><a id="ember801" class="ember-view gh-nav-settings-tags" href="/ghost/settings/tags/"><i class="icon-tag"></i>Tags</a></li>
<li><a id="ember802" class="ember-view gh-nav-settings-code-injection" href="/ghost/settings/code-injection/"><i class="icon-code"></i>Code Injection</a></li>
<li><a id="ember803" class="ember-view gh-nav-settings-labs" href="/ghost/settings/labs/"><i class="icon-apps"></i>Labs</a></li>
<li><a id="ember804" class="ember-view gh-nav-settings-apps active" href="/ghost/settings/apps/"><i class="icon-design"></i>Themes</a></li>
</ul>
</section>
<footer class="gh-nav-footer">
<div class="gh-autonav-toggle">
<i class="icon-minimise"></i>
</div>
<a class="gh-nav-footer-sitelink" target="_blank" href="http://localhost:2368/">View blog <i class="icon-external"></i></a>
<div class="gh-help-menu">
<div id="ember804" class="ember-view closed" role="button"> <div class="gh-help-button">
<i class="icon-question"><span class="hidden">Help</span></i>
</div>
</div><div id="ember805" class="ember-view ghost-dropdown dropdown closed fade-out"> <ul class="dropdown-menu dropdown-triangle-bottom" role="menu">
<li role="presentation"><a class="dropdown-item help-menu-support" role="menuitem" tabindex="-1" href="http://support.ghost.org/" target="_blank"><i class="icon-ambulance"></i> Support Center</a></li>
<li role="presentation"><a class="dropdown-item help-menu-tweet" role="menuitem" tabindex="-1" href="https://twitter.com/intent/tweet?text=%40TryGhost+Hi%21+Can+you+help+me+with+&amp;related=TryGhost" target="_blank" onclick="window.open(this.href, 'twitter-share', 'width=550,height=235');return false;"><i class="icon-twitter"></i> Tweet @TryGhost!</a></li>
<li class="divider"></li>
<li role="presentation"><a class="dropdown-item help-menu-how-to" role="menuitem" tabindex="-1" href="http://support.ghost.org/how-to-use-ghost/" target="_blank"><i class="icon-book"></i> How to Use Ghost</a></li>
<li role="presentation"><a class="dropdown-item help-menu-markdown" role="menuitem" tabindex="-1" href="" data-ember-action="1036"><i class="icon-markdown"></i> Markdown Help</a></li>
<li class="divider"></li>
<li role="presentation"><a class="dropdown-item help-menu-wishlist" role="menuitem" tabindex="-1" href="http://ideas.ghost.org/" target="_blank"><i class="icon-idea"></i> Wishlist</a></li>
</ul>
</div> </div>
</footer>
</nav>
<main id="gh-main" class="gh-main" role="main" data-notification-count="0">
<section id="ember1308" class="ember-view gh-view js-settings-content"><header class="view-header">
<h2 class="view-title">Themes</h2>
<section class="view-actions">
<input id="blog-title" class="gh-input package-filter" type="text" name="general[title]" placeholder="Filter themes by name">
</section>
</main>
</header>
<aside id="ember766" class="ember-view gh-notifications"><!----></aside>
<section class="view-content">
<!---->
<!---->
<form>
<div class="form-group for-select">
<label for="activeTheme">Active Theme</label>
<span class="gh-select" tabindex="0" data-select-text="CodingHorror - 1.0.0">
<select id="activeTheme" class="ember-view ember-select" name="general[activeTheme]"><!---->
<option id="ember1360" class="ember-view" value="Casper-master">CasperPR - 1.0.1</option>
<option id="ember1363" class="ember-view" value="blogdotghost">Blog - 1.0</option>
<option id="ember1366" class="ember-view" value="casper">Casper - 1.2.4</option><option id="ember1369" class="ember-view" value="codinghorror">CodingHorror - 1.0.0</option>
<option id="ember1372" class="ember-view" value="codinghorror.zip">codinghorror.zip</option>
<option id="ember1375" class="ember-view" value="john">john</option>
</select>
</span>
<p>Select a theme for your blog</p>
</div>
</form>
</div></div>
<div class="package-grid package-grid-themes">
<div class="package-grid-cell">
<article class="package-card-theme">
<div class="package-card-content">
<a class="package-card-theme-image" href="/theme/">
<img src="http://cl.ly/b4FN/casper2.jpg" alt="theme" />
<div class="package-card-theme-overlay">
<h3 class="package-card-theme-title">Casper and a Really Long Name</h3>
</div>
</a>
</div>
<footer class="package-card-footer">
<a class="package-developer" href="#" target="_blank">
<img src="https://pbs.twimg.com/profile_images/439941058404028416/3nRmjK6v.jpeg" alt="developer" />
<span class="package-developer-name">GhostFoundation1</span>
</a>
<div class="package-controls">
<a class="package-uninstall package-controls-button" href="#"><i class="icon-trash"></i>Uninstall</a>
</div>
</footer>
</article>
</div>
<div class="package-grid-cell">
<article class="package-card-theme">
<div class="package-card-content">
<a class="package-card-theme-image" href="/theme/">
<img src="http://cl.ly/b4FN/casper2.jpg" alt="theme" />
<div class="package-card-theme-overlay">
<h3 class="package-card-theme-title">Casper and a Really Long Name</h3>
</div>
</a>
</div>
<footer class="package-card-footer">
<a class="package-developer" href="#" target="_blank">
<img src="https://pbs.twimg.com/profile_images/439941058404028416/3nRmjK6v.jpeg" alt="developer" />
<span class="package-developer-name">GhostFoundation1</span>
</a>
<div class="package-controls">
<a class="package-uninstall package-controls-button" href="#"><i class="icon-trash"></i>Uninstall</a>
</div>
</footer>
</article>
</div>
<div class="package-grid-cell">
<article class="package-card-theme">
<div class="package-card-content">
<a class="package-card-theme-image" href="/theme/">
<img src="http://cl.ly/b4FN/casper2.jpg" alt="theme" />
<div class="package-card-theme-overlay">
<h3 class="package-card-theme-title">Casper and a Really Long Name</h3>
</div>
</a>
</div>
<footer class="package-card-footer">
<a class="package-developer" href="#" target="_blank">
<img src="https://pbs.twimg.com/profile_images/439941058404028416/3nRmjK6v.jpeg" alt="developer" />
<span class="package-developer-name">GhostFoundation1</span>
</a>
<div class="package-controls">
<a class="package-uninstall package-controls-button" href="#"><i class="icon-trash"></i>Uninstall</a>
</div>
</footer>
</article>
</div>
<div class="package-grid-cell">
<article class="package-card-theme">
<div class="package-card-content">
<a class="package-card-theme-image" href="/theme/">
<img src="http://cl.ly/b4FN/casper2.jpg" alt="theme" />
<div class="package-card-theme-overlay">
<h3 class="package-card-theme-title">Casper and a Really Long Name</h3>
</div>
</a>
</div>
<footer class="package-card-footer">
<a class="package-developer" href="#" target="_blank">
<img src="https://pbs.twimg.com/profile_images/439941058404028416/3nRmjK6v.jpeg" alt="developer" />
<span class="package-developer-name">GhostFoundation1</span>
</a>
<div class="package-controls">
<a class="package-uninstall package-controls-button" href="#"><i class="icon-trash"></i>Uninstall</a>
</div>
</footer>
</article>
</div>
<div class="package-grid-cell">
<article class="package-card-theme">
<div class="package-card-content">
<a class="package-card-theme-image" href="/theme/">
<img src="http://cl.ly/b4FN/casper2.jpg" alt="theme" />
<div class="package-card-theme-overlay">
<h3 class="package-card-theme-title">Casper and a Really Long Name</h3>
</div>
</a>
</div>
<footer class="package-card-footer">
<a class="package-developer" href="#" target="_blank">
<img src="https://pbs.twimg.com/profile_images/439941058404028416/3nRmjK6v.jpeg" alt="developer" />
<span class="package-developer-name">GhostFoundation1</span>
</a>
<div class="package-controls">
<a class="package-uninstall package-controls-button" href="#"><i class="icon-trash"></i>Uninstall</a>
</div>
</footer>
</article>
</div>
<div class="package-grid-cell">
<article class="package-card-theme">
<div class="package-card-content">
<a class="package-card-theme-image" href="/theme/">
<img src="http://cl.ly/b4FN/casper2.jpg" alt="theme" />
<div class="package-card-theme-overlay">
<h3 class="package-card-theme-title">Casper and a Really Long Name</h3>
</div>
</a>
</div>
<footer class="package-card-footer">
<a class="package-developer" href="#" target="_blank">
<img src="https://pbs.twimg.com/profile_images/439941058404028416/3nRmjK6v.jpeg" alt="developer" />
<span class="package-developer-name">GhostFoundation1</span>
</a>
<div class="package-controls">
<a class="package-uninstall package-controls-button" href="#"><i class="icon-trash"></i>Uninstall</a>
</div>
</footer>
</article>
</div>
<div class="package-grid-cell">
<article class="package-card-theme">
<div class="package-card-content">
<a class="package-card-theme-image" href="/theme/">
<img src="http://cl.ly/b4FN/casper2.jpg" alt="theme" />
<div class="package-card-theme-overlay">
<h3 class="package-card-theme-title">Casper and a Really Long Name</h3>
</div>
</a>
</div>
<footer class="package-card-footer">
<a class="package-developer" href="#" target="_blank">
<img src="https://pbs.twimg.com/profile_images/439941058404028416/3nRmjK6v.jpeg" alt="developer" />
<span class="package-developer-name">GhostFoundation1</span>
</a>
<div class="package-controls">
<a class="package-uninstall package-controls-button" href="#"><i class="icon-trash"></i>Uninstall</a>
</div>
</footer>
</article>
</div>
</div>
</section>
</main>
<aside id="ember766" class="ember-view gh-notifications"><!----></aside>
<!---->
<!---->
</div></div>
</body>
</html>

36
app/styles/layouts/packages.css
View File

@ -22,15 +22,44 @@
max-width: 1200px;
}
/* 3 col themes */
.package-grid-themes .package-grid-cell {
flex: 0 0 33.3333%;
}
/* 2 col themes */
@media (max-width: 1240px) {
.package-grid-themes .package-grid-cell {
flex: 0 0 50%;
}
}
/* 1 col themes */
@media (max-width: 800px) {
.package-grid-themes .package-grid-cell {
flex: 1 1 100%;
}
}
/* 2 col apps */
.package-grid-apps .package-grid-cell {
flex: 0 0 50%;
}
/* 1 col apps */
@media (max-width: 1200px) {
.package-grid-apps .package-grid-cell {
flex: 1 1 100%;
}
}
/* Package Card Theme
/* ---------------------------------------------------------- */
.package-card-theme {
flex: 1 1 290px;
overflow: hidden;
margin: 10px;
max-width: 440px;
border: rgba(0,0,0,0.1) 1px solid;
border-radius: 5px;
}
@ -95,7 +124,6 @@
/* ---------------------------------------------------------- */
.package-card-app {
flex: 1 1 500px;
overflow: hidden;
margin: 10px;
padding: 20px;
@ -297,7 +325,7 @@
border-top: #e1e1e1 1px solid;
border-radius: 0;
}
.package-card-app:first-of-type {
.package-grid-cell:first-of-type .package-card-app {
border-top: none;
}
}