mirror of
https://github.com/NativeScript/NativeScript.git
synced 2025-11-05 13:26:48 +08:00
feat(core): box shadow demo (#9182)
This commit is contained in:
committed by
Nathan Walker
parent
d46f9562b4
commit
3bd2d96f29
@@ -5,17 +5,79 @@
|
||||
The following CSS rule changes the font size of all UI
|
||||
components that have the btn class name.
|
||||
*/
|
||||
.btn {
|
||||
.btn-view-demo {
|
||||
font-size: 18;
|
||||
/* box-shadow: -5 -5 10 10 navy; */
|
||||
box-shadow: -5 -5 rgba(0,0,0,0.5);
|
||||
background-color: #add8e6;
|
||||
color: navy;
|
||||
/* TODO: adding border radius breaks shadow */
|
||||
/* border-radius: 10; */
|
||||
background-color: #65ADF1;
|
||||
border-radius: 5;
|
||||
font-size: 17;
|
||||
padding: 15;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.bold{
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.controls Label {
|
||||
font-size: 20;
|
||||
font-weight: bold;
|
||||
color: #333;
|
||||
margin-top: 10;
|
||||
}
|
||||
|
||||
.controls Button {
|
||||
padding: 10 15;
|
||||
margin: 5;
|
||||
font-size: 17;
|
||||
font-weight: bold;
|
||||
color: #65ADF1;
|
||||
border-radius: 5;
|
||||
border-width: 1;
|
||||
border-color: #65ADF1;
|
||||
}
|
||||
|
||||
.box-shadow-demo .demo-component {
|
||||
font-size: 20;
|
||||
font-weight: bold;
|
||||
color: #555;
|
||||
border-color: #555;
|
||||
margin: 10;
|
||||
padding: 20 25;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.box-shadow-demo .box-shadow-prop-controls {
|
||||
padding: 10;
|
||||
color: #333;
|
||||
font-size: 17;
|
||||
}
|
||||
|
||||
.box-shadow-demo .box-shadow-prop-controls TextField{
|
||||
margin-left: 10;
|
||||
padding: 5;
|
||||
border-bottom-width: 1;
|
||||
border-color: #65ADF1;
|
||||
}
|
||||
|
||||
.box-shadow-demo .controls .description {
|
||||
font-size: 15;
|
||||
font-weight: normal;
|
||||
color: #333;
|
||||
margin-bottom: 10;
|
||||
}
|
||||
|
||||
.box-shadow-demo .controls Button[selectedAttr=true] {
|
||||
background-color: #65ADF1;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.box-shadow-prop-controls .btn-apply {
|
||||
background-color: #65ADF1;
|
||||
color: #fff;
|
||||
padding: 10 15;
|
||||
border-radius: 4;
|
||||
margin-left: 10;
|
||||
font-size: 17;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user