Browse Source

add some mobile css

main
Franzi 1 month ago
parent
commit
63422d44fc
Signed by: kunsi GPG Key ID: 12E3D2136B818350
  1. 2
      _layouts/default.html
  2. 41
      css/style.sass

2
_layouts/default.html

@ -5,6 +5,8 @@
<link rel="stylesheet" href="/css/style.css" type="text/css">
{% feed_meta %}
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
</head>
<body>
<a href="#content" id="skip-to-content">Skip to content</a>

41
css/style.sass

@ -33,7 +33,8 @@ h1
-webkit-text-fill-color: transparent
-webkit-text-stroke: 2px #FFFFFF
paint-order: stroke fill
font-size: 8em
font-size: 6em
font-size: clamp(2em, 10vw, 8em)
margin-bottom: 30px
h2
@ -45,7 +46,10 @@ h3
#content
margin: 20px 0 0 11em
margin: 0 0 0 11em
@media (max-width: 800px)
margin: 5px
a
text-decoration: underline
@ -94,24 +98,33 @@ nav
float: left
width: 10em
@media (max-width: 800px)
float: none
width: auto
text-align: center
a
display: block
border: 5px outset #AAAAAA;
background-color: #CCCCCC;
margin-bottom: 10px
color: #FFFFFF
padding: 2px 5px
text-decoration: none
color: #000000
text-align: right
&.current-page
border-style: inset
font-weight: bolder
text-decoration: none
&:hover,
&:active,
&:focus
border-style: inset
@media (min-width: 800px)
display: block
border: 5px outset #AAAAAA;
background-color: #CCCCCC;
margin-bottom: 10px
text-decoration: none
color: #000000
text-align: right
&.current-page,
&:hover,
&:active,
&:focus
border-style: inset
p

Loading…
Cancel
Save