diff options
Diffstat (limited to 'src/components/HMI/css/buttonControls.css')
-rw-r--r-- | src/components/HMI/css/buttonControls.css | 546 |
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 |