mirror of
https://github.com/cactuzhead/Advanced-Progress-Bars.git
synced 2026-07-22 05:42:10 +00:00
37 lines
No EOL
1.5 KiB
Markdown
37 lines
No EOL
1.5 KiB
Markdown
---
|
|
title: Box Shadow
|
|
has_toc: false
|
|
back_to_top: true
|
|
back_to_top_text: "Back to top"
|
|
nav_order: 90
|
|
---
|
|
|
|
# Box-Shadow <span class="label label-green badge">NEW v1.1.0</span>
|
|
Starting in release `1.1.0`, You can now add a box shadow to your progress bars.
|
|
|
|
Toggling the box-shadow `on` will reveal a further 4 options:-
|
|
|
|
## Box-Shadow Type
|
|
If this is toggled `off` you will have a glow shadow that shows around your progress bars container.
|
|
|
|

|
|
|
|
When you toggle this `on` you will be selecting a drop shadow and will additionally add two further settings.
|
|
|
|

|
|
|
|
These two `H-Offset` and `V-Offset` sliders will allow you to set the horizontal and vertical offsets from a range of 1 to 5 pixels.
|
|
|
|
{: .note }
|
|
The glow shadow option (obtained by toggling this `off`) is effectively setting both of these offsets to zero and is a quicker and simpler way to setup a glow shadow.
|
|
|
|
## Blur
|
|
Define the blur of the drop-shadow from a range of 0 to 5 pixels. Zero is no blur whilst five gives a nice subtle blur.
|
|
|
|
## Inset
|
|
When this is toggled `on` you invert the box-shadow so that it runs from the border of your progress bars container inwards rather than the more usual outwards.
|
|
|
|

|
|
|
|
## Box-Shadow Color
|
|
Select your desired custom color for the box-shadow with the colorpicker or use one of the `Light` or `Dark` defaults. |