blob: 5a4e6bcf4c03c518c021b012bf34d5eac8feb723 [file] [log] [blame]
<link rel="import" href="chrome://resources/html/cr.html">
<link rel="import" href="chrome://resources/html/polymer.html">
<link rel="import" href="chrome://resources/polymer/v1_0/iron-icons/hardware-icons.html">
<link rel="import" href="chrome://resources/polymer/v1_0/iron-icons/iron-icons.html">
<link rel="import" href="chrome://resources/polymer/v1_0/paper-checkbox/paper-checkbox.html">
<link rel="import" href="chrome://resources/polymer/v1_0/paper-item/paper-item.html">
<link rel="import" href="chrome://resources/polymer/v1_0/paper-menu/paper-menu.html">
<link rel="import" href="chrome://extensions/icons.html">
<dom-module id="extensions-sidebar">
<template>
<style>
:host {
margin-top: 30px;
white-space: nowrap;
}
#section-menu,
.section-item {
-webkit-margin-start: 20px;
}
#section-menu {
--paper-menu-background-color: transparent;
--paper-menu-selected-item: {
background-color: transparent;
color: rgb(66, 133, 244);
font-weight: normal;
}
padding: 0;
}
#more-extensions {
display: flex;
text-decoration: none;
}
paper-item {
color: #5A5A5A;
cursor: pointer;
font-size: 88%;
padding: 0;
}
.section-menu-item iron-icon,
.section-item iron-icon {
-webkit-margin-end: 15px;
}
#developer-mode-checkbox {
--paper-checkbox-checked-color: rgb(66, 133, 244);
--primary-text-color: #5A5A5A;
}
#developer-mode {
display: flex;
}
#developer-mode span {
flex-grow: 1;
}
#devtools-controls {
border-top: 1px solid grey;
}
</style>
<paper-menu id="section-menu" selected="0">
<paper-item class="section-menu-item" id="sections-extensions"
on-tap="onExtensionsTap_">
<iron-icon icon="extension"></iron-icon>
<span>$i18n{sidebarExtensions}</span>
</paper-item>
<paper-item class="section-menu-item" id="sections-apps"
on-tap="onAppsTap_">
<iron-icon icon="apps"></iron-icon>
<span>$i18n{sidebarApps}</span>
</paper-item>
</paper-menu>
<a class="section-item" id="more-extensions" target="_blank"
href="$i18n{getMoreExtensionsUrl}">
<paper-item>
<iron-icon icon="extensions-icons:store"></iron-icon>
<span>$i18n{getMoreExtensions}</span>
</paper-item>
</a>
<paper-item class="section-item" id="keyboard-shortcuts"
on-tap="onKeyboardShortcutsTap_">
<iron-icon icon="hardware:keyboard"></iron-icon>
<span>$i18n{keyboardShortcuts}</span>
</paper-item>
<div id="devtools-controls">
<paper-item class="section-item" id="developer-mode">
<span>$i18n{developerMode}</span>
<paper-checkbox id="developer-mode-checkbox"
checked="[[inDevMode]]"
on-change="onDevModeChange_"></paper-checkbox>
</paper-item>
<template is="dom-if" if="[[inDevMode]]">
<paper-item class="section-item" id="load-unpacked"
on-tap="onLoadUnpackedTap_">
<span>$i18n{sidebarLoadUnpacked}</span>
</paper-item>
<paper-item class="section-item" id="pack-extensions"
on-tap="onPackTap_">
<span>$i18n{sidebarPack}</span>
</paper-item>
<paper-item class="section-item" id="update-now"
on-tap="onUpdateNowTap_">
<span>$i18n{sidebarUpdateNow}</span>
</paper-item>
</template>
</div>
</template>
<script src="chrome://extensions/sidebar.js"></script>
</dom-module>