starry99 · lihyel · Jul 26, 2021 · Jul 26, 2021 · Jul 26, 2021 · Jul 26, 2021
diff --git a/404.html b/404.html
@@ -9,7 +9,7 @@
   <section class="fourzerofour">
       <p>
         <img src="{{ '/assets/img/cat_404.jpg' | relative_url }}" width="300px"><br>
-        404 page not found <br>
+        아직 준비중인 페이지입니다. 다음에 다시 방문해주세요 :) <br>
         Go <a href="{{ '/' | relative_url }}">home</a> :)
       </p>
   </section>

diff --git a/_config.yml b/_config.yml
@@ -1,13 +1,13 @@
 
-title: Catbook #Your awesome title
-email: #youremail@domain.com
+title: LI_HYEL's Blog #Your awesome title
+email: 0907leeharry@gmail.com #youremail@domain.com
 description: > # this means to ignore newlines until "baseurl"
   Write an awesome description for your new site here. You can edit this
   line in _config.yml. It will appear in your document head meta (for
   Google search results) and in your feed.xml site description.
 
 baseurl: # the subpath of the site
-url: http://starry99.github.io/catbook # the base hostname & protocol for your site
+url: https://lihyel.github.io # the base hostname & protocol for your site http://starry99.github.io/catbook
 
 permalink: /:year-:month/:title
 timezone:
@@ -20,10 +20,10 @@ cusdis:
     app_id: #your cusdis app_id
 
 user:
-  name: Catbook
-  pic: /assets/img/cat.jpg
+  name: LI_HYEL
+  pic: /assets/img/92.jpg
   picAlt: "catbook"
-  job: a category-centric theme
+  job: 개발세발 코린이의 개발일지
   aboutme: true # comment this out if you don't need the 'about' page.
 
 exclude:

diff --git a/_posts/2017-11-01-s2.md b/_posts/2017-11-01-s2.md
diff --git a/_posts/2018-07-04-t1.md b/_posts/2018-07-04-t1.md
diff --git a/_posts/2021-07-26-NewYearCount.md b/_posts/2021-07-26-NewYearCount.md
@@ -0,0 +1,165 @@
+---
+title: New Years Counter
+categories: [dev]
+comments: true
+---
+
+
+### 2학년 1학기 '웹클라이언트컴퓨팅'수업 (이지영prof)
+
+
+
+## PROJECT: 
+### 새해 카운트다운 프로그램
+
+
+
+◎기능
+- 배경에 눈이 내리는 효과
+- 새해가 얼마나 남았는지 카운트다운 해주는 프로그램
+
+◎응용 가능성
+- 눈 내리는 양, 속도를 조절하여 다른 분위기 연출
+- 사용 목적에 맞게 시간과 날짜를 지정하여 다양한 용도로 사용할 수 있음
+
+
+
+
+### ▽Code review▽
+
+▼HTML
+```html
+<!DOCTYPE html>
+<html>
+<head>
+    <meta charset="UTF-8">
+    <title>PROJECT NewYear</title>
+    <link rel="stylesheet" href="./style.css">
+</head>
+<body>
+
+    <h1> New Year is coming! :) </h1>
+
+    <div class = "countdown-container">
+        <div class="time">
+            <h1 id="days">00</h1>
+            <small>days</small>
+        </div>
+        <div class="time">
+            <h1 id="hours">00</h1>
+            <small>hours</small>
+        </div>
+        <div class="time">
+            <h1 id="minutes">00</h1>
+            <small>minutes</small>
+        </div>
+        <div class="time">
+            <h1 id="seconds">00</h1>
+            <small>seconds</small>
+        </div>
+    </div>
+
+    <script src="./script.js"></script>
+
+</body>
+</html>
+```
+
+▼JAVA SCRIPT
+```js
+const body = document.body;
+const endTime = new Date('December 31 2021 23:59:59');
+const daysEl = document.getElementById('days');
+const hoursEl = document.getElementById('hours');
+const minutesEl = document.getElementById('minutes');
+const secondsEl = document.getElementById('seconds'); 
+
+setInterval(updateCountdown, 1000)
+setInterval(createSnowFlake, 100); 
+
+function updateCountdown() {
+    const startTime = new Date();
+    const diff = endTime - startTime;
+    const days = Math.floor(diff / 1000 / 60 / 60 / 24);
+    const hours = Math.floor(diff / 1000 / 60 / 60) % 24;
+    const minutes = Math.floor(diff / 1000 / 60) % 60;
+    const seconds = Math.floor(diff / 1000) % 60;
+    daysEl.innerHTML = days;
+    hoursEl.innerHTML = hours < 10 ? '0'+hours : hours;
+    minutesEl.innerHTML = minutes < 10 ? '0'+minutes : minutes;
+    secondsEl.innerHTML = seconds < 10 ? '0'+seconds : seconds;
+}
+
+function createSnowFlake() {
+    const snow_flake = document.createElement('i');
+    snow_flake.classList.add('fas');
+    snow_flake.classList.add('fa-snowflake');
+    snow_flake.style.left = Math.random() * window.innerWidth + 'px';
+    snow_flake.style.animationDuration = Math.random() * 3 + 2 + 's';
+    snow_flake.style.opacity = Math.random();
+    snow_flake.style.fontSize = Math.random() * 10 + 10 + 'px';
+
+    document.body.appendChild(snow_flake);
+
+    setTimeout(() => {
+        snow_flake.remove();
+    }, 5000); 
+}
+```
+
+▼CSS
+```css
+@import url('https://fonts.googleapis.com/css?family=Muli&display=swap');
+@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.10.2/css/all.min.css');
+
+* {
+    box-sizing: border-box;
+}
+
+body {
+    background-color: #323975;
+    color: #fff;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    font-family: 'Muli', sans-serif;
+    height:100vh;
+    overflow: hidden;
+    margin: 0;
+    text-align: center;
+}
+
+.fa-snowflake {
+    color: #fff;
+    position: absolute;
+    top: -20px;
+    animation: fall linear forwards; 
+}
+
+@keyframes fall {
+    to {
+        transform: translateY(105vh); 
+    }
+}
+
+.countdown-container {
+    display: flex;
+}
+
+.time {
+    display: flex;
+    font-size: 1.2em;
+    flex-direction: column;
+    margin: 0 15px;
+}
+
+.time h1 {
+    margin-bottom: 0;
+}
+
+.time small{
+    color: #ccc; 
+}
+```
+
diff --git a/aboutme.html b/aboutme.html
@@ -5,7 +5,7 @@
 <section class="aboutme">
     <div class="post_content">
         <p>
-            If you don't need 'about' page, edit the _config.yml to comment out the code.
+            소프트웨어학과 공대생의 개발일지 블로그
             <br><br>
             <img src="https://starry99.github.io/catbook/assets/img/cat1.jpg">
         </p>

diff --git a/assets/img/46.jpg b/assets/img/46.jpg
diff --git a/assets/img/51.jpg b/assets/img/51.jpg
diff --git a/assets/img/92.jpg b/assets/img/92.jpg
diff --git a/categories/dev.html b/categories/dev.html
@@ -3,4 +3,4 @@
 type: dev
 ---
 
-{% include archive.html %}
+{% include archive.html %}
diff --git a/categories/diary.html b/categories/diary.html
@@ -0,0 +1,6 @@
+---
+layout: page
+type: diary
+---
+
+{% include archive.html %}
diff --git a/categories/travel.html b/categories/travel.html
diff --git a/categories/writing.html b/categories/writing.html
@@ -3,4 +3,4 @@
 type: writing
 ---
 
-{% include archive.html %}
+{% include archive.html %}