본문으로 건너뛰기
사용자

nyangx3/a(비교)

보기RAW역사
r99 vs r100
......
17441744
* {{{+1 A}}}('''A'''ny): 랜덤 문서
17451745
--F, E 빼곤 딱히 쓸 곳이 없다.--}}}}}}
17461746
----
1747
* 문법
1747
* CSS Custom Property
1748
{{{#!wiki style="margin-left: -25px"
17481749
* espejo, liberty 스킨은 화이트 모든 배경색이 #fff로 같으나 다크 모드 배경색이 각각 #1c1d1f, #000로 다른데, 스타일 문법에서 background: var(--article-background-color)를 쓰는 방식으로 이를 가져올 수 있다.
1749
{{{#!wiki style="margin: -5px 0 -5px 28px; display: table; font-size: .75rem"
1750
{{{#!folding [ 그 외 펼치기 · 접기 ]
1750
그 외 color: var(--text-color)로 스킨 상관 없이 기본 텍스트 색[* #373a3c,#ddd]을 가져올 수 있으며, espejo 스킨 한정으로 color: var(--espejo-link-color)로 기본 링크 색[* #0275d8,#e69720]을 가져올 수 있다.
1751
* 그 외에도 있으나 따로 정리하기 귀찮으니 속성 이름과 값을 보고 알아서 유추하시길..
1752
{{{#!wiki style="font-size: .75rem; display: table"
1753
{{{#!folding [ (espejo/색상) 펼치기 · 접기 ]
1754
##)]
1755
{{{#!if a='width: 1em; height: 1em; display: inline-table; vertical-align: -2px; border: 1px black solid" dark-style="border: 1px white solid"'
1756
}}}--espejo-background-color: #f5f5f5 {{{#!wiki style="background: #f5f5f5; @a@
1757
}}}
1758
--espejo-text-color: #212529 {{{#!wiki style="background: #212529; @a@
1759
}}}
1760
--espejo-text-secondary-color: rgba(33, 37, 41, .749) {{{#!wiki style="background: rgba(33, 37, 41, .749); @a@
1761
}}}
1762
--espejo-text-tertiary-color: rgba(33, 37, 41, .502) {{{#!wiki style="background: rgba(33, 37, 41, .502); @a@
1763
}}}
1764
--espejo-text-quaternary-color: rgba(33, 37, 41, .353) {{{#!wiki style="background: rgba(33, 37, 41, .353); @a@
1765
}}}
1766
--espejo-text-light-color: #212529 {{{#!wiki style="background: #212529; @a@
1767
}}}
1768
--espejo-link-color: #0275d8 {{{#!wiki style="background: #0275d8; @a@
1769
}}}
1770
--espejo-link-hover-color: #0263b8 {{{#!wiki style="background: #0263b8; @a@
1771
}}}
1772
--espejo-link-external-color: #377e21 {{{#!wiki style="background: #377e21; @a@
1773
}}}
1774
--espejo-highlight-color: rgba(231, 227, 23, .5) {{{#!wiki style="background: rgba(231, 227, 23, .5); @a@
1775
}}}
1776
--espejo-white-color: #fff {{{#!wiki style="background: #fff; @a@
1777
}}}
1778
--espejo-black-color: #000 {{{#!wiki style="background: #000; @a@
1779
}}}
1780
--espejo-danger-color: #d64a58 {{{#!wiki style="background: #d64a58; @a@
1781
}}}
1782
--espejo-danger-hover-color: #ab3b46 {{{#!wiki style="background: #ab3b46; @a@
1783
}}}
1784
--espejo-pink-color: #db2777 {{{#!wiki style="background: #db2777; @a@
1785
}}}
1786
--espejo-brand1-color: #00a69c {{{#!wiki style="background: #00a69c; @a@
1787
}}}
1788
--espejo-brand2-color: #28b472 {{{#!wiki style="background: #28b472; @a@
1789
}}}
1790
--espejo-brand-bright1-color: #bfe9d5 {{{#!wiki style="background: #bfe9d5; @a@
1791
}}}
1792
--espejo-brand-bright2-color: #d4f0e3 {{{#!wiki style="background: #d4f0e3; @a@
1793
}}}
1794
--espejo-card-background-color: #fff {{{#!wiki style="background: #fff; @a@
1795
}}}
1796
--espejo-card-border-color: #ccc {{{#!wiki style="background: #ccc; @a@
1797
}}}
1798
--espejo-component-background-color: #fff {{{#!wiki style="background: #fff; @a@
1799
}}}
1800
--espejo-component-background-focus-color: #f2f2f2 {{{#!wiki style="background: #f2f2f2; @a@
1801
}}}
1802
--espejo-component-border-color: #ced4da {{{#!wiki style="background: #ced4da; @a@
1803
}}}
1804
--espejo-component-border-focus-color: #878a8d {{{#!wiki style="background: #878a8d; @a@
1805
}}}
1806
--espejo-button-background-color: #fff {{{#!wiki style="background: #fff; @a@
1807
}}}
1808
--espejo-button-background-disabled-color: #f7f7f7 {{{#!wiki style="background: #f7f7f7; @a@
1809
}}}
1810
--espejo-button-background-secondary-color: #a2a2a2 {{{#!wiki style="background: #a2a2a2; @a@
1811
}}}
1812
--espejo-button-background-active-color: #d4f0e3 {{{#!wiki style="background: #d4f0e3; @a@
1813
}}}
1814
--espejo-button-background-danger-color: #d64a58 {{{#!wiki style="background: #d64a58; @a@
1815
}}}
1816
--espejo-button-background-hover-color: #efefef {{{#!wiki style="background: #efefef; @a@
1817
}}}
1818
--espejo-button-background-secondary-hover-color: #aaa {{{#!wiki style="background: #aaa; @a@
1819
}}}
1820
--espejo-button-background-active-hover-color: #c9e4d8 {{{#!wiki style="background: #c9e4d8; @a@
1821
}}}
1822
--espejo-button-background-danger-hover-color: #c1434f {{{#!wiki style="background: #c1434f; @a@
1823
}}}
1824
--espejo-button-background-focus-color: #f3f3f3 {{{#!wiki style="background: #f3f3f3; @a@
1825
}}}
1826
--espejo-button-background-secondary-focus-color: #a7a7a7 {{{#!wiki style="background: #a7a7a7; @a@
1827
}}}
1828
--espejo-button-background-active-focus-color: #cee9dc {{{#!wiki style="background: #cee9dc; @a@
1829
}}}
1830
--espejo-button-background-danger-focus-color: #c74552 {{{#!wiki style="background: #c74552; @a@
1831
}}}
1832
--espejo-button-border-color: #dadada {{{#!wiki style="background: #dadada; @a@
1833
}}}
1834
--espejo-button-border-hover-color: #c5c5c5 {{{#!wiki style="background: #c5c5c5; @a@
1835
}}}
1836
--espejo-button-border-focus-color: #c5c5c5 {{{#!wiki style="background: #c5c5c5; @a@
1837
}}}
1838
--espejo-nav-bar-background-color: linear-gradient(90deg, #00a69c {{{#!wiki style="background: #00a69c; @a@
1839
}}}, #00a69c {{{#!wiki style="background: #00a69c; @a@
1840
}}}, #28b472 {{{#!wiki style="background: #28b472; @a@
1841
}}});
1842
--espejo-nav-bar-text-color: #fff {{{#!wiki style="background: #fff; @a@
1843
}}}
1844
--espejo-nav-bar-item-hover-color: hsla(0, 0%, 100%, .1) {{{#!wiki style="background: hsla(0, 0%, 100%, .1); @a@
1845
}}}
1846
--espejo-nav-bar-border-color: #ccc {{{#!wiki style="background: #ccc; @a@
1847
}}}
1848
--espejo-site-notice-background-color: #fefc8c {{{#!wiki style="background: #fefc8c; @a@
1849
}}}
1850
--espejo-site-notice-icon-background-color: #e5e37e {{{#!wiki style="background: #e5e37e; @a@
1851
}}}
1852
--espejo-article-title-namespace-underline-color: inset 0 -0.5rem 0 #d4f0e3 {{{#!wiki style="background: #d4f0e3; @a@
1853
}}}
1854
--espejo-article-menu-background-color: #fff {{{#!wiki style="background: #fff; @a@
1855
}}}
1856
--espejo-toc-map-item-background-1-color: #5a5a5a {{{#!wiki style="background: #5a5a5a; @a@
1857
}}}
1858
--espejo-toc-map-item-background-2-color: #5a5a5a {{{#!wiki style="background: #5a5a5a; @a@
1859
}}}
1860
--espejo-toc-map-item-background-3-color: #8c8c8c {{{#!wiki style="background: #8c8c8c; @a@
1861
}}}
1862
--espejo-toc-map-item-background-4-color: #adadad {{{#!wiki style="background: #adadad; @a@
1863
}}}
1864
--espejo-toc-map-item-background-5-color: #bdbdbd {{{#!wiki style="background: #bdbdbd; @a@
1865
}}}
1866
--espejo-toc-map-item-background-6-color: #bdbdbd {{{#!wiki style="background: #bdbdbd; @a@
1867
}}}
1868
--espejo-toc-map-item-background-hover-1-color: #404040 {{{#!wiki style="background: #404040; @a@
1869
}}}
1870
--espejo-toc-map-item-background-hover-2-color: #404040 {{{#!wiki style="background: #404040; @a@
1871
}}}
1872
--espejo-toc-map-item-background-hover-3-color: #797979 {{{#!wiki style="background: #797979; @a@
1873
}}}
1874
--espejo-toc-map-item-background-hover-4-color: #a0a0a0 {{{#!wiki style="background: #a0a0a0; @a@
1875
}}}
1876
--espejo-toc-map-item-background-hover-5-color: #b3b3b3 {{{#!wiki style="background: #b3b3b3; @a@
1877
}}}
1878
--espejo-toc-map-item-background-hover-6-color: #b3b3b3 {{{#!wiki style="background: #b3b3b3; @a@
1879
}}}
1880
--espejo-nav-control-background-color: #1aafa6 {{{#!wiki style="background: #1aafa6; @a@
1881
}}}
1882
--espejo-nav-control-text-color: #fff {{{#!wiki style="background: #fff; @a@
1883
}}}
1884
--espejo-nav-control-border-color: rgba(206, 212, 218, .5) {{{#!wiki style="background: rgba(206, 212, 218, .5); @a@
1885
}}}
1886
--light-text-color: #212529 {{{#!wiki style="background: #212529; @a@
1887
}}}
1888
--dark-text-color: #e0e0e0 {{{#!wiki style="background: #e0e0e0; @a@
1889
}}}
1890
--light-text-secondary-color: rgba(33, 37, 41, .749) {{{#!wiki style="background: rgba(33, 37, 41, .749); @a@
1891
}}}
1892
--dark-text-secondary-color: hsla(0, 0%, 88%, .749) {{{#!wiki style="background: hsla(0, 0%, 88%, .749); @a@
1893
}}}
1894
--light-link-color: #0275d8 {{{#!wiki style="background: #0275d8; @a@
1895
}}}
1896
--dark-link-color: #ec9f19 {{{#!wiki style="background: #ec9f19; @a@
1897
}}}
1898
--light-article-background-color: #fff {{{#!wiki style="background: #fff; @a@
1899
}}}
1900
--dark-article-background-color: #1c1d1f {{{#!wiki style="background: #1c1d1f; @a@
1901
}}}
17511902
}}}}}}
1903
{{{#!wiki style="font-size: .75rem; display: table"
1904
{{{#!folding [ (espejo/색상 외) 펼치기 · 접기 ]
1905
##)]
1906
--espejo-layout-gutter-var: 0;
1907
--espejo-card-gutter-var: 1rem;
1908
--espejo-content-gutter-var: 0;
1909
--espejo-nav-bar-height-var: 3rem;
1910
--espejo-nav-bar-brand-gap-var: 0.5rem;
1911
--espejo-nav-bar-menu-item-gap-var: 0;
1912
--espejo-nav-bar-image-height-var: 2rem;
1913
--espejo-search-box-gap-var: 0;
1914
--espejo-search-box-gutter-left-var: env(safe-area-inset-left, 0);
1915
--espejo-search-box-gutter-right-var: env(safe-area-inset-right, 0);
1916
--espejo-search-box-button-width-var: 2rem;
1917
--espejo-search-box-left-button-width-var: 2.25rem;
1918
--espejo-search-box-suggest-gutter-left-var: max(env(safe-area-inset-left, 0), 0.25rem);
1919
--espejo-search-box-suggest-gutter-right-var: max(env(safe-area-inset-right, 0), 0.25rem);
1920
--espejo-site-notice-gap-left-var: env(safe-area-inset-left, 0);
1921
--espejo-site-notice-gap-right-var: env(safe-area-inset-right, 0);
1922
--espejo-sidebar-item-gutter-left-var: calc(env(safe-area-inset-left, 0) + 1rem);
1923
--espejo-sidebar-item-gutter-right-var: calc(env(safe-area-inset-right, 0) + 1rem);
1924
--espejo-article-gutter-left-var: calc(env(safe-area-inset-left, 0) + 1rem);
1925
--espejo-article-gutter-right-var: calc(env(safe-area-inset-right, 0) + 1rem);
1926
--espejo-article-gutter-y-var: 1rem;
1927
--espejo-article-title-gutter-bottom-var: 1.25rem;
1928
--espejo-article-wiki-title-gutter-bottom-var: 1rem;
1929
--espejo-nav-control-gutter-x-var: 1.5rem;
1930
--espejo-nav-control-gutter-y-var: 1.5rem;
1931
--espejo-nav-control-gap-var: 0.5rem;
1932
--espejo-sidebar-width-var: 280px;
1933
--espejo-nav-control-toc-popup-width-var: 280px;
1934
--espejo-page-font-size-var: 15px;
1935
--espejo-page-font-family-var: "Pretendard JP", Pretendard, -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Noto Sans KR", "Noto Sans CJK KR", "NanumBarunGothic", Roboto, "Segoe UI", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif, emoji;
1936
--espejo-page-font-weight-var: 400;
1937
--espejo-layout-gutter-var: 1rem;
1938
--espejo-card-gutter-var: 1.25rem;
1939
--espejo-content-gutter-var: 1rem;
1940
--espejo-card-border-width-var: 1px;
1941
--espejo-card-border-radius-var: 6px;
1942
--espejo-button-border-width-var: 1px;
1943
--espejo-button-border-radius-var: 0.3rem;
1944
--espejo-button-gutter-x-var: 0.75rem;
1945
--espejo-button-gutter-y-var: 0.25rem;
1946
--espejo-nav-bar-height-var: 3.5rem;
1947
--espejo-nav-bar-gutter-left-var: max(env(safe-area-inset-left, 0), 1rem);
1948
--espejo-nav-bar-gutter-right-var: max(env(safe-area-inset-right, 0), 1rem);
1949
--espejo-nav-bar-gutter-y-var: 0.5rem;
1950
--espejo-nav-bar-border-width-var: 1px;
1951
--espejo-nav-bar-brand-gap-var: 1rem;
1952
--espejo-nav-bar-child-radius-var: 4px;
1953
--espejo-nav-bar-menu-item-gutter-var: 0.75rem;
1954
--espejo-nav-bar-menu-item-gap-var: 0.5rem;
1955
--espejo-nav-bar-menu-icon-size-var: 1rem;
1956
--espejo-nav-bar-menu-icon-size-large-var: 1.2rem;
1957
--espejo-nav-bar-menu-icon-gap-var: 0.75rem;
1958
--espejo-nav-bar-menu-font-size-var: 1.05rem;
1959
--espejo-nav-bar-menu-font-weight-var: 500;
1960
--espejo-nav-bar-image-menu-item-gutter-var: 0.5rem;
1961
--espejo-nav-bar-image-height-var: 2.5rem;
1962
--espejo-search-box-width-var: 20rem;
1963
--espejo-search-box-height-var: 2.5rem;
1964
--espejo-search-box-gap-var: 0.5rem;
1965
--espejo-search-box-gutter-left-var: 0;
1966
--espejo-search-box-gutter-right-var: 0;
1967
--espejo-search-box-button-width-var: 2.25rem;
1968
--espejo-search-box-left-button-width-var: 2.5rem;
1969
--espejo-search-box-suggest-gap-top-var: 0.75rem;
1970
--espejo-search-box-suggest-gutter-left-var: 0.25rem;
1971
--espejo-search-box-suggest-gutter-right-var: 0.25rem;
1972
--espejo-search-box-suggest-item-gutter-x-var: 0.5rem;
1973
--espejo-search-box-suggest-item-gutter-y-var: 0.5rem;
1974
--espejo-site-notice-gap-left-var: 0;
1975
--espejo-site-notice-gap-right-var: 0;
1976
--espejo-site-notice-gutter-x-var: 0.75rem;
1977
--espejo-site-notice-gutter-y-var: 0.75rem;
1978
--espejo-dropdown-menu-gutter-x-var: 0;
1979
--espejo-dropdown-menu-gutter-y-var: 0.25rem;
1980
--espejo-dropdown-menu-gap-top-var: 0.25rem;
1981
--espejo-dropdown-menu-gap-x-var: 0.25rem;
1982
--espejo-dropdown-menu-item-gutter-x-var: 0.75rem;
1983
--espejo-dropdown-menu-item-gutter-y-var: 0.375rem;
1984
--espejo-dropdown-menu-item-gutter-y-tight-var: 0.3125rem;
1985
--espejo-dropdown-menu-item-gap-x-var: 0.25rem;
1986
--espejo-dropdown-menu-item-gap-y-var: 0.125rem;
1987
--espejo-dropdown-menu-item-gap-y-tight-var: 0;
1988
--espejo-dropdown-menu-item-border-radius-var: 4px;
1989
--espejo-dropdown-menu-item-icon-gap-var: 0.75rem;
1990
--espejo-dropdown-menu-item-icon-gap-tight-var: 0.35rem;
1991
--espejo-dropdown-menu-header-gutter-x-var: 1rem;
1992
--espejo-dropdown-menu-header-gutter-top-var: 0.375rem;
1993
--espejo-dropdown-menu-header-gutter-bottom-var: 0.125rem;
1994
--espejo-sidebar-width-var: 320px;
1995
--espejo-sidebar-item-gutter-left-var: 1.25rem;
1996
--espejo-sidebar-item-gutter-right-var: 1.25rem;
1997
--espejo-sidebar-item-gutter-bottom-var: 1rem;
1998
--espejo-article-min-height-var: 50rem;
1999
--espejo-article-gutter-left-var: 1.5rem;
2000
--espejo-article-gutter-right-var: 1.5rem;
2001
--espejo-article-gutter-y-var: 1.5rem;
2002
--espejo-article-seperator-width-var: 1px;
2003
--espejo-article-seperator-gap-var: 1.5rem;
2004
--espejo-article-title-gutter-bottom-var: 1.5rem;
2005
--espejo-article-wiki-title-gutter-bottom-var: 1.5rem;
2006
--espejo-nav-control-gutter-x-var: 2.5rem;
2007
--espejo-nav-control-gutter-y-var: 2rem;
2008
--espejo-nav-control-gap-var: 0.75rem;
2009
--espejo-nav-control-item-width-var: 2.5rem;
2010
--espejo-nav-control-item-height-var: 2.5rem;
2011
--espejo-nav-control-toc-popup-width-var: 320px;
2012
--espejo-nav-control-toc-popup-max-height-var: 28rem;
2013
}}}}}}
2014
{{{#!wiki style="font-size: .75rem; display: table"
2015
{{{#!folding [ (liberty) 펼치기 · 접기 ]
2016
##)]
2017
--liberty-brand-color: #008275 {{{#!wiki style="background: #008275; @a@
2018
}}}
2019
--liberty-brand-dark-color: #00413b {{{#!wiki style="background: #00413b; @a@
2020
}}}
2021
--liberty-brand-bright-color: #80c1ba {{{#!wiki style="background: #80c1ba; @a@
2022
}}}
2023
--liberty-navbar-logo-image: url(https://namu.wiki/liberty_namu_logo.png);
2024
--liberty-navbar-logo-minimum-width: 6rem;
2025
--text-color: #373a3c {{{#!wiki style="background: #373a3c; @a@
2026
}}}
2027
--article-background-color: #fff {{{#!wiki style="background: #fff; @a@
2028
}}}
2029
----
2030
--liberty-brand-color: #2d2f34 {{{#!wiki style="background: #2d2f34; @a@
2031
}}}
2032
--liberty-brand-dark-color: #16171a {{{#!wiki style="background: #16171a; @a@
2033
}}}
2034
--liberty-brand-bright-color: #383b40 {{{#!wiki style="background: #383b40; @a@
2035
}}}
2036
--liberty-navbar-logo-image: url(https://namu.wiki/liberty_namu_logo.png);
2037
--liberty-navbar-logo-minimum-width: 6rem;
2038
--text-color: #ddd {{{#!wiki style="background: #ddd; @a@
2039
}}}
2040
--article-background-color: #000 {{{#!wiki style="background: #000; @a@
2041
}}}
2042
}}}}}}
17522043
*
2044
}}}
17532045
* 토론
17542046
* 빈 토론을 만들기 위해 {{{##}}}같은 주석 문법을 많이 사용하는데, 사실 {{{\}}} 한 글자로도 만들 수 있다.
17552047
{{{#!wiki style="display: none"
......
    ♠ Built with Ace of Spades.