Skip to content

irasutoya.com【ルナーダック】 by kaz

Imported from https://raw.githubusercontent.com/sabakuran/personal-stylesheets/master/css/jp/irasutoya.com.user.css

Mirrored from https://raw.githubusercontent.com/xrkaz/personal-stylesheets/master/css/jp/irasutoya.com.user.css

Screenshot of irasutoya.com【ルナーダック】

Details

Authorkaz

LicenseWTFPL

Categoryirasutoya

Created

Updated

Size10 kB

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

DuckDuckGoにインスパイアされたirasutoya.comのテーマ

Features

• 7つのカラースキーム (ダーク、ピンク、シアン、イエロー、レッド、グリーン、ブルー) • 固定ナビゲーションバー • 画像の彩度セレクター • 画像の明るさセレクター • 丸い角トグル • モダンデザイン

Support

Chromium (Vivaldi) Firefox

Notes

Source code

Source code has over 10K characters, so we truncated it. You can inspect the full source code on install link.
us = "\Aルナーダック v1.0.1 🌸 kaz.cx"

/* ==UserStyle==
==========================================================
とりあえず基本的なところだけ。忙しさがなくなったら改良します。
==========================================================
@name         irasutoya.com【ルナーダック】
@namespace    kaz.cx
@description  DuckDuckGoにインスパイアされたirasutoya.comのテーマ
@author       kaz <x@kaz.cx> (https://kaz.cx)
@homepageURL  https://kaz.cx/lunar-duck
@supportURL   https://github.com/xrkaz/personal-stylesheets/issues
@preprocessor stylus
@version      1.0.1
@license      WTFPL
===================
@var select cs "カラースキーム" {
    "デフォルト*":"cs-dark",
    "ミク":"cs-cyan",
    "ルカ":"cs-pink",
    "リン":"cs-yellow",
    "テト":"cs-red",
    "グミ":"cs-green",
    "カイト":"cs-blue",
}
@var checkbox navstick "固定ナビゲーションバー" 1
@var checkbox srcstick "固定検索パネル" 1
@var checkbox xzucc "SNSを隠す" 1
@var checkbox xpromo "プロモを隠す" 1
@var select imgsat "画像の彩度" {
  "グレースケール":"0%",
  "10%":"10%",
  "20%":"20%",
  "30%":"30%",
  "40%":"40%",
  "半分":"50%",
  "60%":"60%",
  "70%":"70%",
  "80%":"80%",
  "90%":"90%",
  "デフォルト*":"100%"
}
@var select imglumen "画像の明るさ" {
  "暗い":"0%",
  "10%":"10%",
  "20%":"20%",
  "30%":"30%",
  "40%":"40%",
  "半分":"50%",
  "60%":"60%",
  "70%":"70%",
  "80%":"80%",
  "90%":"90%",
  "デフォルト*":"100%"
}
@var select prad "丸い角" {
  "なし":"0",
  "デフォルト*":"4px",
  "8px":"8px",
  "12px":"12px"
}
@var checkbox xus "テーマの作成者を表示" 1
==/UserStyle== */

@-moz-document domain("irasutoya.com")
  
  i = !important
  
  :root
    --txt hsla(0, 0%, 100%, .8)
    --txt-act hsl(0, 0%, 100%)
    --txt-sub hsla(0, 0%, 100%, .5)
    --txt-ph hsla(0, 0%, 100%, .3)
    --txt-succ hsl(150, 50%, 50%)
    --txt-succ-act hsl(150, 50%, 80%)
    --bg-succ hsl(150, 30%, 20%)
    --txt-warn hsl(35, 50%, 50%)
    --bg-warn hsl(35, 30%, 20%)
    --txt-dang hsl(360, 50%, 50%)
    --bg-dang hsl(360, 30%, 20%)
    --txt-info hsl(225, 50%, 50%)
    --bg-info hsl(225, 30%, 20%)
    if cs == "cs-dark"
      --bg-1 hsl(0, 0%, 10%)
      --bg-2 hsl(0, 0%, 5%)
      --bg-3 hsl(0, 0%, 15%)
      --bg-4 hsl(0, 0%, 20%)
      --bg-5 hsl(0, 0%, 25%)
      --bg-6 hsl(0, 0%, 45%)
      --txt-lnk hsl(225, 100%, 70%)
      --txt-lnk-act hsl(225, 100%, 80%)
    else if cs == "cs-pink"
      --bg-1 hsl(315, 20%, 10%)
      --bg-2 hsl(315, 20%, 5%)
      --bg-3 hsl(325, 20%, 20%)
      --bg-4 hsl(330, 15%, 25%)
      --bg-5 hsl(330, 15%, 30%)
      --bg-6 hsl(330, 15%, 50%)
      --txt-lnk hsl(335, 45%, 60%)
      --txt-lnk-act hsl(335, 45%, 80%)
    else if cs == "cs-cyan"
      --bg-1 hsl(185, 20%, 10%)
      --bg-2 hsl(185, 20%, 5%)
      --bg-3 hsl(185, 100%, 10%)
      --bg-4 hsl(185, 30%, 20%)
      --bg-5 hsl(185, 15%, 40%)
      --bg-6 hsl(185, 30%, 45%)
      --txt-lnk hsl(190, 45%, 60%)
      --txt-lnk-act hsl(190, 45%, 80%)
    else if cs == "cs-yellow"
      --bg-1 hsl(50, 20%, 10%)
      --bg-2 hsl(50, 20%, 5%)
      --bg-3 hsl(50, 100%, 10%)
      --bg-4 hsl(50, 30%, 20%)
      --bg-5 hsl(50, 15%, 40%)
      --bg-6 hsl(50, 30%, 45%)
      --txt-lnk hsl(50, 45%, 60%)
      --txt-lnk-act hsl(50, 45%, 80%)
    else if cs == "cs-red"
      --bg-1 hsl(0, 20%, 10%)
      --bg-2 hsl(0, 20%, 5%)
      --bg-3 hsl(0, 100%, 10%)
      --bg-4 hsl(0, 30%, 20%)
      --bg-5 hsl(0, 15%, 40%)
      --bg-6 hsl(0, 30%, 45%)
      --txt-lnk hsl(0, 45%, 60%)
      --txt-lnk-act hsl(0, 45%, 80%)
    else if cs == "cs-green"
      --bg-1 hsl(140, 20%, 10%)
      --bg-2 hsl(140, 20%, 5%)
      --bg-3 hsl(140, 100%, 10%)
      --bg-4 hsl(140, 30%, 20%)
      --bg-5 hsl(140, 15%, 40%)
      --bg-6 hsl(140, 30%, 45%)
      --txt-lnk hsl(140, 45%, 60%)
      --txt-lnk-act hsl(140, 45%, 80%)
    else if cs == "cs-blue"
      --bg-1 hsl(200, 20%, 10%)
      --bg-2 hsl(200, 20%, 5%)
      --bg-3 hsl(200, 100%, 10%)
      --bg-4 hsl(200, 30%, 20%)
      --bg-5 hsl(200, 15%, 40%)
      --bg-6 hsl(200, 30%, 45%)
      --txt-lnk hsl(200, 45%, 60%)
      --txt-lnk-act hsl(200, 45%, 80%)

  pan1()
    background-color var(--bg-1)
    color var(--txt)
  shad()
    box-shadow 0 1px 3px hsla(0, 0%, 0%, .5)
  rad()
    border-radius prad
  sharad()
    shad()
    rad()
    
  /* 
  #Label2, #HTML6, #PopularPosts2, #HTML5
    margin 0
    
  .post
    margin 0
    padding 0
  
  .related-posts-widget img
    background none
  
  #PopularPosts1
    margin 0
  
  .box
    margin-left 0
  */
  
  // faq headers
  h3.faq
    color var(--txt-succ)
  
  #HTML7
    sharad()
    background-color var(--bg-3)
    z-index 1
  if srcstick
    #HTML7
      position sticky
      top 0
  if navstick
    #botmenu
      z-index 1
      position sticky
      top 0
    
    
  // scrollbar
  html
    // chromium
    ::-webkit-scrollbar
      width 15px
    ::-webkit-scrollbar-track
      background-color var(--bg-2)
      border-left 1px solid var(--bg-3)
    ::-webkit-scrollbar-thumb
      background-color var(--bg-4)
      border-radius 0
      &:hover
        background-color var(--bg-6)
    // firefox
    scrollbar-color var(--bg-4) var(--bg-2)
    scrollbar-width auto
      
  body
    background var(--bg-1)
    color var(--txt)
  a
    color var(--txt-lnk)
    &:hover, &:focus
      color var(--txt-lnk-act)
      text-decoration none
  .entry a:link, .entry a:visited
    color var(--txt-lnk)
    text-decoration none
    &:hover, &:focus
      color var(--txt-lnk-act)
      text-decoration none
  #footer a:link, #footer a:visited
    color var(--txt-lnk)
    text-decoration none
    &:hover, &:focus
      color var(--txt-lnk-act)
      text-decoration none
  .sidebar li a:link, .sidebar li a:visited
    color var(--txt-lnk)
    &:hover, &:focus
      color var(--txt-lnk-act)
      text-decoration none
  #submenu li a
    color var(--txt)
    &:hover, &:focus
      color var(--txt-act)
      background-color var(--bg-3)
      text-decoration none
  .category a:link, .category a:visited
    color var(--txt-sub)
    &:hover, &:focus
      color var(--txt)
      text-decoration none
  .category a
    shad()
    background var(--bg-4)
    &:hover, &:focus
      background var(--bg-5)
  .boxmeta h2 a:link, .boxmeta h2 a:visited
    color var(--txt-lnk)
    &:hover, &:focus
      color var(--txt-lnk-act)
      text-decoration none
      
  // ad management
  .entryadwrapperhome, .entryadwrapperhome2, .entryadwrapperhome3, .entryadwrapper, .entryadwrapper2, .entryadwrapperlabel, #HTML1
    display none
    
  // hide socials
  if xzucc
    .sharebuttuns, #HTML2, #HTML3, .linestamplink
      display none
      
  // hide promotions
  if xpromo
    [src="https://1.bp.blogspot.com/-8CoIodd2jBg/XSbwznho_MI/AAAAAAABTnQ/gGTTJepoFhk_TYyDTVl4fLZFk3GJocPdACLcBGAs/s250/banner_goods_desktop.jpg"],
    [src^="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj2Dino7dpAIlnBuIg4vEEvvE2CP5deoASLrP4Qz7Fwukn32y6nFsPERsrQNbrINsVurayaRcR6hZYGGSrTjlCfvkIPuSDbRnidozDiJHocZiLW8wBjhk_ooWFSm5-z2CaNAz0XFD8OWpTlxTDFCvXsxmnfTR18bXOOGytZX6GnZiS2UWoXukSv3mGS6w/s230/ban"]
      display none
  
  // adjust image saturation
  #torrent-description img, .comment-content img, .well img
    filter saturate(imgsat)
  
  // image shadows
  if imgshad
    #torrent-description img, .comment-content img, .well img
      shad()    
  
  // images
  img
    filter drop-shadow(2px 2px 0 var(--txt)) drop-shadow(-2px 2px 0 var(--txt)) drop-shadow(2px -2px 0 var(--txt)) drop-shadow(-2px -2px 0 var(--txt)) saturate(imgsat) brightness(imglumen)
    
  // header menu
  #botmenu
    shad()
    background-color var(--bg-2)
    border 1px solid var(--bg-3)
    border-top 0
    border-radius 0 0 prad prad
    margin-top 0
    
  // content
  .dottedborder
    display none
  .boxim
    background none
      
  // sidebar
  #wrapper
    background url(#)
  .sidebar .widget
    color var(--txt)
  .sidebar h2
    color var(--txt)
    text-shadow none
  .sidebar li
    text-shadow none
    border-bottom 0
  hr.sidebarhr
    display none
  .list-label-widget-content li
    margin-bottom 0
    
  // searchbar
  #searchwords
    sharad()
    background var(--bg-4)
    border 1px solid var(--bg-4)
    color var(--txt)
    width 219px
  #searchwords::placeholder
    color var(--txt-ph)
  #searchBtn
    background var(--bg-4)
    border 1px solid var(--bg-4)
    border-radius 0 prad prad 0
    cursor pointer
    &:hover, &:focus
      background var(--bg-6)
      border 1px solid var(--bg-6)
  #searchform
    width 230px
    
  // post content
  .post
    color var(--txt)
    border-bottom 0
  .title h2
    color var(--txt)
  .entry-post-date
    color var(--txt-sub)
  .category
    color var(--txt)
      
  // footer
  #footer
    shad()
    color var(--txt)
    background-color var(--bg-2)
    border 1px solid var(--bg-3)
    border-bottom 0
    border-radius prad prad 0 0
  #searchBtn img
    filter none
  // pyoko
  .pyokobottom
    margin-bottom 0
    margin-top 30px

  // rotating color animation
  @keyframes rainbow
    0%
      color hsl(335, 45%, 60%)
      text-shadow 0 0 10px hsl(335, 45%, 60%)
    10%
      color hsl(225, 100%, 70%)
      text-shadow 0 0 10px hsl(225, 100%, 70%)
    20%
      color hsl(190, 45%, 60%)
      text-shadow 0 0 10px hsl(190, 45%, 60%)
    30%
      color hsl(50, 45%, 60%)
      text-shadow 0 0 10px hsl(50, 45%, 60%)
    40%
      color hsl(0, 45%, 60%)
      text-shadow 0 0 10px hsl(0, 45%, 60%)
    50%
      color hsl(140, 45%, 60%)
      text-shadow 0 0 10px hsl(140, 45%, 60%)
    60%
      color hsl(200, 45%, 60%)
      text-shadow 0 0 10px hsl(200, 45%, 60%)
    70%
      color hsl(35, 60%, 40%)
      text-shadow 0 0 10px hsl(35, 60%, 40%)
    80%
      color hsl(10, 70%, 70%)
      text-shadow 0 0 10px hsl(10, 70%, 70%)
    90%
      color hsl(50, 100%, 50%)
      text-shadow 0 0 10px hsl(50, 100%, 50%)
    100%
      color hsl(335, 45%, 60%)
      text-shadow 0 0 10px hsl(335, 45%, 60%)

  // show userstyle attribution
  if xus
    .fcred::after
      content us
      display block
      white-space pre-wrap
      font-size 14px
      animation rainbow 5s infinite
...

Reviews

No reviews yet.