| /* Copyright 2014 The Chromium Authors. All rights reserved. |
| * Use of this source code is governed by a BSD-style license that can be |
| * found in the LICENSE file. |
| */ |
| |
| .tutorial-slide { |
| -webkit-transition: opacity 200ms ease-in-out; |
| background-color: white; |
| border-radius: 2px; |
| bottom: 0; |
| box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25); |
| height: 408px; |
| left: 0; |
| margin: auto; |
| position: absolute; |
| right: 0; |
| top: 0; |
| width: 320px; |
| z-index: 100; |
| } |
| |
| .tutorial-slide.single-pod { |
| margin-left: 30px; |
| } |
| |
| html[dir=rtl] .tutorial-slide.single-pod { |
| margin-right: 30px; |
| } |
| |
| .hidden { |
| opacity: 0; |
| pointer-events: none; |
| } |
| |
| #slide-guests { |
| bottom: 20px; |
| left: 20px; |
| margin: 0; |
| top: auto; |
| } |
| |
| html[dir=rtl] #slide-guests { |
| right: 20px; |
| } |
| |
| #slide-friends, |
| #slide-not-you { |
| bottom: 20px; |
| left: 60px; |
| margin: 0; |
| top: auto; |
| } |
| |
| html[dir=rtl] #slide-friends, |
| html[dir=rtl] #slide-not-you { |
| right: 60px; |
| } |
| |
| #slide-not-you { |
| height: 100px; |
| left: 100px; |
| margin: 0; |
| width: 240px; |
| } |
| |
| html[dir=rtl] #slide-not-you { |
| right: 100px; |
| } |
| |
| .slide-contents { |
| padding: 0 20px; |
| text-align: center; |
| } |
| |
| .slide-title { |
| color: black; |
| font-size: 20px; |
| line-height: 20px; |
| margin: 30px 0; |
| } |
| |
| .slide-text { |
| color: #666; |
| font-size: 15px; |
| line-height: 20px; |
| } |
| |
| .slide-buttons { |
| bottom: 20px; |
| position: absolute; |
| text-align: center; |
| width: 100%; |
| } |
| |
| .slide-buttons .link-button { |
| width: 100%; |
| } |
| |
| .slide-buttons button { |
| bottom: 0; |
| height: 35px; |
| padding: 0 15px; |
| width: 138px; |
| } |
| |
| .slide-buttons button.left { |
| left: 16px; |
| position: absolute; |
| } |
| |
| html[dir=rtl] .slide-buttons button.left { |
| right: 16px; |
| } |
| |
| .slide-buttons button.right { |
| bottom: 0; |
| position: absolute; |
| } |
| |
| .arrow-down { |
| border-left: 15px solid transparent; |
| border-right: 15px solid transparent; |
| border-top: 15px solid white; |
| bottom: -15px; |
| height: 0; |
| left: 120px; |
| position: absolute; |
| width: 0; |
| } |
| |
| #slide-not-you .arrow-down { |
| left: 100px; |
| } |
| |
| html[dir=rtl] #slide-not-you .arrow-down { |
| right: 100px; |
| } |
| |
| #slide-guests .arrow-down { |
| left: 60px; |
| } |
| |
| html[dir=rtl] #slide-guests .arrow-down { |
| right: 60px; |
| } |
| |
| .slide-image { |
| height: 182px; |
| } |
| |
| #slide-your-chrome .slide-image { |
| background-color: rgb(241, 202, 58); |
| background-image: url( |
| 'chrome://theme/IDR_ICON_USER_MANAGER_TUTORIAL_YOUR_CHROME'); |
| } |
| |
| #slide-guests .slide-image { |
| background-color: rgb(90, 196, 144); |
| background-image: url('chrome://theme/IDR_ICON_USER_MANAGER_TUTORIAL_GUESTS'); |
| } |
| |
| #slide-friends .slide-image { |
| background-color: rgb(179, 229, 252); |
| background-image: url( |
| 'chrome://theme/IDR_ICON_USER_MANAGER_TUTORIAL_FRIENDS'); |
| } |
| |
| #slide-complete .slide-image { |
| background-color: white; |
| background-image: url( |
| 'chrome://theme/IDR_ICON_USER_MANAGER_TUTORIAL_COMPLETE'); |
| } |
| |
| #slide-not-you #dismiss-bubble-button { |
| background-image: url('chrome://theme/IDR_CLOSE_1'); |
| cursor: pointer; |
| height: 16px; |
| position: absolute; |
| right: 5px; |
| top: 5px; |
| width: 16px; |
| } |
| |
| html[dir=rtl] #slide-not-you #dismiss-bubble-button { |
| left: 5px; |
| } |