Dotclear

Changeset 3690:b48aaf7c80a4 for admin


Ignore:
Timestamp:
01/28/18 13:16:06 (8 years ago)
Author:
franck <carnet.franck.paul@…>
Branch:
default
Message:

Focus (and visually show) the subhash if possible

Location:
admin
Files:
4 edited

Legend:

Unmodified
Added
Removed

  • admin/js/jquery/jquery.pageTabs.js

    r3333 r3690  
    11(function($) { 
    2      'use strict'; 
     2  'use strict'; 
    33 
    4      $.pageTabs = function(start_tab, opts) { 
    5           var defaults = { 
    6                containerClass: 'part-tabs', 
    7                partPrefix: 'part-', 
    8                contentClass: 'multi-part', 
    9                activeClass: 'part-tabs-active', 
    10                idTabPrefix: 'part-tabs-' 
    11           }; 
     4  $.pageTabs = function(start_tab, opts) { 
     5    var defaults = { 
     6      containerClass: 'part-tabs', 
     7      partPrefix: 'part-', 
     8      contentClass: 'multi-part', 
     9      activeClass: 'part-tabs-active', 
     10      idTabPrefix: 'part-tabs-' 
     11    }; 
    1212 
    13           $.pageTabs.options = $.extend({}, defaults, opts); 
    14           var active_tab = start_tab || ''; 
    15           var hash = $.pageTabs.getLocationHash(); 
    16           var subhash = $.pageTabs.getLocationSubhash(); 
     13    $.pageTabs.options = $.extend({}, defaults, opts); 
     14    var active_tab = start_tab || ''; 
     15    var hash = $.pageTabs.getLocationHash(); 
     16    var subhash = $.pageTabs.getLocationSubhash(); 
    1717 
    18           if (hash !== undefined && hash) { 
    19                window.scrollTo(0,0); 
    20                active_tab = hash; 
    21           } else if (active_tab == '') { // open first part 
    22                active_tab = $('.'+$.pageTabs.options.contentClass+':eq(0)').attr('id'); 
    23           } 
     18    if (hash !== undefined && hash) { 
     19      window.scrollTo(0, 0); 
     20      active_tab = hash; 
     21    } else if (active_tab == '') { // open first part 
     22      active_tab = $('.' + $.pageTabs.options.contentClass + ':eq(0)').attr('id'); 
     23    } 
    2424 
    25           createTabs(); 
     25    createTabs(); 
    2626 
    27           $('ul li', '.'+$.pageTabs.options.containerClass).click(function(e) { 
    28                if ($(this).hasClass($.pageTabs.options.activeClass)) { 
    29                     return; 
    30                } 
     27    $('ul li', '.' + $.pageTabs.options.containerClass).click(function(e) { 
     28      if ($(this).hasClass($.pageTabs.options.activeClass)) { 
     29        return; 
     30      } 
    3131 
    32                $(this).parent().find('li.'+$.pageTabs.options.activeClass).removeClass($.pageTabs.options.activeClass); 
    33                $(this).addClass($.pageTabs.options.activeClass); 
    34                $('.'+$.pageTabs.options.contentClass+'.active').removeClass('active').hide(); 
     32      $(this).parent().find('li.' + $.pageTabs.options.activeClass).removeClass($.pageTabs.options.activeClass); 
     33      $(this).addClass($.pageTabs.options.activeClass); 
     34      $('.' + $.pageTabs.options.contentClass + '.active').removeClass('active').hide(); 
    3535 
    36                var part_to_activate = $('#'+$.pageTabs.options.partPrefix+getHash($(this).find('a').attr('href'))); 
     36      var part_to_activate = $('#' + $.pageTabs.options.partPrefix + getHash($(this).find('a').attr('href'))); 
    3737 
    38                part_to_activate.addClass('active').show(); 
    39                if (!part_to_activate.hasClass('loaded')) { 
    40                     part_to_activate.onetabload(); 
    41                     part_to_activate.addClass('loaded'); 
    42                } 
     38      part_to_activate.addClass('active').show(); 
     39      if (!part_to_activate.hasClass('loaded')) { 
     40        part_to_activate.onetabload(); 
     41        part_to_activate.addClass('loaded'); 
     42      } 
    4343 
    44                part_to_activate.tabload(); 
    45           }); 
     44      part_to_activate.tabload(); 
     45    }); 
    4646 
    47           $(window).bind('hashchange onhashchange', function(e) { 
    48                $.pageTabs.clickTab($.pageTabs.getLocationHash()); 
    49           }); 
     47    $(window).bind('hashchange onhashchange', function(e) { 
     48      $.pageTabs.clickTab($.pageTabs.getLocationHash()); 
     49    }); 
    5050 
    51           $.pageTabs.clickTab(active_tab); 
     51    $.pageTabs.clickTab(active_tab); 
    5252 
    53           if (subhash !== undefined) { 
    54                // Tab displayed, now scroll to the sub-part if defined in original document.location (#tab.sub-part) 
    55                document.getElementById(subhash).scrollIntoView(); 
    56           } 
     53    if (subhash !== undefined) { 
     54      var elt = document.getElementById(subhash); 
     55      // Tab displayed, now scroll to the sub-part if defined in original document.location (#tab.sub-part) 
     56      elt.scrollIntoView() 
     57      // Give focus to the sub-part if possible 
     58      $('#' + subhash).addClass('focus').focusout(function() { 
     59        $(this).removeClass('focus'); 
     60      }); 
     61      elt.focus(); 
     62    } 
    5763 
    58           return this; 
    59      }; 
     64    return this; 
     65  }; 
    6066 
    61      var createTabs = function createTabs() { 
    62           var lis = [], li_class = ''; 
     67  var createTabs = function createTabs() { 
     68    var lis = [], 
     69      li_class = ''; 
    6370 
    64           $('.'+$.pageTabs.options.contentClass).each(function() { 
    65                $(this).hide(); 
    66                lis.push('<li id="'+$.pageTabs.options.idTabPrefix+$(this).attr('id')+'">' 
    67                      +'<a href="#'+$(this).attr('id')+'">'+$(this).attr('title')+'</a></li>'); 
    68                $(this).attr('id', $.pageTabs.options.partPrefix + $(this).attr('id')).prop('title',''); 
    69           }); 
     71    $('.' + $.pageTabs.options.contentClass).each(function() { 
     72      $(this).hide(); 
     73      lis.push('<li id="' + $.pageTabs.options.idTabPrefix + $(this).attr('id') + '">' + 
     74        '<a href="#' + $(this).attr('id') + '">' + $(this).attr('title') + '</a></li>'); 
     75      $(this).attr('id', $.pageTabs.options.partPrefix + $(this).attr('id')).prop('title', ''); 
     76    }); 
    7077 
    71           $('<div class="'+$.pageTabs.options.containerClass+'"><ul>'+lis.join('')+'</ul></div>') 
    72                .insertBefore($('.'+$.pageTabs.options.contentClass).get(0)); 
    73      }; 
     78    $('<div class="' + $.pageTabs.options.containerClass + '"><ul>' + lis.join('') + '</ul></div>') 
     79      .insertBefore($('.' + $.pageTabs.options.contentClass).get(0)); 
     80  }; 
    7481 
    75      var getHash = function getHash(href) { 
    76           var href = href || ''; 
     82  var getHash = function getHash(href) { 
     83    var href = href || ''; 
    7784 
    78           return href.replace(/.*#/, ''); 
    79      }; 
     85    return href.replace(/.*#/, ''); 
     86  }; 
    8087 
    81      $.pageTabs.clickTab = function(tab) { 
    82           if (tab=='') { 
    83                tab = getHash($('ul li a', '.'+$.pageTabs.options.containerClass+':eq(0)').attr('href')); 
    84           } else if ($('#'+$.pageTabs.options.idTabPrefix+tab, '.'+$.pageTabs.options.containerClass).length==0) { 
    85                // try to find anchor in a .multi-part div 
    86                if ($('#'+tab).length==1) { 
    87                     var div_content = $('#'+tab).parents('.'+$.pageTabs.options.contentClass); 
    88                     if (div_content.length==1) { 
    89                          tab = div_content.attr('id').replace($.pageTabs.options.partPrefix,''); 
    90                     } else { 
    91                          tab = getHash($('ul li a', '.'+$.pageTabs.options.containerClass+':eq(0)').attr('href')); 
    92                     } 
    93                } else { 
    94                     tab = getHash($('ul li a', '.'+$.pageTabs.options.containerClass+':eq(0)').attr('href')); 
    95                } 
    96           } 
     88  $.pageTabs.clickTab = function(tab) { 
     89    if (tab == '') { 
     90      tab = getHash($('ul li a', '.' + $.pageTabs.options.containerClass + ':eq(0)').attr('href')); 
     91    } else if ($('#' + $.pageTabs.options.idTabPrefix + tab, '.' + $.pageTabs.options.containerClass).length == 0) { 
     92      // try to find anchor in a .multi-part div 
     93      if ($('#' + tab).length == 1) { 
     94        var div_content = $('#' + tab).parents('.' + $.pageTabs.options.contentClass); 
     95        if (div_content.length == 1) { 
     96          tab = div_content.attr('id').replace($.pageTabs.options.partPrefix, ''); 
     97        } else { 
     98          tab = getHash($('ul li a', '.' + $.pageTabs.options.containerClass + ':eq(0)').attr('href')); 
     99        } 
     100      } else { 
     101        tab = getHash($('ul li a', '.' + $.pageTabs.options.containerClass + ':eq(0)').attr('href')); 
     102      } 
     103    } 
    97104 
    98           $('ul li a', '.'+$.pageTabs.options.containerClass).filter(function() { 
    99                return getHash($(this).attr('href'))==tab; 
    100           }).parent().click(); 
    101      }; 
     105    $('ul li a', '.' + $.pageTabs.options.containerClass).filter(function() { 
     106      return getHash($(this).attr('href')) == tab; 
     107    }).parent().click(); 
     108  }; 
    102109 
    103      $.pageTabs.getLocationHash = function() { 
    104           // Return the URL hash (without subhash — #hash[.subhash]) 
    105           var h = getHash(document.location.hash).split('.'); 
    106           return h[0]; 
    107      }; 
    108      $.pageTabs.getLocationSubhash = function() { 
    109           // Return the URL subhash if present (without hash — #hash[.subhash]) 
    110           var sh = getHash(document.location.hash).split('.'); 
    111           return sh[1]; 
    112      }; 
     110  $.pageTabs.getLocationHash = function() { 
     111    // Return the URL hash (without subhash — #hash[.subhash]) 
     112    var h = getHash(document.location.hash).split('.'); 
     113    return h[0]; 
     114  }; 
     115  $.pageTabs.getLocationSubhash = function() { 
     116    // Return the URL subhash if present (without hash — #hash[.subhash]) 
     117    var sh = getHash(document.location.hash).split('.'); 
     118    return sh[1]; 
     119  }; 
    113120})(jQuery); 
    114121 
    115122jQuery.fn.tabload = function(f) { 
    116      this.each(function() { 
    117           if (f) { 
    118                chainHandler(this,'tabload',f) 
    119           } else { 
    120                var h = this.tabload; 
    121                if (h) { h.apply(this); } 
    122           } 
    123      }); 
    124      return this; 
     123  this.each(function() { 
     124    if (f) { 
     125      chainHandler(this, 'tabload', f) 
     126    } else { 
     127      var h = this.tabload; 
     128      if (h) { 
     129        h.apply(this); 
     130      } 
     131    } 
     132  }); 
     133  return this; 
    125134}; 
    126135 
    127136jQuery.fn.onetabload = function(f) { 
    128      this.each(function() { 
    129           if (f) { 
    130                chainHandler(this,'onetabload',f); 
    131           } else { 
    132                var h = this.onetabload; 
    133                if (h != null) { 
    134                     h.apply(this); 
    135                     this.onetabload = null; 
    136                } 
    137           } 
    138      }); 
    139      return this; 
     137  this.each(function() { 
     138    if (f) { 
     139      chainHandler(this, 'onetabload', f); 
     140    } else { 
     141      var h = this.onetabload; 
     142      if (h != null) { 
     143        h.apply(this); 
     144        this.onetabload = null; 
     145      } 
     146    } 
     147  }); 
     148  return this; 
    140149}; 

  • admin/style/default.css

    r3685 r3690  
    984984  text-decoration: none; } 
    985985 
    986 input[type=text], 
    987 input[type=password], 
    988 input[type=submit], 
    989 input[type=button], 
    990 input[type=reset], 
    991 a.button, 
    992 button, 
    993 textarea, 
    994 select, 
    995 legend { 
     986input[type=text], input[type=password], input[type=submit], input[type=button], input[type=reset], a.button, button, textarea, select, legend { 
    996987  max-width: 100%; } 
    997988 
    998 input[type=text], 
    999 input[type=password], 
    1000 input[type=submit], 
    1001 input[type=button], 
    1002 input[type=reset], 
    1003 a.button, 
    1004 button, 
    1005 textarea, 
    1006 legend { 
     989input[type=text], input[type=password], input[type=submit], input[type=button], input[type=reset], a.button, button, textarea, legend { 
    1007990  border-radius: 3px; } 
    1008991 
    … …  
    10231006    background-color: #eee; } 
    10241007 
    1025 input[type=text], 
    1026 textarea { 
     1008input[type=text], textarea { 
    10271009  font-family: inherit; 
    10281010  font-size: 100%; } 
    … …  
    10361018  margin-bottom: 0.5em; } 
    10371019 
    1038 label .maximal, 
    1039 textarea.maximal, 
    1040 input.maximal, 
    1041 select.maximal { 
     1020label .maximal, textarea.maximal, input.maximal, select.maximal { 
    10421021  width: 99%; } 
    10431022 
    1044 input.invalid, 
    1045 textarea.invalid, 
    1046 select.invalid, 
    1047 input:not([type=file]):invalid:not(:focus) { 
     1023input.invalid, textarea.invalid, select.invalid, input:not([type=file]):invalid:not(:focus) { 
    10481024  color: #900; 
    10491025  box-shadow: 0 0 0 3px rgba(218, 62, 90, 0.3); } 
    10501026 
    1051 input.invalid, 
    1052 textarea.invalid, 
    1053 input:not([type=file]):invalid:not(:focus) { 
     1027input.invalid, textarea.invalid, input:not([type=file]):invalid:not(:focus) { 
    10541028  border: 1px solid red; 
    10551029  background: #FFBABA; } 
    10561030 
    1057 input[type=text], 
    1058 input[type=password], 
    1059 textarea, 
    1060 select, 
    1061 input:not([type=file]):invalid, 
    1062 input:not([type=file]):invalid:placeholder-shown { 
     1031input[type=text], input[type=password], textarea, select, input:not([type=file]):invalid, input:not([type=file]):invalid:placeholder-shown { 
    10631032  color: #000; 
    10641033  box-shadow: 1px 1px 2px #f3f3f3 inset; 
    … …  
    10661035  vertical-align: top; } 
    10671036 
    1068 input[type=text], 
    1069 input[type=password], 
    1070 textarea, 
    1071 input:not([type=file]):invalid, 
    1072 input:not([type=file]):invalid:placeholder-shown { 
     1037input[type=text], input[type=password], textarea, input:not([type=file]):invalid, input:not([type=file]):invalid:placeholder-shown { 
    10731038  background: #fcfcfc; 
    10741039  border-width: 1px; 
    … …  
    10761041  border-color: #dfdfdf; } 
    10771042 
    1078 input:focus, 
    1079 textarea:focus { 
     1043input:focus, textarea:focus { 
    10801044  border-color: #9bca1c; } 
    10811045 
    … …  
    11041068  background: transparent url(../images/check-on.png) no-repeat 0 50%; } 
    11051069 
    1106 input[type=text], 
    1107 input[type=password], 
    1108 textarea { 
     1070input[type=text], input[type=password], textarea { 
    11091071  margin-right: .3em; } 
    11101072 
    1111 input[type=checkbox], 
    1112 input[type=radio], 
    1113 input[type=file] { 
     1073input[type=checkbox], input[type=radio], input[type=file] { 
    11141074  border: none; 
    11151075  margin: 0 .33em 0 0; 
    … …  
    11341094  font-weight: normal; } 
    11351095 
    1136 label, 
    1137 label span { 
     1096label, label span { 
    11381097  display: block; } 
    11391098 
    1140 label.ib, 
    1141 input.ib { 
     1099label.ib, input.ib { 
    11421100  display: inline-block; } 
    11431101 
    … …  
    11451103  display: inline; } 
    11461104 
    1147 label.classic input, 
    1148 label span input, 
    1149 label.classic select, 
    1150 label span select { 
     1105label.classic input, label span input, label.classic select, label span select { 
    11511106  display: inline; } 
    11521107 
    … …  
    11631118  margin-top: 2em; } 
    11641119 
    1165 label.area, 
    1166 p.area { 
     1120label.area, p.area { 
    11671121  width: inherit !important; } 
    11681122 
    … …  
    11741128  p.field.wide label { 
    11751129    width: 21em; } 
    1176   p.field input, 
    1177   p.field select { 
     1130  p.field input, p.field select { 
    11781131    display: inline-block; } 
    11791132 
    … …  
    11991152  50% { 
    12001153    background-color: #ffbaba; } 
     1154  100% { 
     1155    background-color: inherit; } } 
     1156.focus { 
     1157  background-color: inherit; 
     1158  animation-name: kf-focus; 
     1159  animation-duration: 1s; } 
     1160 
     1161@keyframes kf-focus { 
     1162  0% { 
     1163    background-color: inherit; } 
     1164  50% { 
     1165    background-color: #ccff00; } 
    12011166  100% { 
    12021167    background-color: inherit; } } 

  • admin/style/scss/partials/_forms.scss

    r3685 r3690  
    1 input[type=text], 
    2 input[type=password], 
    3 input[type=submit], 
    4 input[type=button], 
    5 input[type=reset], 
    6 a.button, 
    7 button, 
    8 textarea, 
    9 select, 
     1input[type=text], input[type=password], input[type=submit], input[type=button], input[type=reset], a.button, button, textarea, select, legend { 
     2  max-width: 100%; 
     3} 
     4input[type=text], input[type=password], input[type=submit], input[type=button], input[type=reset], a.button, button, textarea, legend { 
     5  border-radius: 3px; 
     6} 
     7form { 
     8  display: block; 
     9  margin: 0; 
     10  padding: 0; 
     11} 
     12fieldset { 
     13  display: block; 
     14  margin: 1em 0; 
     15  padding: 1em 0.5em; 
     16  border-width: 1px 0; 
     17  border-style: solid; 
     18  border-color: #ccc; 
     19  background: #f7f7f7; 
     20  &:focus-within { 
     21    background-color: #eee; 
     22  } 
     23} 
     24input[type=text], textarea { 
     25  font-family: $sans-serif-input; 
     26  font-size: 100%; 
     27} 
    1028legend { 
    11      max-width: 100%; 
    12 } 
    13  
    14 input[type=text], 
    15 input[type=password], 
    16 input[type=submit], 
    17 input[type=button], 
    18 input[type=reset], 
    19 a.button, 
    20 button, 
    21 textarea, 
    22 legend { 
    23      border-radius: 3px; 
    24 } 
    25  
    26 form { 
    27      display: block; 
    28      margin: 0; 
    29      padding: 0; 
    30 } 
    31  
    32 fieldset { 
    33      display: block; 
    34      margin: 1em 0; 
    35      padding: 1em 0.5em; 
    36      border-width: 1px 0; 
    37      border-style: solid; 
    38      border-color: #ccc; 
    39      background: #f7f7f7; 
    40      &:focus-within { 
    41           background-color: #eee; 
    42      } 
    43 } 
    44  
    45 input[type=text], 
     29  padding: 0.2em 0.6em; 
     30  border-width: 1px; 
     31  border-style: solid; 
     32  border-color: #676e78; 
     33  background: #fff; 
     34  margin-bottom: 0.5em; 
     35} 
     36label .maximal, textarea.maximal, input.maximal, select.maximal { 
     37  width: 99%; 
     38} 
     39input.invalid, textarea.invalid, select.invalid, input:not([type=file]):invalid:not(:focus) { 
     40  color: #900; 
     41  box-shadow: 0 0 0 3px rgba(218, 62, 90, 0.3); 
     42} 
     43input.invalid, textarea.invalid, input:not([type=file]):invalid:not(:focus) { 
     44  border: 1px solid red; 
     45  background: #FFBABA; 
     46} 
     47input[type=text], input[type=password], textarea, select, input:not([type=file]):invalid, input:not([type=file]):invalid:placeholder-shown { 
     48  color: #000; 
     49  box-shadow: 1px 1px 2px #f3f3f3 inset; 
     50  padding: 3px; 
     51  vertical-align: top; 
     52} 
     53input[type=text], input[type=password], textarea, input:not([type=file]):invalid, input:not([type=file]):invalid:placeholder-shown { 
     54  background: #fcfcfc; 
     55  border-width: 1px; 
     56  border-style: solid; 
     57  border-color: #dfdfdf; 
     58} 
     59input:focus, textarea:focus { 
     60  border-color: #9bca1c; 
     61} 
    4662textarea { 
    47      font-family: $sans-serif-input; 
    48      font-size: 100%; 
    49 } 
    50  
    51 legend { 
    52      padding: 0.2em 0.6em; 
    53      border-width: 1px; 
    54      border-style: solid; 
    55      border-color: #676e78; 
    56      background: #fff; 
    57      margin-bottom: 0.5em; 
    58 } 
    59  
    60 label .maximal, 
    61 textarea.maximal, 
    62 input.maximal, 
    63 select.maximal { 
    64      width: 99%; 
    65 } 
    66  
    67 input.invalid, 
    68 textarea.invalid, 
    69 select.invalid, 
    70 input:not([type=file]):invalid:not(:focus) { 
    71      color: #900; 
    72      box-shadow: 0 0 0 3px rgba(218, 62, 90, 0.3); 
    73 } 
    74 input.invalid, 
    75 textarea.invalid, 
    76 input:not([type=file]):invalid:not(:focus) { 
    77      border: 1px solid red; 
    78      background: #FFBABA; 
    79 } 
    80  
    81 input[type=text], 
    82 input[type=password], 
    83 textarea, 
    84 select, 
    85 input:not([type=file]):invalid, 
    86 input:not([type=file]):invalid:placeholder-shown { 
    87      color: #000; 
    88      box-shadow: 1px 1px 2px #f3f3f3 inset; 
    89      padding: 3px; 
    90      vertical-align: top; 
    91 } 
    92 input[type=text], 
    93 input[type=password], 
    94 textarea, 
    95 input:not([type=file]):invalid, 
    96 input:not([type=file]):invalid:placeholder-shown { 
    97      background: #fcfcfc; 
    98      border-width: 1px; 
    99      border-style: solid; 
    100      border-color: #dfdfdf; 
    101 } 
    102  
    103 input:focus, 
    104 textarea:focus { 
    105      border-color: #9bca1c; 
    106 } 
    107  
    108 textarea { 
    109      padding: 2px 0; 
    110      &.maximal { 
    111           resize: vertical; 
    112      } 
    113      .area & { 
    114           display: block; 
    115           width: 100%; 
    116           resize: vertical; 
    117      } 
    118 } 
    119  
     63  padding: 2px 0; 
     64  &.maximal { 
     65    resize: vertical; 
     66  } 
     67  .area & { 
     68    display: block; 
     69    width: 100%; 
     70    resize: vertical; 
     71  } 
     72} 
    12073select { 
    121      padding: 2px 0; 
    122      vertical-align: middle; 
    123 } 
    124 @media not all and (min-resolution:.001dpcm) 
    125 { @supports (-webkit-appearance:none) { 
    126      /* Safari 10.1+ only (https://browserstrangeness.bitbucket.io/css_hacks.html#webkit) */ 
    127      select { 
    128           font-size: initial; 
     74  padding: 2px 0; 
     75  vertical-align: middle; 
     76} 
     77@media not all and (min-resolution:.001dpcm) { 
     78  @supports (-webkit-appearance: none) { 
     79    /* Safari 10.1+ only (https://browserstrangeness.bitbucket.io/css_hacks.html#webkit) */ 
     80    select { 
     81      font-size: initial; 
    12982    } 
    130 }} 
    131  
     83  } 
     84} 
    13285select.l10n option { 
    133      padding-left: 16px; 
    134 } 
    135  
     86  padding-left: 16px; 
     87} 
    13688option.avail10n { 
    137      background: transparent url(../images/check-on.png) no-repeat 0 50%; 
    138 } 
    139  
    140 input[type=text], 
    141 input[type=password], 
    142 textarea { 
    143      margin-right: .3em; 
    144 } 
    145  
    146 input[type=checkbox], 
    147 input[type=radio], 
     89  background: transparent url(../images/check-on.png) no-repeat 0 50%; 
     90} 
     91input[type=text], input[type=password], textarea { 
     92  margin-right: .3em; 
     93} 
     94input[type=checkbox], input[type=radio], input[type=file] { 
     95  border: none; 
     96  margin: 0 .33em 0 0; 
     97  padding: 0; 
     98  background: transparent; 
     99} 
     100input+input[type=checkbox] { 
     101  // Used for js expand/hide (lists, options, ...) 
     102  margin-left: .33em; 
     103} 
     104a input { 
     105  // Used for js expand/hide (lists, options, ...) 
     106  margin-right: .33em; 
     107} 
    148108input[type=file] { 
    149      border: none; 
    150      margin: 0 .33em 0 0; 
    151      padding: 0; 
    152      background: transparent; 
    153 } 
    154 input + input[type=checkbox] { 
    155      // Used for js expand/hide (lists, options, ...) 
    156      margin-left: .33em; 
    157 } 
    158 a input { 
    159      // Used for js expand/hide (lists, options, ...) 
    160      margin-right: .33em; 
    161 } 
    162  
    163 input[type=file] { 
    164      margin-top: .3em; 
    165      margin-bottom: .3em; 
    166 } 
    167  
     109  margin-top: .3em; 
     110  margin-bottom: .3em; 
     111} 
    168112optgroup { 
    169      font-weight: bold; 
    170      font-style: normal; 
    171 } 
    172  
     113  font-weight: bold; 
     114  font-style: normal; 
     115} 
    173116option { 
    174      font-weight: normal; 
    175 } 
    176  
    177 label, 
    178 label span { 
    179      display: block; 
    180 } 
    181  
    182 label.ib, 
    183 input.ib { 
    184      display: inline-block; 
    185 } 
    186  
     117  font-weight: normal; 
     118} 
     119label, label span { 
     120  display: block; 
     121} 
     122label.ib, input.ib { 
     123  display: inline-block; 
     124} 
    187125label.classic { 
    188      display: inline; 
    189 } 
    190  
    191 label.classic input, 
    192 label span input, 
    193 label.classic select, 
    194 label span select { 
    195      display: inline; 
    196 } 
    197  
     126  display: inline; 
     127} 
     128label.classic input, label span input, label.classic select, label span select { 
     129  display: inline; 
     130} 
    198131label.required { 
    199      font-weight: bold; 
    200 } 
    201  
     132  font-weight: bold; 
     133} 
    202134label.required abbr { 
    203      color: #900; 
    204      font-size: 1.3em; 
    205 } 
    206  
     135  color: #900; 
     136  font-size: 1.3em; 
     137} 
    207138label.bold { 
    208      text-transform: uppercase; 
    209      font-weight: bold; 
    210      margin-top: 2em; 
    211 } 
    212  
    213 label.area, 
    214 p.area { 
    215      width: inherit !important; 
    216 } 
    217  
     139  text-transform: uppercase; 
     140  font-weight: bold; 
     141  margin-top: 2em; 
     142} 
     143label.area, p.area { 
     144  width: inherit !important; 
     145} 
    218146p.field { 
    219      position: relative; 
    220      label { 
    221           display: inline-block; 
    222           width: 14em; 
    223      } 
    224      &.wide label { 
    225           width: 21em; 
    226      } 
    227      input, 
    228      select { 
    229           display: inline-block; 
    230      } 
    231 } 
    232  
     147  position: relative; 
     148  label { 
     149    display: inline-block; 
     150    width: 14em; 
     151  } 
     152  &.wide label { 
     153    width: 21em; 
     154  } 
     155  input, select { 
     156    display: inline-block; 
     157  } 
     158} 
    233159.form-note, .form-stats { 
    234      font-style: italic; 
    235      font-weight: normal; 
    236      color: #676e78; 
    237 } 
    238  
     160  font-style: italic; 
     161  font-weight: normal; 
     162  color: #676e78; 
     163} 
    239164p.form-note, p.form-stats { 
    240      margin-top: -.7em; 
    241 } 
    242  
     165  margin-top: -.7em; 
     166} 
    243167span.form-note, span.form-stats { 
    244      text-transform: none; 
    245 } 
    246  
     168  text-transform: none; 
     169} 
    247170.missing { 
    248171  background-color: inherit; 
    … …  
    261184  } 
    262185} 
    263  
     186.focus { 
     187  background-color: inherit; 
     188  animation-name: kf-focus; 
     189  animation-duration: 1s; 
     190} 
     191@keyframes kf-focus { 
     192  0% { 
     193    background-color: inherit; 
     194  } 
     195  50% { 
     196    background-color: #ccff00; 
     197  } 
     198  100% { 
     199    background-color: inherit; 
     200  } 
     201} 
    264202// .more-info Additional information on fieldset, field, … (may be hide from user-prefs) 
    265203.more-info {} 
    266  
    267204.no-more-info { 
    268      display: none; 
    269 } 
     205  display: none; 
     206} 

  • admin/style/scss/partials/_utils.scss

    r3685 r3690  
    88} 
    99 
    10  
    1110/* _media_item.js */ 
    1211 
Note: See TracChangeset for help on using the changeset viewer.

Sites map