adjust server selector
This commit is contained in:
Alex Turchyn
committed by
Pete Matsyburka
Pete Matsyburka
parent
5f44806287
commit
fc6f796f30
@@ -1,12 +1,50 @@
|
||||
<div class="text-center">
|
||||
<div class="join">
|
||||
<a href="https://docuseal.com<%= request.fullpath.gsub('docuseal.eu', 'docuseal.com') %>" class="btn bg-base-200 join-item w-32 <%= 'bg-base-300' if request.host == 'docuseal.com' %>">
|
||||
<%= svg_icon 'world', class: 'w-5 h-5' %>
|
||||
Global
|
||||
</a>
|
||||
<a href="https://docuseal.eu<%= request.fullpath.gsub('docuseal.com', 'docuseal.eu') %>" class="btn bg-base-200 join-item w-32 <%= 'bg-base-300' if request.host == 'docuseal.eu' %>">
|
||||
<%= svg_icon 'eu_flag', class: 'w-5 h-5' %>
|
||||
Europe
|
||||
</a>
|
||||
<% eu_server = request.host == 'docuseal.eu' %>
|
||||
<server-selector>
|
||||
<div id="global_server_selector" class="text-center hidden">
|
||||
<div class="join">
|
||||
<a href="https://docuseal.com<%= request.fullpath.gsub('docuseal.eu', 'docuseal.com') %>" class="btn bg-base-200 join-item w-40 <%= 'bg-base-300' unless eu_server %>">
|
||||
<%= svg_icon 'world', class: 'w-5 h-5' %>
|
||||
Global
|
||||
</a>
|
||||
<a href="https://docuseal.eu<%= request.fullpath.gsub('docuseal.com', 'docuseal.eu') %>" class="relative btn bg-base-200 join-item w-40 <%= 'bg-base-300' if eu_server %>">
|
||||
<%= svg_icon 'eu_flag', class: 'w-5 h-5' %>
|
||||
Europe
|
||||
<span id="eu_server_alert" class="absolute flex space-x-1 hidden" style="top: -1.5rem;">
|
||||
<span class="text-xs font-normal leading-none text-base-content normal-case">
|
||||
<%= t('eu_data_residency') %>
|
||||
</span>
|
||||
<%= svg_icon 'corner_right_down', class: 'w-4 h-5 stroke-1 shrink-0 pt-1' %>
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="us_server_selector" class="flex justify-center hidden">
|
||||
<div class="dropdown">
|
||||
<label tabindex="0" class="relative btn btn-sm btn-outline normal-case border-base-content/20 w-36">
|
||||
<% if eu_server %>
|
||||
<%= svg_icon 'eu_flag', class: 'w-5 h-5' %>
|
||||
<span>EU Cloud</span>
|
||||
<% else %>
|
||||
<%= svg_icon 'usa_flag', class: 'w-5 h-5' %>
|
||||
<span>US Cloud</span>
|
||||
<% end %>
|
||||
<%= svg_icon 'chevron_down', class: 'w-4 h-4 absolute right-1' %>
|
||||
</label>
|
||||
<ul tabindex="0" class="dropdown-content z-[1] menu border border-base-content/20 mt-1 bg-base-100 rounded-box w-36">
|
||||
<li>
|
||||
<a href="https://docuseal.com<%= request.fullpath.gsub('docuseal.eu', 'docuseal.com') %>" class="flex items-center space-x-2 <%= 'bg-base-300' unless eu_server %>">
|
||||
<%= svg_icon 'usa_flag', class: 'w-5 h-5' %>
|
||||
US Cloud
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://docuseal.eu<%= request.fullpath.gsub('docuseal.com', 'docuseal.eu') %>" class="flex items-center space-x-2 <%= 'bg-base-300' if eu_server %>">
|
||||
<%= svg_icon 'eu_flag', class: 'w-5 h-5' %>
|
||||
EU Cloud
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</server-selector>
|
||||
<%= render 'scripts/server_selector' %>
|
||||
|
||||
@@ -0,0 +1,3 @@
|
||||
<svg class="<%= local_assigns[:class] %>" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" width="24" height="24" stroke-width="2">
|
||||
<path d="M6 6h6a3 3 0 0 1 3 3v10l-4 -4m8 0l-4 4"></path>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 285 B |
@@ -0,0 +1,9 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="<%= local_assigns[:class] %>" viewBox="0 0 640 480">
|
||||
<path fill="#bd3d44" d="M0 0h640v480H0" />
|
||||
<path stroke="#fff" stroke-width="37" d="M0 55.3h640M0 129h640M0 203h640M0 277h640M0 351h640M0 425h640" />
|
||||
<path fill="#192f5d" d="M0 0h364.8v258.5H0" />
|
||||
<marker id="um-a" markerHeight="30" markerWidth="30">
|
||||
<path fill="#fff" d="m14 0 9 27L0 10h28L5 27z" />
|
||||
</marker>
|
||||
<path fill="none" marker-mid="url(#um-a)" d="m0 0 16 11h61 61 61 61 60L47 37h61 61 60 61L16 63h61 61 61 61 60L47 89h61 61 60 61L16 115h61 61 61 61 60L47 141h61 61 60 61L16 166h61 61 61 61 60L47 192h61 61 60 61L16 218h61 61 61 61 60z" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 671 B |
@@ -0,0 +1,21 @@
|
||||
<script>
|
||||
customElements.define('server-selector', class extends HTMLElement {
|
||||
connectedCallback() {
|
||||
const usServerSelector = this.querySelector('#us_server_selector');
|
||||
const globalServerSelector = this.querySelector('#global_server_selector');
|
||||
const euServerAlert = this.querySelector('#eu_server_alert');
|
||||
const timezone = Intl.DateTimeFormat().resolvedOptions().timeZone
|
||||
const usTimezones = /^(?:America\/(?:New_York|Detroit|Kentucky\/(?:Louisville|Monticello)|Indiana\/(?:Indianapolis|Vincennes|Winamac|Marengo|Petersburg|Vevay|Tell_City|Knox)|Chicago|Menominee|North_Dakota\/(?:Center|New_Salem|Beulah)|Denver|Boise|Phoenix|Los_Angeles|Anchorage|Juneau|Sitka|Metlakatla|Yakutat|Nome|Adak)|Pacific\/Honolulu)$/;
|
||||
const euTimezones = /^Europe\/(?:Vienna|Brussels|Sofia|Zagreb|Nicosia|Prague|Copenhagen|Tallinn|Helsinki|Paris|Berlin|Athens|Budapest|Dublin|Rome|Riga|Vilnius|Luxembourg|Valletta|Amsterdam|Warsaw|Lisbon|Bratislava|Ljubljana|Madrid|Stockholm|Bucharest)$/;
|
||||
|
||||
if (usTimezones.test(timezone)) {
|
||||
usServerSelector.classList.remove('hidden');
|
||||
} else if (euTimezones.test(timezone)) {
|
||||
globalServerSelector.classList.remove('hidden');
|
||||
euServerAlert.classList.remove('hidden');
|
||||
} else {
|
||||
globalServerSelector.classList.remove('hidden');
|
||||
}
|
||||
}
|
||||
});
|
||||
</script>
|
||||
Reference in New Issue
Block a user