scrawl.css 3.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172
  1. /*common
  2. */
  3. body{margin: 0;}
  4. table{width:100%;}
  5. table td{padding:2px 4px;vertical-align: middle;}
  6. a{text-decoration: none;}
  7. em{font-style: normal;}
  8. .border_style1{border: 1px solid #ccc;border-radius: 5px;box-shadow:2px 2px 5px #d3d6da;}
  9. /*module
  10. */
  11. .main{margin: 8px;overflow: hidden;}
  12. .hot{float:left;height:335px;}
  13. .drawBoard{position: relative; cursor: crosshair;}
  14. .brushBorad{position: absolute;left:0;top:0;z-index: 998;}
  15. .picBoard{border: none;text-align: center;line-height: 300px;cursor: default;}
  16. .operateBar{margin-top:10px;font-size:12px;text-align: center;}
  17. .operateBar span{margin-left: 10px;}
  18. .drawToolbar{float:right;width:110px;height:300px;overflow: hidden;}
  19. .colorBar{margin-top:10px;font-size: 12px;text-align: center;}
  20. .colorBar a{display:block;width: 10px;height: 10px;border:1px solid #1006F1;border-radius: 3px; box-shadow:2px 2px 5px #d3d6da;opacity: 0.3}
  21. .sectionBar{margin-top:15px;font-size: 12px;text-align: center;}
  22. .sectionBar a{display:inline-block;width:10px;height:12px;color: #888;text-indent: -999px;opacity: 0.3}
  23. .size1{background: url('images/size.png') 1px center no-repeat ;}
  24. .size2{background: url('images/size.png') -10px center no-repeat;}
  25. .size3{background: url('images/size.png') -22px center no-repeat;}
  26. .size4{background: url('images/size.png') -35px center no-repeat;}
  27. .addImgH{position: relative;}
  28. .addImgH_form{position: absolute;left: 18px;top: -1px;width: 75px;height: 21px;opacity: 0;cursor: pointer;}
  29. .addImgH_form input{width: 100%;}
  30. /*scrawl遮罩层
  31. */
  32. .maskLayerNull{display: none;}
  33. .maskLayer{position: absolute;top:0;left:0;width: 100%; height: 100%;opacity: 0.7;
  34. background-color: #fff;text-align:center;font-weight:bold;line-height:300px;z-index: 1000;}
  35. /*btn state
  36. */
  37. .previousStepH .icon{display: inline-block;width:16px;height:16px;background-image: url('images/undoH.png');cursor: pointer;}
  38. .previousStepH .text{color:#888;cursor:pointer;}
  39. .previousStep .icon{display: inline-block;width:16px;height:16px;background-image: url('images/undo.png');cursor:default;}
  40. .previousStep .text{color:#ccc;cursor:default;}
  41. .nextStepH .icon{display: inline-block;width:16px;height:16px;background-image: url('images/redoH.png');cursor: pointer;}
  42. .nextStepH .text{color:#888;cursor:pointer;}
  43. .nextStep .icon{display: inline-block;width:16px;height:16px;background-image: url('images/redo.png');cursor:default;}
  44. .nextStep .text{color:#ccc;cursor:default;}
  45. .clearBoardH .icon{display: inline-block;width:16px;height:16px;background-image: url('images/emptyH.png');cursor: pointer;}
  46. .clearBoardH .text{color:#888;cursor:pointer;}
  47. .clearBoard .icon{display: inline-block;width:16px;height:16px;background-image: url('images/empty.png');cursor:default;}
  48. .clearBoard .text{color:#ccc;cursor:default;}
  49. .scaleBoardH .icon{display: inline-block;width:16px;height:16px;background-image: url('images/scaleH.png');cursor: pointer;}
  50. .scaleBoardH .text{color:#888;cursor:pointer;}
  51. .scaleBoard .icon{display: inline-block;width:16px;height:16px;background-image: url('images/scale.png');cursor:default;}
  52. .scaleBoard .text{color:#ccc;cursor:default;}
  53. .removeImgH .icon{display: inline-block;width:16px;height:16px;background-image: url('images/delimgH.png');cursor: pointer;}
  54. .removeImgH .text{color:#888;cursor:pointer;}
  55. .removeImg .icon{display: inline-block;width:16px;height:16px;background-image: url('images/delimg.png');cursor:default;}
  56. .removeImg .text{color:#ccc;cursor:default;}
  57. .addImgH .icon{vertical-align:top;display: inline-block;width:16px;height:16px;background-image: url('images/addimg.png')}
  58. .addImgH .text{color:#888;cursor:pointer;}
  59. /*icon
  60. */
  61. .brushIcon{display: inline-block;width:16px;height:16px;background-image: url('images/brush.png')}
  62. .eraserIcon{display: inline-block;width:16px;height:16px;background-image: url('images/eraser.png')}