CSS to Sass

README.md

@@ -1,12 +1,12 @@
 # [ivaaan.neocities.org](https://ivaaan.neocities.org)
 
-My personal website and blog :3
+My personal website and blog, built with Hugo :3
 
 Everything is in Spanish btw
 
 ## Credits
 
-* Theme template: [`hugo starter theme`](https://github.com/ericmurphyxyz/hugo-starter-theme)
+* Theme template: [`hugo-starter-theme`](https://github.com/ericmurphyxyz/hugo-starter-theme)
 
 * Github deployer to Neocities: [`deploy-to-neocities`](https://github.com/marketplace/actions/deploy-to-neocities)
 

content/_index.md

@@ -1,3 +1,3 @@
-Holaaa~, soy Iván (<span class="sitelen-inline">soko [soko ilo jasima esun nasa ilo]</span>), una persona ---tal vez--- que forma parte de la enorme ilusión del cosmos. Actualmente estudio informática en Cataluña.
+Holaaa~, soy Iván, una persona ---tal vez--- que forma parte de la enorme ilusión del cosmos. Actualmente estudio informática en Cataluña.
 
-Me gusta la programación, la geopolítica, la lingüística, la narrativa, el diseño de juegos y la pasta. Mi idioma favorito es el toki pona <span class="sitelen-inline">toki+pona</span>, seguido por el esperanto y el finés ---aunque este último me está costando. A propósito, has perdido [El Juego](https://es.wikipedia.org/wiki/El_Juego_(juego_mental)).
+Me gusta la programación, la geopolítica, la lingüística, la narrativa, el diseño de juegos y la pasta. Mi idioma favorito es el toki pona, seguido por el esperanto y el finés ---aunque este último me está costando. A propósito, has perdido [El Juego](https://es.wikipedia.org/wiki/El_Juego_(juego_mental)).

static/css/style.sass

@@ -0,0 +1,111 @@
+$bg: #1d2021
+$fg: #ebdbb2
+$black: #665c54
+$brblack: #7c6f64
+$red: #cc241d
+$brred: #b8bb26
+$green: #98971a
+$brgreen: #b8bb26
+$yellow: #d79921
+$bryellow: #fabd2f
+$blue: #458588
+$brblue: #83a598
+$purple: #b16286
+$brpurple: #d3869b
+$aqua: #689d6a
+$braqua: #8ec07c
+$white: #a89984
+$brwhite: #bdae93
+
+body
+  font-family: serif
+  text-align: justify
+  color: $fg
+  background-color: $bg
+  line-height: 1.5
+  padding: 1rem
+  margin: 0 auto
+  margin-bottom: 2rem
+  max-width: 45rem
+
+a
+  color: $brblue
+  text-decoration: none
+
+  &:hover
+    text-decoration: underline
+
+h1, h2
+  color: $yellow
+  text-align: left
+
+h3, h4, h5, h6
+  color: $brred
+  text-align: left
+
+i, em
+  color: $white
+
+ol
+  list-style-type: none
+  padding-left: 0
+  text-align: left
+
+// TABLES
+table
+  width: 100%
+  border-collapse: collapse
+  margin-bottom: 16px
+
+  th, td
+    border: 1px solid $white
+    padding: 6px 13px
+
+  th
+    background-color: #282828
+    text-align: left
+    font-weight: 600
+
+// DATE
+.date
+  font-style: italic
+  color: $white
+  margin-top: -20px
+  margin-bottom: 30px
+  font-size: 90%
+
+// HEADING
+.heading
+  display: flex
+  align-items: center
+  justify-content: space-between
+  margin-bottom: 50px
+
+  .avatar
+    margin-right: 20px
+    width: 60px
+    height: 60px
+    border-radius: 50%
+
+  .links
+    display: flex
+
+    .icon
+      margin-left: 20px
+      width: 30px
+      height: 30px
+
+// FOOTER
+.footer
+  color: $black
+  text-align: center
+  font-size: 80%
+  padding-top: 2rem
+
+// toki pona
+@font-face
+  font-family: 'nasin nanpa'
+  src: url('../fonts/nasin-nanpa.otf')
+
+.sitelen
+  font-size: 140%