460 lines
23 KiB
HTML
460 lines
23 KiB
HTML
<html>
|
|
<head>
|
|
<meta http-equiv="content-type" content="text/html; charset=utf-8">
|
|
<title>Multi-Account Containers</title>
|
|
<script type="text/javascript" src="./js/i18n.js"></script>
|
|
<link rel="stylesheet" href="./css/popup.css">
|
|
</head>
|
|
<body>
|
|
<div class="hide panel onboarding onboarding-panel-1">
|
|
<img class="onboarding-img" alt="" src="/img/onboarding-1.png" />
|
|
<h3 class="onboarding-title" data-i18n-message-id="onboarding-1-header"></h3>
|
|
<p data-i18n-message-id="onboarding-1-description"></p>
|
|
<a href="#" class="onboarding-button onboarding-start-button keyboard-nav" tabindex="0" data-i18n-message-id="getStarted"></a>
|
|
</div>
|
|
|
|
<div class="panel onboarding onboarding-panel-2 hide">
|
|
<img class="onboarding-img" alt="" src="/img/onboarding-2.png" />
|
|
<h3 class="onboarding-title" data-i18n-message-id="onboarding-2-header"></h3>
|
|
<p data-i18n-message-id="onboarding-2-description"></p>
|
|
<a href="#" class="onboarding-button onboarding-next-button keyboard-nav" tabindex="0" data-i18n-message-id="next"></a>
|
|
</div>
|
|
|
|
<div class="panel onboarding onboarding-panel-3 hide">
|
|
<img class="onboarding-img" alt="" src="/img/onboarding-3.png" />
|
|
<h3 class="onboarding-title" data-i18n-message-id="onboarding-3-header"></h3>
|
|
<p data-i18n-message-id="onboarding-3-description"></p>
|
|
<a href="#" class="onboarding-button onboarding-almost-done-button keyboard-nav" tabindex="0" data-i18n-message-id="next"></a>
|
|
</div>
|
|
|
|
<div class="panel onboarding onboarding-panel-4 hide" id="onboarding-panel-4">
|
|
<img class="onboarding-img" alt="" src="/img/onboarding-4.png" />
|
|
<h3 class="onboarding-title" data-i18n-message-id="onboarding-4-header"></h3>
|
|
<p data-i18n-message-id="onboarding-4-description"></p>
|
|
<a href="#" id="onboarding-done-button" class="onboarding-button keyboard-nav" tabindex="0" data-i18n-message-id="next"></a>
|
|
</div>
|
|
|
|
<div class="panel onboarding onboarding-panel-5 hide" id="onboarding-panel-5">
|
|
<img class="onboarding-img" alt="" src="/img/onboarding-3.png" />
|
|
<h3 class="onboarding-title" data-i18n-message-id="onboarding-5-header"></h3>
|
|
<p data-i18n-message-id="onboarding-5-description"></p>
|
|
<a href="#" id="onboarding-longpress-button" class="onboarding-button keyboard-nav" tabindex="0" data-i18n-message-id="next"></a>
|
|
</div>
|
|
|
|
<div class="panel onboarding onboarding-panel-6 hide" id="onboarding-panel-6">
|
|
<img class="onboarding-img" alt="" src="/img/Sync.svg" />
|
|
<h3 class="onboarding-title" data-i18n-message-id="onboarding-6-header"></h3>
|
|
<p data-i18n-message-id="onboarding-6-description"></p>
|
|
<div class="half-button-wrapper">
|
|
<a href="#" id="no-sync" class="half-onboarding-button grey-button keyboard-nav" tabindex="0" data-i18n-message-id="notNow"></a>
|
|
<a href="#" id="start-sync-button" class="half-onboarding-button keyboard-nav" tabindex="0" data-i18n-message-id="startSyncing"></a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="panel onboarding onboarding-panel-7 hide" id="onboarding-panel-7">
|
|
<img class="onboarding-img" alt="" src="/img/Account.svg" />
|
|
<h3 class="onboarding-title" data-i18n-message-id="onboarding-7-header"></h3>
|
|
<p data-i18n-message-id="onboarding-7-description"></p>
|
|
<div class="half-button-wrapper">
|
|
<a href="#" id="no-sign-in" class="half-onboarding-button grey-button keyboard-nav" tabindex="0" data-i18n-message-id="notNow"></a>
|
|
<a href="#" id="sign-in" class="half-onboarding-button keyboard-nav" tabindex="0" data-i18n-message-id="signIn"></a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="panel onboarding onboarding-panel-8 hide" id="onboarding-panel-8">
|
|
<div class="moz-vpn-onboarding-content">
|
|
<img class="onboarding-img" alt="" src="/img/moz-vpn-onboarding.svg" />
|
|
<h3 class="onboarding-title" data-i18n-message-id="proxyNowAvailable"></h3>
|
|
<p data-i18n-message-id="onboarding-8-description"></p>
|
|
</div>
|
|
<div id="moz-vpn-fw-onboarding-done" class="half-button-wrapper">
|
|
<a id="moz-vpn-fw-onboarding-done" href="#" class="half-onboarding-button keyboard-nav onboarding-done" tabindex="0" data-i18n-message-id="done"></a>
|
|
</div>
|
|
<div class="moz-vpn-permissions">
|
|
<div class="moz-vpn-permissions-copy">
|
|
<span data-i18n-message-id="mozillaVpnRequiresAdditionalPermissions"></span>
|
|
</div>
|
|
<div class="half-button-wrapper">
|
|
<a href="#" id="permissions-not-now" class="half-onboarding-button grey-button keyboard-nav onboarding-done" tabindex="0" data-i18n-message-id="notNow"></a>
|
|
<a href="#" id="onboarding-enable-permissions" class="half-onboarding-button keyboard-nav" tabindex="0" data-i18n-message-id="enable"></a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="panel achievement-panel hide" id="achievement-panel">
|
|
<img class="onboarding-img" alt="" src="/img/onboarding-3.png" />
|
|
<h3 class="onboarding-title" data-i18n-message-id="oneHundredTabsHeader"></h3>
|
|
<p data-i18n-message-id="youHaveOpened"></p>
|
|
<p data-i18n-message-id="spreadTheWord"></p>
|
|
<p class="share-ctas">
|
|
<a class="cta-link" href="https://mzl.la/2gJtIZ4" id="achievement-rate-button" target="_blank">
|
|
<span class="cta amo-rate-cta" data-i18n-message-id="rate">
|
|
<img src="/img/amo-icon.svg" class="cta-icon" alt="">
|
|
</span>
|
|
</a>
|
|
<a class="cta-link" href="https://bit.ly/fb-share-mac-addon" target="_blank">
|
|
<span class="cta fb-share-cta" data-i18n-message-id="share">
|
|
<img src="/img/webicon-facebook.svg" class="cta-icon" alt="">
|
|
</span>
|
|
</a>
|
|
<a class="cta-link" href="http://bit.ly/tweet-100-tabs-mac-addon" target="_blank">
|
|
<span class="cta tweet-cta" data-i18n-message-id="tweet">
|
|
<img src="/img/webicon-twitter.svg" class="cta-icon" alt="">
|
|
</span>
|
|
</a>
|
|
</p>
|
|
<a href="#" id="achievement-done-button" class="onboarding-button keyboard-nav" data-i18n-message-id="done"></a>
|
|
</div>
|
|
|
|
<div class="panel menu-panel container-panel hide" id="container-panel">
|
|
<h3 class="title">Multi-Account Containers</h3>
|
|
<a href="#" class="info-icon" id="info-icon" tabindex="10">
|
|
<img data-i18n-attribute-message-id="info" data-i18n-attribute="alt" alt="" src="/img/info.svg" / >
|
|
</a>
|
|
<hr>
|
|
<table class="menu">
|
|
<tr class="menu-item hover-highlight keyboard-nav" id="open-new-tab-in" tabindex="0">
|
|
<td>
|
|
<img class="menu-icon" alt="" src="/img/tab-new-16.svg" />
|
|
<span class="menu-text" data-i18n-message-id="openInNewTabTitle"></span>
|
|
<span class="menu-arrow">
|
|
<img alt="" src="/img/arrow-icon-right.svg" />
|
|
</span>
|
|
</td>
|
|
</tr>
|
|
<tr class="menu-item hover-highlight keyboard-nav" id="reopen-site-in" tabindex="0">
|
|
<td>
|
|
<img class="menu-icon" alt="" src="/img/refresh-16.svg" />
|
|
<span data-i18n-message-id="reopenThisSiteIn" class="menu-text"></span>
|
|
<span class="menu-arrow">
|
|
<img alt="" src="/img/arrow-icon-right.svg" />
|
|
</span>
|
|
</td>
|
|
</tr>
|
|
<tr class="menu-item hover-highlight keyboard-nav" id="sort-containers-link" tabindex="0">
|
|
<td>
|
|
<img class="menu-icon" alt="" src="/img/sort-16_1.svg" />
|
|
<span class="menu-text" data-i18n-message-id="sortTabsByContainer"></span>
|
|
<span class="menu-arrow">
|
|
</span>
|
|
</td>
|
|
</tr>
|
|
<tr class="menu-item hover-highlight keyboard-nav" id="always-open-in" tabindex="0">
|
|
<td>
|
|
<img class="menu-icon" alt="" src="/img/container-openin-16.svg" />
|
|
<span class="menu-text" data-i18n-message-id="alwaysOpenThisSiteIn"></span>
|
|
<span class="menu-arrow">
|
|
<img alt="" src="/img/arrow-icon-right.svg" />
|
|
</span>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
<hr>
|
|
<div class="sub-header-wrapper flx-row flx-space-between">
|
|
<div class="sub-header" data-i18n-message-id="containers"></div>
|
|
<h4 class="moz-vpn-logotype vpn-status-container-list display-none">Mozilla VPN
|
|
<span class="moz-vpn-connection-status-indicator container-list-status-icon">
|
|
<span class="tooltip"></span>
|
|
</span>
|
|
</h4>
|
|
</div>
|
|
<div class="scrollable identities-list">
|
|
<table class="menu" id="identities-list">
|
|
<tr class="menu-item hover-highlight">
|
|
<td>
|
|
<div class="menu-item-name">
|
|
<div class="menu-icon">
|
|
<div class="usercontext-icon"
|
|
data-identity-icon="pet"
|
|
data-identity-color="blue"></div>
|
|
</div>
|
|
<span class="menu-text" data-i18n-message-id="default"></span>
|
|
</div>
|
|
<span class="menu-right-float">
|
|
<span class="container-count">22</span>
|
|
<span class="menu-arrow">
|
|
<img alt="" src="/img/arrow-icon-right.svg" />
|
|
</span>
|
|
</span>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
<div id="moz-vpn-tout" class="moz-vpn-content expanded">
|
|
<div class="flx-row button-wrapper">
|
|
<h4 class="moz-vpn-logo">Mozilla VPN</h4>
|
|
<button class="controller dismiss-moz-vpn-tout" tab-index="0"></button>
|
|
</div>
|
|
<div class="collapsible-content flx-col controller-collapsible-content">
|
|
<div class="flx-row flx-space-between">
|
|
<span class="moz-vpn-subtitle" data-i18n-message-id="integrateContainers"></span>
|
|
</div>
|
|
<button id="moz-vpn-learn-more" class="moz-vpn-cta primary-cta" data-i18n-message-id="getMozillaVpn"></button>
|
|
</div>
|
|
</div>
|
|
<v-padding-hack-footer></v-padding-hack-footer> <!--prevents last container from getting covered up by the 'manage containers button' when list is long-->
|
|
<div class="bottom-btn keyboard-nav controller" id="manage-containers-link" tabindex="0" data-i18n-message-id="manageContainers"></div>
|
|
</div>
|
|
|
|
|
|
<div class="hide panel menu-panel container-info-panel" id="container-info-panel" tabindex="-1">
|
|
<h3 class="title" id="container-info-title" data-i18n-attribute-message-id="personal"></h3>
|
|
<button class="btn-return arrow-left controller keyboard-nav-back" id="close-container-info-panel" tabindex="0"></button>
|
|
<hr>
|
|
<table class="menu">
|
|
<tr class="menu-item hover-highlight keyboard-nav" id="open-new-tab-in-info" tabindex="0">
|
|
<td>
|
|
<img class="menu-icon" alt="" src="/img/tab-new-16.svg" />
|
|
<span class="menu-text" data-i18n-message-id="openNewTabInThisContainer"></span>
|
|
<span class="menu-arrow">
|
|
</span>
|
|
</td>
|
|
</tr>
|
|
<tr class="menu-item hover-highlight keyboard-nav" id="hideorshow-container" tabindex="0">
|
|
<td>
|
|
<img id="container-info-hideorshow-icon" class="menu-icon" alt="" src="img/password-hide.svg" />
|
|
<span id="container-info-hideorshow-label" class="menu-text" data-i18n-message-id="hideThisContainer"></span>
|
|
<span class="menu-arrow">
|
|
</span>
|
|
</td>
|
|
</tr>
|
|
<tr class="menu-item hover-highlight keyboard-nav" id="move-to-new-window" tabindex="0">
|
|
<td>
|
|
<img class="menu-icon" alt="" src="/img/movetowindow-16.svg" />
|
|
<span class="menu-text" data-i18n-message-id="moveTabsToANewWindow"></span>
|
|
<span class="menu-arrow">
|
|
</span>
|
|
</td>
|
|
</tr>
|
|
<tr class="menu-item hover-highlight keyboard-nav" id="always-open" tabindex="0">
|
|
<td>
|
|
<img class="menu-icon" alt="" src="/img/container-openin-16.svg" />
|
|
<span class="menu-text" id="always-open-in-info-panel" data-i18n-message-id="alwaysOpenSiteInContainer"></span>
|
|
<span class="menu-arrow">
|
|
</span>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
<hr>
|
|
<div class="sub-header-wrapper">
|
|
<div class="sub-header" data-i18n-message-id="openTabs"></div>
|
|
</div>
|
|
<div class="scrollable">
|
|
<table class="menu" id="container-info-table">
|
|
<tr class="menu-item hover-highlight keyboard-nav" tabindex="0">
|
|
<td>
|
|
<div class="favicon"><img class="menu-icon" src="https://www.mozilla.org/favicon.ico" /></div>
|
|
<span class="menu-text truncate-text">www.mozillllllllllllllllllllllllllllllllllllla.org</span>
|
|
<img class="trash-button" src="/img/close.svg" />
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
<v-padding-hack-footer></v-padding-hack-footer>
|
|
<div class="bottom-btn keyboard-nav hover-highlight" id="manage-container-link" tabindex="0" data-i18n-message-id="manageThisContainer"></div>
|
|
</div>
|
|
|
|
|
|
<div class="panel menu-panel container-picker-panel hide" id="container-picker-panel">
|
|
<h3 class="title" id="picker-title">
|
|
Multi-Account Containers
|
|
</h3>
|
|
<button class="btn-return arrow-left controller keyboard-nav-back" id="close-container-picker-panel" tabindex="0"></button>
|
|
<hr>
|
|
<div id="new-container-div"></div>
|
|
<div class="scrollable identities-list">
|
|
<table class="menu" id="picker-identities-list">
|
|
<tr class="menu-item hover-highlight keyboard-nav">
|
|
<td>
|
|
<div class="menu-icon">
|
|
<div class="usercontext-icon"
|
|
data-identity-icon="pet"
|
|
data-identity-color="blue">
|
|
</div>
|
|
</div>
|
|
<span class="menu-text" data-i18n-message-id="default"></span>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="panel menu-panel edit-container-panel hide" id="edit-container-panel">
|
|
<h3 class="title" id="container-edit-title" data-i18n-message-id="default"></h3>
|
|
<button class="btn-return arrow-left controller" id="close-container-edit-panel"></button>
|
|
<hr>
|
|
<div class="edit-form">
|
|
<form id="edit-container-panel-form">
|
|
<input type="hidden" name="container-id" id="edit-container-panel-usercontext-input" />
|
|
<fieldset>
|
|
<legend class="form-header" data-i18n-message-id="name"></legend>
|
|
<v-padding-hack-4></v-padding-hack-4>
|
|
<input type="text" name="container-name" id="edit-container-panel-name-input" class="edit-container-panel-name-input" maxlength="25"/>
|
|
</fieldset>
|
|
<legend class="form-header" data-i18n-message-id="color"></legend>
|
|
<fieldset id="edit-container-panel-choose-color" class="radio-choice">
|
|
|
|
</fieldset>
|
|
<fieldset id="edit-container-panel-choose-icon" class="radio-choice">
|
|
<legend class="form-header" data-i18n-message-id="icon"></legend>
|
|
</fieldset>
|
|
<fieldset class="proxies"> <!---- PROXIES -->
|
|
<input type="text" class="proxies" name="container-proxy" id="edit-container-panel-proxy" maxlength="50" placeholder="type://host:port" hidden/>
|
|
<input type="text" class="proxies" name="moz-proxy-enabled" id="moz-proxy-enabled" maxlength="5" hidden/>
|
|
<input type="text" class="proxies" name="country-code" id="country-code-input" maxlength="5" hidden/>
|
|
<input type="text" class="proxies" name="city-name" id="city-name-input" maxlength="5" hidden/>
|
|
</fieldset>
|
|
</form>
|
|
<div id="edit-container-options">
|
|
<div class="options-header" data-i18n-message-id="options"></div>
|
|
<div class="container-options">
|
|
<label for="site-isolation" class="options-label" data-i18n-message-id="limitToDesignatedSites"></label>
|
|
<label class="switch">
|
|
<input id="site-isolation" class="switch-input" name="site-isolation" type="checkbox">
|
|
<span class="slider round"></span>
|
|
</label>
|
|
</div>
|
|
<button class="container-options blue-link" id="manage-assigned-sites-list" tabindex="0" data-i18n-message-id="manageSiteList"></button>
|
|
</div>
|
|
</div>
|
|
<moz-vpn-container-ui class="moz-vpn-controller-content expanded">
|
|
<div class="flx-row button-wrapper">
|
|
<h4 class="moz-vpn-logotype">Mozilla VPN
|
|
<span class="moz-vpn-connection-status-indicator"></span>
|
|
</h4>
|
|
<button class="expand-collapse blue-link" tab-index="0">
|
|
<span data-i18n-message-id="hide" class="hide-label hide-show-label"></span>
|
|
<span data-i18n-message-id="show" class="show-label hide-show-label"></span>
|
|
</button>
|
|
</div>
|
|
<div class="collapsible-content flx-col controller-collapsible-conten">
|
|
<div class="flx-row flx-space-between add-bg-color">
|
|
<span class="moz-vpn-subtitle"></span>
|
|
<label class="switch">
|
|
<input id="moz-vpn-switch" class="moz-vpn-switch switch-input" type="checkbox">
|
|
<span class="slider round"></span>
|
|
</label>
|
|
</div>
|
|
<button id="get-mozilla-vpn" class="moz-vpn-cta primary-cta" data-i18n-message-id="getMozillaVpn"></button>
|
|
<button id="moz-vpn-current-server" class="controller">
|
|
<span class="current-country-flag"></span>
|
|
<span class="current-city-name"></span>
|
|
</button>
|
|
</div>
|
|
</moz-vpn-container-ui>
|
|
<button id="advanced-proxy-settings-btn" class="proxy-section advanced-proxy-settings-btn controller">
|
|
<span class="advanced-proxy-settings-btn-label" data-i18n-message-id="advancedProxySettings"></span>
|
|
<span id="advanced-proxy-address"></span>
|
|
</button>
|
|
<button class="delete-container delete-btn alert-text" id="delete-container-button" data-i18n-message-id="deleteThisContainer"></button>
|
|
|
|
<!-- TODO get UX / CONTENT on how to message about unavailable proxies -->
|
|
<!-- Prevent users from opening containers where proxies are unavailable and which will result in timeouts -->
|
|
<!-- Provide a way for users to disable Mozilla proxies if they cancel their subscription or somehow lose access -->
|
|
|
|
<!-- <div class="modal-warning">
|
|
<div class="modal-content">
|
|
<button id="close-proxy-warning" class="x-close modal-clickable">Close</button>
|
|
<p>This container has been configured to use a Mozilla VPN proxy, but the Mozilla VPN app is off. To access the web via this container, turn Mozilla VPN on or disable the proxy for this container.</p>
|
|
<button class="disable-proxy modal-clickable">Disable proxy for this container</button>
|
|
<button id="close-modal" class="modal-clickable" class="disable-proxy">Close</button>
|
|
</div>
|
|
</div> -->
|
|
|
|
|
|
<div class="panel-footer">
|
|
<a href="#" class="button expanded secondary footer-button cancel-button" id="create-container-cancel-link" data-i18n-message-id="cancel"></a>
|
|
<a href="#" class="button expanded primary footer-button" id="create-container-ok-link" data-i18n-message-id="ok"></a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="panel menu-panel edit-container-assignments hide" id="edit-container-assignments">
|
|
<h3 class="title" id="edit-assignments-title" data-i18n-message-id="default"></h3>
|
|
<button class="btn-return arrow-left controller" id="close-container-assignment-panel"></button>
|
|
<hr>
|
|
<div class="scrollable edit-sites-assigned">
|
|
<div class="sub-header" data-i18n-attribute-message-id="sitesAssignedToThisContainer"></div>
|
|
<table class="menu scrollable" id="edit-sites-assigned">
|
|
<tr class="menu-item hover-highlight" tabindex="0">
|
|
<td>
|
|
<div class="favicon"><img class="menu-icon" src="https://www.mozilla.org/favicon.ico" /></div>
|
|
<span class="menu-text truncate-text">www.mozillllllllllllllllllllllllllllla.org</span>
|
|
<img class="trash-button" src="/img/container-delete.svg" />
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="hide panel delete-container-panel" id="delete-container-panel">
|
|
<h3 class="title" id="container-delete-title" data-i18n-message-id="default">
|
|
</h3>
|
|
|
|
<button class="btn-return arrow-left controller" id="close-container-delete-panel"></button>
|
|
<hr>
|
|
<div class="panel-content delete-container-confirm">
|
|
<h4 class="delete-container-confirm-title" data-i18n-message-id="removeThisContainer"></h4>
|
|
<p class="delete-warning" data-i18n-message-id="removeThisContainerConfirmation"></p>
|
|
</div>
|
|
<div class="panel-footer">
|
|
<a href="#" class="button expanded secondary footer-button cancel-button" data-i18n-message-id="cancel" id="delete-container-cancel-link"></a>
|
|
<a href="#" class="button expanded primary footer-button" data-i18n-message-id="ok" id="delete-container-ok-link"></a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="hide panel moz-vpn-server-list-panel" id="moz-vpn-server-list-panel">
|
|
<h3 class="title proxy-panel-title" id="vpn-server-list-title" data-i18n-message-id="chooseLocation"></h3>
|
|
<button class="btn-return arrow-left controller moz-vpn-return" id="moz-vpn-return"></button>
|
|
<ul id="moz-vpn-server-list" class="moz-vpn-server-list">
|
|
<template id="server-list-item">
|
|
<li class="server-list-item" data-country-code="">
|
|
<button class="flx-row server-city-list-visibility-btn controller">
|
|
<div class="toggle"></div>
|
|
<img class="server-country-flag" src="" alt="" />
|
|
<p class="server-country-name"></p>
|
|
</button>
|
|
<ul class="server-city-list"></ul>
|
|
</li>
|
|
</template>
|
|
<template id="server-city-list-items">
|
|
<li>
|
|
<label class="server-city-list-item" tabindex="0">
|
|
<input class="server-radio-btn" type="radio" data-country-code="" data-city-name="" checked=""/>
|
|
<div class="server-radio-control"></div>
|
|
<span class="server-city-name"></span>
|
|
</label>
|
|
</li>
|
|
</template>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="hide panel advanced-proxy-settings-panel" id="advanced-proxy-settings-panel">
|
|
<h3 class="title proxy-panel-title" id="advanced-proxy-settings-title">
|
|
<span data-i18n-message-id="advancedProxySettings"></span>
|
|
<div class="flx-row">
|
|
<p data-identity-color="" class="proxy-title-container-color"></p>
|
|
<span id="proxy-title-container-name"></span>
|
|
</div>
|
|
</h3>
|
|
<button class="btn-return arrow-left controller moz-vpn-return" id="advanced-proxy-settings-return"></button>
|
|
<form class="advanced-proxy-panel-content">
|
|
<label class="advanced-proxy-input-label" for="container-proxy" data-i18n-message-id="advancedProxySettings"></label>
|
|
<div class="advanced-proxy-input-wrapper">
|
|
<input id="edit-advanced-proxy-input" class="proxy-host primary-input" name="container-proxy" type="text" maxlength="50" placeholder="type://host:port" />
|
|
<button id="clear-advanced-proxy-input" class="controller" data-i18n-attribute="value" data-i18n-attribute-message-id="clearproxylabel"></button>
|
|
<span class="proxy-validity" data-i18n-message-id="invalidProxyAlert"></span>
|
|
</div>
|
|
<button id="submit-advanced-proxy" class="primary-cta apply-to-container" data-i18n-message-id="applyToContainer"></button>
|
|
<a id="advanced-proxy-settings-learn-more" href="" class="blue-link" data-i18n-message-id="learnMore"></a>
|
|
</form>
|
|
<div id="permissions-overlay" class="permissions-overlay" data-tab-group="proxy-disabled">
|
|
<p data-tab-group="proxy-disabled" data-i18n-message-id="additionalPermissionNeeded"></p>
|
|
<button id="enable-proxy-permissions" class="primary-cta" data-tab-group="proxy-disabled" data-i18n-message-id="enable"></button>
|
|
</div>
|
|
</div>
|
|
<script src="js/utils.js"></script>
|
|
<script src="js/popup.js"></script>
|
|
<script src="js/mozillaVpn.js"></script>
|
|
<script src="js/proxified-containers.js"></script>
|
|
</body>
|
|
</html>
|