venerdì 1 agosto 2014

disable firefox wild zoom

How to disable the annoying wild zooming (ctrl + wheel) on firefox: about: config find mousewheel.with_control.action and set the value to 0

martedì 8 luglio 2014

CSS Callout for Bootstrap

A small css for the box-type "callout" similar to those used in the documentation of twitter bootstrap.
(Boostrap is required :-))
    /* callout like bootstrap docs */
    .bs-callout {
      margin: 20px 0;
      padding: 15px 30px 15px 15px;
      border: 1px solid #eee;
      border-left: 5px solid #eee;
      border-radius: 3px;
    }

    .bs-callout h4 {
      margin-top: 0;
    }
    .bs-callout p:last-child {
      margin-bottom: 0;
    }

    .bs-callout code,
    .bs-callout .highlight {
      background-color: #fff;
    }
     
    .bs-callout-danger { border-left: 5px solid #dFb5b4; }
    .bs-callout-danger h4 { color: #B94A48; }
    .bs-callout-warning { border-left: 5px solid #C09853; }
    .bs-callout-warning h4 { color: #f1e7bc; }
    .bs-callout-info { border-left: 5px solid #d0e3f0; }
    .bs-callout-info h4 { color: #3A87AD; }
    .bs-callout-primary { border-left: 5px solid #285e8e; }
    .bs-callout-primary h4 { color: #428bca; }
    .bs-callout-success { border-left: 5px solid #398439; }
    .bs-callout-success h4 { color: #5cb85c; }
    
Use it:
    <div class="bs-callout bs-callout-primary">
        <h4>Your Title</h4>
        <p>
            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla blandit neque sed laoreet luctus.
            Vestibulum laoreet nunc id nunc euismod, a lacinia mauris pharetra. Sed nec odio augue.
            Duis gravida scelerisque tellus eget fermentum. Suspendisse potenti. Aliquam vel vehicula nunc.
            Donec porta arcu at dui ultricies, vitae tempor quam scelerisque. Aenean id nibh pretium, suscipit dui et,
            tempus risus. Vestibulum leo nisi, tristique eu interdum dignissim, hendrerit non ligula. Nam eget ultrices
            turpis, nec venenatis mi. Integer vel tellus lorem.
        <p/>
    </div>
    
Result:

Your Title

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla blandit neque sed laoreet luctus. Vestibulum laoreet nunc id nunc euismod, a lacinia mauris pharetra. Sed nec odio augue. Duis gravida scelerisque tellus eget fermentum. Suspendisse potenti. Aliquam vel vehicula nunc. Donec porta arcu at dui ultricies, vitae tempor quam scelerisque. Aenean id nibh pretium, suscipit dui et, tempus risus. Vestibulum leo nisi, tristique eu interdum dignissim, hendrerit non ligula. Nam eget ultrices turpis, nec venenatis mi. Integer vel tellus lorem.


Your Title

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla blandit neque sed laoreet luctus. Vestibulum laoreet nunc id nunc euismod, a lacinia mauris pharetra. Sed nec odio augue. Duis gravida scelerisque tellus eget fermentum. Suspendisse potenti. Aliquam vel vehicula nunc. Donec porta arcu at dui ultricies, vitae tempor quam scelerisque. Aenean id nibh pretium, suscipit dui et, tempus risus. Vestibulum leo nisi, tristique eu interdum dignissim, hendrerit non ligula. Nam eget ultrices turpis, nec venenatis mi. Integer vel tellus lorem.


Your Title

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla blandit neque sed laoreet luctus. Vestibulum laoreet nunc id nunc euismod, a lacinia mauris pharetra. Sed nec odio augue. Duis gravida scelerisque tellus eget fermentum. Suspendisse potenti. Aliquam vel vehicula nunc. Donec porta arcu at dui ultricies, vitae tempor quam scelerisque. Aenean id nibh pretium, suscipit dui et, tempus risus. Vestibulum leo nisi, tristique eu interdum dignissim, hendrerit non ligula. Nam eget ultrices turpis, nec venenatis mi. Integer vel tellus lorem.



etc ...