diff --git a/assets/js/application.js b/assets/js/application.js index 68c7357aaa..1d156b0ec2 100644 --- a/assets/js/application.js +++ b/assets/js/application.js @@ -60,28 +60,15 @@ var DownloadBox = { $('#gui-os-filter').addClass('visible'); var os = window.session.browser.os; // Mac, Win, Linux if(os == "Mac") { - $(".monitor").addClass("mac"); - $("#download-link").text("Download for Mac").attr("href", `${baseURLPrefix}install/mac`); - $("#gui-link").removeClass('mac').addClass('gui'); - $("#gui-link").text("Mac GUIs").attr("href", `${baseURLPrefix}downloads/guis?os=mac`); + $("#download-link").text("Install for Mac").attr("href", `${baseURLPrefix}install/mac`); $("#gui-os-filter").attr('data-os', 'mac'); $("#gui-os-filter").text("Only show GUIs for my OS (Mac)") } else if (os == "Windows") { - $(".monitor").addClass("windows"); - $("#download-link").text("Download for Windows").attr("href", `${baseURLPrefix}install/windows`); - $("#gui-link").removeClass('mac').addClass('gui'); - $("#gui-link").text("Windows GUIs").attr("href", `${baseURLPrefix}downloads/guis?os=windows`); - $("#alt-link").removeClass("windows").addClass("mac"); - $("#alt-link").text("Mac Build").attr("href", `${baseURLPrefix}install/mac`); + $("#download-link").text("Install for Windows").attr("href", `${baseURLPrefix}install/windows`); $("#gui-os-filter").attr('data-os', 'windows'); $("#gui-os-filter").text("Only show GUIs for my OS (Windows)") } else if (os == "Linux") { - $(".monitor").addClass("linux"); - $("#download-link").text("Download for Linux").attr("href", `${baseURLPrefix}install/linux`); - $("#gui-link").removeClass('mac').addClass('gui'); - $("#gui-link").text("Linux GUIs").attr("href", `${baseURLPrefix}downloads/guis?os=linux`); - $("#alt-link").removeClass("windows").addClass("mac"); - $("#alt-link").text("Mac Build").attr("href", `${baseURLPrefix}install/mac`); + $("#download-link").text("Install for Linux").attr("href", `${baseURLPrefix}install/linux`); $("#gui-os-filter").attr('data-os', 'linux'); $("#gui-os-filter").text("Only show GUIs for my OS (Linux)") } else { diff --git a/assets/sass/dark-mode.scss b/assets/sass/dark-mode.scss index 3997a0a193..ff9d4eb6d7 100644 --- a/assets/sass/dark-mode.scss +++ b/assets/sass/dark-mode.scss @@ -108,14 +108,6 @@ @include box-shadow(none); } - div.monitor { - filter: brightness(.85); - } - - .monitor a { - color: #dbd7d7; - } - hr.sidebar { filter: brightness(0.5); } diff --git a/assets/sass/front-page.scss b/assets/sass/front-page.scss index 97dc12dfa9..78d3ba3eee 100644 --- a/assets/sass/front-page.scss +++ b/assets/sass/front-page.scss @@ -18,7 +18,7 @@ ul { @extend .unstyled !optional; - padding-top: 24px; + padding-top: 6px; display: flex; flex-direction: row; flex-wrap: wrap; @@ -99,106 +99,87 @@ } } -$monitor-width: 313px; -$monitor-height: 271px; - #front-downloads { float: right; - width: 313px; + width: 295px; position: relative; - .monitor { - position: absolute; - top: 0; - right: -12px; - } - - table { - position: absolute; - top: $monitor-height; - left: 24px; + .downloads-box { + padding: 20px; + background: var(--versions-footer-bg-color); + outline: 1px solid #f0c8bb; - td { - padding: 8px 20px 6px 0; - min-width: 145px; + :root[data-theme="dark"] & { + outline-color: var(--orange); } - - a { - font-weight: bold; + border-radius: 4px; + position: relative; + + &::before { + content: ''; + position: absolute; + top: 15px; + left: 15px; + width: 80px; + height: 80px; + background: url('#{$baseurl}images/logos/downloads/Git-Icon-1788C.png') no-repeat; + background-size: contain; + opacity: 0.55; } } -} -.monitor { - @include background-image-2x($baseurl + "images/monitor-default", $monitor-width, $monitor-height); - width: $monitor-width - 40; - height: $monitor-height - 45; - padding-top: 45px; - padding-left: 40px; - color: var(--main-bg); - text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.2); + .release-info { + margin-bottom: 18px; + padding: 0 0 18px 100px; + border-bottom: 1px solid var(--base-border-color); - h4 { - font-weight: normal; - color: var(--main-bg); - font-size: 16px; - } + h4 { + font-weight: normal; + font-size: 16px; + } - span.version { - display: block; - margin-bottom: 6px; - font-size: 28px; - font-weight: bold; - } + .version { + display: block; + margin-bottom: 6px; + font-size: 28px; + font-weight: bold; + } - a { - color: #eee; - font-size: 12px; - text-decoration: underline; - } + a { + font-size: 12px; + text-decoration: underline; + } - span.release-date { - font-size: 12px; + time { + font-size: 12px; + } } a.button { - @include border-radius(2px); - @include box-shadow(0 1px 0 #148a92); - display: block; - width: 224px; - padding: 5px 0; - margin-top: 10px; - font-size: 16px; - color: var(--main-bg); - text-align: center; - background-image: linear-gradient(#1c868c, #186368); - border-top: solid 1px #085e64; - border-right: solid 1px #1f6367; - border-bottom: solid 1px #134143; - border-left: solid 1px #1f6367; - transition-duration: 0.3s; - transition-property: background-image; + display: flex; + align-items: center; + justify-content: center; + gap: 8px; + padding: 12px 16px; text-decoration: none; - - &:hover { - background-image: linear-gradient(#1a7e84, #165b60); - } - } - - &.mac { - @include background-image-2x($baseurl + "images/monitor-mac", $monitor-width, $monitor-height); - width: $monitor-width - 40; - height: $monitor-height - 36; - padding-top: 36px; - padding-left: 40px; + border-radius: 6px; + font-weight: bold; + transition: all 0.2s; } - &.windows { - @include background-image-2x($baseurl + "images/monitor-windows", $monitor-width, $monitor-height); + #download-link { + background: var(--orange); + margin-bottom: 10px; + color: white; } - &.linux { - @include background-image-2x($baseurl + "images/monitor-linux", $monitor-width, $monitor-height); + .github-link { + background: transparent; + color: var(--font-color); + border: 1px solid var(--base-border-color); + font-weight: normal; + font-size: 13px; + padding: 10px 16px; } } @@ -258,80 +239,41 @@ $monitor-height: 271px; } } -a.icon { - display: inline-block; - height: 30px; - padding-left: 30px; - line-height: 36px; - - &.gui { - @include background-image-2x($baseurl + "images/icons/gui", 18px, 24px, 6px 3px); - } - - &.older-releases { - @include background-image-2x($baseurl + "images/icons/box", 22px, 20px, 0 6px); - } - - &.windows { - @include background-image-2x($baseurl + "images/icons/windows", 24px, 21px, 0 6px); - } - - &.mac { - @include background-image-2x($baseurl + "images/icons/apple", 17px, 21px, 5px 4px); - } - - &.linux { - @include background-image-2x($baseurl + "images/icons/linux", 17px, 21px, 6px 6px); - } - - &.source { - @include background-image-2x($baseurl + "images/icons/source-code", 25px, 20px, 0 6px); - } -} - - - // Breakpoint ---------------- @media (max-width: $default) { #front-content { display: flex; + #front-navigation { width: 50%; + #front-nav { ul { padding: 0 1rem 0 0; + li { margin-bottom: 1rem !important; margin-right: 0 !important; } } } + #front-book { width: unset; } } + #front-downloads { - width: 50%; - .monitor { - @include center-transformX; - } - table{ - @include center-transformX; - tbody, tr { - display: flex; - flex-direction: column; - } - td { - margin-bottom: 1rem; - a { padding-left: 2.3rem; } - } - } + width: calc(50% - 20px); + padding-left: 20px; } } + #companies-projects { ul { // TODO } + li { // TODO } @@ -340,30 +282,41 @@ a.icon { // Mobile @media (max-width: $mobile-m) { - #front-content{ + #front-content { flex-direction: column-reverse; - #front-navigation, #front-downloads { + + #front-navigation, + #front-downloads { width: 100%; border-right: none; } + + #front-downloads { + padding-left: 0; + } + #front-navigation { - #front-nav { + #front-nav { ul { padding: 0 1rem; } } + #front-book { @include flex-center; align-items: center; } } + #front-downloads { border-bottom: 1px solid var(--base-border-color); margin-bottom: 2rem; padding-bottom: 1rem; - .monitor, table { + + table { position: relative; } + table { top: 0; } diff --git a/layouts/partials/monitor.html b/layouts/partials/monitor.html deleted file mode 100644 index 2ec7c6da24..0000000000 --- a/layouts/partials/monitor.html +++ /dev/null @@ -1,16 +0,0 @@ -
- -

Latest source Release

- - - {{ .Site.Params.latest_version }} - - - Release Notes - - ({{ .Site.Params.latest_release_date }}) - - - - Download Source Code -
diff --git a/layouts/partials/site-root.html b/layouts/partials/site-root.html index 8362e0e1e0..66f2c9070a 100644 --- a/layouts/partials/site-root.html +++ b/layouts/partials/site-root.html @@ -57,17 +57,22 @@

Community

- {{ partialCached "monitor.html" . }} - - - - - - - - - -
Graphical UIsTarballs
Windows BuildSource Code
+
+
+

Latest source release

+ {{ .Site.Params.latest_version }} + Release Notes + +
+ + + Install + + + + GitHub Repository + +
diff --git a/layouts/shortcodes/monitor.html b/layouts/shortcodes/monitor.html deleted file mode 100644 index a2956ec9c4..0000000000 --- a/layouts/shortcodes/monitor.html +++ /dev/null @@ -1 +0,0 @@ -{{ partialCached "monitor.html" . }} diff --git a/static/images/monitor-default.png b/static/images/monitor-default.png deleted file mode 100644 index 65f0f747c2..0000000000 Binary files a/static/images/monitor-default.png and /dev/null differ diff --git a/static/images/monitor-default@2x.png b/static/images/monitor-default@2x.png deleted file mode 100644 index 2f438f1180..0000000000 Binary files a/static/images/monitor-default@2x.png and /dev/null differ diff --git a/static/images/monitor-linux.png b/static/images/monitor-linux.png deleted file mode 100644 index 33f2cf0b11..0000000000 Binary files a/static/images/monitor-linux.png and /dev/null differ diff --git a/static/images/monitor-linux@2x.png b/static/images/monitor-linux@2x.png deleted file mode 100644 index 8adadb297d..0000000000 Binary files a/static/images/monitor-linux@2x.png and /dev/null differ diff --git a/static/images/monitor-mac.png b/static/images/monitor-mac.png deleted file mode 100644 index dec96b1fe9..0000000000 Binary files a/static/images/monitor-mac.png and /dev/null differ diff --git a/static/images/monitor-mac@2x.png b/static/images/monitor-mac@2x.png deleted file mode 100644 index 261afc6db5..0000000000 Binary files a/static/images/monitor-mac@2x.png and /dev/null differ diff --git a/static/images/monitor-windows.png b/static/images/monitor-windows.png deleted file mode 100644 index 85ff370e38..0000000000 Binary files a/static/images/monitor-windows.png and /dev/null differ diff --git a/static/images/monitor-windows@2x.png b/static/images/monitor-windows@2x.png deleted file mode 100644 index e5e2afbe83..0000000000 Binary files a/static/images/monitor-windows@2x.png and /dev/null differ