markusprap.github.io/index.html at master · markusprap/markusprap.github.io · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
<!DOCTYPE html>
<html lang="id">
  <head>
    <meta name="generator" content="Hugo 0.50" />
    <meta charset="utf-8">
    <meta content="width=device-width, initial-scale=1.0" name="viewport">
    <title> Markus Prap Kurniawan | markusprap </title>

    <!--File CSS-->
    <link rel="stylesheet" href="style.css">

    <!--Font CSS-->
    <link href="https://fonts.googleapis.com/css?family=Oxygen&display=swap" rel="stylesheet">

    <!--Link Bootstrap-->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
    <script src="https://use.fontawesome.com/releases/v5.0.8/js/all.js"></script>
    <script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
    <script type="text/javascript" src="main.js"></script>
  </head>
  <body>
    <header>
      <nav> <a href="#"> /markusprap </a> </nav>
      <div id="theme">
        <div onclick="setDarkMode(true)" id="darkBtn" class=""> 🌚 Dark </div>
        <div onclick="setDarkMode(false)" id="lightBtn" class="is-hidden"> 🌝 Light </div>
      </div>

      <script>

        if(localStorage.getItem('preferredTheme') == 'dark') {
          setDarkMode(true)
        }
        function setDarkMode(isDark) {
          var darkBtn = document.getElementById('darkBtn')
          var lightBtn = document.getElementById('lightBtn')

          if (isDark) {
            lightBtn.style.display = "block"
            darkBtn.style.display = "none"
            localStorage.setItem('preferredTheme', 'dark');
          } else {
            lightBtn.style.display = "none"
            darkBtn.style.display = "block"
            localStorage.removeItem('preferredTheme');
          }
          document.body.classList.toggle("darkmode");
        }
      </script>
    </header>

    <main>
      <div class="landing">
        <div class="">
          <h1> Halo, Saya Markus Prap Kurniawan </h1>

          <h2> Disini saya menuangkan segala ide dan cerita saya baik yang telah sukses maupun gagal. Kalian bisa baca blog dan dengerin podcast saya. Semoga bermanfaat dan menginspirasi :) </h2>

        </div>
        <img src="fotoku.jpeg" alt="Markus Prap Kurniawan" width="100" height="100" class="is-avatar">
      </div>
      <hr>
      <div class="colums">
        <div class="blog">
          <h3> Blog </h3>
          <ul>
            <li>
              <a href="../Sebuah Perjumpaan/index.html">Sebuah Perjumpaan</a>
              <span style="color: grey;"> - 6 Mei 2019 </span>
            </li>
            <li>
              <a href="#">About Me</a>
              <span style="color: grey;"> - 24 Juli 2019 </span>
            </li>
          </ul>
        </div>

        <div class="recommend">
          <h3>Rekomendasi buat kamu</h3>
          <ul>
            <li>
              <a href="">Eksperimen</a>
            </li>
            <li>
                <a href="">Design</a>
              </li>
              <li>
                  <a href="">Buku</a>
                </li>
          </ul>
        </div>
      </div>

      <br><hr>
      <div class="podcast">
        <h3>Dengerin Podcast disini</h3>
        <ul>
          <li>
            <a href="">Podcast</a>
            <span style="color: grey;"> - 6 Mei 2019 </span>
          </li>
          <li>
            <a href="">Podcast</a>
            <span style="color: grey;"> - 6 Mei 2019 </span>
          </li>
          <li>
            <a href="">Podcast</a>
            <span style="color: grey;"> - 6 Mei 2019 </span>
          </li>
          <li>
            <a href="">Podcast</a>
            <span style="color: grey;"> - 6 Mei 2019 </span>
          </li>

        </ul>
      </div>
    </main>

    <footer>
      <h4>Mau kenalan dengan saya</h4>
      <div class="col-12 social padding">
        <a href="#"><i class="fab fa-facebook"></i></a>
        <a href="#"><i class="fab fa-twitter"></i></a>
        <a href="#"><i class="fab fa-google-plus-g"></i></a>
        <a href="#"><i class="fab fa-instagram"></i></a>
      </div>
      <p>Made with &#10084; in Jombang</p>

    </footer>
  </body>
</html>