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