https://lars-christian.com/

ID de l'analyse :
b3b3e4b2-ce97-464e-86ea-e93e1ac1d4ccTerminée
URL soumise :
https://lars-christian.com/
Fin du rapport :

Liens : 7 trouvé(s)

Lientexte
https://mastodon.social/@larsMastodon
https://blogroll.org/Blogroll.org
https://ooh.directory/ooh.directory
https://personalsit.es/Personalsit.es
https://xn--sr8hvo.ws/previous←
https://xn--sr8hvo.ws/🕸💍
https://xn--sr8hvo.ws/next→

Variables JavaScript : 3 trouvée(s)

NomType
onbeforetoggleobject
documentPictureInPictureobject
onscrollendobject

Messages de journal de console : 0 trouvé(s)

HTML

<!DOCTYPE html><html lang="en-ie"><head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Lars-Christian.com — Inverse vandalism</title>
    <link rel="alternate" type="application/atom+xml" title="All content feed" href="/feed.xml">
    <link rel="alternate" type="application/atom+xml" title="Posts feed" href="/posts/feed.xml">
    <link rel="alternate" type="application/atom+xml" title="Notes feed" href="/notes/feed.xml">
    <link rel="icon" href="/lars-christiancom-sitelogo.png" sizes="32x32">
<style>
/* Body and variables */

body {
	--sitebg: #CCCCCC;
	--containerbg: #D6D6D6;
	--blockquotebg: #E0E0E0;
	--blockquotelv2bg: #E9E9E9;
	--text: #003333;
	--link: #30011E;
	--linkvisited: #013013;
	--imgdropshadow: #AEAEAE;
	--contrast: #003333;
	--text-contrast: #CCD6D6;
	font-family: system-ui, sans-serif;
	font-size: 20px;
	font-weight: 400;
	letter-spacing: 0.02em;
	line-height: 1.5em;
	background-color: var(--sitebg);
	color: var(--text);
}

@media (prefers-color-scheme: dark) {
	body {
	--sitebg: #282828;
	--containerbg: #323232;
	--blockquotebg: #3C3C3C;
	--blockquotelv2bg: #454545;
	--text: #CCD6D6;
	--link: #C0B2BB;
	--linkvisited: #B2C0B7;
	--imgdropshadow: #575757;
	--contrast: #CCD6D6;
	--text-contrast: #003333;
	}
}

/* Text styling */

a:link {
	color: var(--link);
	text-decoration: underline;
}

a:visited {
	color: var(--linkvisited);
}

a:hover {
	text-decoration: none;
}

h1 {
	font-size: 3em;
	line-height: 1.2em;
	font-weight: 400;
	margin-top: 0.8em;
	margin-bottom: 0.8em;
}

#notecontainer h1 {
	font-size: 1.6em;
	line-height: 1.5em;
	font-weight: 500;
	margin-top: 0.4em;
	margin-bottom: 0.2em;
}

h2 {
	font-size: 2em;
	line-height: 1.4em;
	font-weight: 400;
	margin-top: 0.6em;
	margin-bottom: 0.4em;
}

h3 {
	font-size: 1.6em;
	line-height: 1.5em;
	font-weight: 400;
	margin-top: 0.4em;
	margin-bottom: 0.2em;
}

h4 {
	font-size: 1.4em;
	line-height: 1.5em;
	font-weight: 400;
	margin-top: 0.4em;
	margin-bottom: 0.2em;
}

h5 {
	font-size: 1.2em;
	line-height: 1.5em;
	font-weight: 400;
	margin-top: 0.4em;
	margin-bottom: 0.2em;
}

h6 {
	font-size: 1em;
	line-height: 1.5em;
	font-weight: 400;
	margin-top: 0.4em;
	margin-bottom: 0.2em;
}

.bold {
	font-weight: 600;
}

.small {
	font-size: 0.8em;
}

.center {
	text-align: center;
}


/* Containers */

#container {
	max-width: 704px;
	margin: auto;
	padding: 0 2vw;
}

/* Header */

header {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	margin-top: 1em;
}

@media (max-width: 660px) {
	header {
  	display: flex;
    flex-direction: column;
  }
}

#logonsiteamecontainer {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
}

#logo {
	height: 60px;
    width: 60px;
    background: linear-gradient(135deg, rgb(48, 1, 30) 0%, rgb(103, 42, 78) 100%);
    filter: drop-shadow(4px 4px 0 #552340);
    transform: translateZ(0); /* Safari drop-shadow weirdness */
}

#sitename {
	line-height: 60px;
	height: 60px;
	float: right;
	margin: 1em;
	text-transform: uppercase;
	font-weight: 600;
}

#sitename a:link {
	text-decoration: none;
}

#headernav nav ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
	overflow: hidden;
}

#headernav nav li {
	float: left;
	font-weight: 600;
}

#headernav nav a {
	display: block;
	padding: 8px;
}

/* Footer */

#footernav {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: flex-start;
	margin-top: 1em;
}

#footernav ul {
	padding-inline-start: 1em;
}

#footernav li {
	line-height: 1.8em;
}

#footernav div {
	padding-right: 0.2em;
}

/* Blockquotes */

blockquote {
	display: block;
	background-color: var(--blockquotebg);
	filter: drop-shadow(4px 4px 0 var(--imgdropshadow));
	transform: translateZ(0); /* Safari drop-shadow weirdness */
	font-weight: 300;
	padding: 1.2em;
	margin: 2em 1em;
}

blockquote > blockquote {
	background-color: var(--blockquotelv2bg);
	font-size: 0.8em;
}

.popquote {
	display: block;
	background-color: rgb(48, 1, 30);
	background-image: linear-gradient(135deg, rgb(48, 1, 30) 0%, rgb(103, 42, 78) 100%);
	font-size: 0.8em;
	font-weight: 300;
	color: #F2F2F3;
	text-align: center;
	filter: drop-shadow(4px 4px 0 #552340);
	transform: translateZ(0); /* Safari drop-shadow weirdness */
	margin: 4em 0 2.6em;
    padding: 1.6em;
}

/* Images */

article img {
	display: block;
	max-width: 93.975%;
	margin: auto;
	height: auto;
	margin-top: 2em;
	margin-bottom: 2em;
	filter: drop-shadow(4px 4px 0 var(--imgdropshadow));
	transform: translateZ(0); /* Safari drop-shadow weirdness */
}

#profilephoto {
	float: right;
	margin: .5em 0 .5em 1em;
	filter: drop-shadow(4px 4px 0 var(--imgdropshadow));
	transform: translateZ(0); /* Safari drop-shadow weirdness */
	width: 100px;
	height: 100px;
}

/* Rulers */

hr {
	margin: 2.4em 0;
	border: none;
	height: 1px;
	background-color: var(--contrast);
}

article hr {
	margin-left: 8em;
	margin-right: 8em;
}

.postbottom {
	margin-bottom: 0.4em;
	margin-left: 0;
	margin-right: 0;
}

.notebottom {
	margin: 2.4em 0 0.4em;
	background-color: var(--imgdropshadow);
}

/* Posts and notes listings */

.entrylistcontainer {
	display: flex;
	flex-direction: row;
	overflow: hidden;
	width: 100%;
	padding-top: 0.4em;
	padding-bottom: 0.8em;
}

.entrylistdate {
	flex: 0 0 200px;
	min-width: 200px;
	padding-right: 10px;
}

.entrylisttitle {
	flex: 1;
	overflow: auto;
	font-weight: 600;
}

@media (max-width: 600px) {
	.entrylistcontainer {
	flex-direction: column;
	}

	.entrylistdate {
	flex-basis: auto;
	min-width: auto;
	padding-right: 0;
	}

	.entrylisttitle {
	white-space: normal;
	}
}

.listseeall {
	text-align: center;
	font-weight: 600;
}


/* Single posts and notes styling */

.postmeta {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: flex-start;
}

.postmeta p {
	font-size: 0.8em;
}

#notecontainer {
	background-color: var(--containerbg);
	padding: 1em 1em;
	margin-top: 3em;
	filter: drop-shadow(4px 4px 0 var(--imgdropshadow));
	transform: translateZ(0); /* Safari drop-shadow weirdness */
}

.notemetadate {
	margin-top: 0;
}

/* Code inline and block */

code {
	word-wrap: break-word;
	word-break: keep-all;
	background-color: var(--contrast);
	color: var(--text-contrast);
	filter: drop-shadow(4px 4px 0 var(--imgdropshadow));
	transform: translateZ(0); /* Safari drop-shadow weirdness */
	overflow-x: auto;
}

p code {
	padding: 0.1em 0.4em;
	margin: 0 0.4em;
}

pre code {
    display: block;
    padding: 1em;
}
</style>
</head>

<body>
<div id="container">

<header>
    <div id="logonsiteamecontainer">
        <a href="https://lars-christian.com/" style="display:block" title="Home" rel="home"><div id="logo"></div></a>
        <div id="sitename"><a href="https://lars-christian.com/" title="Home" rel="home">Lars-Christian.com</a></div>
    </div>
    <div id="headernav">
        <nav>
            <ul>
                <li>
                    <a href="/about">About</a>
                </li>
                <li>
                    <a href="/now">Now</a>
                </li>
                <li>
                    <a href="/writing">Writing</a>
                </li>
            </ul>
        </nav>
    </div>
</header><main>
	<h1>Hello</h1>

	<div><img src="lcs-dithered.png" id="profilephoto" alt="A picture of Lars-Christian Simonsen captured by his two year old daughter who told him to smile — he did his best to oblige."></div>
	<p>My name is Lars-Christian Simonsen.</p>
	<p>I am a thirtysomething man from Oslo, Norway. I use <a href="https://lars-christian.com">Lars-Christian.com</a> to write about things.</p>

	<hr>

	<p>I publish two types of content. <a href="/posts">Posts</a> are longer, <a href="/notes">notes</a> are short posts and links to cool things from around the web.</p>

	<h2>Posts</h2>
	  <div class="entrylistcontainer"><div class="entrylistdate">25 November 2024</div><div class="entrylisttitle"><a href="/posts/2024-11-25-commitment">Commitment</a></div></div>
  <div class="entrylistcontainer"><div class="entrylistdate">24 November 2024</div><div class="entrylisttitle"><a href="/posts/2024-11-24-moving-this-blog-to-a-new-host">Moving this blog to a new host</a></div></div>
  <div class="entrylistcontainer"><div class="entrylistdate">13 November 2024</div><div class="entrylisttitle"><a href="/posts/2024-11-13-from-wordpress-to-windrunner-ssg-making-my-own-static-site-generator">From Wordpress to Windrunner SSG: Making my own static site generator</a></div></div>
  <div class="entrylistcontainer"><div class="entrylistdate">12 October 2024</div><div class="entrylisttitle"><a href="/posts/2024-10-12-a-decision-is-made">A decision is made</a></div></div>
  <div class="entrylistcontainer"><div class="entrylistdate">20 August 2024</div><div class="entrylisttitle"><a href="/posts/2024-08-20-my-inspiration">My inspiration</a></div></div>

	<p class="listseeall"><a href="/posts/">All posts</a></p>

	<h2>Notes</h2>
	  <div class="entrylistcontainer"><div class="entrylistdate">25 November 2024</div><div class="entrylisttitle"><a href="/notes/2024-11-25-poe-right">Poe right</a></div></div>
  <div class="entrylistcontainer"><div class="entrylistdate">24 November 2024</div><div class="entrylisttitle"><a href="/notes/2024-11-24-physical-notebooks">Physical notebooks</a></div></div>
  <div class="entrylistcontainer"><div class="entrylistdate">23 November 2024</div><div class="entrylisttitle"><a href="/notes/2024-11-23-matts-thoughts-on-meaning-and-writing">Matt's thoughts on meaning and writing</a></div></div>
  <div class="entrylistcontainer"><div class="entrylistdate">23 November 2024</div><div class="entrylisttitle"><a href="/notes/2024-11-23-a-little-peace-and-quiet">A little peace and quiet</a></div></div>
  <div class="entrylistcontainer"><div class="entrylistdate">23 November 2024</div><div class="entrylisttitle"><a href="/notes/2024-11-23-filling-out-the-archives">Filling out the archives</a></div></div>

	<p class="listseeall"><a href="/notes/">All notes</a></p>

</main><footer>
    <blockquote class="popquote">“Life before death, strength before weakness, journey before destination.”</blockquote>
    <div id="footernav">
        <div>
            <p class="bold">Pages</p>
            <ul>
                <li><a href="/about">About</a></li>
                <li><a href="/now">Now</a></li>
                <li>
                    <a href="/writing">Writing</a>
                    <ul>
                        <li><a href="/posts">Posts</a></li>
                        <li><a href="/notes">Notes</a></li>
                    </ul>
                </li>
                <li><a href="/subscribe">Subscribe</a></li>
                <li><a href="/privacy">Privacy</a></li>
            </ul>
        </div>
        <div>
            <p class="bold">Connect</p>
            <ul>
                <li><a href="mailto:[email protected]" rel="me">Email</a></li>
                <li><a href="https://mastodon.social/@lars" rel="me">Mastodon</a></li>
            </ul>
        </div>
        <div>
            <p class="bold">Surf</p>
            <ul>
                <li><a href="https://blogroll.org/">Blogroll.org</a></li>
                <li><a href="https://ooh.directory/">ooh.directory</a></li>
                <li><a href="https://personalsit.es/">Personalsit.es</a></li>
            </ul>
            <p class="center"><a href="https://xn--sr8hvo.ws/previous">←</a> <a href="https://xn--sr8hvo.ws/">🕸💍</a> <a href="https://xn--sr8hvo.ws/next">→</a></p>
        </div>
    </div>
</footer>
</div>

</body></html>