/*
 * Copyright (C) 2015 - present Instructure, Inc.
 *
 * This file is part of Canvas.
 *
 * Canvas is free software: you can redistribute it and/or modify it under
 * the terms of the GNU Affero General Public License as published by the Free
 * Software Foundation, version 3 of the License.
 *
 * Canvas is distributed in the hope that it will be useful, but WITHOUT ANY
 * WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR
 * A PARTICULAR PURPOSE. See the GNU Affero General Public License for more
 * details.
 *
 * You should have received a copy of the GNU Affero General Public License along
 * with this program. If not, see <http://www.gnu.org/licenses/>.
 */

// .tooltip is depricated, use the tooltip behavior instead.
// see: app/coffeescripts/behaviors/tooltip.coffee
// code to make tooltips.
// here is some sample html to use this:
//
// <a href="#" class="tooltip">
//   <span class="tooltip_wrap">
//     <span class="tooltip_text">The tip</span>
//   </span>
//   the thing to put tip on
// </a>

.tooltip {
  position: relative;
  z-index: 2;
  outline: none;
  &:hover, &:active, &:focus {
    outline: none;
    text-decoration: none;
    .tooltip_wrap, .tooltip_text {
      visibility: visible;
    }
  }
  .tooltip_wrap, .tooltip_text {
    display: block;
    visibility: hidden;
  }
  .tooltip_wrap {
    background: url(/images/tooltip_carat.png) no-repeat left bottom;
    bottom: 15px;
    padding-bottom: 3px;
    position: absolute;
    opacity: 0.9;
  }
  .tooltip_text {
    background-color: #444;
    background-position: direction(left) bottom;
    color: #fff;
    #{direction(left)}: 0px;
    max-width: 250px;
    padding: 2px 7px;
    white-space: nowrap;
    border-radius: 5px;
    font-weight: normal;
  }
  .right {
    #{direction(right)}: 0px;
    background-position: direction(right) bottom;
  }
}
