generated from vilor/hyde-template
My website.
http://www.vilor.one/
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
105 lines
2.7 KiB
105 lines
2.7 KiB
3 years ago
|
;; Copyright (C) 2022 Ivan Polyakov
|
||
|
|
;;
|
||
|
|
;; This file is part of vilor's website.
|
||
|
|
;;
|
||
|
|
;; Vilor's website is free software: you can redistribute it and/or modify
|
||
|
|
;; it under the terms of the GNU General Public License as published by
|
||
|
|
;; the Free Software Foundation, either version 3 of the License, or
|
||
|
|
;; (at your option) any later version.
|
||
|
|
;;
|
||
|
|
;; Vilor's website is distributed in the hope that it will be useful,
|
||
|
|
;; but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||
|
|
;; MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||
|
|
;; GNU General Public License for more details.
|
||
|
|
;;
|
||
|
|
;; You should have received a copy of the GNU General Public License
|
||
|
|
;; along with this program. If not, see <https://www.gnu.org/licenses/>.
|
||
|
|
|
||
|
|
(import scss)
|
||
|
|
|
||
|
|
(define scrollbar-styles
|
||
|
|
`(css+
|
||
|
|
(.scrollbar-app
|
||
|
|
((// form)
|
||
|
|
(margin-bottom 10px)
|
||
|
|
|
||
|
|
((// fieldset)
|
||
|
|
(border none)
|
||
|
|
(padding 0)
|
||
|
|
(margin 0))
|
||
|
|
|
||
|
|
((// .scrollbar-app__panel)
|
||
|
|
(margin-bottom 16px))
|
||
|
|
|
||
|
|
((// h3)
|
||
|
|
(font-size 24px)
|
||
|
|
(margin 0))
|
||
|
|
|
||
|
|
((// h4)
|
||
|
|
(font-size 20px)
|
||
|
|
(margin 12px 0 0 0))
|
||
|
|
|
||
|
|
((// .scrollbar-app__input)
|
||
|
|
(display inline-block)
|
||
|
|
(display inline-flex)
|
||
|
|
(align-items center)
|
||
|
|
(padding 8px)))
|
||
|
|
|
||
|
|
((// .scrollbar-app__panel)
|
||
|
|
(background-color "#585f70")
|
||
|
|
(padding 12px))
|
||
|
|
|
||
|
|
((// textarea)
|
||
|
|
("--sb-w" 10px)
|
||
|
|
("--thumb-clr" "#9b3e46")
|
||
|
|
("--thumb-bstl" "solid")
|
||
|
|
("--thumb-bw" 1px)
|
||
|
|
("--thumb-bclr" white)
|
||
|
|
("--thumb-brad" 8px)
|
||
|
|
("--track-clr" "#3b4252")
|
||
|
|
("--track-brad" 8px)
|
||
|
|
("--track-mt" 0px)
|
||
|
|
("--track-mb" 0px)
|
||
|
|
(height 300px)
|
||
|
|
(font-size 32px)
|
||
|
|
(overflow-y scroll)
|
||
|
|
(scrollbar-width "var(--sb-w)")
|
||
|
|
(scrollbar-color "var(--thumb-clr) var(--track-clr)")
|
||
|
|
(margin-top 60px)
|
||
|
|
|
||
|
|
((& ::-webkit-scrollbar)
|
||
|
|
(width "var(--sb-w)")
|
||
|
|
(margin-bottom 5px))
|
||
|
|
|
||
|
|
((& ::-webkit-scrollbar-thumb)
|
||
|
|
(background-color "var(--thumb-clr)")
|
||
|
|
(border-style "var(--thumb-bstl)")
|
||
|
|
(border-width "var(--thumb-bw)")
|
||
|
|
(border-color "var(--thumb-bclr)")
|
||
|
|
(border-radius "var(--thumb-brad)"))
|
||
|
|
|
||
|
|
((& ::-webkit-scrollbar-track)
|
||
|
|
(background-color "var(--track-clr)")
|
||
|
|
(border-radius "var(--track-brad)")
|
||
|
|
(margin-top "var(--track-mt)")
|
||
|
|
(margin-bottom "var(--track-mb)")))
|
||
|
|
|
||
|
|
((// .scrollbar-app__buttons)
|
||
|
|
(margin-top 24px)
|
||
|
|
|
||
|
|
((// button)
|
||
|
|
(min-width 149px)
|
||
|
|
(font-size 18px)
|
||
|
|
(background-color "#ced9f3")
|
||
|
|
(padding 14px 25px)
|
||
|
|
(border none)
|
||
|
|
(border-radius 4px)
|
||
|
|
(outline none)
|
||
|
|
(margin-right 16px)
|
||
|
|
|
||
|
|
((& :hover)
|
||
|
|
(background-color "#a2b8ed")))))))
|
||
|
|
|
||
|
|
(write-css scrollbar-styles)
|
||
|
|
(newline)
|