Skip to content

Commit

Permalink
some style updates
Browse files Browse the repository at this point in the history
  • Loading branch information
@leafo
leafo committed Aug 24, 2018
1 parent 0ffca5b commit 9ddd8dc
Show file tree
Hide file tree
Showing 5 changed files with 100 additions and 84 deletions.
24 changes: 4 additions & 20 deletions static/scss/include/common.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ $lua_blue: #00257A; // color of lua logo
$back_color: lighten($lua_blue, 73%);
$header_color: lighten(desaturate($lua_blue, 60%), 5%);
$button_color: #637393;
$site_width: 800px;
$site_width: 960px;
$link_color: #008FEE;
$button_height: 35px;
$red_button_color: #EE004F;
Expand Down Expand Up @@ -31,21 +31,9 @@ $button_color: $link_color;
user-select: none;
}

@mixin grid_width($size, $divisions: 8, $gutter: 10px) {
width: #{floor($size * (($site_width - (($divisions - 1) * $gutter)) / $divisions) + ($size - 1) * $gutter)};
}

@mixin grid_cell($size, $divisions: 8, $gutter: 10px) {
display: inline-block;
vertical-align: top;
font-size: $base_font_size;

@include grid_width($size, $divisions, $gutter);
margin-right: $gutter;

&:last-child, &.last {
margin-right: 0;
}
@mixin site_width {
max-width: $site_width;
min-width: 800px;
}

@mixin single_line {
Expand All @@ -56,13 +44,9 @@ $button_color: $link_color;

@mixin border_box {
box-sizing: border-box;
-moz-box-sizing: border-box;
}

@mixin transition($args...) {
-webkit-transition: $args;
-moz-transition: $args;
-ms-transition: $args;
transition: $args;
}

Expand Down
87 changes: 43 additions & 44 deletions static/scss/main.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -99,41 +99,37 @@ hr {
color: white;

.header_inner {
width: $site_width;
@include site_width;
margin: 0 auto;
}

h1 {
display: inline-block;
vertical-align: middle;

letter-spacing: 0.025em;
margin: 0;
font-size: 22px;
font-weight: normal;
height: 100%;
display: flex;
align-items: center;

> * {
margin: 0 15px;
&:last-child {
margin-right: 0;
}

a {
color: desaturate(lighten($header_color, 70%), 50%);
&:hover {
text-decoration: none;
&:first-child {
margin-left: 0;
}
}
}

.header_search {
display: inline-block;
margin-left: 15px;
vertical-align: middle;
margin-top: 10px;
flex: 1;
max-width: 400px;

input[type=text] {
border: 0;
width: 200px;
font-size: 14px;
padding: 8px 10px;
border-radius: 4px;
background: $back_color;
color: #666;
width: 100%;
box-sizing: border-box;

&:focus {
outline: none;
Expand All @@ -144,46 +140,53 @@ hr {
}

.user_panel {
float: right;
font-size: $small_font_size;
margin-top: 18px;
line-height: normal;
flex: 1;
text-align: right;
display: flex;
justify-content: flex-end;
align-content: center;

> * {
margin-left: 12px;
&:first-child {
margin-left: 0;
}
}

.unread_notifications {
background: white;
display: inline-block;
vertical-align: 0px;
height: 22px;
line-height: 22px;
color: $link_color;
padding: 0 8px;

margin-right: 10px;
border-radius: 18px;
&:hover {
color: $link_color;
}
}

a {
color: lighten($link_color, 30%);
text-decoration: none;
font-weight: bold;

&:hover {
color: lighten($link_color, 50%);
}
}
}

.text_logo {
width: 150px;
display: inline-block;
vertical-align: top;
margin-top: 13px;
}

.icon_logo {
display: inline-block;
vertical-align: top;
width: 45px;
height: 45px;
margin-top: 4px;
}

a {
color: lighten($link_color, 30%);
text-decoration: none;
&:hover {
text-decoration: underline;
}
margin-top: 2px;
}
}

Expand All @@ -194,14 +197,10 @@ hr {
.content {
background: $back_color;
border-bottom: 1px solid $light_border_color;

h2, h3, h4 {
font-weight: normal;
}
}

.main_column {
width: $site_width;
@include site_width;
margin: 0 auto;
padding-bottom: 40px;
}
Expand Down
40 changes: 35 additions & 5 deletions static/scss/pages/index.scss
View file
Original file line number Diff line number Diff line change
@@ -1,11 +1,41 @@
.home_columns {
font-size: 0;
display: flex;
> * {
width: 50%;
margin-right: 5px;
margin-left: 5px;

.column {
@include grid_cell(4);
&:last-child {
margin-right: 0;
}

h2 {
margin-top: 0;
&:first-child {
margin-left: 0;
}
}

.split_header {
margin: 0 0 20px 0;
}
}



.split_header {
display: flex;
align-items: center;
margin: 40px 0 20px 0;

h2 {
margin-top: 0;
margin-bottom: 0;
}

> * {
margin-right: 10px;

&:last-child {
margin-right: 0;
}
}
}
Expand Down
16 changes: 9 additions & 7 deletions views/index.moon
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,8 +17,8 @@ class Index extends require "widgets.page"

div class: "home_columns", ->
div class: "column", ->
h2 ->
text "Recent Modules"
div class: "split_header", ->
h2 "Recent Modules"
text " "
span class: "header_sub", ->
text "("
Expand All @@ -29,9 +29,10 @@ class Index extends require "widgets.page"

@render_modules @recent_modules

div class: "column last", ->
h2 ->
text "Most Downloaded"
div class: "column", ->
div class: "split_header", ->
h2 "Most Downloaded"
text " "
span class: "header_sub", ->
text "("
a href: @url_for("popular_this_week"), "This week"
Expand All @@ -46,8 +47,9 @@ class Index extends require "widgets.page"
text ", " unless i == 1
a href: @url_for("label",label: l.name), l.name

h2 ->
text "Daily Module Downloads"
div class: "split_header", ->
h2 "Daily Module Downloads"
text " "
span class: "header_sub", ->
text "("
a href: @url_for("stats"), "More graphs & stats"
Expand Down
17 changes: 9 additions & 8 deletions views/layout.moon
View file
Original file line number Diff line number Diff line change
Expand Up @@ -47,7 +47,6 @@ class Layout extends Widget
div class: "content", ->
div class: "header", ->
div class: "header_inner", ->
@user_panel!
a href: @url_for"index", ->
if @current_user
img class: "icon_logo", alt: "LuaRocks", src: "/static/header_luarocks_icon.svg"
Expand All @@ -57,6 +56,8 @@ class Layout extends Widget
form class: "header_search", action: @url_for("search"), method: "GET", ->
input type: "text", name: "q", placeholder: "Search modules or uploaders...", value: @params.q

@user_panel!

@content_for "inner"

div class: "footer", ->
Expand Down Expand Up @@ -93,27 +94,27 @@ class Layout extends Widget

user_panel: =>
div class: "user_panel", ->
if @current_user and @current_user\get_unseen_notifications_count! > 0
if @current_user and true -- @current_user\get_unseen_notifications_count! > 0
a href: @url_for("notifications"), title: "notifications", class: "unread_notifications",
@current_user\get_unseen_notifications_count!

a href: "https://github.com/luarocks/luarocks/wiki/Download", "Install"
raw " · "
text " "
a href: "https://github.com/luarocks/luarocks/wiki/Documentation", "Docs"
raw " · "
text " "

if @current_user
a href: @url_for("user_profile", user: @current_user), class: "login", -> b @current_user\name_for_display!
raw " · "
text " "
a href: @url_for"upload_rockspec", "Upload"
raw " · "
text " "
a href: @url_for"user_settings.profile", "Settings"
raw " · "
text " "
a href: @url_for"user_logout", "Log Out"
else
login_params = { return_to: @params.return_to, intent: @params.intent }
a href: @url_for("user_login", nil, login_params), "Log In"
raw " · "
text " "
a href: @url_for("user_register", nil, login_params), "Register"


0 comments on commit 9ddd8dc

Please sign in to comment.