diff --git a/Makefile b/Makefile index 72929ec..e36a222 100644 --- a/Makefile +++ b/Makefile @@ -1,4 +1,14 @@ -.PHONY: all css serve-dev +.PHONY: all css js serve-dev + +define update_cache_buster + hash=$$(sha256sum "$(1)" | cut -c1-8); \ + perl -0pi -e "s|(^[[:space:]]*$(2):.*?url: '/)[^']*(')|\$$1$(1)?v=$$hash\$$2|ms" _config.yml +endef + +define update_sri + hash=$$(openssl dgst -sha384 -binary "$(1)" | openssl base64 -A); \ + perl -0pi -e "s|(^[[:space:]]*$(2):.*?sri: ')[^']*(')|\$$1sha384-$$hash\$$2|ms" _config.yml +endef all: @echo '# These are the available make targets' @@ -6,7 +16,22 @@ all: css: npm install - npx less --clean-css="--s1 --advanced" styles/styles.less > styles/styles.min.css + npx lessc --clean-css="--s1 --advanced" styles/styles.less > styles/styles.min.css + $(call update_cache_buster,styles/styles.min.css,css) + $(call update_sri,styles/styles.min.css,css) + +js: + npm install + @for file in js/*.js; do \ + case "$$file" in \ + *.min.js) continue ;; \ + esac; \ + minified="$${file%.js}.min.js"; \ + name="$$(basename "$$file" .js)"; \ + npx uglifyjs "$$file" -c -m -o "$$minified"; \ + $(call update_cache_buster,$$minified,$$name); \ + $(call update_sri,$$minified,$$name); \ + done serve-dev: docker run -it -p 4000:4000 -v $(PWD):/site -w /site library/ruby:3 bash -c 'bundle install && bundle exec jekyll serve -H 0.0.0.0' diff --git a/README.md b/README.md index 02d9161..3e9ee7e 100644 --- a/README.md +++ b/README.md @@ -12,3 +12,7 @@ The pages are rendered with Jekyll and kindly hosted by github. ## Build CSS To build the stylesheets run `make css`. + +## Build JS + +To build the stylesheets run `make js`. diff --git a/_bin/update-jsdelivr-refs.php b/_bin/update-jsdelivr-refs.php new file mode 100755 index 0000000..6877b86 --- /dev/null +++ b/_bin/update-jsdelivr-refs.php @@ -0,0 +1,228 @@ +#!/usr/bin/env php + true, + CURLOPT_FOLLOWLOCATION => true, + CURLOPT_TIMEOUT => 15, + CURLOPT_HTTPHEADER => [ + 'Accept: application/json', + ], + ]); + + $response = curl_exec($ch); + + if ($response === false) { + $error = curl_error($ch); + curl_close($ch); + + throw new RuntimeException( + sprintf('Request failed: %s', $error) + ); + } + + $status = curl_getinfo($ch, CURLINFO_HTTP_CODE); + + curl_close($ch); + + if ($status < 200 || $status >= 300) { + throw new RuntimeException( + sprintf( + 'Request failed with HTTP %d: %s', + $status, + $url + ) + ); + } + + $data = json_decode($response, true); + + if (!is_array($data)) { + throw new RuntimeException( + sprintf( + 'Invalid JSON returned by %s', + $url + ) + ); + } + + return $data; +} + +/** + * Resolve a version constraint to a concrete version. + * + * jsDelivr handles the version/semver resolution. + */ +function resolveVersion($package, $constraint) +{ + $url = JSDELIVR_API . '/packages/npm/' . rawurlencode($package) . '/resolved?specifier=' . rawurlencode($constraint); + $data = apiRequest($url); + + if (!isset($data['version']) || !is_string($data['version'])) { + throw new RuntimeException( + sprintf( + 'Unable to resolve version "%s" for %s', + $constraint, + $package + ) + ); + } + + return $data['version']; +} + +/** + * Get the package metadata and file listing for a + * specific version. + */ +function getPackageFiles($package, $version) +{ + $url = JSDELIVR_API . '/packages/npm/' . rawurlencode($package) . '@' . rawurlencode($version); + $data = apiRequest($url); + + if (!isset($data['files']) || !is_array($data['files'])) { + throw new RuntimeException( + sprintf( + 'No file listing returned for %s@%s', + $package, + $version + ) + ); + } + + return $data['files']; +} + +/** + * Flatten the jsDelivr file tree into a path => metadata array. + */ +function flattenFiles($files, $prefix = '') +{ + $result = []; + + foreach ($files as $file) { + if (!isset($file['name'])) { + continue; + } + + $name = $file['name']; + $path = $prefix . '/' . ltrim($name, '/'); + + if (($file['type'] ?? null) === 'directory') { + if (isset($file['files']) && is_array($file['files'])) { + $result += flattenFiles($file['files'], $path); + } + + continue; + } + + $result[$path] = $file; + } + + return $result; +} + +/** + * Process all dependencies and return the resolved + * CDN configuration. + */ +function processDependencies($refs) +{ + $result = []; + + foreach ($refs as $name => $dependency) { + $package = $dependency['package']; + + if (!isset($dependency['version'])) { + throw new RuntimeException(sprintf('No version specified for %s', $package)); + } + + $requestedVersion = $dependency['version']; + $resolvedVersion = resolveVersion($package, $requestedVersion); + $files = getPackageFiles($package, $resolvedVersion); + $availableFiles = flattenFiles($files); + + foreach (['css', 'js'] as $type) { + if (empty($dependency[$type]) || !is_array($dependency[$type])) { + continue; + } + + $result[$name][$type] = []; + + foreach ($dependency[$type] as $file) { + if (!isset($availableFiles[$file])) { + throw new RuntimeException( + sprintf( + 'File does not exist: %s@%s%s', + $name, + $resolvedVersion, + $file + ) + ); + } + + $fileInfo = $availableFiles[$file]; + + if (!isset($fileInfo['hash'])|| !is_string($fileInfo['hash'])) { + throw new RuntimeException( + sprintf( + 'No hash available for: %s@%s%s', + $name, + $resolvedVersion, + $file + ) + ); + } + + $result[$name][$type][] = [ + 'url' => JSDELIVR_CDN . '/' . $package . '@' . $resolvedVersion . $file, + 'sri' => 'sha256-' . $fileInfo['hash'], + ]; + } + } + } + + return $result; +} + + +try { + $resolved = processDependencies($refs); + foreach ($resolved as $package => $types) { + echo " {$package}:" . PHP_EOL; + + foreach ($types as $type => $files) { + echo " {$type}:" . PHP_EOL; + + foreach ($files as $file) { + echo " url: '{$file['url']}'" . PHP_EOL; + echo " sri: '{$file['sri']}'" . PHP_EOL; + } + } + } +} catch (Throwable $e) { + fwrite(STDERR, 'ERROR: ' . $e->getMessage() . PHP_EOL); + exit(1); +} \ No newline at end of file diff --git a/_config.yml b/_config.yml index 09d8338..df0de88 100644 --- a/_config.yml +++ b/_config.yml @@ -1,38 +1,56 @@ safe: true encoding: UTF-8 url: https://roundcube.net -enforce_ssl: roundcube.net -hostname: "https://roundcube.net" permalink: news/:year/:month/:day/:title exclude: [vendor] plugins: [jekyll-paginate] paginate: 10 -paginate_path: "/news/page:num/" -environment: "production" +paginate_path: '/news/page:num/' +environment: 'production' num_related_items: 5 -libs: { - fonts: { - roboto: 'https://fonts.googleapis.com/css?family=Roboto&display=swap', - }, - less: { - url: 'https://cdn.jsdelivr.net/npm/less@4.6.4/dist/less.min.js', - sri: 'sha384-WR+iiQT+XSq8wDUutASKAXx1pZTJCLRyHfpwqBiL1ji4qd2BsJIPhn8k/s72NkPj' - }, - css: '/styles/styles.min.css?v=2026051000', - bootstrap: { - css: { - url: 'https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/css/bootstrap.min.css', - sri: 'sha384-sRIl4kxILFvY47J16cr9ZwB07vP4J8+LH7qKQnuqkuIAvNWLzeN8tE5YBujZqJLB' - }, - js: { - url: 'https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/js/bootstrap.bundle.min.js', - sri: 'sha384-FKyoEForCGlyvwx9Hj09JcYn3nv7wiPVlz7YYwJrWVcXK/BmnVDxM+D2scQbITxI' - } - }, - fontawesome: { - css: { - url: 'https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@7.2.0/css/all.min.css', - sri: 'sha384-EXatlQyrOJgDaM9/a74ArMzy7/2bTMSrZj8ID1IPeVmc3GncfCugefCFWSLj8JL/' - }, - } -} +exclude: + - Gemfile + - Gemfile.lock + - jsdelivr.json + - node_modules/ + - Makefile + - package.json + - package-lock.json + - README.md + - stylelint.config.mjs +libs: + css: + url: '/styles/styles.min.css?v=9bf32423' + sri: 'sha384-yb8/IfPlNNl8SDmdqLJ/CA5xbgQHXyHb2ehtoAamh+bLbMmu/tW+EBvF2BdzkzLv' + js: + banner: + url: '/js/banner.min.js?v=f44c2f56' + sri: 'sha384-zF0W4VZ06nGXgt2nFDiPoMhn5+UK+WaAIX1cprNGHkcURqccwGD+fXRZiu77TZ+b' + copy: + url: '/js/copy.min.js?v=ebb9b310' + sri: 'sha384-9TlbtUpnP3OoI5QMwNcfEMbkzjHOvlpeDEjVJCPWHJPxwCA5K2dXqlKZrb07rYVa' + theme: + url: '/js/theme.min.js?v=17d30fbf' + sri: 'sha384-VhNYv2z6f3ZriTjr7a9xelQKHZilrphb/xj36CtPT1McEdLSIPrMG4L+IJkgC1+T' + viewer: + url: '/js/viewer.min.js?v=df6dc21d' + sri: 'sha384-Gn/Zio1YIE6O7P0MXgTN8GECQMnPDd8MYeXQbJV5hk4+6O6aWhkBHcFUFs+DpNDL' + less: + js: + url: 'https://cdn.jsdelivr.net/npm/less@4.9.1/dist/less.min.js' + sri: 'sha256-QoOydTeDccOLjcHMHS1oOUe0QaqHXh2XFuki4s/zSXc=' + roboto: + css: + url: 'https://cdn.jsdelivr.net/npm/@fontsource/roboto@5.3.0/400.css' + sri: 'sha256-aYPEXwxOBquazL7uNzcM57whskXEvU0X84EZ2lI41yk=' + bootstrap: + css: + url: 'https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/css/bootstrap.min.css' + sri: 'sha256-2FMn2Zx6PuH5tdBQDRNwrOo60ts5wWPC9R8jK67b3t4=' + js: + url: 'https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/js/bootstrap.bundle.min.js' + sri: 'sha256-5P1JGBOIxI7FBAvT/mb1fCnI5n/NhQKzNUuW7Hq0fMc=' + fontawesome: + css: + url: 'https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@7.3.1/css/all.min.css' + sri: 'sha256-4Lad8m4ZWW1Lgb9+sMVLYEfnIh7BjV1NQMEe79Pviks=' diff --git a/_includes/footer.html b/_includes/footer.html index 9e7e268..bda5fad 100644 --- a/_includes/footer.html +++ b/_includes/footer.html @@ -13,9 +13,9 @@ Switch theme @@ -41,91 +41,14 @@ - \ No newline at end of file +{% assign scripts = "theme" | split: "," %} +{% if page.scripts %}{% assign scripts = scripts | concat: page.scripts %}{% endif %} +{% for script in scripts %} + {% assign js = site.libs.js[script] %} + + {% if site.environment == "dev" %} + + {% else %} + + {% endif %} +{% endfor %} diff --git a/_includes/head.html b/_includes/head.html index 6c5fcb5..bd5c82b 100644 --- a/_includes/head.html +++ b/_includes/head.html @@ -5,20 +5,14 @@ - + {% if site.environment == "dev" %} - - + + {% else %} - + {% endif %} - diff --git a/_includes/viewer.html b/_includes/viewer.html new file mode 100644 index 0000000..15353b5 --- /dev/null +++ b/_includes/viewer.html @@ -0,0 +1,20 @@ + diff --git a/download/index.html b/download/index.html index eeba2a6..f390944 100644 --- a/download/index.html +++ b/download/index.html @@ -3,6 +3,8 @@ title: Roundcube Webmail Downloads navtitle: Download lastmod: 2019-08-28T12:32:00Z +scripts: + - copy ---

Download your version of Roundcube

@@ -37,9 +39,9 @@

{{ params.title }}{% if params.titleVersion %} - {{ params.pac {{ package.size }} - {{ package.checksum }} + {{ package.checksum }} - + {% endfor %} @@ -115,7 +117,7 @@

PGP signatures for package verification pubkey and the signature file, verify packages with

- gpg --verify roundcubemail-<version>.tar.gz{.asc,} + gpg --verify roundcubemail-<version>.tar.gz{.asc,}

Installation and upgrading

@@ -141,13 +143,12 @@

Integrations

- + Nextcloud webmail The Nextcloud app "Roundcube Mail" integrates an existing Roundcube standalone email-webapp into Nextcloud, with optional SSO.

- @@ -161,7 +162,7 @@

Complete email server packages with Roundcube

Roundcube for Enterprises - is a stand-alone, all-in-one email solution for service providers by Nextcloud. Your customers need a reliable, dependable and performant email service. The Nextcloud Roundcube Enterprise subscription helps you deliver exactly that. + is a stand-alone, all-in-one email solution for service providers by Nextcloud. Your customers need a reliable, dependable and performant email service. The Nextcloud Roundcube Enterprise subscription helps you deliver exactly that.

diff --git a/google2ae4ba011e8a69d4.html b/google2ae4ba011e8a69d4.html index e046b08..d24ab5a 100644 --- a/google2ae4ba011e8a69d4.html +++ b/google2ae4ba011e8a69d4.html @@ -1,4 +1,7 @@ + - + +roundcube + - \ No newline at end of file + diff --git a/index.html b/index.html index 83df609..cdfe49a 100644 --- a/index.html +++ b/index.html @@ -2,6 +2,8 @@ layout: home title: Roundcube - Free and Open Source Webmail Software date: 2020-04-29T21:10:00Z +scripts: + - banner --- - - diff --git a/js/banner.js b/js/banner.js new file mode 100644 index 0000000..4c19087 --- /dev/null +++ b/js/banner.js @@ -0,0 +1,24 @@ +const currentDate = new Date(); + +document.querySelectorAll('.rc-announcement').forEach((announcement) => { + const expiry = announcement.dataset.rcExpiry; + + if (!expiry || currentDate < new Date(expiry)) { + announcement.classList.remove('d-none'); + } +}); + +const switchLogo = () => { + const isDark = document.documentElement.dataset.bsTheme === 'dark'; + + document.querySelectorAll('img[data-rc-dark]').forEach((img) => { + if (!img.dataset.rcLight) { + img.dataset.rcLight = img.src; + } + + img.src = isDark ? img.dataset.rcDark : img.dataset.rcLight; + }); +}; + +switchLogo(); +document.addEventListener('switch-color-mode', switchLogo, false); diff --git a/js/banner.min.js b/js/banner.min.js new file mode 100644 index 0000000..0e93722 --- /dev/null +++ b/js/banner.min.js @@ -0,0 +1 @@ +let currentDate=new Date,switchLogo=(document.querySelectorAll(".rc-announcement").forEach(e=>{var t=e.dataset.rcExpiry;(!t||currentDate{let t="dark"===document.documentElement.dataset.bsTheme;document.querySelectorAll("img[data-rc-dark]").forEach(e=>{e.dataset.rcLight||(e.dataset.rcLight=e.src),e.src=t?e.dataset.rcDark:e.dataset.rcLight})});switchLogo(),document.addEventListener("switch-color-mode",switchLogo,!1); \ No newline at end of file diff --git a/js/copy.js b/js/copy.js new file mode 100644 index 0000000..9b6af14 --- /dev/null +++ b/js/copy.js @@ -0,0 +1,118 @@ +const copyText = 'Copy to clipboard'; +const copyComplete = 'Copied'; +const copyError = 'Copy failed'; +const copyPopoverLinks = document.querySelectorAll('button.copy-popover-link'); + +copyPopoverLinks.forEach((button) => { + const target = button.closest('td')?.querySelector('.copy-popover-target'); + + if (!target) { + return; + } + + // eslint-disable-next-line no-new + new bootstrap.Popover(button, { + content: target.innerHTML, + html: true, + allowList: { ...bootstrap.Popover.Default.allowList, button: [] }, + customClass: 'copy-popover', + }); + + button.addEventListener('click', (event) => { + event.preventDefault(); + }); + + button.addEventListener('shown.bs.popover', () => { + initialisePopoverCopyButtons(button); + }); +}); + +function initialisePopoverCopyButtons(popoverButton) { + const popoverId = popoverButton.getAttribute('aria-describedby'); + + if (!popoverId) { + return; + } + + const popover = document.getElementById(popoverId); + + if (!popover) { + return; + } + + popover.querySelectorAll('button.copy-link').forEach((copyButton) => { + initialiseCopyButton(copyButton); + }); +} + +if (copyPopoverLinks.length > 0) { + document.addEventListener('click', (event) => { + if (event.target.closest('.popover.show')) { + return; + } + + copyPopoverLinks.forEach((button) => { + const popover = bootstrap.Popover.getInstance(button); + + if (popover?.tip?.classList.contains('show')) { + popover.hide(); + } + }); + }); +} + +document.querySelectorAll('button.copy-link').forEach((copyButton) => { + initialiseCopyButton(copyButton); +}); + +function initialiseCopyButton(copyButton) { + if (copyButton.dataset.copyInitialised === 'true') { + return; + } + + copyButton.dataset.copyInitialised = 'true'; + + const tooltip = bootstrap.Tooltip.getOrCreateInstance(copyButton, { + title: copyText, + }); + + copyButton.addEventListener('click', (event) => { + copyToClipboard(copyButton, tooltip, event); + }); +} + +async function copyToClipboard(copyButton, tooltip, event) { + event.preventDefault(); + + const container = copyButton.closest('p, td, div'); + const target = container?.querySelector('.copy-target'); + + if (!target) { + return; + } + + const payload = target.textContent.trimEnd(); + + try { + await navigator.clipboard.writeText(payload); + updateCopyButton(copyButton, tooltip, 'complete', copyComplete); + } catch { + updateCopyButton(copyButton, tooltip, 'error', copyError); + } +} + +function updateCopyButton(copyButton, tooltip, cssClass, text) { + tooltip.setContent({ + '.tooltip-inner': text, + }); + + copyButton.classList.add(cssClass); + + window.setTimeout(() => { + tooltip.setContent({ + '.tooltip-inner': copyText, + }); + + copyButton.classList.remove(cssClass); + }, 2500); +} diff --git a/js/copy.min.js b/js/copy.min.js new file mode 100644 index 0000000..026af17 --- /dev/null +++ b/js/copy.min.js @@ -0,0 +1 @@ +let copyText="Copy to clipboard",copyComplete="Copied",copyError="Copy failed",copyPopoverLinks=document.querySelectorAll("button.copy-popover-link");function initialisePopoverCopyButtons(t){var t=t.getAttribute("aria-describedby");t&&(t=document.getElementById(t))&&t.querySelectorAll("button.copy-link").forEach(t=>{initialiseCopyButton(t)})}function initialiseCopyButton(e){if("true"!==e.dataset.copyInitialised){e.dataset.copyInitialised="true";let o=bootstrap.Tooltip.getOrCreateInstance(e,{title:copyText});e.addEventListener("click",t=>{copyToClipboard(e,o,t)})}}async function copyToClipboard(t,o,e){e.preventDefault();e=t.closest("p, td, div")?.querySelector(".copy-target");if(e){e=e.textContent.trimEnd();try{await navigator.clipboard.writeText(e),updateCopyButton(t,o,"complete",copyComplete)}catch{updateCopyButton(t,o,"error",copyError)}}}function updateCopyButton(t,o,e,i){o.setContent({".tooltip-inner":i}),t.classList.add(e),window.setTimeout(()=>{o.setContent({".tooltip-inner":copyText}),t.classList.remove(e)},2500)}copyPopoverLinks.forEach(t=>{var o=t.closest("td")?.querySelector(".copy-popover-target");o&&(new bootstrap.Popover(t,{content:o.innerHTML,html:!0,allowList:{...bootstrap.Popover.Default.allowList,button:[]},customClass:"copy-popover"}),t.addEventListener("click",t=>{t.preventDefault()}),t.addEventListener("shown.bs.popover",()=>{initialisePopoverCopyButtons(t)}))}),0{t.target.closest(".popover.show")||copyPopoverLinks.forEach(t=>{t=bootstrap.Popover.getInstance(t);t?.tip?.classList.contains("show")&&t.hide()})}),document.querySelectorAll("button.copy-link").forEach(t=>{initialiseCopyButton(t)}); \ No newline at end of file diff --git a/js/theme.js b/js/theme.js new file mode 100644 index 0000000..8695797 --- /dev/null +++ b/js/theme.js @@ -0,0 +1,34 @@ +const html = document.documentElement; +const storageAvailable = typeof Storage !== 'undefined'; +const savedColorMode = storageAvailable ? localStorage.getItem('color-mode') : undefined; + +switchColorMode(savedColorMode || 'auto', true); + +document.querySelectorAll('div.color-modes a[data-rc-color-mode]').forEach((link) => { + link.addEventListener('click', (event) => { + event.preventDefault(); + switchColorMode(link.dataset.rcColorMode); + }); +}); + +function switchColorMode(mode, onload = false) { + const prefersDark = window.matchMedia?.('(prefers-color-scheme: dark)').matches ?? false; + const colorMode = mode === 'auto' ? (prefersDark ? 'dark' : 'light') : mode; + html.dataset.bsTheme = colorMode; + + const currentTheme = document.querySelector('div.color-modes > ul.dropdown-menu a.current-theme'); + const selectedTheme = document.querySelector(`div.color-modes > ul.dropdown-menu a.${mode}-mode`); + + currentTheme?.classList.remove('current-theme'); + selectedTheme?.classList.add('current-theme'); + + if (!onload && storageAvailable) { + if (mode === 'auto') { + localStorage.removeItem('color-mode'); + } else { + localStorage.setItem('color-mode', mode); + } + } + + document.dispatchEvent(new Event('switch-color-mode')); +} diff --git a/js/theme.min.js b/js/theme.min.js new file mode 100644 index 0000000..e05bdf1 --- /dev/null +++ b/js/theme.min.js @@ -0,0 +1 @@ +let html=document.documentElement,storageAvailable="undefined"!=typeof Storage,savedColorMode=storageAvailable?localStorage.getItem("color-mode"):void 0;function switchColorMode(e,o=!1){var t=window.matchMedia?.("(prefers-color-scheme: dark)").matches??!1,t="auto"===e?t?"dark":"light":e,t=(html.dataset.bsTheme=t,document.querySelector("div.color-modes > ul.dropdown-menu a.current-theme")),r=document.querySelector(`div.color-modes > ul.dropdown-menu a.${e}-mode`);t?.classList.remove("current-theme"),r?.classList.add("current-theme"),!o&&storageAvailable&&("auto"===e?localStorage.removeItem("color-mode"):localStorage.setItem("color-mode",e)),document.dispatchEvent(new Event("switch-color-mode"))}switchColorMode(savedColorMode||"auto",!0),document.querySelectorAll("div.color-modes a[data-rc-color-mode]").forEach(o=>{o.addEventListener("click",e=>{e.preventDefault(),switchColorMode(o.dataset.rcColorMode)})}); \ No newline at end of file diff --git a/js/viewer.js b/js/viewer.js new file mode 100644 index 0000000..1361b42 --- /dev/null +++ b/js/viewer.js @@ -0,0 +1,162 @@ +const viewer = document.getElementById('viewer'); +const viewerBody = viewer.querySelector('.modal-body'); +const viewerImage = viewerBody.querySelector('img'); +const viewerDialog = viewer.querySelector('.modal-dialog'); +const viewerCaption = viewer.querySelector('.modal-footer > p'); + +viewer.querySelectorAll('button[data-rc-navigation]').forEach((link) => { + link.addEventListener('click', (event) => { + event.preventDefault(); + moveScreen(link.dataset.rcNavigation === 'previous'); + }); +}); + +viewer.addEventListener('show.bs.modal', (event) => { + const source = event.relatedTarget; + const img = source.querySelector('img'); + + const src = img.src; + const alt = img.alt || ''; + + viewerImage.src = src.replace('/thumbs/', '/screens/'); + viewerImage.alt = alt; + viewerCaption.textContent = alt; + + // Extract the current source and index once. + const id = source.id; + viewer.dataset.rcCurIndex = id.replace(/^screenshots-[a-z]+-[a-z]+-/, ''); + viewer.dataset.rcCurSource = id.replace(/-\d+$/, ''); + + updateNavigation(); +}); + +viewer.addEventListener('hidden.bs.modal', () => { + viewerImage.src = 'data:,'; + viewerImage.alt = ''; + viewerImage.style.removeProperty('height'); + + if (viewer.dataset.rcNoResize !== 'true') { + viewerDialog.style.removeProperty('width'); + } + + viewerCaption.textContent = ''; + viewer.dataset.rcCurIndex = ''; + viewer.dataset.rcCurSource = ''; + viewerBody.classList.add('loading'); +}); + +// Keyboard navigation +document.addEventListener('keyup', (event) => { + if (!viewer.classList.contains('show')) { + return; + } + + if (event.key === 'ArrowLeft') { + moveScreen(true); + } else if (event.key === 'ArrowRight') { + moveScreen(); + } +}); + +// Swipe navigation +let touchStartX = 0; +let touchStartY = 0; + +viewerBody.addEventListener('touchstart', (event) => { + const touch = event.changedTouches[0]; + + touchStartX = touch.screenX; + touchStartY = touch.screenY; +}, { passive: true }); + +viewerBody.addEventListener('touchend', (event) => { + if (!viewer.classList.contains('show')) { + return; + } + + const touch = event.changedTouches[0]; + const deltaX = touch.screenX - touchStartX; + const deltaY = touch.screenY - touchStartY; + + // Ignore predominantly vertical swipes. + if (Math.abs(deltaY) > 100) { + return; + } + + if (deltaX > 200) { + moveScreen(true); + } else if (deltaX < -200) { + moveScreen(); + } +}, { passive: true }); + +viewerImage.addEventListener('load', () => { + screenLoaded(viewerImage); +}); + +function screenLoaded(img) { + viewerDialog.style.removeProperty('width'); + + const maxWidth = viewerBody.offsetWidth; + const maxHeight = window.innerHeight * 0.75; + + let height = Math.min( + (img.height / img.width) * maxWidth, + img.height + ); + + height = Math.min(height, maxHeight); + + const width = (img.width / img.height) * height; + + img.style.height = `${height}px`; + viewerDialog.style.width = `${width}px`; + + viewerBody.classList.remove('loading'); +} + +function moveScreen(reverse = false) { + const source = viewer.dataset.rcCurSource; + const target = getNextScreenId(reverse); + + if (target <= 0) { + return; + } + + viewer.dataset.rcNoResize = 'true'; + + bootstrap.Modal.getInstance(viewer).hide(); + + const targetElement = document.getElementById(`${source}-${target}`); + + if (targetElement) { + targetElement.click(); + } + + viewer.dataset.rcNoResize = 'false'; + document.activeElement.blur(); +} + +function getNextScreenId(reverse = false) { + const source = viewer.dataset.rcCurSource; + const current = Number(viewer.dataset.rcCurIndex); + + const sourceElement = document.getElementById(source); + + if (!sourceElement || !current) { + return 0; + } + + const total = sourceElement.querySelectorAll('li').length; + + if (reverse) { + return current === 1 ? 0 : current - 1; + } + + return current === total ? 0 : current + 1; +} + +function updateNavigation() { + viewer.querySelector('.modal-footer > .nav > .nav-link.previous').classList.toggle('disabled', getNextScreenId(true) === 0); + viewer.querySelector('.modal-footer > .nav > .nav-link.next').classList.toggle('disabled', getNextScreenId() === 0); +} diff --git a/js/viewer.min.js b/js/viewer.min.js new file mode 100644 index 0000000..78b552d --- /dev/null +++ b/js/viewer.min.js @@ -0,0 +1 @@ +let viewer=document.getElementById("viewer"),viewerBody=viewer.querySelector(".modal-body"),viewerImage=viewerBody.querySelector("img"),viewerDialog=viewer.querySelector(".modal-dialog"),viewerCaption=viewer.querySelector(".modal-footer > p"),touchStartX=(viewer.querySelectorAll("button[data-rc-navigation]").forEach(t=>{t.addEventListener("click",e=>{e.preventDefault(),moveScreen("previous"===t.dataset.rcNavigation)})}),viewer.addEventListener("show.bs.modal",e=>{var e=e.relatedTarget,t=e.querySelector("img"),r=t.src,t=t.alt||"",r=(viewerImage.src=r.replace("/thumbs/","/screens/"),viewerImage.alt=t,viewerCaption.textContent=t,e.id);viewer.dataset.rcCurIndex=r.replace(/^screenshots-[a-z]+-[a-z]+-/,""),viewer.dataset.rcCurSource=r.replace(/-\d+$/,""),updateNavigation()}),viewer.addEventListener("hidden.bs.modal",()=>{viewerImage.src="data:,",viewerImage.alt="",viewerImage.style.removeProperty("height"),"true"!==viewer.dataset.rcNoResize&&viewerDialog.style.removeProperty("width"),viewerCaption.textContent="",viewer.dataset.rcCurIndex="",viewer.dataset.rcCurSource="",viewerBody.classList.add("loading")}),document.addEventListener("keyup",e=>{viewer.classList.contains("show")&&("ArrowLeft"===e.key?moveScreen(!0):"ArrowRight"===e.key&&moveScreen())}),0),touchStartY=0;function screenLoaded(e){viewerDialog.style.removeProperty("width");var t=viewerBody.offsetWidth,r=.75*window.innerHeight,t=Math.min(e.height/e.width*t,e.height),t=Math.min(t,r),r=e.width/e.height*t;e.style.height=t+"px",viewerDialog.style.width=r+"px",viewerBody.classList.remove("loading")}function moveScreen(e=!1){var t=viewer.dataset.rcCurSource,e=getNextScreenId(e);e<=0||(viewer.dataset.rcNoResize="true",bootstrap.Modal.getInstance(viewer).hide(),(t=document.getElementById(t+"-"+e))&&t.click(),viewer.dataset.rcNoResize="false",document.activeElement.blur())}function getNextScreenId(e=!1){var t=viewer.dataset.rcCurSource,r=Number(viewer.dataset.rcCurIndex),t=document.getElementById(t);return t&&r?(t=t.querySelectorAll("li").length,e?1===r?0:r-1:r===t?0:r+1):0}function updateNavigation(){viewer.querySelector(".modal-footer > .nav > .nav-link.previous").classList.toggle("disabled",0===getNextScreenId(!0)),viewer.querySelector(".modal-footer > .nav > .nav-link.next").classList.toggle("disabled",0===getNextScreenId())}viewerBody.addEventListener("touchstart",e=>{e=e.changedTouches[0];touchStartX=e.screenX,touchStartY=e.screenY},{passive:!0}),viewerBody.addEventListener("touchend",e=>{var t;viewer.classList.contains("show")&&(t=(e=e.changedTouches[0]).screenX-touchStartX,e=e.screenY-touchStartY,100{screenLoaded(viewerImage)}); \ No newline at end of file diff --git a/jsdelivr.json b/jsdelivr.json new file mode 100644 index 0000000..62ec5a1 --- /dev/null +++ b/jsdelivr.json @@ -0,0 +1,33 @@ +{ + "less": { + "package": "less", + "version": "*", + "js": [ + "/dist/less.min.js" + ] + }, + "roboto": { + "package": "@fontsource/roboto", + "version": "*", + "css": [ + "/400.css" + ] + }, + "bootstrap": { + "package": "bootstrap", + "version": "5.3", + "css": [ + "/dist/css/bootstrap.min.css" + ], + "js": [ + "/dist/js/bootstrap.bundle.min.js" + ] + }, + "fontawesome": { + "package": "@fortawesome/fontawesome-free", + "version": "7", + "css": [ + "/css/all.min.css" + ] + } +} diff --git a/package.json b/package.json index 4897939..f05d0fe 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,7 @@ { "dependencies": { "less": "^4.4.0", - "less-plugin-clean-css": "^1.6.0" + "less-plugin-clean-css": "^1.6.0", + "uglify-js": "^3.19.3" } } diff --git a/screens/index.html b/screens/index.html index d05c37d..21b5b2b 100644 --- a/screens/index.html +++ b/screens/index.html @@ -2,6 +2,8 @@ layout: default title: Roundcube Webmail Screenshots navtitle: Screenshots +scripts: + - viewer ---

Impressions of Roundcube's User Interface

@@ -40,146 +42,4 @@

{{ params.name }} Note: The following plugins, distributed with Roundcube, were active when the screenshots where taken: acl, archive, enigma, help, managesieve, markasjunk, password, and vcard_attachments.

- - - \ No newline at end of file +{% include viewer.html %} diff --git a/sitemap.xml b/sitemap.xml index 8d5c207..a18beef 100644 --- a/sitemap.xml +++ b/sitemap.xml @@ -5,7 +5,7 @@ {% for page in site.pages %} {% if page.layout != 'nil' %} - {{site.hostname }}{{ page.url | remove:'index.html' }} + {{site.url}}{{ page.url | remove:'index.html' }} {% if page.lastmod != nil %} {{ page.lastmod | date_to_xmlschema }} {% endif %} @@ -15,7 +15,7 @@ {% endfor %} {% for post in site.posts %} - {{site.hostname }}{{ post.url | remove:'index.html' }} + {{site.url}}{{ post.url | remove:'index.html' }} {% if post.lastmod == nil %} {{ post.date | date_to_xmlschema }} {% else %} diff --git a/styles/styles.less b/styles/styles.less index fb3e1d3..1ef8820 100644 --- a/styles/styles.less +++ b/styles/styles.less @@ -27,7 +27,7 @@ @color-dark-footer: lighten(@color-footer, 30%); :root { - --bs-font-sans-serif: -apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"; + --bs-font-sans-serif: -apple-system,"Segoe UI",roboto,"Helvetica Neue",arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"; --rc-color-primary: @color-primary; --rc-color-header-background: @color-header-background; --rc-color-banner-background: @color-banner-background; @@ -74,8 +74,8 @@ html[data-bs-theme="dark"] { background-color: var(--rc-color-header-background) !important; } -a:not(.btn):not(.nav-link):not(.dropdown-item), -.btn-link { +a:not(.btn, .nav-link, .dropdown-item), +a.btn-link { text-decoration: none; &.anchor { @@ -207,7 +207,7 @@ a.anchor { text-decoration: none !important; } - &:after { + &::after { font: var(--fa-font-solid); content: @fa-var-link; } @@ -217,7 +217,7 @@ a.anchor { } } -a.copy-link { +button.copy-link { color: var(--bs-secondary-color); font-size: .75rem; display: inline-block; @@ -229,29 +229,29 @@ a.copy-link { text-decoration: none !important; } - &:after { + &::after { font: var(--fa-font-regular); content: @fa-var-clipboard; } - &.complete:after { + &.complete::after { font: var(--fa-font-solid); content: @fa-var-check; color: var(--rc-color-success); } - &.error:after { + &.error::after { font: var(--fa-font-solid); content: @fa-var-triangle-exclamation; color: var(--rc-color-error); } } -a.copy-popover-link { +button.copy-popover-link { color: var(--bs-body-color); text-decoration: none !important; - &.checksum:after { + &.checksum::after { font: var(--fa-font-solid); content: @fa-var-file-shield; } @@ -329,11 +329,13 @@ a.mail-list-link::before { font: var(--fa-font-regular); content: @fa-var-envelope; } + /* a.asc-link::after { content: @fa-var-key; } */ + a.irc-link::after { content: @fa-var-comments; } @@ -426,10 +428,14 @@ div.color-modes > ul.dropdown-menu { .modal-arrow { position: absolute; + display: block; top: 0; bottom: 0; height: 100%; width: 30%; + cursor: default; + background: none; + border: 0; &.right-arrow { right: 0; diff --git a/styles/styles.min.css b/styles/styles.min.css index 89dc5e1..04e183e 100644 --- a/styles/styles.min.css +++ b/styles/styles.min.css @@ -1 +1 @@ -:root{--bs-font-sans-serif:-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--rc-color-primary:#37beff;--rc-color-header-background:#212529;--rc-color-banner-background:rgba(189, 234, 255, 0.5);--rc-color-background-alt:rgba(0, 0, 0, 0.05);--rc-color-download-bg:#1eb6ff;--rc-color-download-border:#13b2ff;--rc-color-thumbnail-background:rgba(0, 0, 0, 0.05);--rc-color-footer:#495057;--rc-color-footer-hover:#262a2d;--rc-color-success:#3fb950;--rc-color-error:#f85149}html[data-bs-theme=dark]{--rc-color-primary:#006a9d;--rc-color-header-background:#000;--rc-color-banner-background:rgba(0, 35, 52, 0.5);--rc-color-background-alt:rgba(255, 255, 255, 0.05);--rc-color-download-bg:#005984;--rc-color-download-border:#005279;--rc-color-thumbnail-background:rgba(255, 255, 255, 0.05);--rc-color-footer:#949da5;--rc-color-footer-hover:#bdc3c8}.navbar{--bs-navbar-toggler-focus-width:0;--bs-navbar-toggler-border-color:transparent;--bs-navbar-toggler-padding-x:0}.table{--bs-table-striped-bg:var(--rc-color-background-alt)}.bg-badge,.bg-quote{background-color:var(--rc-color-background-alt)!important}.bg-header,.bg-navbar,.modal-footer.bg-footer{background-color:var(--rc-color-header-background)!important}.btn-link,a:not(.btn):not(.nav-link):not(.dropdown-item){text-decoration:none}.btn-link.anchor,a:not(.btn):not(.nav-link):not(.dropdown-item).anchor{top:-6rem}.btn-link:hover,a:not(.btn):not(.nav-link):not(.dropdown-item):hover{text-decoration:underline}.card-header{padding:.75rem 1.25rem}.card-body{padding:1.25rem}.list-group-item{padding:.75rem 1.25rem}#banner{margin-top:66px;background-color:var(--rc-color-banner-background)}#banner>.container>.grid{display:grid;grid-template-columns:auto;grid-template-rows:auto}#banner>.container>.grid>.logo{grid-column:1;grid-row:1}#banner>.container>.grid>.image{grid-column:1;grid-row:2}#banner>.container>.grid>.download{grid-column:1;grid-row:3}@media (min-width:768px){#banner>.container>.grid{grid-template-columns:1fr 1.5fr}#banner>.container>.grid>.logo{grid-column:1/3;grid-row:1}#banner>.container>.grid>.image{grid-column:2;grid-row:2}#banner>.container>.grid>.download{grid-column:1;grid-row:2}}@media (min-width:992px){#banner>.container>.grid{grid-template-columns:1fr 1fr;grid-template-rows:auto 1fr}#banner>.container>.grid>.logo{grid-column:1;grid-row:1}#banner>.container>.grid>.image{grid-column:2;grid-row:1/3}#banner>.container>.grid>.download{grid-column:1;grid-row:2}}main{padding-top:6rem}main .h1,main h1{font-size:2.2rem;margin-bottom:1rem}main .h2,main h2{font-size:1.8rem;margin-top:1.5rem;font-weight:700}main .h3,main h3{font-size:1.4rem;margin-top:1rem}blockquote{padding:.6rem 1rem;background-color:var(--rc-color-background-alt)}blockquote>p{margin:0}code.block{white-space:pre}a.anchor{color:var(--bs-secondary-color);font-size:.75rem;vertical-align:middle;opacity:0}a.anchor:hover{text-decoration:none!important}a.anchor:after{font:var(--fa-font-solid);content:"\f0c1"}:hover>a.anchor{opacity:1}a.copy-link{color:var(--bs-secondary-color);font-size:.75rem;display:inline-block;width:1.25em;text-align:center;margin-left:.5rem}a.copy-link:hover{text-decoration:none!important}a.copy-link:after{font:var(--fa-font-regular);content:"\f328"}a.copy-link.complete:after{font:var(--fa-font-solid);content:"\f00c";color:var(--rc-color-success)}a.copy-link.error:after{font:var(--fa-font-solid);content:"\f071";color:var(--rc-color-error)}a.copy-popover-link{color:var(--bs-body-color);text-decoration:none!important}a.copy-popover-link.checksum:after{font:var(--fa-font-solid);content:"\e4f0"}div.popover.copy-popover>div.popover-body{padding:0 var(--bs-popover-body-padding-x);display:flex}h1,h2,h3,p{scroll-margin-top:80px}.artical-list>.artical:nth-of-type(odd),ul.ul-striped li:nth-of-type(odd){background-color:var(--rc-color-background-alt)}.artical-list+nav{margin-top:2rem}footer ul,ul.screens{list-style:none}.artical>div.snippet>p{display:inline}footer a{font-weight:500;color:var(--rc-color-footer)}footer a:focus,footer a:hover{color:var(--rc-color-footer-hover)}.rc-icon::after,.rc-icon::before{font:var(--fa-font-solid)}.rc-icon::before{margin-right:.25rem}.rc-icon::after{margin-left:.25rem}a.back-link::before{content:"\f100"}a.read-link::after{content:"\f101"}a.external-link::after{content:"\f35d"}a.rss-link::after{content:"\f09e"}a.mail-list-link::before{font:var(--fa-font-regular);content:"\f0e0"}a.irc-link::after{content:"\f086"}a.dark-mode::before{content:"\f186"}a.light-mode::before{content:"\f185"}a.auto-mode::before{content:"\f72b"}a.current-theme::after{content:"\f00c"}.btn-rc-download{color:var(--bs-white)!important;background-color:var(--rc-color-primary);border-color:var(--rc-color-primary)}.btn-rc-download:hover{color:var(--bs-white);background-color:var(--rc-color-download-bg);border-color:var(--rc-color-download-border)}.btn-rc-download::before{margin-right:0;content:"\f019"}.btn-rc-download>span{margin-left:.5rem}.btn-rc-download.btn-sm>span{display:none}@media (min-width:992px){.btn-rc-download.btn-sm>span{display:inline}}div.color-modes>ul.dropdown-menu{min-width:auto}div.color-modes>ul.dropdown-menu>li>a{font-size:.8rem}div.color-modes>ul.dropdown-menu>li>a::before{text-align:center;width:1.25em;margin-right:.5em;display:inline-block}div.color-modes>ul.dropdown-menu>li>a::after{margin-left:.75em}.img-thumbnail>a{width:140px;background-color:var(--rc-color-thumbnail-background)}#viewer .modal-body{user-select:none}#viewer .modal-body>img{position:relative}#viewer .modal-body .modal-loading span{font-size:10em;opacity:.5}#viewer .modal-body .modal-arrow{position:absolute;top:0;bottom:0;height:100%;width:30%}#viewer .modal-body .modal-arrow.right-arrow{right:0}#viewer .modal-body.loading>img{display:none}#viewer .modal-body:not(.loading)>.modal-loading{display:none}#viewer .modal-footer{color:var(--bs-white)}#viewer .modal-footer .nav{user-select:none}#viewer .modal-footer .nav>.nav-link:not(.disabled){color:var(--bs-white)}table.download-table tbody td,table.download-table tbody th{vertical-align:middle}table.download-table td.link{width:60px}table.download-table td.size{width:80px}table.download-table td.checksum{font-size:.9em;width:40px}@media (min-width:768px){table.download-table th.package{width:255px}table.download-table td.checksum{width:auto}}@media (min-width:992px){table.download-table td.link{width:170px}table.download-table td.size{width:120px}}@media (min-width:768px){table.download-table td.checksum>span>span.copy-target{width:254px}}@media (min-width:992px){table.download-table td.checksum>span>span.copy-target{width:344px}}@media (min-width:1200px){table.download-table td.checksum>span>span.copy-target{width:auto}} \ No newline at end of file +:root{--bs-font-sans-serif:-apple-system,"Segoe UI",roboto,"Helvetica Neue",arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--rc-color-primary:#37beff;--rc-color-header-background:#212529;--rc-color-banner-background:rgba(189, 234, 255, 0.5);--rc-color-background-alt:rgba(0, 0, 0, 0.05);--rc-color-download-bg:#1eb6ff;--rc-color-download-border:#13b2ff;--rc-color-thumbnail-background:rgba(0, 0, 0, 0.05);--rc-color-footer:#495057;--rc-color-footer-hover:#262a2d;--rc-color-success:#3fb950;--rc-color-error:#f85149}html[data-bs-theme=dark]{--rc-color-primary:#006a9d;--rc-color-header-background:#000;--rc-color-banner-background:rgba(0, 35, 52, 0.5);--rc-color-background-alt:rgba(255, 255, 255, 0.05);--rc-color-download-bg:#005984;--rc-color-download-border:#005279;--rc-color-thumbnail-background:rgba(255, 255, 255, 0.05);--rc-color-footer:#949da5;--rc-color-footer-hover:#bdc3c8}.navbar{--bs-navbar-toggler-focus-width:0;--bs-navbar-toggler-border-color:transparent;--bs-navbar-toggler-padding-x:0}.table{--bs-table-striped-bg:var(--rc-color-background-alt)}.bg-badge,.bg-quote{background-color:var(--rc-color-background-alt)!important}.bg-header,.bg-navbar,.modal-footer.bg-footer{background-color:var(--rc-color-header-background)!important}a.btn-link,a:not(.btn,.nav-link,.dropdown-item){text-decoration:none}a.btn-link.anchor,a:not(.btn,.nav-link,.dropdown-item).anchor{top:-6rem}a.btn-link:hover,a:not(.btn,.nav-link,.dropdown-item):hover{text-decoration:underline}.card-header{padding:.75rem 1.25rem}.card-body{padding:1.25rem}.list-group-item{padding:.75rem 1.25rem}#banner{margin-top:66px;background-color:var(--rc-color-banner-background)}#banner>.container>.grid{display:grid;grid-template-columns:auto;grid-template-rows:auto}#banner>.container>.grid>.logo{grid-column:1;grid-row:1}#banner>.container>.grid>.image{grid-column:1;grid-row:2}#banner>.container>.grid>.download{grid-column:1;grid-row:3}@media (min-width:768px){#banner>.container>.grid{grid-template-columns:1fr 1.5fr}#banner>.container>.grid>.logo{grid-column:1/3;grid-row:1}#banner>.container>.grid>.image{grid-column:2;grid-row:2}#banner>.container>.grid>.download{grid-column:1;grid-row:2}}@media (min-width:992px){#banner>.container>.grid{grid-template-columns:1fr 1fr;grid-template-rows:auto 1fr}#banner>.container>.grid>.logo{grid-column:1;grid-row:1}#banner>.container>.grid>.image{grid-column:2;grid-row:1/3}#banner>.container>.grid>.download{grid-column:1;grid-row:2}}main{padding-top:6rem}main .h1,main h1{font-size:2.2rem;margin-bottom:1rem}main .h2,main h2{font-size:1.8rem;margin-top:1.5rem;font-weight:700}main .h3,main h3{font-size:1.4rem;margin-top:1rem}blockquote{padding:.6rem 1rem;background-color:var(--rc-color-background-alt)}blockquote>p{margin:0}code.block{white-space:pre}a.anchor{color:var(--bs-secondary-color);font-size:.75rem;vertical-align:middle;opacity:0}a.anchor:hover{text-decoration:none!important}a.anchor::after{font:var(--fa-font-solid);content:"\f0c1"}:hover>a.anchor{opacity:1}button.copy-link{color:var(--bs-secondary-color);font-size:.75rem;display:inline-block;width:1.25em;text-align:center;margin-left:.5rem}button.copy-link:hover{text-decoration:none!important}button.copy-link::after{font:var(--fa-font-regular);content:"\f328"}button.copy-link.complete::after{font:var(--fa-font-solid);content:"\f00c";color:var(--rc-color-success)}button.copy-link.error::after{font:var(--fa-font-solid);content:"\f071";color:var(--rc-color-error)}button.copy-popover-link{color:var(--bs-body-color);text-decoration:none!important}button.copy-popover-link.checksum::after{font:var(--fa-font-solid);content:"\e4f0"}div.popover.copy-popover>div.popover-body{padding:0 var(--bs-popover-body-padding-x);display:flex}h1,h2,h3,p{scroll-margin-top:80px}.artical-list>.artical:nth-of-type(odd),ul.ul-striped li:nth-of-type(odd){background-color:var(--rc-color-background-alt)}.artical-list+nav{margin-top:2rem}footer ul,ul.screens{list-style:none}.artical>div.snippet>p{display:inline}footer a{font-weight:500;color:var(--rc-color-footer)}footer a:focus,footer a:hover{color:var(--rc-color-footer-hover)}.rc-icon::after,.rc-icon::before{font:var(--fa-font-solid)}.rc-icon::before{margin-right:.25rem}.rc-icon::after{margin-left:.25rem}a.back-link::before{content:"\f100"}a.read-link::after{content:"\f101"}a.external-link::after{content:"\f35d"}a.rss-link::after{content:"\f09e"}a.mail-list-link::before{font:var(--fa-font-regular);content:"\f0e0"}a.irc-link::after{content:"\f086"}a.dark-mode::before{content:"\f186"}a.light-mode::before{content:"\f185"}a.auto-mode::before{content:"\f72b"}a.current-theme::after{content:"\f00c"}.btn-rc-download{color:var(--bs-white)!important;background-color:var(--rc-color-primary);border-color:var(--rc-color-primary)}.btn-rc-download:hover{color:var(--bs-white);background-color:var(--rc-color-download-bg);border-color:var(--rc-color-download-border)}.btn-rc-download::before{margin-right:0;content:"\f019"}.btn-rc-download>span{margin-left:.5rem}.btn-rc-download.btn-sm>span{display:none}@media (min-width:992px){.btn-rc-download.btn-sm>span{display:inline}}div.color-modes>ul.dropdown-menu{min-width:auto}div.color-modes>ul.dropdown-menu>li>a{font-size:.8rem}div.color-modes>ul.dropdown-menu>li>a::before{text-align:center;width:1.25em;margin-right:.5em;display:inline-block}div.color-modes>ul.dropdown-menu>li>a::after{margin-left:.75em}.img-thumbnail>a{width:140px;background-color:var(--rc-color-thumbnail-background)}#viewer .modal-body{user-select:none}#viewer .modal-body>img{position:relative}#viewer .modal-body .modal-loading span{font-size:10em;opacity:.5}#viewer .modal-body .modal-arrow{position:absolute;display:block;top:0;bottom:0;height:100%;width:30%;cursor:default;background:0 0;border:0}#viewer .modal-body .modal-arrow.right-arrow{right:0}#viewer .modal-body.loading>img{display:none}#viewer .modal-body:not(.loading)>.modal-loading{display:none}#viewer .modal-footer{color:var(--bs-white)}#viewer .modal-footer .nav{user-select:none}#viewer .modal-footer .nav>.nav-link:not(.disabled){color:var(--bs-white)}table.download-table tbody td,table.download-table tbody th{vertical-align:middle}table.download-table td.link{width:60px}table.download-table td.size{width:80px}table.download-table td.checksum{font-size:.9em;width:40px}@media (min-width:768px){table.download-table th.package{width:255px}table.download-table td.checksum{width:auto}}@media (min-width:992px){table.download-table td.link{width:170px}table.download-table td.size{width:120px}}@media (min-width:768px){table.download-table td.checksum>span>span.copy-target{width:254px}}@media (min-width:992px){table.download-table td.checksum>span>span.copy-target{width:344px}}@media (min-width:1200px){table.download-table td.checksum>span>span.copy-target{width:auto}} \ No newline at end of file diff --git a/y_key_f7f60b3952eaecd0.html b/y_key_f7f60b3952eaecd0.html index 9cae5be..1573ff3 100644 --- a/y_key_f7f60b3952eaecd0.html +++ b/y_key_f7f60b3952eaecd0.html @@ -1,9 +1,9 @@ - - - - - - + + + +roundcube + + - - \ No newline at end of file + +