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