lixinru
/
YtIoT


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126
							<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <title>The source code</title>
  <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
  <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
  <style type="text/css">
    .highlight { display: block; background-color: #ddd; }
  </style>
  <script type="text/javascript">
    function highlight() {
      document.getElementById(location.hash.replace(/#/, "")).className = "highlight";
    }
  </script>
</head>
<body onload="prettyPrint(); highlight();">
  <pre class="prettyprint lang-js">@mixin extjs-splitter {
    .#{$prefix}splitter {
        .#{$prefix}collapse-el {
            position: absolute;

            cursor: pointer;

            background-color: transparent;
            background-repeat: no-repeat !important;
        }
    }

    .#{$prefix}layout-split-left,
    .#{$prefix}layout-split-right {
        top: 50%;

        margin-top: -17px;

        width: 5px;
        height: 35px;
    }

    .#{$prefix}layout-split-top,
    .#{$prefix}layout-split-bottom {
        left: 50%;

        width: 35px;
        height: 5px;

        margin-left: -17px;
    }

    .#{$prefix}layout-split-left {
        background: no-repeat top right;
        background-image: theme-background-image($theme-name, 'util/splitter/mini-left.gif');
    }

    .#{$prefix}layout-split-right {
        background: no-repeat top left;
        background-image: theme-background-image($theme-name, 'util/splitter/mini-right.gif');
    }

    .#{$prefix}layout-split-top {
        background: no-repeat top left;
        background-image: theme-background-image($theme-name, 'util/splitter/mini-top.gif');
    }

    .#{$prefix}layout-split-bottom {
        background: no-repeat top left;
        background-image: theme-background-image($theme-name, 'util/splitter/mini-bottom.gif');
    }

    .#{$prefix}splitter-collapsed {
        .#{$prefix}layout-split-left {
            background: no-repeat top left;
            background-image: theme-background-image($theme-name, 'util/splitter/mini-right.gif');
        }

        .#{$prefix}layout-split-right {
            background: no-repeat top right;
            background-image: theme-background-image($theme-name, 'util/splitter/mini-left.gif');
        }

        .#{$prefix}layout-split-top {
            background: no-repeat top left;
            background-image: theme-background-image($theme-name, 'util/splitter/mini-bottom.gif');
        }

        .#{$prefix}layout-split-bottom {
            background: no-repeat top left;
            background-image: theme-background-image($theme-name, 'util/splitter/mini-top.gif');
        }
    }

    .#{$prefix}splitter-horizontal {
        cursor: e-resize;
        cursor: row-resize;
        font-size:1px;
    }
    
    .#{$prefix}splitter-vertical {
        cursor: e-resize;
        cursor: col-resize;
        font-size:1px;
    }
    .#{$prefix}splitter-collapsed, .#{$prefix}splitter-horizontal-noresize, .#{$prefix}splitter-vertical-noresize {
        cursor: default;
    }

    .#{$prefix}splitter-active {
        z-index: 4;
        font-size:1px;
        background-color: rgb(180, 180, 180);
        @include opacity(0.8);
    }
    .#{$prefix}splitter-active {
        .#{$prefix}collapse-el {
            @include opacity(0.3);
        }
    }

    .#{$prefix}proxy-el {
        position: absolute;
        background: rgb(180, 180, 180);
        @include opacity(0.8);
    }
}</pre>
</body>
</html>