Subversion Repositories wimsdev

Rev

Rev 9051 | Rev 10883 | Go to most recent revision | Blame | Compare with Previous | Last modification | View Log | RSS feed

  1. /** themes/_css - forms.css */
  2. /**  Somes styles designed to display fields in forms, tableless **/
  3. /* Currently used in exam and documents properties **/
  4.  
  5. /*form{
  6.     line-height: 2em;
  7. }*/
  8.  
  9. /* corrects attributes color:inherit from normalize.css */
  10. input, textarea {
  11.     color:black;
  12. }
  13. input[disabled], textarea[disabled] {
  14.     color:#444;
  15.     background-color:#DFDFDF;
  16. }
  17. /* corrects margin from normalize.css */
  18. input[type="radio"],input[type="checkbox"]{
  19.     margin-right: 5px;
  20. }
  21.  
  22.  
  23. /* this is generaly a fieldset class */
  24. .property_fields{
  25.     position: relative;
  26.     margin-top:1em;
  27.     margin-bottom:1em;
  28.     max-width:900px;
  29.     padding:.5em 0;
  30.     /*Background-image is here to lighten background color */
  31.     background-image: -moz-linear-gradient(top,  rgba(255,255,255,0.7) 0%, rgba(255, 255, 255, 0.9) 48%, rgba(255,255,255,0.4) 100%); /* FF3.6+ */
  32.     background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0.7)), color-stop(48%,rgba(255, 255, 255, 0.9)), color-stop(100%,rgba(255,255,255,0.4))); /* Chrome,Safari4+ */
  33.     background-image: -webkit-linear-gradient(top,  rgba(255,255,255,0.7) 0%,rgba(255, 255, 255, 0.9) 48%,rgba(255,255,255,0.4) 100%); /* Chrome10+,Safari5.1+ */
  34.     background-image: -o-linear-gradient(top,  rgba(255,255,255,0.7) 0%,rgba(255, 255, 255, 0.9) 48%,rgba(255,255,255,0.4) 100%); /* Opera 11.10+ */
  35.     background-image: -ms-linear-gradient(top,  rgba(255,255,255,0.7) 0%,rgba(255, 255, 255, 0.9) 48%,rgba(255,255,255,0.4) 100%); /* IE10+ */
  36.     background-image: linear-gradient(to bottom,  rgba(255,255,255,0.7) 0%,rgba(255, 255, 255, 0.9) 48%,rgba(255,255,255,0.4) 100%); /* W3C */
  37.     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b3ffffff', endColorstr='#66ffffff',GradientType=0 ); /* IE6-9 */
  38. }
  39.  
  40. /*.property_fields .field {
  41.         margin: auto;
  42. }*/
  43.  
  44. .property_fields .actions,
  45. .property_fields .wimsform{
  46.     padding:.5em;
  47.     margin-top:.5em;
  48. }
  49.  
  50. .property_fields .box{
  51.     padding: .4em; /*.4em seems max for Chrome 2-columns layout */
  52.     border:1px solid #CFCFCF;
  53.     /*margin-bottom:1px;*/
  54.     line-height:1.2em;
  55. }
  56. .property_fields p{
  57.     padding:0 1em;
  58. }
  59.  
  60. .box>div, .box>input, .box>textarea, .box>select{
  61.     margin-left:1em;
  62. }
  63.  
  64. .property_fields .halfwidth{
  65.     /*display: inline-block;
  66.     vertical-align: middle;*/
  67.     float:left;
  68.     /*min-width: 380px;*/
  69.     /*min-height could be suppressed when all browsers will render welle "flexbox"*/
  70.     min-height:4em;
  71. }
  72.  
  73. .property_fields .field:nth-child(even){
  74.   background-color: #DFDFDF;
  75.   background-color: rgba(200,200,200,.4);
  76. }
  77.  
  78. .property_fields .field:nth-child(odd){
  79.   background-color: #EFEFEF;
  80.   background-color: rgba(255,255,255,.6);
  81. }
  82.  
  83. .formHelp{
  84.     font-size: 9pt;
  85.     color:#666;
  86. }
  87.  
  88. .property_fields legend{
  89.     font-size: 1.2em;
  90.     font-weight: bold;
  91.     text-shadow: -1px -1px #000;
  92.     padding: 0 .5em;
  93.     margin-left:1em;
  94.     border:1px solid #BBB;
  95.     border-radius:5px;
  96. }
  97.  
  98. .property_fields label{
  99.     font-weight:bold;
  100.     display:inline-block;
  101.     min-width:10em;
  102.     vertical-align: middle;
  103. }
  104.  
  105. .property_fields select{
  106.     vertical-align: middle;
  107. }
  108.  
  109. .property_fields input[type="text"]{
  110.     min-width:50%;
  111. }
  112.  
  113. .fullwidth input[type="text"],
  114. .fullwidth select{
  115.     width:95%;
  116. }
  117.  
  118. .field textarea{
  119.     min-width:80%;
  120. }
  121.  
  122. .fullwidth textarea{
  123.     width:96%;
  124. }
  125.  
  126. .field input.small_input{
  127.     width:6em;
  128.     min-width:6em;
  129. }
  130.  
  131. input[type="color"]{
  132.     vertical-align: bottom;
  133. }
  134.  
  135. li.wims_formradio{
  136.     display: block;
  137. }
  138. .wims_formradio label {
  139.   min-width:0;
  140.   font-weight:normal;
  141. }
  142.  
  143.  
  144.  
  145. /* Small screens */
  146. @media only screen and (max-width: 40em) {
  147.     .property_fields .halfwidth, .halfwidth{
  148.         width:auto;
  149.         display:block;
  150.         min-width: 0;
  151.     }
  152. } /* max-width 640px, mobile-only styles, use when QAing mobile issues */
  153.  
  154. /* Medium screens */
  155. @media only screen and (min-width: 40.063em) and (max-width: 64em) {
  156.     .property_fields .halfwidth{
  157.         min-width: 310px;
  158.     }
  159. } /* min-width 641px and max-width 1024px, use when QAing tablet-only issues */
  160.  
  161. /* Large screens */
  162. @media only screen and (min-width: 64.063em) { } /* min-width 1025px, large screens */
  163.  
  164.