# 噗浪大河道佈景

###### tags: `plurk`, `plurk theme`, `plurk-theme`, `噗浪`, `噗浪佈景`, `大河道`

> 設計者: 方格子
> 範例網址: [方格子的噗浪](https://www.plurk.com/annheilong)
> 安裝佈景: https://www.plurk.com/installDesign/4366647-aa2baf988a

---

不知道哪邊可以分享樣式然後不斷更新也可以找到
噗浪分享出來的樣式也會把註解都拿掉，會不好修改
所以發布在這邊好了

---

以前有使用過 **Howar31** 的大河道佈景：
https://blog.howar31.com/wordpress/plurk-theme/

但是後來噗浪改版後一堆東西都跑掉了就不能用了
最近有靈感所以嘗試做一版自己的版本

---

## 修改方法：

- 按下噗浪右上角的帳號選單 -> 自訂選單
- 將下方的 CSS 樣式貼到「自訂佈景風格 」中，按下「儲存並更新」
- 完成

---

## 佈景:

/*
 * 設計者: 方格子, https://www.plurk.com/annheilong
 */

/****************
 * 大河道
 ****************/
/* 擴展到 100% */
html,
body {
  height: 100%;
  width: 100%;
}
/* 河道留出上面位置放發噗的欄 */
.timeline-holder {
  height: calc(100% - 120px) !important;
  top: 100px;
}
/* 調整時間軸位置 */
.timeline_control {
  bottom: 40px;
}

/****************
 * 噗
 ****************/
/* 噗的最小高度 */
div[id^="plurk_cnt_"] {
  min-height: 4em;
}
/* 噗的陰影 */
.plurk .td_img a,
.plurk > table:nth-of-type(1) > tbody > tr > td:nth-of-type(2),
#form_holder,
.td_response_count a span {
  box-shadow: 10px 10px 10px rgba(90, 60, 0, 0.3);
}
/* 回覆數量 */
.td_response_count span {
  font-size: 14px;
  background-color: rgba(0, 0, 0, 0.3);
}
/* 未讀噗的回覆數量 */
.new .response_count {
  color: yellow;
}
/****************
 * 噗的控制列
 ****************/
/* 將噗的控制列 (編輯,消音,轉噗,喜歡,噗幣,其他) 移動到名字上方
   因為有些太長的噗展開後，這個控制列會跑掉 (找不到) */
.manager {
  position: absolute;
  padding-left: 0.4em;
  top: -2.3em;
  left: 0;
  background-color: rgba(255, 255, 255, 1);
}
/* 調整噗的控制列的圖案的邊框留白 */
.manager a {
  padding: 0;
  margin: 3px;
}

/****************
 * 發噗列
 ****************/
/* 發噗列移動到上方，透明度設為 0.3 */
.dash-group-form {
  position: fixed !important;
  float: none;
  top: 45px;
  left: 20px;
  width: 50% !important;
  opacity: 0.3;
}
/* 當滑鼠移動到發噗列上面，或者游標在輸入框的時候，透明度設為 1 */
.dash-group-form:hover,
.dash-group-form:focus-within {
  opacity: 1;
  z-index: 5001;
}
/* 發噗列的陰影 */
.segment-content {
  box-shadow: 6px 6px 12px rgba(0, 0, 0, 0.4);
}

/****************
 * 個人資料等欄位
 ****************/
/* 將個人資料等欄位往下移動，不然會凸出在河道下面 */
#dashboard_holder {
  top: 100px;
}

/****************
 * 偷偷說
 ****************/
/* 偷偷說的噗底色設為藍色 */
.plurk[data-uid="99999"] .plurk_cnt,
.plurk[data-uid="99999"] .manager {
  background-color: lightblue;
}

/****************
 * R18
 ****************/
/* R18的噗底色設為粉紅色 */
.plurk.porn .plurk_cnt .plurk.porn .manager {
  background-color: pink;
}
/* R18的噗裡面的圖片跟連結模糊化 */
.plurk.porn .plurk_cnt .td_cnt .ex_link {
  filter: blur(4px);
}
/* R18的噗裡面的圖片跟連結當滑鼠移上去時取消模糊 */
.plurk.porn .plurk_cnt .td_cnt .ex_link:hover {
  filter: none;
}