Merge branch 'master' of https://github.com/visuddhinanda/mint

app/collect/index.js

@@ -1,59 +1,61 @@
 function collect_load(begin = 0) {
-	$.get(
-		"list.php",
-		{
-			begin: begin,
-		},
-		function (data, status) {
-			let arrCollectList = JSON.parse(data);
-			let html = "";
-			for (const iterator of arrCollectList.data) {
-				html += "<div style='width:25%;padding:0.5em;'>";
-				html += '<div style="position: relative;">';
-				html +=
-					"<div class='' style='position: absolute;background-color: darkred;color: white;padding: 0 6px;right: 0;'>" +
-					gLocal.gui.ongoing +
-					"</div>";
-				html += "</div>";
-				html += "<div class='card' style='padding:10px;'>";
-				html += "<div class='card_info'>"; //卡片信息开始
-				html += "<div style='font-weight:700'>";
-				html += "<a href='../article/?collect=" + iterator.id + "'>" + iterator.title + "</a>";
-				html += "</div>";
+    $.get(
+        "list.php", {
+            begin: begin,
+        },
+        function(data, status) {
+            let arrCollectList = JSON.parse(data);
+            let html = "";
+            for (const iterator of arrCollectList.data) {
 
-				if (iterator.subtitle && iterator.subtitle != "null") {
-					html += "<div style=''>" + iterator.subtitle + "</div>";
-				}
+                html += "<div class='card collect_card'>";
+                html +=
+                    "<div class='card_state'>" +
+                    gLocal.gui.ongoing +
+                    "</div>";
+                html += "<div class='card_info'>"; //卡片信息开始
+                html += "<div class='collect_title'>";
+                html += "<a href='../article/?collect=" + iterator.id + "'>" + iterator.title + "</a>";
+                html += "</div>";
 
-				html += "<div style=''>" + iterator.username.nickname + "</div>";
-				if (iterator.summary && iterator.summary != "null") {
-					html += "<div style=''>" + iterator.summary + "</div>";
-				}
+                if (iterator.subtitle && iterator.subtitle != "null") {
+                    html += "<div class='subtitle'>" + iterator.subtitle + "</div>";
+                }
+                if (iterator.summary && iterator.summary != "null") {
+                    html += "<div class='summary'>" + iterator.summary + "</div>";
+                }
+                if (iterator.tag) {
+                    html += "<div style='overflow-wrap: anywhere;'>" + iterator.tag + "</div>";
+                }
+                html += "<div style='margin-top:10px'>" + iterator.username.nickname + "</div>";
 
-				if (iterator.tag) {
-					html += "<div style='overflow-wrap: anywhere;'>" + iterator.tag + "</div>";
-				}
-				html += "</div>"; //卡片信息关闭
-				const article_limit = 4;
-				let article_count = 0;
-				let article_list = JSON.parse(iterator.article_list);
-				//章节预览链接
-				html += "<div class='article_title_link' >";
-				for (const article of article_list) {
-					html += "<div style='white-space:nowrap;'>";
-					html +=
-						"<a href='../article/?id=" + article.article + "' target='_blank'>" + article.title + "</a>";
-					html += "</div>";
-					article_count++;
-					if (article_count > article_limit) {
-						break;
-					}
-				}
-				html += "</div>"; //章节预览链接结束
-				html += "</div>"; //card内容 结束
-				html += "</div>"; //卡片外框结束
-			}
-			$("#book_list").html(html);
-		}
-	);
-}
+                html += "</div>"; //卡片信息关闭
+                const article_limit = 4;
+                let article_count = 0;
+                let article_list = JSON.parse(iterator.article_list);
+                //章节预览链接
+                html += "<div class='article_title_link' >";
+
+                //!!!!!!請加上不同語言！！！！！
+                html += "<div style='font-weight:700;'>目錄</div>";
+
+                //章節列表
+                html += "<div>";
+                for (const article of article_list) {
+                    html += "<div style='border-top: #707070 1px solid; text-overflow: ellipsis; line-height:2.2em;'>";
+                    html +=
+                        "<a style='color:var(--main_color);font-weight:700;' href='../article/?id=" + article.article + "' target='_blank'>" + article.title + "</a>";
+                    html += "</div>";
+                    article_count++;
+                    if (article_count > article_limit) {
+                        break;
+                    }
+                }
+                html += "</div>"; //章節列表結束
+                html += "</div>"; //章节预览链接结束
+                html += "</div>"; //card内容 结束
+            }
+            $("#book_list").html(html);
+        }
+    );
+}

app/collect/index.php

@@ -1,71 +1,164 @@
 <?PHP
 include "../pcdl/html_head.php";
 ?>
+
 <body>
 
-<?php
+    <?php
     require_once("../pcdl/head_bar.php");
-?>
-	<script language="javascript" src="../collect/index.js"></script>
-
-<style>
-    #main_tag span{
-        margin: 2px;
-        padding: 2px 12px;
-        font-weight: 500;
-        transition-duration: 0.2s;
-        cursor: pointer;
-        display: inline-flex;
-        align-items: center;
-        flex-wrap: nowrap;
-        justify-content: center;
-        font-size:110%;
-        border: unset;
-        border-radius: 0;
-        border-bottom: 2px solid var(--nocolor);
-    }
-    #main_tag span:hover{
-        background-color:unset;
-        color:unset;
-        border-color: var(--link-hover-color);
-    }
-    #main_tag .select{
-        border-bottom: 2px solid var(--link-color);
-    }
-    tag{
-    background-color: var(--btn-color);
-    margin: 0 0.5em;
-    padding: 3px 5px;
-    border-radius: 6px;
-    display:inline-flex;
-    border: 1.5px solid;
-    border-color: #70707036;
-    }
-    tag .icon:hover{
-        background-color: silver;
-    }
-    #footer_nav{
-        display:none;
-    }
-    .index_inner{
-        display: flex;
-        flex-wrap: wrap;
-    }
-    .index_inner .icon_btn .icon{
-        fill: var(--btn-hover-bg-color);
-    }
-    .index_inner .icon_btn:hover .icon{
-        fill: var(--btn-bg-color);
-    }
-    .article_title_link{
-        white-space:nowrap;
-        overflow-x: scroll;
-    }
-    .card{
-        height: 20vh;
-        overflow-y: scroll;
-    }
-</style>
+    ?>
+    <script language="javascript" src="../collect/index.js"></script>
+
+    <style>
+        h1 {
+            font-size: 42px;
+            font-weight: 700;
+            margin: 0.3em 0;
+        }
+
+        h2 {
+            font-size: 18px;
+            font-weight: 700;
+            margin: 0;
+        }
+
+
+        .disable {
+            opacity: 0.4;
+            cursor: not-allowed;
+        }
+
+        #main_tag span {
+            margin: 2px;
+            padding: 2px 12px;
+            font-weight: 500;
+            transition-duration: 0.2s;
+            cursor: pointer;
+            display: inline-flex;
+            align-items: center;
+            flex-wrap: nowrap;
+            justify-content: center;
+            font-size: 110%;
+            border: unset;
+            border-radius: 0;
+            border-bottom: 2px solid var(--nocolor);
+        }
+
+        #main_tag span:hover {
+            background-color: unset;
+            color: unset;
+            border-color: var(--link-hover-color);
+        }
+
+        #main_tag .select {
+            border-bottom: 2px solid var(--link-color);
+        }
+
+        tag {
+            background-color: var(--btn-color);
+            margin: 0 0.5em;
+            padding: 3px 5px;
+            border-radius: 6px;
+            display: inline-flex;
+            border: 1.5px solid;
+            border-color: #70707036;
+        }
+
+        tag .icon:hover {
+            background-color: silver;
+        }
+
+        #footer_nav {
+            display: none;
+        }
+
+        .index_inner .icon_btn .icon {
+            fill: var(--btn-hover-bg-color);
+        }
+
+        .index_inner .icon_btn:hover .icon {
+            fill: var(--btn-bg-color);
+        }
+
+        .article_title_link {
+            margin-top: 18px;
+            display: grid;
+            grid-template-columns: 80px auto;
+        }
+
+        .collect_card {
+            display: block;
+            padding: 1rem 1.5rem;
+            box-shadow: 0 3px 6px rgb(0 0 0 / 16%);
+        }
+
+        .collect_title {
+            font-size: 20px;
+            font-weight: 700;
+
+        }
+
+        .subtitle {
+            color: gray;
+            text-overflow: ellipsis;
+            margin-bottom: 10px;
+        }
+
+        .summary {
+            display: -webkit-box;
+            -webkit-box-orient: vertical;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            width: 100%;
+            -webkit-line-clamp: 2;
+        }
+
+        .collect_head_bar {
+            background-color: #212121;
+            height: 280px;
+            padding: 30px;
+            color: white;
+        }
+
+        .collect_section {
+            background-color: #f5f5f5;
+        }
+
+        .section_inner {
+            max-width: 960px;
+            margin: 0 auto;
+        }
+
+        .right_content,
+        .left_content {
+            width: 100%;
+            padding: 1rem;
+        }
+
+        .search_section {
+            background-color: #3a3a3a;
+            text-align: center;
+            line-height: 3.5rem;
+            position: sticky;
+            top: 50px;
+            z-index: 80;
+        }
+
+        .tag {
+            background-color: #6374EF;
+            border-radius: 4px;
+            color: white;
+            padding: 3px 6px;
+            margin: 0 5px 5px 0;
+        }
+    </style>
+    <style media="screen and (min-width:800px)">
+        .collect_section .section_inner {
+            display: grid;
+            grid-template-columns: auto 360px;
+        }
+    </style>
+    <!--
 <style media="screen and (max-width:800px)">
 #right_pannal{
 	display:none;
@@ -100,67 +193,105 @@ include "../pcdl/html_head.php";
     width:100% !important;
 }
 
-</style>
-<?php
-//
+</style>-->
+    <?php
+    //
 
-require_once "../path.php";
-require_once "../public/_pdo.php";
-require_once '../media/function.php';
-require_once '../public/function.php';
+    require_once "../path.php";
+    require_once "../public/_pdo.php";
+    require_once '../media/function.php';
+    require_once '../public/function.php';
 
-?>
-<div id='course_head_bar' style='background-color:var(--tool-bg-color1);padding:1em 10px 10px 10px;'>
-    <div class='index_inner '>
-        <div style='font-size:140%;display:flex;'>
-            <span style="display:inline-block;width:20em;"><input type="input" placeholder=<?php echo $_local->gui->search.'：'.$_local->gui->title.'&nbsp;OR&nbsp;'.$_local->gui->author;?> style="background-color:var(--btn-bg-color);" /></span>
+    ?>
+    <div id='course_head_bar' class='collect_head_bar'>
+        <div class='section_inner'>
+            <h1>著作</h1>
+            <div style='width:30em'>各種從經典中擷取的文章，所彙集成的文，其中有多人翻譯的篇章等等的各種。</div>
+            <!--
+            <div id="main_tag">
+                <span tag="vinaya">sīla</span>
+                <span tag="sutta">samadhi</span>
+                <span tag="abhidhamma">paññā</span>
+                <span tag="mūla">vatthu</span>
+            </div>
+            <div id="tag_selected" class="" style="padding-bottom:5px;margin:0.5em 0;"></div>-->
+        </div>
+    </div>
+
+    <div class="search_section">
+        <div style='font-size:140%;'>
+            <span style="display:inline-block;width:20em;"><input type="input" placeholder=<?php echo $_local->gui->search . '：' . $_local->gui->title . '&nbsp;OR&nbsp;' . $_local->gui->author; ?> style="background-color:var(--new-tool-input-text-bg); border:solid 1px var(--new-tool-btn-border)" /></span>
             <button class="icon_btn">
                 <svg class="icon">
-					<use xlink:href="../studio/svg/icon.svg#ic_search"></use>
-				</svg>
+                    <use xlink:href="../studio/svg/icon.svg#ic_search"></use>
+                </svg>
             </button>
         </div>
-        <div id="main_tag">
-            <span tag="vinaya">sīla</span>
-            <span tag="sutta">samadhi</span>
-            <span tag="abhidhamma">paññā</span>
-            <span tag="mūla">vatthu</span>
-        </div>
-        <div id="tag_selected" class=""  style="padding-bottom:5px;margin:0.5em 0;"></div>
-    <div style="display:flex;justify-content: space-between;width: 30vw;">
-        <div level="0" class="tag_others"  style="padding-bottom:5px;"><?php echo $_local->gui->author;?>：</div>
-        <div level="1" class="tag_others"  style="padding-bottom:5px;"><?php echo $_local->gui->language;?>：</div>
-        <div level="7" class="tag_others"  style="padding-bottom:5px;">
-            <select>
-                <option><?php echo $_local->gui->all;?></option>
-                <option><?php echo $_local->gui->ongoing;?></option>
-                <option><?php echo $_local->gui->completed;?></option>
-            </select>
-        </div>
-        <div level="8" class="tag_others"  style="padding-bottom:5px;">
-            <select>
-                <option><?php echo $_local->gui->popular;?></option>
-                <option><?php echo $_local->gui->recommendation;?></option>
-                <option><?php echo $_local->gui->collection;?></option>
-                <option><?php echo $_local->gui->rates;?></option>
-                <option><?php echo $_local->gui->updated;?></option>
-            </select>
+    </div>
+
+    <div class="collect_section">
+        <div class="section_inner">
+            <div class="left_content">
+                <div style="display:flex;">
+                    <h2 style="margin-right:auto;">文集</h2>
+                    <div level="7" class="tag_others" style="padding-bottom:5px; margin-right:5px;">
+                        <select>
+                            <option><?php echo $_local->gui->all; ?></option>
+                            <option><?php echo $_local->gui->ongoing; ?></option>
+                            <option><?php echo $_local->gui->completed; ?></option>
+                        </select>
+                    </div>
+                    <div level="8" class="tag_others" style="padding-bottom:5px;">
+                        <select>
+                            <option><?php echo $_local->gui->popular; ?></option>
+                            <option><?php echo $_local->gui->recommendation; ?></option>
+                            <option><?php echo $_local->gui->collection; ?></option>
+                            <option><?php echo $_local->gui->rates; ?></option>
+                            <option><?php echo $_local->gui->updated; ?></option>
+                        </select>
+                    </div>
+                </div>
+                <div id="book_list">
+                </div>
+            </div>
+            <div class="right_content">
+                <h2>熱門主題</h2>
+                <div class="disable" style="display:flex; margin:1em 0; flex-wrap:wrap;">
+                    <div class="tag">sīla</div>
+                    <div class="tag">smādhi</div>
+                    <div class="tag">paññā</div>
+                    <div class="tag">本生</div>
+                    <div class="tag">visuddhimaga</div>
+                    <div class="tag">入出息</div>
+                </div>
+                <h2><?php echo $_local->gui->author; ?></h2>
+                <div class="disable" style="margin:1em 0;">
+                    <div class="list_with_head noselect">
+                        <div class="head"><span class="head_img">Ko</span></div>
+                        <div class="channal_list">Visuddhinanda Bhikkhu</div>
+                    </div>
+                    <div class="list_with_head noselect">
+                        <div class="head"><span class="head_img">Ko</span></div>
+                        <div class="channal_list">Kosalla Bhikkhu</div>
+                    </div>
+                    <div class="list_with_head noselect">
+                        <div class="head"><span class="head_img">Ko</span></div>
+                        <div class="channal_list">Paññābhinanda</div>
+                    </div>
+                </div>
+                <h2><?php echo $_local->gui->language; ?></h2>
+            </div>
         </div>
+
     </div>
+    <div id="page_bottom" style="height:10em;">
+        <?php echo $_local->gui->loading; ?>
     </div>
-</div>
-
-<div id ="book_list" class='index_inner'>
-
-</div>
-<div id="page_bottom" style="height:10em;">
-    <?php echo $_local->gui->loading;?>
-</div>
-<script>
-$(document).ready(function(){
-    collect_load();
-});
-</script>
-<?php
-include "../pcdl/html_foot.php";
-?>
+    <script>
+        $(document).ready(function() {
+            collect_load();
+        });
+    </script>
+    <?php
+    include "../pcdl/html_foot.php";
+    ?>

app/course/list_new.php

@@ -7,33 +7,29 @@ require_once '../public/load_lang.php';
 require_once '../ucenter/function.php';
 
 global $PDO;
-PDO_Connect("sqlite:"._FILE_DB_COURSE_);
+PDO_Connect("sqlite:" . _FILE_DB_COURSE_);
 $query = "select * from course where 1  order by modify_time DESC limit 0,4";
 $Fetch = PDO_FetchAll($query);
 
-foreach($Fetch as $row){
-    echo '<div class="content_block">';
+foreach ($Fetch as $row) {
     echo '<div class="card">';
-
-    echo '<div class="pd-10">';
-    echo '<div class="title" style="padding-bottom:5px;font-size:110%;font-weight:600;"><a href="../course/course.php?id='.$row["id"].'">'.$row["title"].'</a></div>';
-    echo '<div class="summary"  style="padding-bottom:5px;color: #ad4b00;">'.$row["subtitle"].'</div>';
-    echo '<div class="author"  style="padding-bottom:5px;margin-bottom:0.4em;">'.$_local->gui->speaker.'：';
-    echo '<a href="../uhome/course.php?userid='.$row['teacher'].'">';
+    echo '<div class="card_photo"></div>';
+    echo '<div class="course_right">';
+    echo '<div class="title"><a href="../course/course.php?id=' . $row["id"] . '">' . $row["title"] . '</a></div>';
+    echo '<div class="subtitle"  style="color:gray;">' . $row["subtitle"] . '</div>';
+    echo '<div class="author">' . $_local->gui->speaker . '：';
+    echo '<a href="../uhome/course.php?userid=' . $row['teacher'] . '">';
     echo ucenter_getA($row["teacher"]);
     echo '</a>';
-    echo '</div>';    
-    echo '<div class="summary"  style="padding-bottom:5px;height: 4.5em;line-height: 1.5em;overflow-y: hidden;">'.$row["summary"].'</div>';
     echo '</div>';
+    echo '<div class="summary">' . $row["summary"] . '</div>';
+    echo '</div>';
+    /*
     echo '<div class="pd-10" style="display:flex;justify-content: space-between;">';
     echo '<button><svg t="1600445373282" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2368" width="32" height="32"><path fill="silver" d="M854.00064 412.66688h-275.99872v-35.99872c48-102.00064 35.99872-227.99872 0-288-12.00128-18.00192-35.99872-35.99872-54.00064-35.99872s-35.99872 6.00064-35.99872 54.00064c0 96-6.00064 137.99936-24.00256 179.99872-12.00128 29.99808-77.99808 96-156.00128 120.00256v480c12.00128 6.00064 35.99872 24.00256 54.00064 29.99808 18.00192 12.00128 48 18.00192 60.00128 18.00192h306.00192c77.99808 0 108.00128-29.99808 108.00128-66.00192 0-18.00192 0-29.99808-18.00192-35.99872V796.672c41.99936 0 83.99872-12.00128 83.99872-48 0-29.99808-12.00128-35.99872-18.00192-35.99872v-35.99872h6.00064c24.00256 0 60.00128-35.99872 60.00128-60.00128 0-18.00192-6.00064-35.99872-18.00192-41.99936-6.00064-6.00064-24.00256-6.00064-24.00256-6.00064v-35.99872s12.00128 0 24.00256-12.00128c18.00192-12.00128 18.00192-42.00448 18.00192-42.00448v-12.00128c0-29.99808-48-54.00064-96-54.00064zM67.99872 478.6688l35.99872 408.00256c6.00064 24.00256 24.00256 48 48 48h83.99872c6.00064 0 12.00128-6.00064 18.00192-12.00128s12.00128-6.00064 18.00192-12.00128V412.66688H128c-35.99872 0-60.00128 35.99872-60.00128 66.00192z" p-id="2369"></path></svg></button>';
     echo '<span id="num_like">3</span>';
     echo '<button><svg t="1600445467402" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4462" width="32" height="32"><path d="M604.37 488.16a93.87 93.87 0 1 1-93.92-93.88 94 94 0 0 1 93.92 93.88z" fill="silver" p-id="4463"></path><path d="M510.5 179c-246 0-445.39 227.26-445.39 318.12 0 113.65 199.43 318.17 445.39 318.17s445.39-204.52 445.39-318.17C955.89 406.26 756.46 179 510.5 179z m0 477.33c-92.68 0-168.07-75.44-168.07-168.17S417.77 320 510.45 320s168.17 75.42 168.17 168.13-75.44 168.2-168.17 168.2z" fill="silver" p-id="4464"></path></svg></button>';
     echo '<span id="num_subscribe">23</span>';
-    echo '</div>';
-    
-    echo '</div>';
+    echo '</div>';*/
     echo '</div>';
 }
-
-?>

app/dict/split.php

@@ -23,8 +23,8 @@ f(word){
 		用同样的方法处理剩余部分
 		- f(stack.first element)
 	else
-		add sandhi rule
-		goto 1
+		apply other sandhi rule
+		back to 1
 }
 this is a recursion, depth=16
 此为递归算法，深度=16

app/install/readme.md

@@ -1,21 +1,23 @@
 ## 关于巴利语语料库的数据库生成<br>About how to generate the database of pāli corpus
 
 ```mermaid
-graph TB
-cscd-xml --> A[xmlmaker.php]
-  A --> B(逐词列表<br>word by word list<br>BOOKNAME.csv<br>tmp\palicsv\BOOKNAME\)
-  A -->C(单词统计表<br>vacabulary &<br>frequency<br>BOOKNAME_analysis.csv<br>tmp\palicsv\BOOKNAME\)
-  A -->e(TEXT段落表toc<br>BOOKNAME_toc.csv<br>tmp\palicsv\BOOKNAME\)
-  A -->f(黑体字黏音词<br>bold sandhi<br>BOOKNAME_un.csv<br>tmp\palicsv\BOOKNAME\)
-  A -->g(黑体字组分<br>bold split<br>BOOKNAME_un_part.csv<br>tmp\palicsv\BOOKNAME\)
-  B -->|db_insert_templet.php| h{逐词模板库<br>word by word database<br>BOOKNUM_tpl.db3<br>tmp\appdata\palicanon\templet}
-  B -->|db_insert_index.php| j{单词索引<br>word index<br>wordindex.db3<br>tmp\appdata\palicanon}
-  e --> db_insert_palitext.php
-  cscd-xml -->db_insert_palitext.php
-  db_insert_palitext.php --> i{巴利原文<br>pali_text}
-  j --> 总单词索引-index.db3
-  j --> 单独单词表
-  j --> 三藏单词
-  j --> 书单词索引
-  toc-手工维护 --> |db_update_palitext.php|i
+
+graph LR;
+cscd-xml --> A[xmlmaker.php];
+A --> B[(逐词列表<br>word by word list<br>BOOKNAME.csv<br>tmp\palicsv\BOOKNAME\)];
+A -->C[(单词统计表<br>vacabulary &<br>frequency<br>BOOKNAME_analysis.csv<br>tmp\palicsv\BOOKNAME\)];
+A -->e[(TEXT 段落表 toc<br>BOOKNAME_toc.csv<br>tmp\palicsv\BOOKNAME\)];
+A -->f[(黑体字黏音词<br>bold sandhi<br>BOOKNAME_un.csv<br>tmp\palicsv\BOOKNAME\)];
+A -->g[(黑体字组分<br>bold split<br>BOOKNAME_un_part.csv<br>tmp\palicsv\BOOKNAME\)];
+B -->|db_insert_templet.php| h[(逐词模板库<br>word by word database<br>BOOKNUM_tpl.db3<br>tmp\appdata\palicanon\templet)];
+B -->|db_insert_index.php| j[(单词索引<br>word index<br>wordindex.db3<br>tmp\appdata\palicanon)];
+e --> db_insert_palitext.php;
+cscd-xml -->db_insert_palitext.php;
+db_insert_palitext.php --> i{巴利原文<br>pali_text};
+j --> 总单词索引-index.db3;
+j --> 单独单词表;
+j --> 三藏单词;
+j --> 书单词索引;
+toc-手工维护 --> |db_update_palitext.php|i;
+
 ```

app/pcdl/html_head.php

@@ -2,17 +2,15 @@
 require_once '../path.php';
 require_once '../public/load_lang.php';
 
-if(isset($_GET["language"])){
-	$currLanguage=$_GET["language"];
-	$_COOKIE["language"]=$currLanguage;
-}
-else{
-	if(isset($_COOKIE["language"])){
-		$currLanguage=$_COOKIE["language"];
-	}
-	else{
-		$currLanguage="en";
-		$_COOKIE["language"]=$currLanguage;
+if (isset($_GET["language"])) {
+	$currLanguage = $_GET["language"];
+	$_COOKIE["language"] = $currLanguage;
+} else {
+	if (isset($_COOKIE["language"])) {
+		$currLanguage = $_COOKIE["language"];
+	} else {
+		$currLanguage = "en";
+		$_COOKIE["language"] = $currLanguage;
 	}
 }
 
@@ -20,14 +18,15 @@ else{
 
 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
 <html>
+
 <head>
-    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
 	<meta name="viewport" content="width=device-width, initial-scale=1">
-	<link type="text/css" rel="stylesheet" href="../pcdl/css/font.css"/>
-    <link type="text/css" rel="stylesheet" href="../pcdl/css/basic_style.css"/>
-    <link type="text/css" rel="stylesheet" href="../pcdl/css/style.css"/>
-    <link type="text/css" rel="stylesheet" href="../pcdl/css/color_day.css" id="colorchange" />
-    <link type="text/css" rel="stylesheet" href="../pcdl/css/style_mobile.css" media="screen and (max-width:800px)">
+	<link type="text/css" rel="stylesheet" href="../pcdl/css/font.css" />
+	<link type="text/css" rel="stylesheet" href="../pcdl/css/basic_style.css" />
+	<link type="text/css" rel="stylesheet" href="../pcdl/css/style.css" />
+	<link type="text/css" rel="stylesheet" href="../pcdl/css/color_day.css" id="colorchange" />
+	<link type="text/css" rel="stylesheet" href="../pcdl/css/style_mobile.css" media="screen and (max-width:800px)">
 	<link href="https://fonts.googleapis.com/css2?family=Padauk:wght@400;700&display=swap" rel="stylesheet">
 
 	<!-- generics -->
@@ -61,13 +60,13 @@ else{
 	<link rel="manifest" href="../public/images/favicon/site.webmanifest">
 	<link rel="mask-icon" href="../public/images/favicon/safari-pinned-tab.svg" color="#333333">
 
-    <title>wikipāḷi</title>
+	<title>wikipāḷi</title>
 
 	<script src="../public/js/jquery.js"></script>
 	<script src="../public/js/comm.js"></script>
 	<script src="../studio/js/fixedsticky.js"></script>
 	<script src="../guide/guide.js"></script>
-	<link type="text/css" rel="stylesheet" href="../guide/guide.css"/>
+	<link type="text/css" rel="stylesheet" href="../guide/guide.css" />
 
 	<script src="../ucenter/setting.js"></script>
 
@@ -75,87 +74,103 @@ else{
 	<script src="../public/js/mermaid.min.js"></script>
 
 	<script src="../public/js/notify.js"></script>
-    <link type="text/css" rel="stylesheet" href="../public/css/notify.css"/>
+	<link type="text/css" rel="stylesheet" href="../public/css/notify.css" />
 
 	<script src="../public/js/jquery-ui-1.12.1/jquery-ui.js"></script>
-	<link type="text/css" rel="stylesheet" href="../public/js/jquery-ui-1.12.1/jquery-ui.css"/>	
+	<link type="text/css" rel="stylesheet" href="../public/js/jquery-ui-1.12.1/jquery-ui.css" />
 
 	<script src="../term/term.js"></script>
 	<script src="../term/note.js"></script>
 	<script src="../term/term_popup.js"></script>
-	<link type="text/css" rel="stylesheet" href="../term/term.css"/>
+	<link type="text/css" rel="stylesheet" href="../term/term.css" />
 	<?php
-		if(isset($_GET["display"]) && $_GET["display"]=="para"){
-			echo '<link type="text/css" rel="stylesheet" href="../term/term_para.css"/>';
-		}
+	if (isset($_GET["display"]) && $_GET["display"] == "para") {
+		echo '<link type="text/css" rel="stylesheet" href="../term/term_para.css"/>';
+	}
 	?>
-		<script src="../channal/channal.js"></script>
+	<script src="../channal/channal.js"></script>
 	<script src="../term/popup_note.js"></script>
-	<link type="text/css" rel="stylesheet" href="../term/popup_note.css"/>
+	<link type="text/css" rel="stylesheet" href="../term/popup_note.css" />
 
 	<script src="../term/term_edit_dlg.js"></script>
-	<link type="text/css" rel="stylesheet" href="../term/term_edit_dlg.css"/>
+	<link type="text/css" rel="stylesheet" href="../term/term_edit_dlg.css" />
 	<script src="../uwbw/wbw_channal_list.js"></script>
 	<script src="../usent/historay.js"></script>
 	<script src="../term/pali_sim_sent.js"></script>
-	<link type="text/css" rel="stylesheet" href="../term/pali_sim_dlg.css"/>
+	<link type="text/css" rel="stylesheet" href="../term/pali_sim_dlg.css" />
 	<script src="../term/related_para.js"></script>
-	
+
 	<script src="../inline_dict/inline_dict.js"></script>
 
 	<script src="../widget/click_dropdown.js"></script>
-	<link type="text/css" rel="stylesheet" href="../widget/click_dropdown.css"/>
+	<link type="text/css" rel="stylesheet" href="../widget/click_dropdown.css" />
 
 	<script src="../public/charcode/coverter_my.js"></script>
 
-	<script >
-	<?php require_once '../public/load_lang_js.php';?>
+	<script>
+		<?php require_once '../public/load_lang_js.php'; ?>
 	</script>
 
 	<style>
-	.list_with_head{
-		display:flex;
-		margin: 3px 0;
-	}
-	.head_img{
-		display: inline-flex;
-    min-width: 3em;
-    height: 3em;
-    padding: 0 0px;
-    font-size: 60%;
-    background-color: gray;
-    color: white;
-    border-radius: 1.5em;
-    text-align: center;
-    justify-content: center;
-    margin: auto 2px;
-    line-height: 3em;
-	}
-	.card{
-		box-shadow: 0 0 10px rgba(0,0,0,0.15);
-		font-size: 1em;
-		line-height: 1.3;
-	}
-	.card>.title>a , .card>.title>a:link{
-		color: var(--main-color);
+		.list_with_head {
+			display: flex;
+			margin: 3px 0;
+		}
 
-	}
-	.card a:hover{
-		color: var(--tool-link-hover-color);
-	}
+		.head_img {
+			display: inline-flex;
+			min-width: 3em;
+			height: 3em;
+			padding: 0 0px;
+			font-size: 60%;
+			background-color: gray;
+			color: white;
+			border-radius: 1.5em;
+			text-align: center;
+			justify-content: center;
+			margin: auto 2px;
+			line-height: 3em;
+		}
 
-	.index_inner {
-	width:96vw;
-    max-width: 960px;
-    margin-left: auto;
-    margin-right: auto;
-}
-.card li{
-	white-space: normal;
-}
-.card code{
-	white-space: normal;
-}
+		.card {
+			border-radius: 20px;
+			box-shadow: 0 5px 7px rgba(0, 0, 0, 0.05);
+			margin: 10px 0;
+			background-color: white;
+			padding: 0.7rem;
+			display: flex;
+			position: relative;
+		}
+
+		.card>.title>a,
+		.card>.title>a:link {
+			color: var(--main-color);
+
+		}
+
+		.card a:hover {
+			color: var(--tool-link-hover-color);
+		}
 
+		.card_state {
+			position: absolute;
+			background-color: darkred;
+			color: white;
+			padding: 0 6px;
+			right: -5px;
+		}
+
+		.index_inner {
+			margin-left: auto;
+			margin-right: auto;
+		}
+
+		.card li {
+			white-space: normal;
+		}
+
+		.card code {
+			white-space: normal;
+		}
 	</style>
-</head>
+</head>

app/pcdl/index.js

@@ -1,76 +1,79 @@
 function index_onload() {
-  index_load_term_new();
-  index_load_collect_new();
-  index_load_course_new();
+    index_load_term_new();
+    index_load_collect_new();
+    index_load_course_new();
 }
 
 function index_load_collect_new() {
-  $.get(
-    "../article/list_new.php",
-    {
-      begin: 0,
-      page: 4,
-    },
-    function (data, status) {
-      let arrCollectList = JSON.parse(data);
-      let html = "";
-      for (const iterator of arrCollectList.data) {
-        html += "<div style='width:25%;padding:0.5em;'>";
-        html += '<div style="position: relative;">';
-        html +=
-          "<div class='' style='position: absolute;background-color: darkred;color: white;padding: 0 6px;right: 0;'>" + gLocal.gui.ongoing + "</div>";
-        html += "</div>";
-        html += "<div class='card article_list' style='padding:10px;'>";
-          gLocal.gui.ongoing + "</div>";
-        html += "<div class='title' style='font-weight:700'>";
-        html +=
-          "<a href='../article/?id=" +
-          iterator.id +
-          "'>" +
-          iterator.title +
-          "</a>";
-        html += "</div>";
+    $.get(
+        "../article/list_new.php", {
+            begin: 0,
+            page: 4,
+        },
+        function(data, status) {
+            let arrCollectList = JSON.parse(data);
+            let html = "";
+            for (const iterator of arrCollectList.data) {
+                html += "<div class='card'>";
+
+                html +=
+                    "<div class='card_state'>" + gLocal.gui.ongoing + "</div>";
+
+                //！！！！！請協助補上頭像代碼！！！！！
+                html +=
+                    "<div style='padding:10px 10px 0 0;'><span class='head_img'></span></div>";
+
+                html += "<div class='article_right'>";
+                gLocal.gui.ongoing + "</div>";
+
+                html +=
+                    "<div class='title'><a href='../article/?id=" +
+                    iterator.id +
+                    "'>" +
+                    iterator.title +
+                    "</a></div>";
 
-        html += "<div class='collect' style='color:gray'>";
-        if(iterator.collect){
-          html += "<a href='../article/?collect=" +iterator.collect.id + "'>" + iterator.collect.title + "</a>";
-        }
-        else{
-          html += "unkow";
-        }
-        html += "</div>";
-        if(iterator.subtitle){
-          html += "<div style=''>" + iterator.subtitle + "</div>";
-        }
-        
-        html += "<div style=''>" + iterator.username.nickname + "</div>";
 
-        if(iterator.summary){
-          html += "<div style=''>" + iterator.summary + "</div>";
+                html += "<div class='collect' style='color:gray'>";
+                if (iterator.collect) {
+                    html += "<a href='../article/?collect=" + iterator.collect.id + "'>" + iterator.collect.title + "</a>";
+                } else {
+                    html += "unkow";
+                }
+                html += "</div>";
+                if (iterator.subtitle) {
+                    html += "<div>" + iterator.subtitle + "</div>";
+                }
+                if (iterator.summary) {
+                    html += "<div>" + iterator.summary + "</div>";
+                }
+
+                html += "<div style=''>" + iterator.username.nickname + "</div>";
+
+
+
+                html += "</div>";
+                html += "</div>";
+            }
+            $("#article_new").html(html);
         }
-        
-        html += "</div>";
-        html += "</div>";
-      }
-      $("#article_new").html(html);
-    }
-  );
+    );
 }
 
 function index_load_term_new() {
-  $.get("../term/new.php", function (data, status) {
-    let xDiv = document.getElementById("pali_pedia");
-    if (xDiv) {
-      xDiv.innerHTML = data;
-    }
-  });
+    $.get("../term/new.php", function(data, status) {
+        let xDiv = document.getElementById("pali_pedia");
+        if (xDiv) {
+            xDiv.innerHTML = data;
+        }
+    });
 }
 
 function index_load_course_new() {
-  $.get("../course/list_new.php", function (data, status) {
-    let xDiv = document.getElementById("course_list_new");
-    if (xDiv) {
-      xDiv.innerHTML = data;
-    }
-  });
-}
+    $.get("../course/list_new.php", function(data, status) {
+        let xDiv = document.getElementById("course_list_new");
+        if (xDiv) {
+            xDiv.innerHTML = data;
+        }
+    });
+}

app/pcdl/index.php

@@ -12,29 +12,24 @@ require_once '../pcdl/html_head.php';
 			padding: 10px;
 		}
 
-		.index_inner {
-			width: 960px;
-			margin-left: auto;
-			margin-right: auto;
-		}
-
 		.content_inner {
 			display: flex;
 		}
 
 		.title_bar {
-			border-bottom: solid 1px var(--tool-bt-border-line-color);
 			justify-content: space-between;
 			display: flex;
+			margin: 1em 0;
 		}
 
 		.h3 {
-			font-size: 16px;
+			font-size: 18px;
 			font-weight: 700;
 		}
 
 		.index_list_categories {
-			margin: 2em 0;
+
+			padding: 1rem;
 		}
 
 		.index_list_categories a:hover {
@@ -56,26 +51,148 @@ require_once '../pcdl/html_head.php';
 			display: none;
 		}
 
-		#article_new .card {
-			height: 20vh;
-			overflow-y: scroll;
+		.index_article {
+			background-color: #e0e0e0;
+		}
+
+		.index_course {
+			background-color: #313131;
+		}
+
+		.index_course .h3 {
+			color: white;
+		}
+
+		.article_right {
+			width: calc(100% - 80px);
+		}
+
+		.course_right a,
+		.article_right a {
+			color: var(--main-color);
+		}
+
+		.title a,
+		.course_right title {
+			font-size: 120%;
+			font-weight: 700;
 		}
 
 		#course_list_new .card {
-			height: 15em;
+			height: 150px;
+		}
+
+		.card_photo {
+			position: absolute;
+			left: 0;
+			top: 0;
+			height: 100%;
+			width: 150px;
+			background: gray;
+			border-radius: 20px 0 0 20px;
+		}
+
+		.course_right {
+			margin-left: 150px;
+			display: flex;
+			flex-direction: column;
+		}
+
+		.summary {
+			margin-top: auto;
+			display: -webkit-box;
+			-webkit-box-orient: vertical;
+			overflow: hidden;
+			text-overflow: ellipsis;
+			width: 100%;
+			-webkit-line-clamp: 2;
+		}
+
+		#pali_pedia .card {
+			background-color: #F9F9F9;
+			box-shadow: unset;
+			display: grid;
+			grid-template-columns: 2fr 1fr;
+			grid-template-areas:
+				"title author"
+				"summary author";
+		}
+
+		#pali_pedia .title {
+			grid-area: title;
+			font-size: 120%;
+		}
+
+		#pali_pedia .summary {
+			grid-area: summary;
+		}
+
+		#pali_pedia .author {
+			grid-area: author;
+			color: gray;
+		}
+	</style>
+	<style media="screen and (min-width:800px)">
+		.index_list_content {
+			display: flex;
+			margin: auto;
+			max-width: 900px;
+		}
+
+		.index_course .index_list_content {
+			flex-direction: row-reverse;
+		}
+
+		.title_bar {
+			flex: 4;
+			position: relative;
+			margin: 2em;
+		}
 
+		#article_new {
+			flex: 9;
 		}
 
-		#course_list_new .card .pd-10:first-child {
-			height: 12em;
-			overflow-y: scroll;
-			padding-bottom: 2px;
+		#course_list_new {
+			flex: 8;
 		}
 
-		#course_list_new .card .pd-10:last-child {
-			padding-top: 2px;
+		#pali_pedia .card {
+			margin: 0;
+		}
+
+		#pali_pedia {
+			flex: 12;
+			display: grid;
+			grid-template-columns: 1fr 1fr;
+			grid-gap: 10px;
+		}
+
+		.title_bar .h3 {
+			font-size: 250%;
+		}
+
+		.title_more {
+			position: absolute;
+			right: 30px;
+			bottom: 0;
+		}
+
+		.index_pedia .index_list_content {
+			flex-direction: column;
+		}
+
+		.index_pedia .title_bar {
+			display: grid;
+			justify-content: unset;
+			text-align: center;
+		}
+
+		.index_pedia .title_more {
+			all: unset;
 		}
 	</style>
+	<!--
 	<style media="screen and (max-width:800px)">
 		#right_pannal {
 			display: none;
@@ -99,7 +216,11 @@ require_once '../pcdl/html_head.php';
 		.content_inner {
 			display: block;
 		}
-	</style>
+
+
+
+		.article_list {}
+	</style>-->
 	<a name="pagetop"></a>
 	<!-- tool bar begin-->
 	<?php
@@ -110,37 +231,37 @@ require_once '../pcdl/html_head.php';
 
 	<div class="index_inner">
 
-		<div class="index_list_categories">
-			<div class="title_bar">
-				<span class="title h3"><?php echo $_local->gui->composition; ?></span>
-				<span class="title_more"><a href="../collect"><?php echo $_local->gui->more; ?></a></span>
-			</div>
-			<div class="content">
-				<div id="article_new" class="content_inner">
+		<div class="index_list_categories index_article">
+			<div class="index_list_content">
+				<div class="title_bar">
+					<span class="title h3"><?php echo $_local->gui->composition; ?></span>
+					<span class="title_more"><a href="../collect"><?php echo $_local->gui->more; ?></a></span>
+				</div>
+				<div id="article_new">
 				</div>
 			</div>
 		</div>
 
-		<div class="index_list_categories">
-			<div class="title_bar">
-				<span class="title h3"><?php echo $_local->gui->lesson; ?></span>
-				<span class="title_more"><a href="../course"><?php echo $_local->gui->more; ?></a></span>
-			</div>
-			<div class="content">
-				<div id="course_list_new" class="content_inner">
+		<div class="index_list_categories index_course">
+			<div class="index_list_content">
+				<div class="title_bar">
+					<span class="title h3"><?php echo $_local->gui->lesson; ?></span>
+					<span class="title_more"><a href="../course"><?php echo $_local->gui->more; ?></a></span>
+				</div>
+				<div id="course_list_new">
 				</div>
 			</div>
 		</div>
 
 
 
-		<div class="index_list_categories">
-			<div class="title_bar">
-				<span class="title h3"><?php echo $_local->gui->encyclopedia; ?></span>
-				<span class="title_more"><a href="../wiki"><?php echo $_local->gui->more; ?></a></span>
-			</div>
-			<div class="content">
-				<div id="pali_pedia" class="content_inner">
+		<div class="index_list_categories index_pedia">
+			<div class="index_list_content">
+				<div class="title_bar">
+					<span class="title h3"><?php echo $_local->gui->encyclopedia; ?></span>
+					<span class="title_more"><a href="../wiki"><?php echo $_local->gui->more; ?></a></span>
+				</div>
+				<div id="pali_pedia">
 				</div>
 			</div>
 		</div>

app/studio/css/color_day.css

@@ -38,4 +38,6 @@
     --new-tool-btn-border: #7B7B7B;
     --new-tool-btn: #CDCDCD;
     --new-tool-content-disabled: #989898;
+    --new-tool-input-text-bg: #171717;
+    --new-tag-bg: #6374EF;
 }

app/term/new.php

@@ -7,19 +7,17 @@ require_once '../public/load_lang.php';
 require_once '../public/function.php';
 
 global $PDO;
-PDO_Connect("sqlite:"._FILE_DB_TERM_);
+PDO_Connect("sqlite:" . _FILE_DB_TERM_);
 
 $query = "select word,meaning , owner from term where 1  order by create_time DESC limit 0,4";
 $Fetch = PDO_FetchAll($query);
 
-foreach($Fetch as $row){
-    echo '<div class="content_block">';
-    echo '<div class="card pd-10">';
-    echo '<div class="title" style="padding-bottom:5px;"><a href="../wiki/wiki.php?word='.$row["word"].'">'.$row["word"].'</a></div>';
-    echo '<div class="summary  style="padding-bottom:5px;">'.$row["meaning"].'</div>';
-    echo '<div class="author  style="padding-bottom:5px;">'.$row["owner"].'</div>';
-    echo '</div>';
+foreach ($Fetch as $row) {
+
+    echo '<div class="card">';
+    echo '<div class="title"><a href="../wiki/wiki.php?word=' . $row["word"] . '">' . $row["word"] . '</a></div>';
+    echo '<div class="summary">' . $row["meaning"] . '</div>';
+    echo '<div class="author">' . $row["owner"] . '</div>';
+
     echo '</div>';
 }
-
-?>