사용자:Hsl0/vector.css: 두 판 사이의 차이

큰숲백과, 나무를 보지 말고 큰 숲을 보라.
편집 요약 없음
편집 요약 없음
1번째 줄: 1번째 줄:
.skin-vector-legacy {
--site-background: #98FB98;
--blur: blur(10px);
--radius: 16px;
}
#buttons {
#buttons {
    /* background: #5B5 */
     position: fixed;
     position: fixed;
     bottom: 1rem;
    display: inline-block;
     left: 1rem;
     bottom: 0.5em;
     left: 0.5em;
     z-index: 10;
     z-index: 10;
   
    display: flex;
    contain: content;
   
    background: color-mix(in srgb,var(--site-background),#ffffffcc 95%);
    backdrop-filter: var(--blur);
   
    box-shadow: #00000030 0px 0px 15px 0px;
    border-radius: var(--radius);
}
}
#buttons > button {
#buttons > button {
     display: block;
     background: #5B5;
     height: 2.5em;
     padding: 0.2em 0.5em;
     width: 2.5em;
     color: #FFF;
      
     position: relative;
     background: none;
     display: inline-block;
     border: none;
     margin-left: 0.7em;
      
     z-index: 10;
    font-size: 20px;
     cursor: pointer;
     cursor: pointer;
      
     transition: bottom 0.5s;
     transition: filter 250ms ease, box-shadow 250ms ease-out;
     -webkit-transition: bottom 0.5s;
   
     user-select: none;
     user-select: none;
     -webkit-user-select: none;
     -webkit-user-select: none;
     -ms-user-select: none;
     -moz-user-select: none;
}
     -ms-user-select: none
#buttons > button:first-child {
     border-radius: var(--radius) 0 0 var(--radius);
}
#buttons > button:last-child {
    border-radius: 0 var(--radius) var(--radius) 0;
}
#buttons > button:active {
    filter: blur(1px);
    box-shadow: #00000000 0 0, inset #00000030 0px 0px 8px 0px;
}
#buttons > button:hover:not(:active) {
    box-shadow: #00000030 0px 0px 15px 0px, inset #00000000 0 0;
}
}

2024년 11월 6일 (수) 22:40 판

#buttons {
    /* background: #5B5 */
    position: fixed;
    display: inline-block;
    bottom: 0.5em;
    left: 0.5em;
    z-index: 10;
}
#buttons > button {
    background: #5B5;
    padding: 0.2em 0.5em;
    color: #FFF;
    position: relative;
    display: inline-block;
    margin-left: 0.7em;
    z-index: 10;
    cursor: pointer;
    transition: bottom 0.5s;
    -webkit-transition: bottom 0.5s;
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none
}
원본 주소 "https://bigforest.a2hosted.com/w/index.php?title=사용자:Hsl0/vector.css&oldid=82123"