Commit 39d290c3 authored by rsadam@chromium.org's avatar rsadam@chromium.org

Changes the keyboard background to a linear gradient.

BUG=332073

Review URL: https://codereview.chromium.org/148613007

git-svn-id: svn://svn.chromium.org/chrome/trunk/src@247732 0039d316-1c4b-4281-b951-d872f2087c98
parent 14d8101b
......@@ -16,7 +16,7 @@
margin-bottom: 0.25em;
}
:host:nth-child(1)>:not(.dark) {
:host:nth-child(1)>:not(.dark):not(.active) {
-webkit-box-shadow: inset 0px 1px #6f6f6f, inset 0px -1px #565656;
background-image: -webkit-linear-gradient(#636363, #5b5b5b);
background-size: cover;
......@@ -24,7 +24,7 @@
border-top-color: #878787;
}
:host:nth-child(2)>:not(.dark) {
:host:nth-child(2)>:not(.dark):not(.active) {
-webkit-box-shadow: inset 0px 1px #666666, inset 0px -1px #4c4c4c;
background-image: -webkit-linear-gradient(#5a5a5a, #515151);
background-size: cover;
......@@ -32,7 +32,7 @@
border-top-color: #7f7f7f;
}
:host:nth-child(3)>:not(.dark) {
:host:nth-child(3)>:not(.dark):not(.active) {
-webkit-box-shadow: inset 0px 1px #5d5d5d, inset 0px -1px #444444;
background-image: -webkit-linear-gradient(#505050, #494949);
background-size: cover;
......@@ -40,7 +40,7 @@
border-top-color: #787878;
}
:host:nth-child(4)>:not(.dark) {
:host:nth-child(4)>:not(.dark):not(.active) {
-webkit-box-shadow: inset 0px 1px #565656, inset 0px -1px #434343;
background-image: -webkit-linear-gradient(#484848, #474747);
background-size: cover;
......@@ -48,7 +48,7 @@
border-top-color: #717171;
}
:host>:not(.dark) {
:host>:not(.dark):not(.active) {
-webkit-box-shadow: inset 0px 1px #565656, inset 0px -1px #434343;
background-image: -webkit-linear-gradient(#484848, #474747);
background-size: cover;
......
......@@ -6,7 +6,8 @@
body {
-webkit-user-select: none;
background-color: #151515;
background-image: -webkit-linear-gradient(#282828, #000000);
background-size: cover;
margin: 0;
overflow: hidden;
padding: 0;
......@@ -25,25 +26,33 @@ kb-keyboard:not(.caps-locked)[keyset=upper] kb-shift-key {
color: #d5d5d5;
}
*.dark {
.dark {
font-size: 70%;
}
.dark:not(.active) {
-webkit-box-shadow: inset 0px 1px #313131, inset 0px -1px #202020;
background-color: #222222;
border-bottom-color: #1c1c1c;
border-top-color: #4f4f4f;
font-size: 70%;
}
.caps-locked kb-shift-key.dark,
.active {
-webkit-box-shadow: inset 0px 1px #969696, inset 0px -1px #6f6f6f;
border-bottom-color: #5b5b5b;
border-top-color: #a4a4a4;
}
.caps-locked kb-shift-key.dark,
.active:not(.dark) {
background-image: -webkit-linear-gradient(#8b8b8b, #7d7d7d);
background-size: cover;
}
.caps-locked kb-shift-key,
.active {
-webkit-box-shadow: inset 0px 1px #969696, inset 0px -1px #6f6f6f !important;
/**
* TODO(rsadam): Make active keys have a linear gradient once we figure out
* how to handle keys that already have background images.
*/
.active.dark {
background-color: #8b8b8b;
border-bottom-color: #5b5b5b !important;
border-top-color: #a4a4a4 !important;
}
/**
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment