You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
296 lines
7.0 KiB
296 lines
7.0 KiB
body, html { |
|
width: 90%; |
|
height: 90%; |
|
background: #FFFFFF; |
|
font-family: "Arial"; |
|
font-size: 12px; |
|
padding: 10px; |
|
margin: 0 auto; |
|
} |
|
main { |
|
width: 100%; |
|
height: 100%; |
|
margin: 0px auto; |
|
background: #FFFFFF; |
|
padding: 0px; |
|
margin-left :0px; |
|
margin-right :0px; |
|
position: center; |
|
} |
|
input[name=css-tabs] { |
|
display: none; |
|
} |
|
a { |
|
color: #F29A77; |
|
} |
|
#tabs { |
|
margin-left: 0px; |
|
background: #5C5C5C; |
|
height: 110px; |
|
border-bottom: 5px solid #6c87d4; |
|
box-shadow: 0 3px 5px rgba(0,0,0,0.2); |
|
} |
|
#tabs::before { |
|
|
|
} |
|
|
|
#tabs::after { |
|
content: ""; |
|
display: block; |
|
position: absolute; |
|
z-index: 0; |
|
height: 110px; |
|
width: 102px; |
|
/*background: #6c87d4;*/ |
|
-webkit-transition: -webkit-transform 400ms; |
|
transition: -webkit-transform 400ms; |
|
transition: transform 400ms; |
|
transition: transform 400ms, -webkit-transform 400ms; |
|
} |
|
#tabs label { |
|
position: relative; |
|
font-family: "Arial"; |
|
z-index: 100; |
|
display: block; |
|
float: left; |
|
font-size: 12px; |
|
text-transform: uppercase; |
|
text-align: center; |
|
width: 100px; |
|
height: 100%; |
|
border-right: 1px dotted #575654; |
|
cursor: pointer; |
|
color: #FFFFFF; |
|
} |
|
#tabs label:first-child { |
|
border-left: 1px dotted #575654; |
|
} |
|
#tabs label::before { |
|
content: ""; |
|
display: block; |
|
height: 60px; |
|
width: 60px; |
|
background-position: center; |
|
background-repeat: no-repeat; |
|
background-size: contain; |
|
-webkit-filter: invert(0); |
|
filter: invert(0); |
|
margin: 10px auto; |
|
} |
|
|
|
/* |
|
#TAB_LPR_MAPPING::before { |
|
background-image: url('../images/icon_lpr_mapping.png'); |
|
} |
|
#TAB_LPR_LIST_UPLOAD::before { |
|
background-image: url('../images/icon_lpr_list_upload.png'); |
|
} |
|
*/ |
|
#TAB_ANPR::before { |
|
background-image: url('../images/icon_anpr.png'); |
|
} |
|
#TAB_LPR_LIST::before { |
|
background-image: url('../images/icon_lpr_list.png'); |
|
} |
|
#TAB_ALARM::before { |
|
background-image: url('../images/icon_alarm.png'); |
|
} |
|
#TAB_LICENSE::before { |
|
background-image: url('../images/icon_license.png'); |
|
} |
|
#TAB_PTZ::before { |
|
background-image: url('../images/icon_ptz.png'); |
|
} |
|
#TAB_SETTING::before { |
|
background-image: url('../images/icon_setting.png'); |
|
} |
|
#TAB_OUTPUT::before { |
|
background-image: url('../images/icon_output.png'); |
|
} |
|
#TAB_SPEED::before { |
|
background-image: url('../images/icon_stopwatch.png'); |
|
} |
|
#TAB_RADAR::before { |
|
background-image: url('../images/icon_radar.png'); |
|
} |
|
#TAB_TOF::before { |
|
background-image: url('../images/icon_tof.png'); |
|
} |
|
#TAB_FACE::before { |
|
background-image: url('../images/icon_face.png'); |
|
} |
|
#TAB_FACE_LIST::before { |
|
background-image: url('../images/icon_lpr_list.png'); |
|
} |
|
/* |
|
#RADIO_LPR_MAPPING:checked ~ #tabs #TAB_LPR_MAPPING::before, |
|
#RADIO_LPR_LIST_UPLOAD:checked ~ #tabs #TAB_LPR_LIST_UPLOAD::before, |
|
*/ |
|
/* |
|
#RADIO_LPR_MAPPING:checked ~ #tabs::after { |
|
-webkit-transform: translateX(202px); |
|
transform: translateX(202px); |
|
} |
|
#RADIO_LPR_LIST_UPLOAD:checked ~ #tabs::after { |
|
-webkit-transform: translateX(303px); |
|
transform: translateX(303px); |
|
} |
|
*/ |
|
|
|
#RADIO_ANPR:checked ~ #tabs #TAB_ANPR::before, |
|
#RADIO_LPR_LIST:checked ~ #tabs #TAB_LPR_LIST::before, |
|
#RADIO_ALARM:checked ~ #tabs #TAB_ALARM::before, |
|
#RADIO_LICENSE:checked ~ #tabs #TAB_LICENSE::before, |
|
#RADIO_OUTPUT:checked ~ #tabs #TAB_OUTPUT::before, |
|
#RADIO_RADAR:checked ~ #tabs #TAB_RADAR::before, |
|
#RADIO_SPEED:checked ~ #tabs #TAB_SPEED::before, |
|
#RADIO_PTZ:checked ~ #tabs #TAB_PTZ::before, |
|
#RADIO_TOF:checked ~ #tabs #TAB_TOF::before, |
|
#RADIO_FACE:checked ~ #tabs #TAB_FACE::before, |
|
#RADIO_FACE_LIST:checked ~ #tabs #TAB_FACE_LIST::before, |
|
#RADIO_SETTING:checked ~ #tabs #TAB_SETTING::before { |
|
} |
|
#RADIO_ANPR:checked ~ #tabs::after { |
|
-webkit-transform: translateX(0); |
|
transform: translateX(0); |
|
} |
|
#RADIO_LPR_LIST:checked ~ #tabs::after { |
|
-webkit-transform: translateX(101px); |
|
transform: translateX(101px); |
|
} |
|
#RADIO_ALARM:checked ~ #tabs::after { |
|
-webkit-transform: translateX(202px); |
|
transform: translateX(202px); |
|
} |
|
#RADIO_OUTPUT:checked ~ #tabs::after { |
|
-webkit-transform: translateX(303px); |
|
transform: translateX(303px); |
|
} |
|
#RADIO_SPEED:checked ~ #tabs::after { |
|
-webkit-transform: translateX(404px); |
|
transform: translateX(404px); |
|
} |
|
#RADIO_RADAR:checked ~ #tabs::after { |
|
-webkit-transform: translateX(505px); |
|
transform: translateX(505px); |
|
} |
|
#RADIO_TOF:checked ~ #tabs::after { |
|
-webkit-transform: translateX(606px); |
|
transform: translateX(606px); |
|
} |
|
#RADIO_PTZ:checked ~ #tabs::after { |
|
-webkit-transform: translateX(707px); |
|
transform: translateX(707px); |
|
} |
|
#RADIO_SETTING:checked ~ #tabs::after { |
|
-webkit-transform: translateX(808px); |
|
transform: translateX(808px); |
|
} |
|
#RADIO_LICENSE:checked ~ #tabs::after { |
|
-webkit-transform: translateX(909px); |
|
transform: translateX(909px); |
|
} |
|
#RADIO_FACE:checked ~ #tabs::after { |
|
-webkit-transform: translateX(1010px); |
|
transform: translateX(1010px); |
|
} |
|
#RADIO_FACE_LIST:checked ~ #tabs::after { |
|
-webkit-transform: translateX(1111px); |
|
transform: translateX(1111px); |
|
} |
|
#content { |
|
position: center; |
|
width: 100%; |
|
height: 100%; |
|
} |
|
#content section { |
|
position: center; |
|
width: 100%; |
|
height: 100%; |
|
display:none; |
|
} |
|
|
|
/*#RADIO_LPR_MAPPING:checked ~ #content #CONTENT_LPR_MAPPING, |
|
#RADIO_LPR_LIST_UPLOAD:checked ~ #content #CONTENT_LPR_LIST_UPLOAD, |
|
*/ |
|
#RADIO_ANPR:checked ~ #content #CONTENT_ANPR, |
|
#RADIO_LPR_LIST:checked ~ #content #CONTENT_LPR_LIST, |
|
#RADIO_ALARM:checked ~ #content #CONTENT_ALARM, |
|
#RADIO_LICENSE:checked ~ #content #CONTENT_LICENSE, |
|
#RADIO_TOF:checked ~ #content #CONTENT_TOF, |
|
#RADIO_OUTPUT:checked ~ #content #CONTENT_OUTPUT, |
|
#RADIO_RADAR:checked ~ #content #CONTENT_RADAR, |
|
#RADIO_SPEED:checked ~ #content #CONTENT_SPEED, |
|
#RADIO_PTZ:checked ~ #content #CONTENT_PTZ, |
|
#RADIO_FACE:checked ~ #content #CONTENT_FACE, |
|
#RADIO_FACE_LIST:checked ~ #content #CONTENT_FACE_LIST, |
|
#RADIO_SETTING:checked ~ #content #CONTENT_SETTING { |
|
display: block; |
|
} |
|
|
|
#content #CONTENT_ANPR iframe { |
|
width: 100%; |
|
height: 100%; |
|
} |
|
#content #CONTENT_LPR_LIST iframe { |
|
width: 100%; |
|
height: 100%; |
|
} |
|
/* |
|
#content #CONTENT_LPR_MAPPING iframe { |
|
width: 100%; |
|
height: 100%; |
|
} |
|
#content #CONTENT_LPR_LIST_UPLOAD iframe { |
|
width: 100%; |
|
height: 100%; |
|
}*/ |
|
#content #CONTENT_ALARM iframe { |
|
width: 100%; |
|
height: 100%; |
|
} |
|
|
|
#content #CONTENT_LICENSE iframe { |
|
width: 100%; |
|
height: 100%; |
|
} |
|
|
|
#content #CONTENT_OUTPUT iframe { |
|
width: 100%; |
|
height: 100%; |
|
} |
|
|
|
#content #CONTENT_RADAR iframe { |
|
width: 100%; |
|
height: 100%; |
|
} |
|
|
|
#content #CONTENT_SPEED iframe { |
|
width: 100%; |
|
height: 100%; |
|
} |
|
|
|
#content #CONTENT_SETTING iframe { |
|
width: 100%; |
|
height: 100%; |
|
} |
|
|
|
#content #CONTENT_PTZ iframe { |
|
width: 100%; |
|
height: 100%; |
|
} |
|
|
|
#content #CONTENT_TOF iframe { |
|
width: 100%; |
|
height: 100%; |
|
} |
|
|
|
#content #CONTENT_FACE iframe { |
|
width: 100%; |
|
height: 100%; |
|
} |
|
|
|
#content #CONTENT_FACE_LIST iframe { |
|
width: 100%; |
|
height: 100%; |
|
} |