<html lang="en-US">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
        <title>Submission Dicoding!</title>
        <link rel="stylesheet" href="style.css">
    </head>
    <body>
        <main>
            <header class="header">
                <h1 class="logo"><a href="/">Alicia Ramadhani</a></h1>
                <ul class="main-nav">
                    <li>
                        <a href="/">Home</a>
                    </li>
                    <li>
                        <a href="contact.html">Contact</a>
                    </li>
                </ul>
            </header>

            <div class="flex-container wrapper">
                <section class="content">
                    CONTENT
                    <p>
                        Ini adalah contoh content pertama saya
                    </p>

                    <div class="gallery">
                        <div class="poto-list">
                            <img src="1.jpg" class="poto-item">
                        </div>
                        <div class="poto-list">
                            <img src="1.jpg" class="poto-item">
                        </div>
                        <div class="poto-list">
                            <img src="1.jpg" class="poto-item">
                        </div>
                        <div class="poto-list">
                            <img src="1.jpg" class="poto-item">
                        </div>
                    </div>

                </section>

                <aside class="sidebar">
                    <img src="1.jpg" alt="profile" class="center" id="image_click">
                    <p>
                        Nama Saya : Alicia Ramadhani
                        Umur Saya : 22 Tahun
                    </p>
                </aside>
            </div>

            <footer class="footer">
                <p>
                    Copyright © 2020 - Alicia Ramadhani
                </p>
            </footer>
        </main>
        <script>
            let element = document.getElementById("image_click")
            element.addEventListener('click', function(event){
                console.log('image_click',event)
                //element.classList.add("image-rounded");
                element.classList.toggle("image-rounded")
            })
        </script>
    </body>
</html>