From c9a6d327110806d20877c477095238846a8d83bf Mon Sep 17 00:00:00 2001 From: Jesse Plamondon-Willard Date: Sat, 16 Jun 2018 01:11:13 -0400 Subject: update web UI to let players download from new Nexus page (#547) --- src/SMAPI.Web/Views/Index/Index.cshtml | 21 ++++++-- src/SMAPI.Web/wwwroot/Content/css/index.css | 55 ++++++++++++++++++++- .../Content/images/direct-download-icon.png | Bin 0 -> 250 bytes .../wwwroot/Content/images/nexus-icon.png | Bin 0 -> 927 bytes src/SMAPI.Web/wwwroot/Content/js/index.js | 25 +++++++++- 5 files changed, 95 insertions(+), 6 deletions(-) create mode 100644 src/SMAPI.Web/wwwroot/Content/images/direct-download-icon.png create mode 100644 src/SMAPI.Web/wwwroot/Content/images/nexus-icon.png (limited to 'src/SMAPI.Web') diff --git a/src/SMAPI.Web/Views/Index/Index.cshtml b/src/SMAPI.Web/Views/Index/Index.cshtml index 0f056ada..fbfc2239 100644 --- a/src/SMAPI.Web/Views/Index/Index.cshtml +++ b/src/SMAPI.Web/Views/Index/Index.cshtml @@ -3,9 +3,9 @@ } @model StardewModdingAPI.Web.ViewModels.IndexModel @section Head { - + - + }

@@ -15,10 +15,23 @@

- Download SMAPI @Model.StableVersion.Version
+
+ Download SMAPI @Model.StableVersion.Version
+
+ Download from Nexus + Direct download +
+

+ @if (Model.BetaVersion != null) { - Download SMAPI @Model.BetaVersion.Version
for Stardew Valley 1.3 beta
+
+ Download SMAPI @Model.BetaVersion.Version
for Stardew Valley 1.3 beta
+
+ Download from Nexus + Direct download +
+

} Player guide
diff --git a/src/SMAPI.Web/wwwroot/Content/css/index.css b/src/SMAPI.Web/wwwroot/Content/css/index.css index 6340ed87..514e1a5c 100644 --- a/src/SMAPI.Web/wwwroot/Content/css/index.css +++ b/src/SMAPI.Web/wwwroot/Content/css/index.css @@ -18,7 +18,8 @@ h1 { text-align: center; } -#call-to-action a { +#call-to-action a.main-cta, +#call-to-action a.secondary-cta { box-shadow: #caefab 0 1px 0 0 inset; background: linear-gradient(#77d42a 5%, #5cb811 100%) #77d42a; border-radius: 6px; @@ -40,6 +41,58 @@ h1 { text-shadow: #2b665e 0 1px 0; } +.cta-dropdown { + position: relative; + display: inline-block; + margin-bottom: 1em; +} + +.cta-dropdown a.download { + margin-bottom: 0 !important; +} + +.cta-dropdown .dropdown-content { + display: none; + position: absolute; + text-align: left; + box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2); + border: 1px solid #566963; + background: #5cb811; + border-top: 0; + border-radius: 0 0 6px 6px; + margin-top: -6px; + z-index: 1; +} + +.cta-dropdown .dropdown-content a:hover { + background-color: #ddd; +} + +.cta-dropdown .dropdown-content img { + width: 0.85em; + height: 0.85em; +} + +.cta-dropdown.secondary-cta-dropdown .dropdown-content a:hover { + background-color: #566963; +} + +.cta-dropdown.secondary-cta-dropdown .dropdown-content { + background-color: #768d87; + border-color: #566963; +} + +.cta-dropdown.secondary-cta-dropdown .dropdown-content a { + color: #fff; + text-shadow: #2b665e 0 1px 0; +} + +.cta-dropdown .dropdown-content a { + padding: 0.75em 1em; + text-decoration: none; + display: block; +} + /********* ** Subsections *********/ diff --git a/src/SMAPI.Web/wwwroot/Content/images/direct-download-icon.png b/src/SMAPI.Web/wwwroot/Content/images/direct-download-icon.png new file mode 100644 index 00000000..6c30ca36 Binary files /dev/null and b/src/SMAPI.Web/wwwroot/Content/images/direct-download-icon.png differ diff --git a/src/SMAPI.Web/wwwroot/Content/images/nexus-icon.png b/src/SMAPI.Web/wwwroot/Content/images/nexus-icon.png new file mode 100644 index 00000000..10c66712 Binary files /dev/null and b/src/SMAPI.Web/wwwroot/Content/images/nexus-icon.png differ diff --git a/src/SMAPI.Web/wwwroot/Content/js/index.js b/src/SMAPI.Web/wwwroot/Content/js/index.js index 016d5fa4..8fa1c26f 100644 --- a/src/SMAPI.Web/wwwroot/Content/js/index.js +++ b/src/SMAPI.Web/wwwroot/Content/js/index.js @@ -1,6 +1,7 @@ $(document).ready(function () { + /* enable pufferchick */ var pufferchick = $("#pufferchick"); - $(".download").hover( + $(".cta-dropdown").hover( function () { pufferchick.attr("src", "Content/images/pufferchick-cool.png"); }, @@ -8,4 +9,26 @@ $(document).ready(function () { pufferchick.attr("src", "favicon.ico"); } ); + + /* enable download dropdowns */ + $(".cta-dropdown a.download").each(function(i, button) { + button = $(button); + var wrapper = button.parent(".cta-dropdown"); + var button = wrapper.find(".download"); + var dropdownContent = wrapper.find(".dropdown-content"); + + $(window).on("click", function(e) { + var target = $(e.target); + + // toggle dropdown on button click + if (target.is(button) || $.contains(button.get(0), target.get(0))) { + e.preventDefault(); + dropdownContent.toggle(); + } + + // else hide dropdown + else + dropdownContent.hide(); + }); + }); }); -- cgit From f1bdafde238280b771abb1d74ae780b6b86bdc79 Mon Sep 17 00:00:00 2001 From: Jesse Plamondon-Willard Date: Sat, 16 Jun 2018 01:13:39 -0400 Subject: use sharper pufferchick images --- src/SMAPI.Web/Views/Index/Index.cshtml | 2 +- .../wwwroot/Content/images/pufferchick-cool.png | Bin 2921 -> 1099 bytes src/SMAPI.Web/wwwroot/Content/images/pufferchick.png | Bin 0 -> 831 bytes src/SMAPI.Web/wwwroot/Content/js/index.js | 2 +- 4 files changed, 2 insertions(+), 2 deletions(-) create mode 100644 src/SMAPI.Web/wwwroot/Content/images/pufferchick.png (limited to 'src/SMAPI.Web') diff --git a/src/SMAPI.Web/Views/Index/Index.cshtml b/src/SMAPI.Web/Views/Index/Index.cshtml index fbfc2239..8145d354 100644 --- a/src/SMAPI.Web/Views/Index/Index.cshtml +++ b/src/SMAPI.Web/Views/Index/Index.cshtml @@ -34,7 +34,7 @@

} Player guide
- +

Get help

diff --git a/src/SMAPI.Web/wwwroot/Content/images/pufferchick-cool.png b/src/SMAPI.Web/wwwroot/Content/images/pufferchick-cool.png index 63eb8970..f359146c 100644 Binary files a/src/SMAPI.Web/wwwroot/Content/images/pufferchick-cool.png and b/src/SMAPI.Web/wwwroot/Content/images/pufferchick-cool.png differ diff --git a/src/SMAPI.Web/wwwroot/Content/images/pufferchick.png b/src/SMAPI.Web/wwwroot/Content/images/pufferchick.png new file mode 100644 index 00000000..1de9cf47 Binary files /dev/null and b/src/SMAPI.Web/wwwroot/Content/images/pufferchick.png differ diff --git a/src/SMAPI.Web/wwwroot/Content/js/index.js b/src/SMAPI.Web/wwwroot/Content/js/index.js index 8fa1c26f..d0734b02 100644 --- a/src/SMAPI.Web/wwwroot/Content/js/index.js +++ b/src/SMAPI.Web/wwwroot/Content/js/index.js @@ -6,7 +6,7 @@ $(document).ready(function () { pufferchick.attr("src", "Content/images/pufferchick-cool.png"); }, function () { - pufferchick.attr("src", "favicon.ico"); + pufferchick.attr("src", "Content/images/pufferchick.png"); } ); -- cgit From dc27247b28097a992694fcb7a72133ae4e56e27b Mon Sep 17 00:00:00 2001 From: Jesse Plamondon-Willard Date: Sat, 16 Jun 2018 01:32:52 -0400 Subject: add section anchors for links from Nexus (#547) --- src/SMAPI.Web/Views/Index/Index.cshtml | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) (limited to 'src/SMAPI.Web') diff --git a/src/SMAPI.Web/Views/Index/Index.cshtml b/src/SMAPI.Web/Views/Index/Index.cshtml index 8145d354..411448fa 100644 --- a/src/SMAPI.Web/Views/Index/Index.cshtml +++ b/src/SMAPI.Web/Views/Index/Index.cshtml @@ -37,7 +37,7 @@ -

Get help

+

Get help