- CSS3 effects like box-shadow are applied with the StyleContext::render_background() function
* first, an outset box-shadow is rendered _outside_ the box given as parameter to `render_background()`
* then the box is filled with the background colour
* and last, an inset box-shadow is rendered _inside_ the area of a would-be border,
without rendering the border itself.
* consequently we can not shade the border itself and we can not shade the content
53 lines
1.3 KiB
CSS
53 lines
1.3 KiB
CSS
/*
|
|
gtk-style-experiment.css - investigate GTKs CSS implementation
|
|
|
|
Copyright (C) Lumiera.org
|
|
2019, Hermann Vosseler <Ichthyostega@web.de>
|
|
|
|
Styles and Graphics of the Lumiera GUI can be used and redistributed
|
|
under the the terms of the GNU General Public License version 2 or
|
|
above, or (at your option) under Creative Commons CC-By-SA.
|
|
|
|
* ********************************************************/
|
|
|
|
|
|
/* CSS stylesheet loaded by gtk-style-experiment.cpp on top of
|
|
* the system theme, with GTK_STYLE_PROVIDER_PRIORITY_APPLICATION
|
|
*/
|
|
|
|
|
|
|
|
|
|
/* ---------- Styles for Lumiera Widgets ---------- */
|
|
|
|
|
|
/* ---------- Styles for special markup ---------- */
|
|
|
|
|
|
/* special styling for the frame widget within the main window....
|
|
* This styling will be picked up by our custom drawing code
|
|
*/
|
|
frame.experiment {
|
|
margin: 2em 1ex 0;
|
|
border-style: inset;
|
|
border-color: IndianRed;
|
|
background-color: Lime;
|
|
box-shadow: inset 2px 2px 5px 1px DeepSkyBlue,
|
|
5px 5px 2px 10px DeepPink;
|
|
}
|
|
.track-slope-deep1 {
|
|
border-width: 5px;
|
|
}
|
|
.track-slope-deep2 {
|
|
border-width: 10px;
|
|
}
|
|
frame.track-slope-deep3 {
|
|
border-width: 14px;
|
|
border-color: Cyan;
|
|
}
|
|
.track-slope-deep4 {
|
|
border-width: 17px;
|
|
}
|
|
.track-slope-verydeep {
|
|
border-width: 20px;
|
|
}
|