daily pastebin goal
91%
SHARE
TWEET

Untitled

a guest May 16th, 2018 102 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <!-- TREEVIEW CODE -->
  2. <div class="treeview">
  3. <ul>
  4.     <li class="lamb-first-li">
  5.         <a>
  6.             <div class="container-fluid">
  7.                 <div class="row">
  8.                     Top level
  9.                 </div>
  10.                 <div class="row">
  11.                     <i class="fa fa-exclamation-circle fa-2x"></i>
  12.                 </div>
  13.                 <div class="row">
  14.                     15 Failed Tests
  15.                 </div>
  16.             </div>
  17.         </a>
  18.         <ul>
  19.  
  20.             <li>
  21.                 <a>
  22.                     <div class="container-fluid">
  23.                         <div class="row">
  24.                             Top level
  25.                         </div>
  26.                         <div class="row">
  27.                             <i class="fa fa-exclamation-circle fa-2x"></i>
  28.                         </div>
  29.                         <div class="row">
  30.                             15 Failed Tests
  31.                         </div>
  32.                     </div>
  33.                 </a>
  34.             </li>
  35.             <li>
  36.                 <a>
  37.                     <div class="container-fluid">
  38.                         <div class="row">
  39.                             Top level
  40.                         </div>
  41.                         <div class="row">
  42.                             <i class="fa fa-exclamation-circle fa-2x"></i>
  43.                         </div>
  44.                         <div class="row">
  45.                             15 Failed Tests
  46.                         </div>
  47.                     </div>
  48.                 </a>
  49.                 <ul>
  50.                     <li>
  51.                         <a>
  52.                             <div class="container-fluid">
  53.                                 <div class="row">
  54.                                     Top level
  55.                                 </div>
  56.                                 <div class="row">
  57.                                     <i class="fa fa-exclamation-circle fa-2x"></i>
  58.                                 </div>
  59.                                 <div class="row">
  60.                                     15 Failed Tests
  61.                                 </div>
  62.                             </div>
  63.                         </a>
  64.                         <ul>
  65.                             <li>
  66.                                 <a>
  67.                                     <div class="container-fluid">
  68.                                         <div class="row">
  69.                                             Top level
  70.                                         </div>
  71.                                         <div class="row">
  72.                                             <i class="fa fa-exclamation-circle fa-2x"></i>
  73.                                         </div>
  74.                                         <div class="row">
  75.                                             15 Failed Tests
  76.                                         </div>
  77.                                     </div>
  78.                                 </a>
  79.                             </li>
  80.                             <li>
  81.                                 <a>
  82.                                     <div class="container-fluid">
  83.                                         <div class="row">
  84.                                             Top level
  85.                                         </div>
  86.                                         <div class="row">
  87.                                             <i class="fa fa-exclamation-circle fa-2x"></i>
  88.                                         </div>
  89.                                         <div class="row">
  90.                                             15 Failed Tests
  91.                                         </div>
  92.                                     </div>
  93.                                 </a>
  94.                             </li>
  95.                         </ul>
  96.                     </li>
  97.                 </ul>
  98.             </li>
  99.         </ul>
  100.     </li>
  101. </ul>
  102. </div>
  103. <!-- TREEVIEW CODE -->
  104.    
  105. div {
  106. &.panel:first-child {
  107.   margin-top: 20px;
  108. }
  109. &.treeview {
  110.   padding: 4px;
  111.   margin-bottom: 20px;
  112.   ul:first-child:before {
  113.     display: none;
  114.   }
  115. }
  116. }
  117.  
  118. .treeview {
  119. margin: 0;
  120. padding: 0;
  121. list-style: none;
  122. color: #369;
  123. ul {
  124.  
  125.   margin: 0;
  126.   padding: 0;
  127.   list-style: none;
  128.   color: #369;
  129.   margin-left: 1em;
  130.   position: relative;
  131.   ul {
  132.     margin-left: 5.5em;
  133.   }
  134.   &:before {
  135.     content: "";
  136.     display: block;
  137.     width: 0;
  138.     position: absolute;
  139.     top: 0;
  140.     left: 0;
  141.     border-left: 1px solid;
  142.     bottom: 4.1rem; /* 76px */
  143.   }
  144. }
  145. li {
  146.   margin: 0;
  147.   padding: 0.4rem 5em;
  148.   line-height: 2em;
  149.   font-weight: 700;
  150.   position: relative;
  151.  
  152.   .container-fluid {
  153.     .row {
  154.       text-align: center;
  155.       display: block;
  156.       .lamb-link {
  157.         display: inline;
  158.       }
  159.     }
  160.     .lamb-name-module {
  161.       color: nb-theme(color-primary);
  162.     }
  163.   }
  164.  
  165. }
  166. ul {
  167.   li.lamb-first-li:before {
  168.     border: none;
  169.   }
  170.   li:before {
  171.     content: "";
  172.     display: block;
  173.     width: 60px;
  174.     height: 0;
  175.     border-top: 1px solid;
  176.     margin-top: 30px;
  177.     position: absolute;
  178.     top: 1em;
  179.     left: 0;
  180.   }
  181. }
  182. }
  183.  
  184. .tree-indicator {
  185.   margin-right: 5px;
  186.   cursor: pointer;
  187. }
  188.  
  189. /** =================*/
  190. .treeview li {
  191.   a {
  192.     &:hover {
  193.       background: nb-theme(layout-bg);
  194.       color: #000;
  195.       + ul {
  196.       li {
  197.         a {
  198.           background: nb-theme(layout-bg);
  199.           color: #000;
  200.         }
  201.         &::after, &::before {
  202.           border-color: #94a0b4;
  203.         }
  204.       }
  205.       &::before, ul::before {
  206.         border-color: #94a0b4;
  207.       }
  208.     }
  209.   }
  210. }
  211. /** =================*/
  212.  
  213. a {
  214.   text-decoration: none;
  215.   color: inherit;
  216.   cursor: pointer;
  217.   height: 100px;
  218.   width: 15rem;
  219.   text-decoration: none;
  220.   background-color: white;
  221.   color: #8b8b8b;
  222.   font-family: arial, verdana, tahoma;
  223.   font-size: 11px;
  224.   display: inline-block;
  225.   box-shadow: 0 10px 11px nb-theme(lamb-menu-hover);
  226.   -transition: all 0.5s;
  227.   -webkit-transition: all 0.5s;
  228.   -moz-transition: all 0.5s;
  229.   span {
  230.     top: 50%;
  231.     margin-top: -0.7em;
  232.     display: block;
  233.   }
  234.     }
  235. button {
  236.   text-decoration: none;
  237.   color: inherit;
  238.   border: none;
  239.   background: transparent;
  240.   margin: 0px 0px 0px 0px;
  241.   padding: 0px 0px 0px 0px;
  242.   outline: 0;
  243.   &:active, &:focus {
  244.     text-decoration: none;
  245.     color: inherit;
  246.     border: none;
  247.     background: transparent;
  248.     margin: 0px 0px 0px 0px;
  249.     padding: 0px 0px 0px 0px;
  250.     outline: 0;
  251.   }
  252. }
  253. }
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top