diff --git a/src/client/site/browse_page/mod_tile/mod_tile.jade b/src/client/site/browse_page/mod_tile/mod_tile.jade
index aa0138d6a..8f077439e 100644
--- a/src/client/site/browse_page/mod_tile/mod_tile.jade
+++ b/src/client/site/browse_page/mod_tile/mod_tile.jade
@@ -6,9 +6,12 @@
//-
.view__mod_tile
- a
- .left
- img
- .right
- p.title
- p.description
+ .tile
+ a
+ .left
+ img
+ .right
+ p.title
+ p.description
+
+ .view__mod_version_selector
\ No newline at end of file
diff --git a/src/client/site/browse_page/mod_tile/mod_tile.scss b/src/client/site/browse_page/mod_tile/mod_tile.scss
index c25808bee..1103488d8 100644
--- a/src/client/site/browse_page/mod_tile/mod_tile.scss
+++ b/src/client/site/browse_page/mod_tile/mod_tile.scss
@@ -6,48 +6,55 @@
//
.view__mod_tile {
- min-width : $size-minecraft-block * 9;
-
display: flex;
- a {
- @include floating-panel;
+ .tile {
flex: 1 1 auto;
- border : $size-border-medium solid $color-background-panel;
- color : $color-text;
- text-decoration : none;
+ @include floating-panel;
+ min-width : $size-minecraft-block * 9;
- display : flex;
- padding : $size-margin-medium;
+ display: flex;
+ flex-direction: column;
- & > .left {
- flex: 0 0 $size-minecraft-block * 4;
- margin-right: $size-margin-medium;
+ border : $size-border-medium solid $color-background-panel;
- img {
- width: $size-minecraft-block * 4;
- max-height: $size-minecraft-block * 4;
- }
- }
+ a {
+ flex: 1 1 auto;
+ color : $color-text;
+ text-decoration : none;
- & > .right {
- flex : 1 1 100%;
+ display : flex;
+ padding : $size-margin-medium;
- overflow : hidden;
+ & > .left {
+ flex: 0 0 $size-minecraft-block * 4;
+ margin-right: $size-margin-medium;
- .title {
- max-width: 0;
- margin-bottom : $size-margin-medium;
-
- font-family : $font-family-header;
- font-size : $font-size-xlarge;
+ img {
+ width: $size-minecraft-block * 4;
+ max-height: $size-minecraft-block * 4;
+ }
}
- .description {
- font-family : $font-family-text;
- font-size : $font-size-medium;
- line-height : $font-size-medium * 1.5;
+ & > .right {
+ flex : 1 1 100%;
+
+ overflow : hidden;
+
+ .title {
+ max-width: 0;
+ margin-bottom : $size-margin-medium;
+
+ font-family : $font-family-header;
+ font-size : $font-size-xlarge;
+ }
+
+ .description {
+ font-family : $font-family-text;
+ font-size : $font-size-medium;
+ line-height : $font-size-medium * 1.5;
+ }
}
}
@@ -55,13 +62,18 @@
background: $color-blue-faint;
border-color: $color-link-normal;
- & > .right {
+ & a > .right {
.title {
color: $color-link-normal;
text-decoration: underline;
}
}
}
+
+ .view__mod_version_selector {
+ margin: 0;
+ padding: $size-margin-small $size-margin-medium;
+ }
}
&.disabled {
diff --git a/src/client/site/browse_page/mod_tile/mod_tile_controller.coffee b/src/client/site/browse_page/mod_tile/mod_tile_controller.coffee
index 25c7e6e04..7a5dd6f8a 100644
--- a/src/client/site/browse_page/mod_tile/mod_tile_controller.coffee
+++ b/src/client/site/browse_page/mod_tile/mod_tile_controller.coffee
@@ -5,7 +5,8 @@
# All rights reserved.
#
-BaseController = require '../../base_controller'
+BaseController = require '../../base_controller'
+ModVersionSelectorController = require '../../common/mod_version_selector/mod_version_selector_controller'
########################################################################################################################
@@ -19,6 +20,8 @@ module.exports = class ModTileController extends BaseController
# BaseController Overrides #####################################################################
onDidRender: ->
+ @modVersionSelector = @addChild ModVersionSelectorController, '.view__mod_version_selector', model:@model
+
@$link = @$('a')
@$logoImage = @$('img')
@$title = @$('p.title')
diff --git a/src/client/site/common/mod_version_selector/mod_version_selector.jade b/src/client/site/common/mod_version_selector/mod_version_selector.jade
index 6d268d0f2..af77d0254 100644
--- a/src/client/site/common/mod_version_selector/mod_version_selector.jade
+++ b/src/client/site/common/mod_version_selector/mod_version_selector.jade
@@ -3,8 +3,7 @@
span.checkbox
span.label I have this mod in my modpack
.version
- span I'm using version:
+ span Version:
select
.warning.
- PLEASE NOTE: By selecting "no", crafting plans, search, and other features will ignore items
- and recipes from this mod.
+ PLEASE NOTE: Crafting plans, search, and other features will ignore items and recipes from this mod.