oaup9/o2web/source/x_component_Attendance/$UnitIndex/default/css.wcss

{
  "titleNode" : {
    "background-color" : "#FFF",
    "border-bottom": "1px solid #ccc",
    "color": "#333",
    "margin-left": "15px",
    "height": "50px",
    "overflow": "hidden"
  },
  "titleLeftArrowNode" : {
    "background": "url('../x_component_Attendance/$UnitIndex/default/icon/left.png') no-repeat center",
    "width": "20px",
    "line-height": "50px",
    "height": "50px",
    "float" : "left",
    "cursor" : "pointer"
  },
  "titleLeftArrowNode_over": {
    "background": "url(../x_component_Attendance/$UnitIndex/default/icon/left.png) no-repeat center center"
  },
  "titleLeftArrowNode_down": {
    "background": "url(../x_component_Attendance/$UnitIndex/default/icon/left.png) no-repeat center center"
  },
  "titleRightArrowNode": {
    "width": "20px",
    "line-height": "50px",
    "height": "50px",
    "background": "url(../x_component_Attendance/$UnitIndex/default/icon/right.png) no-repeat center center",
    "cursor": "pointer",
    "float": "left"
  },
  "titleRightArrowNode_over": {
    "background": "url(../x_component_Attendance/$UnitIndex/default/icon/right.png) no-repeat center center"
  },
  "titleRightArrowNode_down": {
    "background": "url(../x_component_Attendance/$UnitIndex/default/icon/right.png) no-repeat center center"
  },
  "titleTextNode": {
    "line-height": "50px",
    "color": "#333",
    "margin": "0px 10px",
    "font-size": "18px",
    "float": "left",
    "cursor": "pointer"
  },
  "titleTextNode_over": {
    "color": "#333"
  },
  "titleTextNode_down": {
    "color": "#333"
  },


  "titleUnitNode" : {
    "line-height": "50px",
    "color": "#333",
    "margin": "0px 20px 0px 55px",
    "font-size": "18px",
    "float": "left"
  },

  "titleUnitAreaNode" : {
    "color": "#333",
    "margin": "0px 20px 0px 55px",
    "font-size": "18px",
    "float": "left",
    "cursor": "pointer"
  },
  "titleUnitActionNode" : {
    //"overflow" : "hidden",
    "height" : "50px",
    "line-height" : "50px",
    "cursor" : "pointer"
  },
  "titleUnitActionTextNode" : {
    "float" : "left",
    "color" : "#333",
    "line-height": "50px"
  },
  "titleUnitActionTextNode_over":{
    "color" : "#333"
  },
  "titleUnitActionIconNode" : {
    "float" : "left",
    "width" : "28px",
    "height": "50px",
    "line-height": "50px",
    "background": "url(../x_component_Attendance/$UnitIndex/default/icon/triangle_down.png) no-repeat center center"
  },
  "titleUnitActionIconNode_over" : {
    "background": "url(../x_component_Attendance/$UnitIndex/default/icon/triangle_down.png) no-repeat center center"
  },
  "titleUnitListNode" : {
    "position" : "absolute",
    "top" : "100%",
    "left" : "0",
    "overflow" : "hidden",
    "z-index" : "200",
    "color" : "#666",
    "border-radius": "2px",
    "box-shadow": "0px 0px 6px 0px rgba(0, 0, 0, 0.25)",
    "min-width" : "140px",
    "margin" : "0px",
    "font-size" : "16px"
  },
  "titleUnitSelectNode" : {
    "height" : "35px",
    "line-height" :"35px",
    "background-color" : "#fff",
    "cursor":"pointer",
    "text-align":"left",
    "padding-left" : "7px",
    "padding-right" : "7px"
  },
  "titleUnitSelectNode_over" : {
    "background-color" : "#F0F0F0"
  },


  "calendarMonthSelectNode": {
    "width": "260px",
    "height": "300px",
    "background-color": "#FFF",
    "position": "absolute",
    "text-align": "center",
    "border-radius": "2px",
    "box-shadow": "0px 0px 6px 0px rgba(0, 0, 0, 0.25)",
    "z-index" : "101",
    "font-size": "14px",
    "color": "#333"
  },
  "calendarMonthSelectTitleNode": {
    "height": "30px",
    "overflow": "hidden"
  },
  "calendarMonthSelectTitlePrevYearNode": {
    "height": "40px",
    "width": "40px",
    "float": "left",
    "background": "url(../x_component_Attendance/$UnitIndex/default/icon/left_year.png) no-repeat center center",
    "cursor": "pointer"
  },
  "calendarMonthSelectTitleNextYearNode": {
    "height": "40px",
    "width": "40px",
    "float": "right",
    "background": "url(../x_component_Attendance/$UnitIndex/default/icon/right_year.png) no-repeat center center",
    "cursor": "pointer"
  },
  "calendarMonthSelectTitleTextNode": {
    "text-align": "center",
    "margin": "0px 40px",
    "height": "40px",
    "font-size": "18px",
    "line-height": "40px"
  },
  "calendarMonthSelectTdNode": {
    "cursor": "pointer",
    "color": "#333",
    "font-size": "14px",
    "background-color": "#FFF"
  },
  "calendarMonthSelectTdNode_over": {
    "color": "#333",
    "background-color": "#F7F7F7"
  },
  "calendarMonthSelectTdNode_down": {
    "color": "#333",
    "background-color": "#F7F7F7"
  },

  "calendarMonthSelectBottomNode": {
    "height": "40px",
    "font-size": "18px",
    "color": "#666",
    "line-height": "40px",
    "cursor": "pointer"
  },

  "elementContentNode": {
    "overflow": "auto",
    "position": "static",
//    "margin-right" : "10px",
    "margin-bottom" : "20px"
  },
  "elementContentListNode": {
    "min-width": "900px"
    //"overflow": "hidden"
  },
  "topContentArea" : {
    "padding-top": "10px",
    "padding-bottom": "10px",
    "background-color": "#F0F0F0",
    "overflow" : "hidden",
    "display" : "block"
  },
  "topLeftArea": {
    "overflow" : "hidden",
    "float": "left",
    "width": "380px"
  },
  "topLeftTitleNode": {
    "overflow": "hidden",
    "color": "#333",
    "height": "30px",
    "padding-top": "11px",
    "padding-left": "20px",
    "font-size": "18px",
    "background-color": "#fff"
  },
  "topLeftContentNode": {
    "overflow" : "hidden",
    "background-color": "#fff"
  },

  "topRightArea": {
    "margin-left": "10px",
    "background": "#fff",
    "float": "left",
    "width": "calc( 100% - 390px )"
  },
  "topRightTitleNode": {
    "overflow": "hidden",
    "color": "#333",
    "height": "30px",
    "padding-top": "11px",
    "padding-left": "20px",
    "font-size": "18px",
    "background-color": "#fff"
  },
  "topRightContentNode": {
    "overflow" : "hidden",
    "min-height": "30px"
  },

  "statusColorArea" : {
    "background": "#fff",
    "width": "110px",
    "margin-left": "20px",
    "margin-top": "30px",
    "float": "left"
  },
  "statusColorTable" : {
    "min-width" : "80px"
  },
  "statusColorTd" : {
    "height" : "10px"
  },
  "statusTextTd" : {
    "padding-top" : "0px",
    "padding-bottom" : "10px"
  },

  "pieChartArea" : {
    "width": "calc( 100% - 130px )",
    "background": "#fff",
    "float" : "left"
  },
  "pieChartTitle" : {
    "color" : "#666",
    "height" : "30px",
    "line-height" : "30px",
    "padding-left" : "10px",
    "font-size" : "14px",
    "background-color" : "#f1f3fc" //"#476783" //"#e6f3ff"
  },
  "pieChartNode" : {
    //"margin-top": "20px",
    "margin-left": "10px",
    "height" : "280px"
  },

  "barChartArea" : {
    "width" : "100%",
//    "margin":"10px",
    "float" : "left"
  },
  "barChartTitle" : {
    "color" : "#666",
    "height" : "30px",
    "line-height" : "30px",
    "padding-left" : "10px",
    "font-size" : "14px",
    "background-color" : "#f1f3fc" //"#476783" //"#e6f3ff"
  },
  "barChartNode" : {
    //"margin-top": "20px",
    "margin-left": "10px",
    "height" : "280px"
  },

  "middleContentArea" : {
    //"overflow" : "hidden",
    "display" : "block"
  },
  "lineChartArea" : {
    "margin":"10px 10px 0px 10px"
  },
  "lineChartTitle" : {
    "color" : "#666",
    "height" : "30px",
    "line-height" : "30px",
    "padding-left" : "10px",
    "font-size" : "14px",
    "background-color" : "#f1f3fc" //"#476783" //"#e6f3ff"
  },
  "lineChartNode" : {
    "margin-top": "20px",
    "margin-left": "40px",
    "height" : "300px"
  },

  "bottomContentArea" : {
    //"overflow" : "hidden",
    "display" : "block"
  },
  "detailArea" : {
    "margin":"0px 20px 0px 20px"
    //"height" : "300px",
    //"border" : "1px solid #ccc"
    //"overflow" : "hidden"
  },
  "detailTitleNode" : {
    "overflow": "hidden",
    "color": "#333",
    "height": "30px",
    "padding-top": "11px",
    "font-size": "18px",
    "background-color": "#fff"
  },

  "table": {
      "margin-top": "10px"
  },
  "listHeadNode": {
  },

  "tableTitle" : {
    "background-color" : "#F7F7F7",
    "text-align":"center",
    "height": "30px",
    "color": "#333",
    "font-size": "15px",
    "border-top": "1px solid #FFF"
  },
  "tableValue" : {
    "height": "30px",
    "color": "#333",
    "font-size": "14px",
    "text-align":"center",
    "overflow" : "hidden",
    //"font-weight" : "bold",
    "border-top": "1px solid #FFF",
    "border-bottom": "1px solid #E6E6E6"
  }
}