본문으로 건너뛰기

기타

vim 모드 텍스트 구성, 새 탭 모양(ASCII 아트), 사이드독 아이콘, 툴팁 모서리 둥글기

허용되는 형식: px

내비게이션

Style Settings
|-- flexcyon://Others
md

환경 설정 옵션

Vim 모드 텍스트

Vim 모드 텍스트 활성화

대상 CSS 변수: var(--flexcyon-vim-mode-text-enable)

기본값: true (클래스 토글)

Vim 모드 텍스트 왼쪽 위치 지정

대상 CSS 변수: var(--flexcyon-vim-mode-left-positioning)

기본값: 6 (px)

Vim 모드 텍스트 아래쪽 위치 지정

대상 CSS 변수: var(--flexcyon-vim-mode-left-positioning)

기본값: -4 (px)

삽입 모드 텍스트

대상 CSS 변수: var(--flexcyon-vim-insert-text)

기본값: “INSERT”

일반 모드 텍스트

대상 CSS 변수: var(--flexcyon-vim-normal-text)

기본값: “NORMAL”

명령 모드 텍스트

대상 CSS 변수: var(--flexcyon-vim-command-text)

기본값: “COMMAND”


새 탭 모양

새로운 빈 탭의 모양을 사용자 정의하세요.

허용되는 형식: px

빈 상태 제목 앞에 추가

대상 CSS 클래스: .flexcyon-ascii-enable, .flexcyon-quote-enable

이 변경사항은 앱 새로고침/재시작 후 적용됩니다.

기본값: none (클래스 선택)

옵션:

  • ASCII Art
  • 인용문

새 탭 글꼴 그룹

대상 CSS 변수: var(--flexcyon-new-tab-font-group)

ASCII 아트가 잘 보이려면 다음과 같은 고정폭 글꼴을 사용하는 것이 좋습니다: Source Code Pro

기본값: none (클래스 선택)

옵션:

  • 고정폭 글꼴
  • 인터페이스 글꼴
  • 텍스트

빈 상태 제목 앞에 추가할 배경

대상 CSS 변수: var(--flexcyon-new-tab-bg-wrapper)

기본값: linear-gradient(to right, var(--collor-green), var(--text-accent))

인용문

대상 CSS 변수: var(--flexcyon-quote-val)

기본값: “This is a placeholder quote\ain the Flexcyon Theme.”

인용문 출처 접두사

대상 CSS 변수: var(--flexcyon-quote-credit-prefix)

기본값: “-”

인용문 출처

대상 CSS 변수: var(--flexcyon-quote-credit)

기본값: “bladeacer”

인용문 글꼴 크기

대상 CSS 변수: var(--flexcyon-quote-font-size)

기본값: 24 (px)

줄바꿈은 \a로, \\\로 에스케이프됩니다.

ASCII Art

대상 CSS 변수: var(--flexcyon-ascii-art)

기본값:

" \a\
       fjlj dlkg1                    un       cj                            \a\
     nze     1byk                   xh       gh                             \a\
     yg       hy     ksud fv      dza       je     fhhif1 dj    bil  j5dhjb \a\
  opvysppc    zo       jzuk      lv4       l0    gk       1le  1lb  il   lj \a\
    oz       iy       auy9      ss       ak4     mb         l0lig   mb   la \a\
    xt       hylfk  aul wrfb   vk       fis       lb0bg8    6mle   cm1  cl1 \a\
   fye        366            axd       hf                 s0if     1    s1  \a\
0ruo0                                                   sjg9l               \a\a\a"
md

CSS에서 렌더링하려면 ASCII 아트 문자열을 에스케이프해야 하며, 줄바꿈은 \a로, \\\로 에스케이프됩니다.

개별 ASCII 아트를 관리하고 구성하려면 CSS 스크립트를 사용하는 것을 강력히 권장합니다.

예제는 여기에서 확인할 수 있습니다.

ASCII 아트 글꼴 크기 제한

대상 CSS 변수: var(--flexcyon-ascii-max-font-size)

기본값: 14 (px)

ASCII 아트 행 높이

대상 CSS 변수: var(--flexcyon-ascii-line-height)

인용문의 행 높이도 변경됩니다.

기본값: 1

ASCII 아트 스케일링 팩터

대상 CSS 변수: var(--flexcyon-ascii-scaling-factor)

기본값: 1

ASCII 아트 텍스트 정렬

대상 CSS 변수: var(--flexcyon-ascii-alignment)

기본값: 왼쪽

옵션:

  • 왼쪽
  • 가운데
  • 오른쪽

빈 상태 제목 비활성화

대상 CSS 변수: var(--flexcyon-empty-state-title-disable)

기본값: true (클래스 토글)

빈 상태 액션 비활성화

대상 CSS 변수: var(--flexcyon-empty-state-actions-disable)

기본값: true (클래스 토글)


사이드 도크

사이드 도크 아이콘 설정하기

사이드 도크 아이콘 효과 활성화

호버 시 무지개 효과

대상 CSS 변수: var(--flexcyon-sidedock-icon-effects)

기본값: true (클래스 토글)

사이드 도크 리본 너비

대상 CSS 변수: var(--flexcyon-sidedock-ribbon-width)

기본값: 48 (px)

워크스페이스 리본을 상단에 배치

대상 CSS 변수: var(--flexcyon-ribbon-top)

기본값: false (클래스 토글)

볼트 스위처를 상단에 배치

대상 CSS 변수: var(--flexcyon-vault-switch-top)

기본값: false (클래스 토글)

볼트 스위처와 액션의 순서 반전

대상 CSS 변수: var(--flexcyon-vault-reverse)

기본값: false (클래스 토글)


툴팁 모서리 둥글기

툴팁 모서리 둥글기 설정하기

Small 래디우스

대상 CSS 변수: var(--radius-s)

기본값: 2 (px)

Medium 래디우스

대상 CSS 변수: var(--radius-m)

기본값: 4 (px)

Large 래디우스

대상 CSS 변수: var(--radius-l)

기본값: 6 (px)

Extra large 래디우스

대상 CSS 변수: var(--radius-xl)

기본값: 8 (px)


사이드바 배경

왼쪽 및 오른쪽 사이드바의 배경 이미지 설정하기

허용되는 형식: px, %

사이드바 배경 선택

대상 CSS 클래스: .flexcyon-sidebar-bg-dots, .flexcyon-sidebar-bg-grid, flexcyon-sidebar-bg-rhombus

아래의 배경 이미지 선언을 덮어쓰며, 왼쪽과 오른쪽 사이드바 모두에 적용됩니다.

기본값: none (클래스 선택)

옵션:

  • 격자
  • 점선
  • 마름모

왼쪽 사이드바 배경 이미지 URL

대상 CSS 변수: var(--flexcyon-bg-image-sidebar-left-url)

기본값: url("")

URL이 작동하려면 이중 따옴표 사이에 URL을 추가하세요. 예: url("https://fake_domain/not_a_real_image.png")

오른쪽 사이드바 배경 이미지 URL

대상 CSS 변수: var(--flexcyon-bg-image-sidebar-right-url)

기본값: url("")

URL이 작동하려면 이중 따옴표 사이에 URL을 추가하세요. 예: url("https://fake_domain/not_a_real_image.png")

사이드바 배경 이미지 혼합 모드

대상 CSS 변수: var(--flexcyon-bg-image-blend-mode)

기본값: darken

사이드바 배경 이미지 반복

대상 CSS 변수: var(--flexcyon-bg-image-repeat)

기본값: no-repeat

사이드바 배경 이미지 흐림 효과

대상 CSS 변수: var(--flexcyon-bg-image-blur)

기본값: 0 (px)

사이드바 배경 이미지 밝기

대상 CSS 변수: var(--flexcyon-bg-image-brightness)

기본값: unset

55%와 같은 백분율 값을 받습니다.

사이드바 배경 이미지 크기

대상 CSS 변수: var(--flexcyon-bg-image-size)

기본값: contain

사이드바 배경 이미지 위치

대상 CSS 변수: var(--flexcyon-bg-image-position)

기본값: center


모달 배경

설정 메뉴, 프롬프트 등의 배경 이미지 설정하기

허용되는 형식: px, %

모달 배경 이미지 URL

대상 CSS 변수: var(--flexcyon-modal-bg-url)

기본값: url("")

URL이 작동하려면 이중 따옴표 사이에 URL을 추가하세요. 예: url("https://fake_domain/not_a_real_image.png")

모달 배경 이미지 혼합 모드

대상 CSS 변수: var(--flexcyon-modal-image-blend-mode)

기본값: lighten

모달 배경 이미지 반복

대상 CSS 변수: var(--flexcyon-modal-image-repeat)

기본값: no-repeat

모달 배경 이미지 흐림 효과

대상 CSS 변수: var(--flexcyon-modal-image-blur)

기본값: 0 (px)

모달 배경 이미지 밝기

대상 CSS 변수: var(--flexcyon-bg-modal-brightness)

기본값: unset

55%와 같은 백분율 값을 받습니다.

모달 배경 이미지 크기

대상 CSS 변수: var(--flexcyon-modal-image-size)

기본값: cover

모달 배경 이미지 위치

대상 CSS 변수: var(--flexcyon-modal-image-position)

기본값: center

모달 배경 어두움 강도

대상 CSS 변수: var(--flexcyon-modal-dark-intensity)

기본값: 1