summaryrefslogtreecommitdiff
path: root/src/components/HMI/css/buttonControls.css
diff options
context:
space:
mode:
Diffstat (limited to 'src/components/HMI/css/buttonControls.css')
-rw-r--r--src/components/HMI/css/buttonControls.css546
1 files changed, 546 insertions, 0 deletions
diff --git a/src/components/HMI/css/buttonControls.css b/src/components/HMI/css/buttonControls.css
new file mode 100644
index 0000000000..39ef852853
--- /dev/null
+++ b/src/components/HMI/css/buttonControls.css
@@ -0,0 +1,546 @@
+/**
+ * buttonControls module CSS
+ *
+ * @category Style Sheets
+ * @filesource css/buttonControls.css
+ * @version 2.0
+ */
+#buttonControls.buttonControls {
+ width: 270px;
+ height: 200px;
+ top: 0px;
+ left: 790px;
+}
+
+#driverDistractionControl.driverDistractionControl {
+ width: 302px;
+ height: 20px;
+ top: 423px;
+ left: 810px;
+}
+
+#driverDistractionControl .driverDistractionControlLabel {
+ left: 20px;
+}
+
+#keyboard_view .back-button{
+ top: 58px;
+}
+
+#keyboard_view .controlls{
+ top: 350px;
+ width: 800px;
+ height: 75px;
+}
+
+#keyboard_view .controll{
+ margin: 10px;
+ height: 60px;
+ border: 1px solid #333;
+ text-align: center;
+ line-height: 60px;
+ border-radius: 3px;
+}
+
+#keyboard_view .controlls .leftBtn{
+ width: 130px;
+ left: 0px;
+}
+
+#keyboard_view .controlls .numericBtn{
+ width: 60px;
+ left: 145px;
+}
+
+#keyboard_view .controlls .symbolBtn{
+ width: 60px;
+ left: 220px;
+}
+
+#keyboard_view .controlls .spaceBtn{
+ width: 215px;
+ left: 295px;
+}
+
+#keyboard_view .controlls .caseSwitchBtn{
+ width: 60px;
+ left: 525px;
+}
+
+#keyboard_view .controlls .localisationBtn{
+ width: 60px;
+ left: 600px;
+}
+
+#keyboard_view .controlls .searchBtn{
+ width: 100px;
+ left: 677px;
+}
+
+#keyboard_view .keyboardLayout{
+ width: 750px;
+ height: 185px;
+ top: 170px;
+ left: 25px;
+}
+
+#keyboard_view .keyboardLayout.wide{
+ left: 5px !important;
+}
+
+#keyboard_view .searchBar{
+ top: 58px;
+ width: 666px;
+ height: 49px;
+ left: 120px;
+}
+
+#keyboard_view input{
+ width: 597px;
+ height: 48px;
+ border: 1px solid #333;
+ border-radius: 2px;
+ background: rgba(119, 119, 119, 0.42);
+ cursor: pointer;
+ font-size: 32px;
+ color: #FFF;
+ padding-left: 10px;
+ padding-right: 10px;
+}
+
+#keyboard_view .microphone{
+ text-align: center;
+ line-height: 49px;
+}
+
+#keyboard_view .clearBtn{
+ right: 0px;
+ top: 0px;
+ width: 48px;
+ height: 48px;
+ border: 1px solid #333;
+ border-radius: 2px;
+ font-size: 32px;
+ text-align: center;
+ line-height: 50px;
+}
+
+#keyboard_view .microphone{
+ left: 63px;
+ top: 58px;
+ width: 48px;
+ height: 48px;
+ border: 1px solid #333;
+ border-radius: 2px;
+}
+
+#keyboard_view .keyboardLayout .ffw-button{
+ width: 60px;
+ height: 50px;
+ border-radius: 3px;
+ border: 1px solid #333;
+ margin: 5px;
+ font-size: 42px;
+ text-align: center;
+ line-height: 50px;
+}
+#keyboard_view .keyboardLayout .k1{
+ left: 75px;
+}
+#keyboard_view .keyboardLayout .k2{
+ left: 150px;
+}
+#keyboard_view .keyboardLayout .k3{
+ left: 225px;
+}
+#keyboard_view .keyboardLayout .k4{
+ left: 300px;
+}
+#keyboard_view .keyboardLayout .k5{
+ left: 375px;
+}
+#keyboard_view .keyboardLayout .k6{
+ left: 450px;
+}
+#keyboard_view .keyboardLayout .k7{
+ left: 525px;
+}
+#keyboard_view .keyboardLayout .k8{
+ left: 600px;
+}
+#keyboard_view .keyboardLayout .k9{
+ left: 675px;
+}
+#keyboard_view .keyboardLayout .k10{
+ left: 38px;
+ top: 62px;
+}
+#keyboard_view .keyboardLayout .k11{
+ left: 113px;
+ top: 62px;
+}
+#keyboard_view .keyboardLayout .k12{
+ left: 188px;
+ top: 62px;
+}
+#keyboard_view .keyboardLayout .k13{
+ left: 263px;
+ top: 62px;
+}
+#keyboard_view .keyboardLayout .k14{
+ left: 338px;
+ top: 62px;
+}
+#keyboard_view .keyboardLayout .k15{
+ left: 413px;
+ top: 62px;
+}
+#keyboard_view .keyboardLayout .k16{
+ left: 488px;
+ top: 62px;
+}
+#keyboard_view .keyboardLayout .k17{
+ left: 563px;
+ top: 62px;
+}
+#keyboard_view .keyboardLayout .k18{
+ left: 638px;
+ top: 62px;
+}
+#keyboard_view .keyboardLayout .k19{
+ left: 713px;
+ top: 62px;
+}
+#keyboard_view .keyboardLayout .k20{
+ left: 0px;
+ top: 124px;
+}
+#keyboard_view .keyboardLayout .k21{
+ left: 75px;
+ top: 124px;
+}
+#keyboard_view .keyboardLayout .k22{
+ left: 150px;
+ top: 124px;
+}
+#keyboard_view .keyboardLayout .k23{
+ left: 225px;
+ top: 124px;
+}
+#keyboard_view .keyboardLayout .k24{
+ left: 300px;
+ top: 124px;
+}
+#keyboard_view .keyboardLayout .k25{
+ left: 375px;
+ top: 124px;
+}
+#keyboard_view .keyboardLayout .k26{
+ left: 450px;
+ top: 124px;
+}
+#keyboard_view .keyboardLayout .k27{
+ left: 525px;
+ top: 124px;
+}
+#keyboard_view .keyboardLayout .k28{
+ left: 600px;
+ top: 124px;
+}
+#keyboard_view .keyboardLayout .k29{
+ left: 675px;
+ top: 124px;
+}
+#infoTable.infoTable {
+ width: 400px;
+ height: 96px;
+ top: 308px;
+ left: 801px;
+ background-color: #383737;
+ color: white;
+ border: 1px solid gray;
+ overflow: hidden;
+}
+
+#infoTable .sdlGPLabel {
+ width: 190px;
+ border-right: 1px solid #14100F;
+ height: 96px;
+ position: relative;
+ float: left;
+}
+
+#infoTable .sdlGPData {
+ position: relative;
+ display: block;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ width: 203px;
+ height: 18px;
+}
+
+#buttonControls .ContainerControlls {
+ left: 34px;
+ background:
+ url(../images/home/controlButtons/backGroundControllButtons.png)
+ no-repeat;
+ width: 200px;
+ height: 200px;
+}
+
+#buttonControls .UpBtn {
+ background: url(../images/home/controlButtons/UpButton.png) no-repeat;
+ background-position: -32px 0;
+ width: 137px;
+ height: 64px;
+ left: 32px;
+ -webkit-transition: 0.2s;
+}
+
+#TUNEUP.pressed {
+ background: url(../images/home/controlButtons/UpButton_pressed.png)
+ !important;
+ background-position: -32px 0 !important;
+ width: 137px !important;
+ height: 69px !important;
+ left: 32px !important;
+}
+
+#buttonControls .DownBtn {
+ background: url(../images/home/controlButtons/DownButton.png) no-repeat;
+ background-position: -32px -132px;
+ width: 137px;
+ height: 65px;
+ top: 132px;
+ left: 32px;
+ -webkit-transition: 0.2s;
+}
+
+#TUNEDOWN.pressed {
+ background: url(../images/home/controlButtons/DownButton_pressed.png)
+ no-repeat;
+ background-position: -32px -132px !important;
+ width: 137px !important;
+ height: 65px !important;
+ top: 132px !important;
+ left: 32px !important;
+}
+
+#buttonControls .LeftBtn {
+ background: url(../images/home/controlButtons/LeftButton.png) no-repeat;
+ width: 63px;
+ height: 138px;
+ background-position: -3px -31px;
+ left: 3px;
+ top: 31px;
+ -webkit-transition: 0.2s;
+}
+
+#SEEKLEFT.pressed {
+ background: url(../images/home/controlButtons/LeftButton_pressed.png)
+ no-repeat;
+ width: 63px !important;
+ height: 138px !important;
+ background-position: -3px -31px !important;
+ left: 3px !important;
+ top: 31px !important;
+}
+
+#buttonControls .RightBtn {
+ background: url(../images/home/controlButtons/RightButton.png) no-repeat;
+ background-position: -131px -31px;
+ width: 68px;
+ height: 139px;
+ left: 131px;
+ top: 31px;
+ -webkit-transition: 0.2s;
+}
+
+#SEEKRIGHT.pressed {
+ background: url(../images/home/controlButtons/RightButton_pressed.png)
+ no-repeat;
+ background-position: -131px -31px !important;
+ width: 68px !important;
+ height: 139px !important;
+ left: 131px !important;
+ top: 31px !important;
+}
+
+#buttonControls .OkBtn {
+ background: url(../images/home/controlButtons/OkButton.png) no-repeat;
+ background-position: -55px -55px;
+ width: 89px;
+ height: 90px;
+ left: 55px;
+ top: 55px;
+ -webkit-transition: 0.2s;
+}
+
+#OK.pressed {
+ background: url(../images/home/controlButtons/OkButton_pressed.png)
+ no-repeat;
+ background-position: -55px -55px !important;
+ width: 89px !important;
+ height: 90px !important;
+ left: 55px !important;
+ top: 55px !important;
+}
+
+#app_controlButtons{
+ z-index: 2;
+}
+#app_controlButtons .systemRequest {
+ top: 252px !important;
+ left: 1059px !important;
+ width: 135px !important;
+ font-size: 16px !important;
+ text-align: center;
+ line-height: 48px;
+}
+
+#app_controlButtons .btnNotPressed {
+ width: 40px;
+ height: 40px;
+ left: 0px;
+ top: 200px;
+ -webkit-transition: 0.2s;
+ border-radius: 8px;
+ background-color: #1D1D1D;
+ border: 1px solid #383737;
+ box-shadow: inset 5px 5px 10px #383737, inset -3px -3px 10px black;
+ -webkit-transition: 0.2s;
+ font-size: 38px;
+ line-height: 42px;
+ text-align: center;
+ position: relative;
+ float: left;
+ margin-left: 10px;
+ margin-top: 10px;
+}
+
+}
+#app_controlButtons .languageSelect {
+ position: absolute;
+ width: 150px;
+ height: 30px;
+ color: white;
+ background: #393939;
+}
+
+#app_controlButtons .languageSelect option {
+ background: #393939;
+}
+
+#UILanguages.languageSelect {
+ top: 110px;
+ left: 1028px;
+}
+
+#TTSVRLanguages.languageSelect {
+ top: 170px;
+ left: 1028px;
+}
+
+#app_controlButtons .UILanguagesLabel {
+ top: 91px;
+ left: 1028px;
+ width: 150px;
+}
+
+#app_controlButtons .TTSVRLanguagesLabel {
+ top: 151px;
+ left: 1028px;
+ width: 160px;
+}
+
+#app_controlButtons .appUILanguagesLabel {
+ top: 91px;
+ left: 1195px;
+ width: 250px;
+}
+
+#app_controlButtons .appTTSVRLanguagesLabel {
+ top: 151px;
+ left: 1195px;
+ width: 250px;
+}
+
+#app_controlButtons .appUILang {
+ top: 117px;
+ left: 1195px;
+ width: 150px;
+}
+
+#app_controlButtons .appTTSVRLang {
+ top: 176px;
+ left: 1195px;
+ width: 150px;
+}
+
+#app_controlButtons .sendDataCheckBox {
+ left: 1158px;
+ position: absolute;
+ top: 275px;
+}
+
+#app_controlButtons .sendDataLabel {
+ top: 275px;
+ left: 1180px;
+ width: 160px;
+}
+
+#buttonControls .btnNotPressed.pressed {
+ box-shadow: inset 5px 5px 10px black, inset -3px -3px 10px #383737;
+ line-height: 45px;
+}
+
+#app_controlButtons .languageSelect {
+ position: absolute;
+ width: 150px;
+ height: 30px;
+ color: white;
+ background: #393939;
+}
+
+#app_controlButtons .languageSelect option {
+ background: #393939;
+}
+
+#UILanguages.languageSelect {
+ top: 110px;
+ left: 1028px;
+}
+
+#TTSVRLanguages.languageSelect {
+ top: 170px;
+ left: 1028px;
+}
+
+#app_controlButtons .UILanguagesLabel {
+ top: 91px;
+ left: 1028px;
+ width: 150px;
+}
+
+#app_controlButtons .TTSVRLanguagesLabel {
+ top: 151px;
+ left: 1028px;
+ width: 160px;
+}
+
+#app_controlButtons .phone_call_button{
+ height: 40px;
+ width: 163px;
+ font-size: 20px;
+ line-height: 41px;
+ border: 1px solid #FFFF30;
+ top: 2px;
+ color: #FFFF30;
+ padding-left: 10px;
+ left: 244px;
+ transition: left 2s;
+}
+
+#app_controlButtons .phone_call_button.expand{
+ left: 156px;
+} \ No newline at end of file