Skip to content
GitLab
Projects
Groups
Snippets
/
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Sign in
Toggle navigation
Menu
Open sidebar
Miroslav Kratochvil
jekyll-theme-lcsb-default
Commits
5c68ee0b
Verified
Commit
5c68ee0b
authored
Apr 20, 2020
by
Laurent Heirendt
✈
Browse files
add css for banner
parent
05f77f4f
Changes
1
Hide whitespace changes
Inline
Side-by-side
_sass/minima/_gdpr.scss
View file @
5c68ee0b
...
...
@@ -89,4 +89,81 @@
-moz-user-select
:
none
;
-ms-user-select
:
none
;
user-select
:
none
;
}
// Small component to show a Material Design style input toggle
// ref: https://codepen.io/FezVrasta/pen/yNRgrB - MIT licensed
$toggle-w
:
32px
;
$toggle-h
:
14px
;
$handle-size
:
18px
;
$unchecked-handle-bg
:
#F1F1F1
;
$checked-handle-bg
:
#198cdc
;
$disabled-handle-bg
:
#BDBDBD
;
$unchecked-toggle-bg
:
#848484
;
$checked-toggle-bg
:
desaturate
(
lighten
(
$checked-handle-bg
,
28%
)
,
32%
);
// kind of magic recipe
$disabled-toggle-bg
:
#D5D5D5
;
label
.input-toggle
{
line-height
:
0
;
font-size
:
0
;
display
:
inline-block
;
margin
:
0
;
>
span
{
display
:
inline-block
;
position
:
relative
;
background-image
:
linear-gradient
(
to
right
,
$unchecked-toggle-bg
0%
,
$unchecked-toggle-bg
50%
,
$checked-toggle-bg
50%
,
$checked-toggle-bg
100%
);
background-size
:
$toggle-w
*
2
$toggle-h
;
background-position
:
0%
;
border-radius
:
$toggle-w
;
width
:
$toggle-w
;
height
:
$toggle-h
;
cursor
:
pointer
;
transition
:
background-position
0
.2s
ease-in
;
}
>
input
:checked
+
span
{
background-position
:
-100%
;
}
>
span
:after
{
content
:
""
;
display
:
block
;
position
:
absolute
;
width
:
$handle-size
;
height
:
$handle-size
;
background
:
$unchecked-handle-bg
;
align-self
:
center
;
top
:
50%
;
left
:
0
;
transform
:
translateY
(
-50%
);
border-radius
:
100%
;
//box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
transition
:
left
0
.2s
ease-in
,
background-color
0
.2s
ease-in
,
transform
0
.3s
ease
;
}
>
input
:checked
+
span
:after
{
left
:
$handle-size
;
background-color
:
$checked-handle-bg
;
}
// Jelly effect on click
>
span
:active:after
{
//transform: translateY(-50%) scale3d(1.15, 0.85, 1);
}
// No jelly effect on disabled toggles
>
input
:disabled
+
span
:active:after
{
transform
:
translateY
(
-50%
);
}
>
input
:disabled
+
span
{
cursor
:
default
;
}
>
input
:disabled
+
span
{
background
:
$disabled-toggle-bg
;
}
>
input
:disabled
+
span
:after
{
background
:
$disabled-handle-bg
;
}
// Hide original checkbox, but don't use `display: none` to allow focus on it using keyboard
>
input
{
display
:
block
;
position
:
absolute
;
opacity
:
0
;
width
:
0
;
height
:
0
;
}
}
\ No newline at end of file
Write
Preview
Supports
Markdown
0%
Try again
or
attach a new file
.
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment