From 6f2863055b8e7120aba33eaace1dca09d212d50b Mon Sep 17 00:00:00 2001 From: Byron Date: Thu, 6 Oct 2011 01:34:46 -0600 Subject: search form, ask button, sort bar and some sidebar styles --- askbot/skins/default/media/images/bigbutton.png | Bin 0 -> 263 bytes .../skins/default/media/images/bigbuttonhover.png | Bin 0 -> 236 bytes .../default/media/images/contributorsback.png | Bin 0 -> 714 bytes .../skins/default/media/images/feed-icon-small.png | Bin 689 -> 669 bytes .../media/images/sprites_source/sprites.svg | 329 +++++++++++++- .../default/media/images/summary-background.png | Bin 0 -> 291 bytes askbot/skins/default/media/js/live_search.js | 2 +- askbot/skins/default/media/style/lib_style.less | 4 +- askbot/skins/default/media/style/style.css | 495 ++++++++++++--------- .../default/templates/blocks/secundary_header.html | 24 +- .../default/templates/blocks/tag_selector.html | 2 +- .../default/templates/main_page/headline.html | 6 - .../skins/default/templates/main_page/sidebar.html | 6 +- .../skins/default/templates/main_page/tab_bar.html | 9 +- 14 files changed, 635 insertions(+), 242 deletions(-) create mode 100644 askbot/skins/default/media/images/bigbutton.png create mode 100644 askbot/skins/default/media/images/bigbuttonhover.png create mode 100644 askbot/skins/default/media/images/contributorsback.png mode change 100755 => 100644 askbot/skins/default/media/images/feed-icon-small.png create mode 100644 askbot/skins/default/media/images/summary-background.png diff --git a/askbot/skins/default/media/images/bigbutton.png b/askbot/skins/default/media/images/bigbutton.png new file mode 100644 index 00000000..2a7c0f05 Binary files /dev/null and b/askbot/skins/default/media/images/bigbutton.png differ diff --git a/askbot/skins/default/media/images/bigbuttonhover.png b/askbot/skins/default/media/images/bigbuttonhover.png new file mode 100644 index 00000000..cf4bacca Binary files /dev/null and b/askbot/skins/default/media/images/bigbuttonhover.png differ diff --git a/askbot/skins/default/media/images/contributorsback.png b/askbot/skins/default/media/images/contributorsback.png new file mode 100644 index 00000000..dd728383 Binary files /dev/null and b/askbot/skins/default/media/images/contributorsback.png differ diff --git a/askbot/skins/default/media/images/feed-icon-small.png b/askbot/skins/default/media/images/feed-icon-small.png old mode 100755 new mode 100644 index b3c949d2..2794b0f5 Binary files a/askbot/skins/default/media/images/feed-icon-small.png and b/askbot/skins/default/media/images/feed-icon-small.png differ diff --git a/askbot/skins/default/media/images/sprites_source/sprites.svg b/askbot/skins/default/media/images/sprites_source/sprites.svg index 5591260e..34898e30 100644 --- a/askbot/skins/default/media/images/sprites_source/sprites.svg +++ b/askbot/skins/default/media/images/sprites_source/sprites.svg @@ -18,6 +18,18 @@ sodipodi:docname="sprites.svg"> + + + + @@ -137,6 +149,105 @@ fx="-2600.8416" fy="2819.7468" r="16.18819" /> + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + ASK A QUESTION + ASK A QUESTION + + + + + + + + + + + diff --git a/askbot/skins/default/media/images/summary-background.png b/askbot/skins/default/media/images/summary-background.png new file mode 100644 index 00000000..58c3855a Binary files /dev/null and b/askbot/skins/default/media/images/summary-background.png differ diff --git a/askbot/skins/default/media/js/live_search.js b/askbot/skins/default/media/js/live_search.js index f9f03453..1a46e338 100644 --- a/askbot/skins/default/media/js/live_search.js +++ b/askbot/skins/default/media/js/live_search.js @@ -15,7 +15,7 @@ var liveSearch = function(){ query.attr('class', 'searchInputCancelable'); x_button = $(''); //x_button.click(reset_query); - x_button.val('x'); + x_button.val('X'); x_button.click( function(){ query.val(''); diff --git a/askbot/skins/default/media/style/lib_style.less b/askbot/skins/default/media/style/lib_style.less index 655156ae..d1424137 100644 --- a/askbot/skins/default/media/style/lib_style.less +++ b/askbot/skins/default/media/style/lib_style.less @@ -5,7 +5,8 @@ @header-color:#16160f; @link:#1b79bd; -@question-link:#FF0000; +@question-link:#464646; +@button-label:#4a757f; /* Receive exactly positions for background Sprite */ @@ -13,6 +14,7 @@ background:@hor @vert @back; } + /* CSS3 Elements */ .box-shadow (@hor: 0px, @vert: 0px, @blur: 5px, @shadow: #929292){ diff --git a/askbot/skins/default/media/style/style.css b/askbot/skins/default/media/style/style.css index 983daf06..f22f6a2b 100644 --- a/askbot/skins/default/media/style/style.css +++ b/askbot/skins/default/media/style/style.css @@ -303,39 +303,47 @@ h1 { border-bottom:#d3d3c2 1px solid; margin-bottom:10px; - a{ - display:block; - float:left; - } #home-button{ - border-right:#afaf9e 1px solid; + border-right:#afaf9e 1px solid; .sprites(-6px,-36px); height:55px; width:43px; + display:block; + float:left; } + #home-button:hover{ .sprites(-6px-45,-36px); } - - .scope-selector{ - font-size:21px; - color:#5a5a4b; - height:55px; - line-height:55px; - margin-left:24px - } - .on{ - background:url(../images/scopearrow.png) no-repeat center bottom; + + #scope-wrapper{ + width:688px; + float:left; + + a{ + display:block; + float:left; + } + + .scope-selector{ + font-size:21px; + color:#5a5a4b; + height:55px; + line-height:55px; + margin-left:24px + } + .on{ + background:url(../images/scopearrow.png) no-repeat center bottom; + } } } - #searchBar { display:inline-block; background-color: #fff; - width:400px; + width:412px; border: 1px solid #c9c9b5; - float:left; + float:right; height:42px; margin:6px 0px 0px 15px; @@ -350,11 +358,11 @@ h1 { } .searchInput, .searchInputCancelable { - width: 342px; + width: 352px; } .searchInputCancelable { - width: 307px; + width: 317px; } .searchBtn { @@ -393,18 +401,39 @@ h1 { } } +#ask-button{ + background: url(../images/bigbutton.png) repeat-x bottom; + line-height:44px; + text-align:center; + width:200px; + height:42px; + font-size:23px; + color:@button-label; + margin-top:7px; + float:right; + text-transform:uppercase; + .rounded-corners(5px); + .box-shadow(1px, 1px, 2px, #636363) +} + +#ask-button:hover{ + text-decoration:none; + background: url(../images/bigbutton.png) repeat-x top; + .text-shadow(0px, 1px, 0px, #c6d9dd) +} + /* ----- Content layout ----- */ #ContentLeft { - width: 710px; + width: 730px; float: left; position: relative; } #ContentRight { - width: 230px; + width: 200px; float: right; - padding: 0 5px 10px 5px; + padding: 0 0px 10px 0px; } #ContentFull { @@ -412,82 +441,72 @@ h1 { width: 950px; } +/* ----- Sidebar Widgets Box ----- */ -.users-page h1, .tags-page h1 { - float: left; -} - -.main-page h1 { - margin-right: 5px; -} - - - - - - - +.box { + background: #fff; + padding: 10px 0px 0px 0px; -#ground { - width: 100%; - clear: both; - border-top: 1px solid #000; - padding: 6px 0 0 0; - text-align: center; - background: #777; -} -#ground p { - margin-bottom:0; -} + p { + margin-bottom: 4px; + } + p.info-box-follow-up-links { + text-align: right; + margin: 0; + } + h2 { + padding-left: 0; + background:#eceeeb; + height:30px; + line-height:30px; + text-align:right; + font-size:24px; + font-weight:normal; + color:#656565; + padding-right:10px; + margin-bottom:10px; + } + h3{ + color:#4a757f; + font-size:18px; + text-align:left; + font-weight:normal; + } + .contributorback{ + background: #eceeeb url(../images/contributorsback.png) no-repeat center left; + } -img.license-logo { - margin: 6px 0 10px 0; -} + label { + color: #333; + } + ul { + margin-left: 15px; + } -#askFormBar { - display:inline-block; - background-color: #e3e3e3;/*888a85; /*#e9b96e;*/ - border: 1px solid #aaaaaa; - padding: 4px 7px 5px 5px; -} -#askFormBar p { - width: 685px; - margin:0 0 5px 0; -} -#askFormBar .questionTitleInput { - font-size: 24px; - line-height: 24px; - height: 36px; - width: 680px; - margin: 0px; - padding: 5px 0 0 5px; + li { + list-style-type: disc; + font-size: 13px; + line-height: 20px; + margin-bottom: 10px; + } + ul.tags { + list-style: none; + margin: 0; + padding: 0; + line-height: 170%; + display: block; + } } -#question-list { - float: left; - position: relative; - background-color: #FFF; - padding: 0; - width: 100%; +img.gravatar { + margin:1px; } -.ask-page div#question-list { - float: none; - width: 706px; -} -.ask-page div#question-list h2 { - font-size: 14px; - padding-bottom: 0; -} -.ask-page div#question-list span { - padding: 3px 7px; - margin-right: 5px; - background: #ccc; -} +/* ----- Tags Styles ----- */ /* tag formatting is also copy-pasted in template because it must be the same in the emails @@ -528,7 +547,6 @@ img.license-logo { } ul.tags, -.boxC ul.tags, ul.tags.marked-tags, ul#related-tags { list-style: none; @@ -557,6 +575,7 @@ ul.tags.marked-tags li, #tagSelector div.inputs { clear: both; float: none; + margin-bottom:10px; } .tags-page ul.tags li, @@ -618,6 +637,78 @@ ul#related-tags li { text-decoration: none; } + +.users-page h1, .tags-page h1 { + float: left; +} + +.main-page h1 { + margin-right: 5px; +} + +#ground { + width: 100%; + clear: both; + border-top: 1px solid #000; + padding: 6px 0 0 0; + text-align: center; + background: #777; +} + +#ground p { + margin-bottom:0; +} + + + +img.license-logo { + margin: 6px 0 10px 0; +} + + +#askFormBar { + display:inline-block; + background-color: #e3e3e3;/*888a85; /*#e9b96e;*/ + border: 1px solid #aaaaaa; + padding: 4px 7px 5px 5px; +} +#askFormBar p { + width: 685px; + margin:0 0 5px 0; +} +#askFormBar .questionTitleInput { + font-size: 24px; + line-height: 24px; + height: 36px; + width: 680px; + margin: 0px; + padding: 5px 0 0 5px; +} + +#question-list { + float: left; + position: relative; + background-color: #FFF; + padding: 0; + width: 100%; +} + +.ask-page div#question-list { + float: none; + width: 706px; +} +.ask-page div#question-list h2 { + font-size: 14px; + padding-bottom: 0; +} +.ask-page div#question-list span { + padding: 3px 7px; + margin-right: 5px; + background: #ccc; +} + + + span.delete-icon { padding-left: 13px; vertical-align: bottom; @@ -652,21 +743,117 @@ ul#search-tags { padding-top: 3px; } +/* ----- Sorting top Tab ------*/ + +.tabBar { + background-color: #eff5f6; + height: 30px; + width: 412px; + clear: both; + margin-bottom: 3px; + margin-top: 3px; + float:right; + font-family:Georgia; + font-size:16px; + .rounded-corners(5px); +} + +.tabBar h2 { + float: left; +} + +.tabsA, .tabsC { + float: right; + position: relative; + display: block; + height: 20px; +} + +/* tabsA - used for sorting */ +.tabsA { float: right; } +.tabsC { float: left; } + +.tabsA a, .tabsC a{ + + border-left: 1px solid #d0e1e4; + color: #8b1717; + display: block; + float: left; + height: 20px; + line-height: 20px; + padding:4px 7px 4px 7px; + text-decoration: none; +} + +.tabsA a.on, .tabsC a.on, .tabsA a:hover, .tabsC a:hover { + color: #C22828; +} + +.tabsA a.rev.on, tabsA a.rev.on:hover { +} + + + +.tabsA .label, .tabsC .label { + float: left; + color: #646464; + margin-top:4px; + margin-right:5px; +} + +.tabsB a { + background: #eee; + border: 1px solid #eee; + color: #777; + display: block; + float: left; + height: 22px; + line-height: 28px; + margin: 5px 0px 0 4px; + padding: 0 11px 0 11px; + text-decoration: none; +} + +.rss { + float: right; + font-size: 16px; + color: #f57900 !important; + margin: 1px 8px 0 0; + width:45px; + padding-left: 16px; + padding-top:3px; + background: url(../images/feed-icon-small.png) no-repeat center right; +} + +.rss:hover { + color: #F4A731 !important; +} + + +/* ----- Question list ----- */ + .short-summary { position: relative; filter: inherit; - padding: 5px 2px 5px 2px; - border-top: 1px dashed #ccccce; + padding: 10px; + border-bottom: 1px solid #DDDBCE; + margin-bottom:1px; overflow: hidden; - width: 702px; + width: 710px; float: left; + background: url(../images/summary-background.png) repeat-x; } .short-summary h2 { - font-size: 21px; + font-size: 22px; font-weight:normal; } +.short-summary a { + color:@question-link; +} + + .short-summary .userinfo .relativetime, .short-summary .userinfo a, .short-summary span.anonymous { @@ -790,29 +977,7 @@ ul#search-tags { text-decoration: underline; } -.boxC { - background: white /*#cacdc6; /*f9f7ed;*/; - padding: 10px 10px 10px 15px; - margin-bottom: 12px; -} - -.boxC p { - margin-bottom: 4px; -} - -.boxC p.info-box-follow-up-links { - text-align: right; - margin: 0; -} -.boxC h2, -.boxC h3 { - padding-left: 0; -} - -.boxC label { - color: #333; -} .pager { clear:both; @@ -886,17 +1051,6 @@ ul#search-tags { padding: 5px 0 10px 0; } -p.rss { - float: right; - font-size: 12px; - color: #666; - margin: 0 2px 0 0; -} - -p.rss a { - padding-left: 16px; - background: url(../images/feed-icon-small.png) no-repeat; -} /* badges */ a.medal { @@ -923,85 +1077,7 @@ a:hover.medal { border-right: 1px solid #D1CA3D; } -/*Tabs*/ -.tabBar { - background-color: #FFF; - border-bottom: 1px solid white; - height: 30px; - width: 100%; - clear: both; - margin-bottom: 3px; - margin-top: 3px; -} - -.tabBar h2 { - float: left; -} -.tabsA, .tabsC { - background-color: #FFF; - float: right; - position: relative; - display: block; - font-weight: bold; - height: 20px; -} - -/* tabsA - used for sorting */ -.tabsA { float: right; } -.tabsC { float: left; } - -.tabsA a.on, .tabsC a.on, .tabsA a:hover, .tabsC a:hover { - background: #fff; - color: #a40000; - border-top: 1px solid #babdb6; - border-left: 1px solid #babdb6; - border-right: 1px solid #888a85; - border-bottom: 1px solid #888a85; - height: 24px; - line-height: 26px; - margin-top: 3px; -} - -.tabsA a.rev.on, tabsA a.rev.on:hover { - padding: 0px 2px 0px 7px; -} - -.tabsA a, .tabsC a{ - background: #f9f7eb; - border-top: 1px solid #eeeeec; - border-left: 1px solid #eeeeec; - border-right: 1px solid #a9aca5; - border-bottom: 1px solid #888a85; - color: #888a85; - display: block; - float: left; - height: 20px; - line-height: 22px; - margin: 5px 0 0 4px; - padding: 0 2px; - text-decoration: none; -} - -.tabsA .label, .tabsC .label { - float: left; - font-weight: bold; - color: #777; - margin: 8px 0 0 0px; -} - -.tabsB a { - background: #eee; - border: 1px solid #eee; - color: #777; - display: block; - float: left; - height: 22px; - line-height: 28px; - margin: 5px 0px 0 4px; - padding: 0 11px 0 11px; - text-decoration: none; -} .questions-related { font-weight: 700; @@ -1401,16 +1477,7 @@ div.comments { } -.boxC ul { - margin-left: 15px; -} -.boxC li { - list-style-type: disc; - font-size: 13px; - line-height: 20px; - margin-bottom: 10px; -} /* openid styles */ .form-row { @@ -2343,9 +2410,7 @@ p.signup_p { padding-right:5px; } -img.gravatar { - margin:2px; -} + .user-info-table .gravatar { margin:0; } diff --git a/askbot/skins/default/templates/blocks/secundary_header.html b/askbot/skins/default/templates/blocks/secundary_header.html index 563d3883..0d588627 100644 --- a/askbot/skins/default/templates/blocks/secundary_header.html +++ b/askbot/skins/default/templates/blocks/secundary_header.html @@ -2,17 +2,21 @@
- - ALL - UNANSWERED - {% if request.user.is_authenticated() %} - FOLLOWED - {% endif %} - {% include "blocks/input_bar.html" %} {# include search form block #} + +
+ ALL + UNANSWERED + {% if request.user.is_authenticated() %} + FOLLOWED + {% endif %} + + {% include "blocks/input_bar.html" %} {# include search form block #} +
+ {% trans %}ask a question{% endtrans %}
diff --git a/askbot/skins/default/templates/blocks/tag_selector.html b/askbot/skins/default/templates/blocks/tag_selector.html index c3626be9..be456ad1 100644 --- a/askbot/skins/default/templates/blocks/tag_selector.html +++ b/askbot/skins/default/templates/blocks/tag_selector.html @@ -1,6 +1,6 @@ {# todo - maybe disable navigation from ignored tags here when "hide" is on - with js? #} {% import "macros.html" as macros %} -
+

{% trans %}Interesting tags{% endtrans %}

{{ macros.tag_list_widget( diff --git a/askbot/skins/default/templates/main_page/headline.html b/askbot/skins/default/templates/main_page/headline.html index 130a9bd9..62d67ebb 100644 --- a/askbot/skins/default/templates/main_page/headline.html +++ b/askbot/skins/default/templates/main_page/headline.html @@ -1,12 +1,6 @@ {% import "macros.html" as macros %} {% if questions_count > 0 %}
-

- ({% trans %}rss feed{% endtrans %}) -

{% if search_tags %} {% trans cnt=questions_count, q_num=questions_count|intcomma %}{{q_num}} question, tagged{% pluralize %}{{q_num}} questions, tagged{% endtrans %} diff --git a/askbot/skins/default/templates/main_page/sidebar.html b/askbot/skins/default/templates/main_page/sidebar.html index 6abc0492..57267ea3 100644 --- a/askbot/skins/default/templates/main_page/sidebar.html +++ b/askbot/skins/default/templates/main_page/sidebar.html @@ -4,8 +4,8 @@ {% if contributors and settings.SIDEBAR_MAIN_SHOW_AVATARS %} {% cache 600 "contributors" contributors search_tags scope sort query context.page context.page_size language_code %} -
-

{% trans %}Contributors{% endtrans %}

+
+

{% trans %}Contributors{% endtrans %}

{% spaceless %} {% for person in contributors %} {{ macros.gravatar(person,48) }} @@ -21,7 +21,7 @@ {% if tags and settings.SIDEBAR_MAIN_SHOW_TAGS %} {% cache 0 "tags" tags search_tags scope sort query context.page context.page_size language_code %} -
+

{% trans %}Related tags{% endtrans %}

{% if tag_list_type == 'list' %}