Subversion Repositories wimsdev

Rev

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

  1. /** Default widget_boxes style */
  2.  
  3. .mode_popup{
  4.   padding:1em;
  5. }
  6.  
  7. .wims_widget_box {
  8.   margin: 5px;
  9.   max-width: 900px;
  10. }
  11.  
  12. .wims_columns {
  13.   display: flex;
  14.   flex-wrap: wrap;
  15. }
  16.  
  17. .wims_widget_box .title_box {
  18.   border-radius: 5px 5px 0 0 ;
  19.   border: 1px solid #BBB;
  20.   border-bottom-width: 0;
  21.   margin: 0;
  22.   padding: .5em;
  23. }
  24.  
  25. .wims_widget_box .title_box h1,
  26. .wims_widget_box .title_box h2,
  27. .wims_widget_box .title_box h3  {
  28.   margin-top: 2px;
  29.   margin-bottom: 0;
  30. }
  31.  
  32. .wims_widget_box .title_box .wims_title {
  33.   /* Text shadow for light text on dark background */
  34.   /*text-shadow: -1px -1px 1px rgba(0, 0, 0, .5), 1px 1px 1px rgba(0, 0, 0, .5);*/
  35. }
  36.  
  37. .wims_widget_box .box_content {
  38.   display: block;
  39.   background-color: #fff;
  40.   margin: 0;
  41.   padding: .5em;
  42.   clear: both;
  43.   /*text-align: center;*/
  44.   border: 1px solid #BBB;
  45.   border-radius: 0 0 5px 5px ;
  46.   min-height: 6em;
  47.   box-sizing: border-box;
  48. }
  49.  
  50.  
  51. /** details/summary html5 tags (accordions)  **/
  52. details {
  53.   background-color: #4442;
  54.   margin-bottom: .5rem;
  55.   padding: 0 .5rem .5rem .5rem;
  56.   box-shadow: 0 .1rem 1rem -.5rem rgba(0,0,0,.4);
  57. }
  58. details summary ~ div{
  59.   opacity: 0;
  60.   transform: translateY(-10px);
  61.   transition: .6s opacity ease,.6s transform ease;
  62. }
  63. details[open] summary ~ div {
  64.   opacity: 1;
  65.   transform: translateY(0);
  66. }
  67.  
  68. summary {
  69.   padding: .5rem;
  70.   margin: 0 -.5rem;
  71.   background-color: #4442;
  72.   cursor: pointer;
  73.   transition: .4s background-color ease;
  74. }
  75.  
  76. summary:hover, summary:focus{
  77.   background-color: #4444;
  78. }
  79.  
  80.  
  81.  
  82. /* Small screens */
  83. @media only screen and (max-width: 40em) {
  84.   .medium_size {
  85.     width:100%;
  86.     margin: 5px;
  87.   }
  88. }
  89.  
  90. /* Medium screens */
  91. @media only screen and (min-width: 40.063em) and (max-width: 64em) {
  92.   .medium_size {
  93.     max-width: 40em;
  94.     margin: .8em auto;
  95.   }
  96. }
  97.  
  98. /* Large screens */
  99. @media only screen and (min-width: 64.063em) {
  100.   .medium_size {
  101.     width:50%;
  102.     margin: 0;
  103.     padding: .5em;
  104.     box-sizing:border-box;
  105.   }
  106.   .side_col{width: 30%;}
  107.   .main_col{width: auto;}
  108. }
  109.