☰

Workflowy官方缺美工，咱就自己上！

比WF官方主题好看亿点点~

目前为 2024-11-28 提交的版本。查看 最新版本。

  1. /* ==UserStyle==
  2. @name           Workflowy官方缺美工，咱就自己上！
  3. @description    比WF官方主题好看亿点点~
  4. @namespace      github.com/openstyles/stylus
  5. @version        0.1
  6. @author         YYYYang
  7. @license 		MIT
  8. ==/UserStyle== */
  9. @-moz-document domain("workflowy.com") {
  10.  
  11.     /* 让todo节点的小方块与其它bullet节点竖直对齐 */
  12.  
  13.     .checkmark:not(.boardColumn):not(.boardCard):not(.dashboard-card)>.name {
  14.  
  15.         a.bullet {
  16.             opacity: 0;
  17.         }
  18.  
  19.         >.prefix,
  20.         >.content {
  21.             left: -22px;
  22.         }
  23.     }
  24.  
  25.     .checkmark:not(.boardColumn):not(.boardCard):not(.dashboard-card):hover>.name {
  26.         a.bullet {
  27.             opacity: 1;
  28.         }
  29.  
  30.         >.prefix,
  31.         >.content {
  32.             -webkit-animation: slide-right 0.2s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
  33.             animation: slide-right 0.2s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
  34.         }
  35.  
  36.         .prefix label:hover {
  37.             -webkit-animation: shake-bottom 1s cubic-bezier(0.455, 0.030, 0.515, 0.955) both;
  38.             animation: shake-bottom 1s cubic-bezier(0.455, 0.030, 0.515, 0.955) both;
  39.         }
  40.     }
  41.  
  42.  
  43.     /* * ----------------------------------------
  44.     /* * animation slide-right
  45.     /* * ---------------------------------------- */
  46.  
  47.     @-webkit-keyframes slide-right {
  48.         0% {
  49.             -webkit-transform: translateX(0);
  50.             transform: translateX(0);
  51.         }
  52.  
  53.         100% {
  54.             -webkit-transform: translateX(22px);
  55.             transform: translateX(22px);
  56.         }
  57.     }
  58.  
  59.     @keyframes slide-right {
  60.         0% {
  61.             -webkit-transform: translateX(0);
  62.             transform: translateX(0);
  63.         }
  64.  
  65.         100% {
  66.             -webkit-transform: translateX(22px);
  67.             transform: translateX(22px);
  68.         }
  69.     }
  70.  
  71.  
  72.     /* * ----------------------------------------
  73.     /* * animation shake-bottom
  74.     /* * ---------------------------------------- */
  75.  
  76.     @-webkit-keyframes shake-bottom {
  77.  
  78.         0%,
  79.         100% {
  80.             -webkit-transform: rotate(0deg);
  81.             transform: rotate(0deg);
  82.             -webkit-transform-origin: 50% 100%;
  83.             transform-origin: 50% 100%;
  84.         }
  85.  
  86.         10% {
  87.             -webkit-transform: rotate(2deg);
  88.             transform: rotate(2deg);
  89.         }
  90.  
  91.         20%,
  92.         40%,
  93.         60% {
  94.             -webkit-transform: rotate(-4deg);
  95.             transform: rotate(-4deg);
  96.         }
  97.  
  98.         30%,
  99.         50%,
  100.         70% {
  101.             -webkit-transform: rotate(4deg);
  102.             transform: rotate(4deg);
  103.         }
  104.  
  105.         80% {
  106.             -webkit-transform: rotate(-2deg);
  107.             transform: rotate(-2deg);
  108.         }
  109.  
  110.         90% {
  111.             -webkit-transform: rotate(2deg);
  112.             transform: rotate(2deg);
  113.         }
  114.     }
  115.  
  116.     @keyframes shake-bottom {
  117.  
  118.         0%,
  119.         100% {
  120.             -webkit-transform: rotate(0deg);
  121.             transform: rotate(0deg);
  122.             -webkit-transform-origin: 50% 100%;
  123.             transform-origin: 50% 100%;
  124.         }
  125.  
  126.         10% {
  127.             -webkit-transform: rotate(2deg);
  128.             transform: rotate(2deg);
  129.         }
  130.  
  131.         20%,
  132.         40%,
  133.         60% {
  134.             -webkit-transform: rotate(-4deg);
  135.             transform: rotate(-4deg);
  136.         }
  137.  
  138.         30%,
  139.         50%,
  140.         70% {
  141.             -webkit-transform: rotate(4deg);
  142.             transform: rotate(4deg);
  143.         }
  144.  
  145.         80% {
  146.             -webkit-transform: rotate(-2deg);
  147.             transform: rotate(-2deg);
  148.         }
  149.  
  150.         90% {
  151.             -webkit-transform: rotate(2deg);
  152.             transform: rotate(2deg);
  153.         }
  154.     }
  155.  
  156.  
  157. }

欢迎访问Greasy Fork镜像

土豆服务器，请按需使用

镜像地址随时可能被墙，建议加群获取最新地址

加入Q群

QingJ © 2025

镜像随时可能失效，请加Q群300939539或关注我们的公众号极客氢云获取最新地址