redesign

Author: ContentsViewer

Client/ContentsViewer/ContentsViewerStandard.css

@@ -14,87 +14,18 @@ body {
   margin: 0;
 }
 
-.new-box {
-  border: 2px solid #f3cbd0;
-  border-radius: 5px;
-  margin: 40px 5px 5px 5px;
-  padding: 20px 20px 10px 20px;
-  position: relative;
-}
-
-.new-box:before {
-  background-color: #ef858c;
-  border-radius: 5px;
-  color: #fff;
-  content: "New!!";
-  padding: 5px 20px;
-  position: absolute;
-  left: -10px;
-  top: -20px;
-}
-
-.new-box:after {
-  border-top: 12px solid #ef858c;
-  border-right: 12px solid transparent;
-  border-left: 12px solid transparent;
-  content: "";
-  position: absolute;
-  top: 10px;
-  left: 15px;
+.recent-list>div {
+  border-left: 4px solid #fb6d76c7;
+  padding: 0 0 0 12px;
 }
-
-ol.new-list {
-  counter-reset: list;
+.recent-list ul{
   list-style-type: none;
-  /* font-size: 14px; */
-  font: 14px/1.6 "arial narrow", sans-serif;
-  padding: 0;
-  margin: 0;
+  font-size: 0.875em;
 }
-
-ol.new-list li {
-  position: relative;
-  padding: 7px 0 7px 20px;
+.recent-list ul li{
+  line-height: 1.23;
   margin: 0;
-  font-weight: bold;
-  font-size: 14px;
-  border-bottom: dashed 1px #f6a38b;
-}
-
-ol.new-list li:before {
-  counter-increment: list;
-  content: "";
-  display: block;
-  position: absolute;
-  left: 0px;
-  height: 15px;
-  width: 15px;
-  border-radius: 50%;
-  background: #f6a38b;
-  top: 50%;
-  -moz-transform: translateY(-50%);
-  -webkit-transform: translateY(-50%);
-  -o-transform: translateY(-50%);
-  -ms-transform: translateY(-50%);
-  transform: translateY(-50%);
-}
-
-ol.new-list li:after {
-  content: "";
-  display: block;
-  position: absolute;
-  left: 6px;
-  height: 0;
-  width: 0;
-  border-top: 4px solid transparent;
-  border-bottom: 4px solid transparent;
-  border-left: 5px solid #fff;
-  top: 50%;
-  -moz-transform: translateY(-50%);
-  -webkit-transform: translateY(-50%);
-  -o-transform: translateY(-50%);
-  -ms-transform: translateY(-50%);
-  transform: translateY(-50%);
+  padding: 4px 0;
 }
 
 ul.tag-list {
@@ -1983,17 +1914,6 @@ a.directory .name, a.file .name{
   ul.tagline li a::after {
     background-color: white !important;
   }
-  .new-box:before {
-    background-color: white;
-    border-radius: 5px;
-    border: 2px solid #ef858c;
-    color: #000;
-    content: "New!!";
-    padding: 5px 20px;
-    position: absolute;
-    left: -10px;
-    top: -20px;
-  }
   ul.tag-list li span {
     background-color: white;
     color: #606060;
@@ -2166,21 +2086,6 @@ a.directory .name, a.file .name{
     background-color: rgba(255, 255, 255, 0.1);
     color: var(--main-font-color);
   }
-  [theme="dark"] .new-box {
-    border: 2px solid #f3cbd087;
-  }
-  [theme="dark"] .new-box:before {
-    background-color: #bb6c71;
-  }
-  [theme="dark"] .new-box:after {
-    border-top: 12px solid #bb6c71;
-  }
-  [theme="dark"] ol.new-list li:before {
-    background-color: #f6a38bc9;
-  }
-  [theme="dark"] ol.new-list li {
-    border-bottom: dashed 1px #f6a38bc9;
-  }
   [theme="dark"] ul.tag-list li a {
     color: var(--main-font-color);
   }

Frontend/viewer.php

@@ -188,7 +188,7 @@
         <div id="content-summary" class="summary">
           <?=$vars['contentSummary']?>
           <?php if (isset($vars['latestContents'])): ?>
-          <?=CreateNewBox($vars['latestContents'])?>
+          <?=CreateRecentList($vars['latestContents'])?>
           <?php endif;?>
           <?php if (isset($vars['tagList'])): ?>
           <h3><?=Localization\Localize('tagmap', 'TagMap')?></h3>

Locales/ja/translations.core.json

@@ -42,6 +42,7 @@
     "invalidParameter": "無効なパラメータです.",
     "authenticationFailed": "認証に失敗しました.",
     "temporarilyUnavailable": "一時的に利用できません",
+    "recentChanges": "最近の更新",
     "retrievedFrom": "「{0}」から取得",
     "sorryLongTimeToGeneratePageAndReport": 
         "申し訳ございません m(. _ . )m<br> ページの生成に時間がかかったようです.<br>品質向上のためこの問題は管理者に報告されます."

Module/ContentTextParser.php

@@ -77,7 +77,7 @@ public static function ParseContentLink($matches, $context) {
         $title = '';
         $parent = $content->Parent();
         if($parent !== false) {
-            $title .= NotBlankText([$parent->title, basename($parent->path)]) . '-';
+            $title .= NotBlankText([$parent->title, basename($parent->path)]) . '/';
         }
         $title .= NotBlankText([$content->title, basename($content->path)]);
         $href = CreateContentHREF($content->path);

Module/ContentsViewerUtils.php

@@ -76,22 +76,45 @@ function CreateFileHREF($filePath){
  * @param array $latestContents
  *  array of Content
  */
-function CreateNewBox($latestContents) {
-    $newBoxElement = "<div class='new-box'><ol class='new-list'>";
+function CreateRecentList($latestContents) {
+    $html = '<div class="recent-list">';
+    $html .= '<h3>' . Localization\Localize('recentChanges', 'Recent Changes') . '</h3>';
 
     $displayCount = count($latestContents);
     if($displayCount > 16) $displayCount = 16;
 
-    for($i = 0; $i < $displayCount; $i++){
+    /**
+     * [
+     *  '2020-06-08' => [Content, Content, ...],
+     *  ...
+     * ]
+     */
+    $dateGroup = [];
+    for($i = 0; $i < $displayCount; $i++) {
         $content = $latestContents[$i];
-        $parent = $content->Parent();
-        $title = "[" . date("Y-m-d", $content->modifiedTime) . "] " . NotBlankText([$content->title, basename($content->path)]) .
-                    ($parent === false ? '' : ' | ' . NotBlankText([$parent->title, basename($parent->path)]));
-        $newBoxElement .= "<li><a href='" . CreateContentHREF($content->path) . "'>" . $title . "</a></li>";
+        $date = date("Y-m-d", $content->modifiedTime);
+        if(!array_key_exists($date, $dateGroup)) {
+            $dateGroup[$date] = [];
+        }
+        $dateGroup[$date][] = $content;
     }
-
-    $newBoxElement .= "</ol></div>";
-    return $newBoxElement;
+    $html .= '<div>';
+    foreach($dateGroup as $date => $group) {
+        $html .= '<h4>' . $date . '</h4>';
+        $html .= '<ul>';
+        foreach($group as $content) {
+            $title = '';
+            $parent = $content->Parent();
+            if($parent !== false) {
+                $title .= NotBlankText([$parent->title, basename($parent->path)]) . '/';
+            }
+            $title .= NotBlankText([$content->title, basename($content->path)]);
+            $html .= '<li><a href="' . CreateContentHREF($content->path) . '">' . $title . '</a></li>';
+        }
+        $html .= '</ul>';
+    }
+    $html .= '</div></div>';
+    return $html;
 }
 
 function CreateTagListElement($tag2path, $rootDirectory, $layerName, $parentTagPathParts = []) {