Make lots of improvements to the narrow-screen layout
This commit is contained in:
parent
580c61e924
commit
427dcde672
6 changed files with 19 additions and 12 deletions
|
@ -7,12 +7,12 @@
|
|||
{{i}}<span class="p-name sr-only">{{ entry.author.name }}</span>
|
||||
{{i}}</a>
|
||||
{{i}}<a class="u-uid u-url" href="{{ entry.url }}">
|
||||
{{i}}<time class="dt-published media" datetime="{{ entry.published.isoformat() }}">
|
||||
{{i}}<time class="dt-published media" datetime="{{ entry.published.isoformat() }}" title="{{ entry.published.isoformat() }}">
|
||||
{{i}}<i class="fas fa-fw fa-calendar" aria-hidden="true"></i>
|
||||
{{i}}<div class="media-body">{{ entry.published | ago }}</div>
|
||||
{{i}}</time>
|
||||
{{i}}</a>
|
||||
{{i}}<time class="dt-updated media" datetime="{{ entry.updated.isoformat() }}"{% if (entry.updated | ago) == (entry.published | ago) %} hidden{% endif %}>
|
||||
{{i}}<time class="dt-updated media" datetime="{{ entry.updated.isoformat() }}" title="{{ entry.updated.isoformat() }}"{% if (entry.updated | ago) == (entry.published | ago) %} hidden{% endif %}>
|
||||
{{i}}<i class="fas fa-fw fa-pencil-alt" aria-hidden="true"></i>
|
||||
{{i}}<div class="media-body">{{ entry.updated | ago }}</div>
|
||||
{{i}}</time>
|
||||
|
|
|
@ -33,6 +33,9 @@ ol.entries, div.entry
|
|||
max-width 10rem
|
||||
> :first-child
|
||||
margin-right 2px
|
||||
display none
|
||||
@media (min-width $sm)
|
||||
display inline-block
|
||||
> .card
|
||||
flex 1
|
||||
.e-content
|
||||
|
|
|
@ -1,8 +1,3 @@
|
|||
$sm = 576px
|
||||
$md = 768px
|
||||
$lg = 992px
|
||||
$xl = 1200px
|
||||
|
||||
main
|
||||
flex-direction column
|
||||
align-items center
|
||||
|
|
|
@ -1,8 +1,4 @@
|
|||
$monokai_bg = #272822
|
||||
$sm = 576px
|
||||
$md = 768px
|
||||
$lg = 992px
|
||||
$xl = 1200px
|
||||
|
||||
html
|
||||
background-color $base00
|
||||
|
|
|
@ -6,9 +6,20 @@ const {safeLoad} = require('js-yaml');
|
|||
|
||||
const themePath = join(__dirname, '..', '..', 'base16-materialtheme-scheme', 'material-darker.yaml');
|
||||
|
||||
const breakpoints = {
|
||||
sm: 576,
|
||||
md: 768,
|
||||
lg: 992,
|
||||
xl: 1200,
|
||||
};
|
||||
|
||||
module.exports = function() {
|
||||
const theme = safeLoad(readFileSync(themePath, 'utf8'));
|
||||
return function(style) {
|
||||
for (let key in breakpoints) {
|
||||
style.define('$' + key, new stylus.nodes.Unit(breakpoints[key], 'px'));
|
||||
}
|
||||
|
||||
for (let i = 0; i < 16; i++) {
|
||||
const key = 'base0' + i.toString(16).toUpperCase();
|
||||
const hex = theme[key];
|
||||
|
|
|
@ -30,10 +30,12 @@ PACKAGE = PackageJson()
|
|||
|
||||
|
||||
def friendly_url(url):
|
||||
if '//' not in url:
|
||||
url = '//' + url
|
||||
(scheme, netloc, path, params, q, fragment) = urlparse(url)
|
||||
if path == '/':
|
||||
return netloc
|
||||
return netloc + path
|
||||
return "{}\u200B{}".format(netloc, path)
|
||||
|
||||
|
||||
def load_package_json() -> Dict[str, Any]:
|
||||
|
|
Loading…
Reference in a new issue