Add responsive view for better cross-device support.
This commit is contained in:
parent
a001ed5c2c
commit
03cfddc4cd
@ -13,6 +13,7 @@
|
||||
<head>
|
||||
<title>Inferencium - About</title>
|
||||
<link rel="stylesheet" href=inf.css>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
</head>
|
||||
|
||||
<!-- Navigation bar. -->
|
||||
|
@ -13,6 +13,7 @@
|
||||
<head>
|
||||
<title>Inferencium - Blog</title>
|
||||
<link rel="stylesheet" href="inf.css">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
</head>
|
||||
|
||||
<!-- Navigation bar. -->
|
||||
|
@ -13,6 +13,7 @@
|
||||
<head>
|
||||
<title>Inferencium - Blog - FOSS is Working Against Itself</title>
|
||||
<link rel="stylesheet" href="../inf.css">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
</head>
|
||||
|
||||
<!-- Navigation bar. -->
|
||||
|
@ -13,6 +13,7 @@
|
||||
<head>
|
||||
<title>Inferencium - Blog - systemd Insecurity</title>
|
||||
<link rel="stylesheet" href="../inf.css">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
</head>
|
||||
|
||||
<!-- Navigation bar. -->
|
||||
|
@ -13,6 +13,7 @@
|
||||
<head>
|
||||
<title>Inferencium - Blog - The Chromium Monopoly</title>
|
||||
<link rel="stylesheet" href="../inf.css">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
</head>
|
||||
|
||||
<!-- Navigation bar. -->
|
||||
|
@ -13,6 +13,7 @@
|
||||
<head>
|
||||
<title>Inferencium - Blog - Untrusted: The Issue with Decentralisation</title>
|
||||
<link rel="stylesheet" href="../inf.css">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
</head>
|
||||
|
||||
<!-- Navigation bar. -->
|
||||
|
@ -13,6 +13,7 @@
|
||||
<head>
|
||||
<title>Inferencium - Contact</title>
|
||||
<link rel="stylesheet" href="inf.css">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
</head>
|
||||
|
||||
<!-- Navigation bar. -->
|
||||
|
@ -13,6 +13,7 @@
|
||||
<head>
|
||||
<title>Inferencium - Contact - Briar</title>
|
||||
<link rel="stylesheet" href="../inf.css">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
</head>
|
||||
|
||||
<!-- Navigation bar. -->
|
||||
|
@ -13,6 +13,7 @@
|
||||
<head>
|
||||
<title>Inferencium - Contact - Session</title>
|
||||
<link rel="stylesheet" href="../inf.css">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
</head>
|
||||
|
||||
<!-- Navigation bar. -->
|
||||
|
@ -13,6 +13,7 @@
|
||||
<head>
|
||||
<title>Inferencium - Contact - Signal</title>
|
||||
<link rel="stylesheet" href="../inf.css">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
</head>
|
||||
|
||||
<!-- Navigation bar. -->
|
||||
|
@ -13,6 +13,7 @@
|
||||
<head>
|
||||
<title>Inferencium - Contact - XMPP</title>
|
||||
<link rel="stylesheet" href="../inf.css">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
</head>
|
||||
|
||||
<!-- Navigation bar. -->
|
||||
|
@ -13,6 +13,7 @@
|
||||
<head>
|
||||
<title>Inferencium</title>
|
||||
<link rel="stylesheet" href=inf.css>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
</head>
|
||||
|
||||
<!-- Navigation bar. -->
|
||||
|
28
inf.css
28
inf.css
@ -45,8 +45,8 @@ h6 {
|
||||
|
||||
body {
|
||||
padding-top: 40px;
|
||||
margin-left: 400px;
|
||||
margin-right: 150px;
|
||||
margin-left: min(400px, 45vw);
|
||||
margin-right: min(150px, 12vw);
|
||||
font-family: Roboto, sans-serif;
|
||||
font-size: 20px;
|
||||
background-color: #262626;
|
||||
@ -135,3 +135,27 @@ table, th, td {
|
||||
.logo-small {
|
||||
transform: translate(0px, 13px);
|
||||
}
|
||||
|
||||
@media (max-width: 600px) {
|
||||
.sidebar {
|
||||
width: 100vw;
|
||||
height: auto;
|
||||
font-size: 0px;
|
||||
padding-top: 5px;
|
||||
}
|
||||
.sidebar div {
|
||||
font-size: min(max(7vw, 20px), 30px);
|
||||
display: inline-block;
|
||||
}
|
||||
.sidebar img, .sidebar .title {
|
||||
display: none;
|
||||
}
|
||||
body {
|
||||
margin: 15px;
|
||||
}
|
||||
}
|
||||
@media (max-width: 300px) {
|
||||
body {
|
||||
padding-top: 80px;
|
||||
}
|
||||
}
|
||||
|
@ -13,6 +13,7 @@
|
||||
<head>
|
||||
<title>Inferencium - Source</title>
|
||||
<link rel="stylesheet" href=inf.css>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
</head>
|
||||
|
||||
<!-- Navigation bar. -->
|
||||
|
Loading…
x
Reference in New Issue
Block a user