ui/file_manager/gallery/gallery.html

   1 <!--
   2   -- Copyright 2014 The Chromium Authors. All rights reserved.
   3   -- Use of this source code is governed by a BSD-style license that can be
   4   -- found in the LICENSE file.
   5   -->
   6 <html i18n-values="dir:textdirection">
   7 <head>
   8   <link rel="stylesheet" href="chrome://resources/css/text_defaults.css">
   9   <link rel="stylesheet" href="../file_manager/foreground/css/list.css">
  10   <link rel="stylesheet" href="../file_manager/foreground/css/common.css">
  11   <link rel="stylesheet" href="../file_manager/foreground/css/file_types.css">
  12   <link rel="stylesheet" href="../file_manager/foreground/css/share_dialog.css">
  13   <link rel="stylesheet" href="css/gallery.css">
  14
  15   <script src="chrome://resources/js/polymer_config.js"></script>
  16   <script src="chrome://resources/js/util.js"></script>
  17
  18   <link rel="import" href="chrome://resources/polymer/v1_0/paper-button/paper-button.html">
  19   <link rel="import" href="chrome://resources/polymer/v1_0/paper-input/paper-input.html">
  20   <link rel="import" href="chrome://resources/polymer/v1_0/paper-ripple/paper-ripple.html">
  21   <link rel="import" href="chrome://resources/polymer/v1_0/paper-slider/paper-slider.html">
  22   <link rel="import" href="chrome-extension://hhaomjibdihmijegdhdafkllkbggdgoj/foreground/elements/files_toast.html">
  23   <link rel="import" href="chrome-extension://hhaomjibdihmijegdhdafkllkbggdgoj/foreground/elements/files_toggle_ripple.html">
  24
  25   <script src="js/gallery_scripts.js"></script>
  26   <style is="custom-style">
  27     paper-input {
  28       --paper-input-container-color: rgba(255, 255, 255, 0.2);
  29       --paper-input-container-focus-color: white;
  30       --paper-input-container-input-color: white;
  31       --paper-input-container-underline-focus: {
  32         height: 1px;
  33       }
  34     }
  35     paper-slider {
  36       --paper-slider-active-color: white;
  37       --paper-slider-knob-color: white;
  38       --paper-slider-secondary-color: transparent;
  39     }
  40   </style>
  41 </head>
  42 <body>
  43   <div class="gallery">
  44     <div id="content" class="content">
  45       <div class="thumbnail-view"></div>
  46     </div>
  47     <div id="top-toolbar" class="toolbar top tool dimmable">
  48       <div class="filename-spacer">
  49         <!-- Change this to use paper-input after ChromeVox supports shadow DOM. -->
  50         <paper-input-container id="rename-input" no-label-float>
  51           <input spellcheck="false"></input>
  52         </paper-input-container>
  53       </div>
  54       <div class="button-spacer">
  55         <!-- Use button element for edit button to implement toggle button with
  56           -- custom ripple effect. -->
  57         <button class="edit" i18n-values="title:GALLERY_EDIT">
  58           <div class="icon"></div>
  59           <files-toggle-ripple></files-toggle-ripple>
  60         </button>
  61         <paper-button class="print" i18n-values="title:GALLERY_PRINT" disabled></paper-button>
  62         <paper-button class="delete" i18n-values="title:GALLERY_DELETE"></paper-button>
  63         <!-- Use button element for mode button to implement toggle switch button. -->
  64         <button class="mode">
  65           <div class="icon slide-mode" i18n-values="title:GALLERY_SLIDE"></div>
  66           <div class="icon thumbnail-mode" i18n-values="title:GALLERY_THUMBNAIL"></div>
  67           <paper-ripple></paper-ripple>
  68         </button>
  69         <paper-button class="slideshow" i18n-values="title:GALLERY_SLIDESHOW"></paper-button>
  70         <paper-button class="share" i18n-values="title:GALLERY_SHARE"></paper-button>
  71       </div>
  72     </div>
  73     <div id="bottom-toolbar" class="toolbar bottom tool dimmable">
  74       <div class="slide-mode-toolbar">
  75         <div class="ribbon-spacer"></div>
  76       </div>
  77
  78       <div class="edit-mode-toolbar">
  79         <div class="options">
  80           <div class="saved" i18n-content="GALLERY_SAVED"></div>
  81         </div>
  82         <div class="edit-bar-spacer"></div>
  83       </div>
  84     </div>
  85     <div class="prompt-wrapper" pos="center">
  86       <div class="error-banner"></div>
  87     </div>
  88     <div class="toast-stage">
  89       <files-toast></files-toast>
  90     </div>
  91   </div>
  92 </body>
  93 </html>