';a.slidesSpacing=a.st.slidesSpacing;a._w=(a._h?a.slider.width():a.slider.height())+a.st.slidesSpacing;a._x=Boolean(0=a.numSlides&&(a._z=!1);a._a1=a._z&&a._l?2===a.numSlides?1:2:0;a._b1=6>a.numSlides?
+a.numSlides:6;a._c1=0;a._d1=0;a.slidesJQ=[];for(c=0;c
'));a._e1=f=m(f+"').appendTo(d),a._c2=d.children(".rsArrowLeft").click(function(b){b.preventDefault();a.prev()}),a._d2=d.children(".rsArrowRight").click(function(b){b.preventDefault();a.next()}),a.st.arrowsNavAutoHide&&!a.hasTouch&&(a._c2.addClass("rsHidden"),a._d2.addClass("rsHidden"),d.one("mousemove.arrowshover",function(){a._c2.removeClass("rsHidden");
+a._d2.removeClass("rsHidden")}),d.hover(function(){a._e2||(a._c2.removeClass("rsHidden"),a._d2.removeClass("rsHidden"))},function(){a._e2||(a._c2.addClass("rsHidden"),a._d2.addClass("rsHidden"))})),a.ev.on("rsOnUpdateNav",function(){a._f2()}),a._f2());if(a._f1)a._p1.on(a._j1,function(b){a._g2(b)});else a.dragSuccess=!1;var q=["rsPlayBtnIcon","rsPlayBtn","rsCloseVideoBtn","rsCloseVideoIcn"];a._p1.click(function(b){if(!a.dragSuccess){var d=m(b.target).attr("class");if(-1!==m.inArray(d,q)&&a.toggleVideo())return!1;
+if(a.st.navigateByClick&&!a._h2){if(m(b.target).closest(".rsNoDrag",a._r1).length)return!0;a._i2(b)}a.ev.trigger("rsSlideClick")}}).on("click.rs","a",function(b){if(a.dragSuccess)return!1;a._h2=!0;setTimeout(function(){a._h2=!1},3)});a.ev.trigger("rsAfterInit")}m.rsModules||(m.rsModules={uid:0});u.prototype={constructor:u,_i2:function(b){b=b[this._h?"pageX":"pageY"]-this._j2;b>=this._q?this.next():0>b&&this.prev()},_t:function(){var b;b=this.st.numImagesToPreload;if(this._z=this.st.loop)2===this.numSlides?
+(this._z=!1,this.st.loopRewind=!0):2>this.numSlides&&(this.st.loopRewind=this._z=!1);this._z&&0
'):
+a._l5.eq(d).before('
');a._l5=a._k5.children()}),a.ev.on("rsOnRemoveSlide",function(b,c){var d=a._l5.eq(c);d&&d.length&&(d.remove(),a._l5=a._k5.children())}),a.ev.on("rsOnUpdateNav",function(){var b=a.currSlideId;a._n5&&a._n5.removeClass("rsNavSelected");b=a._l5.eq(b);b.addClass("rsNavSelected");a._n5=b}))}});c.rsModules.bullets=c.rsProto._i5})(jQuery);
+// jquery.rs.thumbnails v1.0.5
+(function(f){f.extend(f.rsProto,{_h6:function(){var a=this;"thumbnails"===a.st.controlNavigation&&(a._i6={drag:!0,touch:!0,orientation:"horizontal",navigation:!0,arrows:!0,arrowLeft:null,arrowRight:null,spacing:4,arrowsAutoHide:!1,appendSpan:!1,transitionSpeed:600,autoCenter:!0,fitInViewport:!0,firstMargin:!0,paddingTop:0,paddingBottom:0},a.st.thumbs=f.extend({},a._i6,a.st.thumbs),a._j6=!0,!1===a.st.thumbs.firstMargin?a.st.thumbs.firstMargin=0:!0===a.st.thumbs.firstMargin&&(a.st.thumbs.firstMargin=
+a.st.thumbs.spacing),a.ev.on("rsBeforeParseNode",function(a,d,c){d=f(d);c.thumbnail=d.find(".rsTmb").remove();c.thumbnail.length?c.thumbnail=f(document.createElement("div")).append(c.thumbnail).html():(c.thumbnail=d.attr("data-rsTmb"),c.thumbnail||(c.thumbnail=d.find(".rsImg").attr("data-rsTmb")),c.thumbnail=c.thumbnail?'
';a._o6=d.appendSpan?'':"";for(var k=0;k'+e.thumbnail+a._o6+
+"
";c=f(c+"'),c.append(a._r6)),d.arrowRight?a._s6=d.arrowRight:(a._s6=f('
'),c.append(a._s6)),a._r6.click(function(){var b=
+(Math.floor(a._i3/a._t6)+a._u6)*a._t6+a._v6;a._a4(b>a._n3?a._n3:b)}),a._s6.click(function(){var b=(Math.floor(a._i3/a._t6)-a._u6)*a._t6+a._v6;a._a4(b
'+d.thumbnail+"
"):a._l5.eq(b).before(''+item.thumbnail+"
");a._l5=a._k5.children()}),a.ev.on("rsOnRemoveSlide",function(c,d){var b=a._l5.eq(d);b&&(b.remove(),a._l5=a._k5.children())}),a.ev.on("rsOnUpdateNav",function(){var c=a.currSlideId;a._n5&&a._n5.removeClass("rsNavSelected");c=a._l5.eq(c);c.addClass("rsNavSelected");a._n5=c}))},_g6:function(){var a=this,c;a._j5=!0;c='';
+for(var d=0;d'+a.slides[d].thumbnail+"
";c=e(c+"");a._k5=c;a._l5=c.children(".rsNavItem");a.slider.append(c);a._k5.click(function(b){b=e(b.target).closest(".rsNavItem");b.length&&a.goTo(b.index())})}});e.rsModules.tabs=e.rsProto._f6})(jQuery);
+// jquery.rs.fullscreen v1.0.5
+(function(c){c.extend(c.rsProto,{_q5:function(){var a=this;a._r5={enabled:!1,keyboardNav:!0,buttonFS:!0,nativeFS:!1,doubleTap:!0};a.st.fullscreen=c.extend({},a._r5,a.st.fullscreen);if(a.st.fullscreen.enabled)a.ev.one("rsBeforeSizeSet",function(){a._s5()})},_s5:function(){var a=this;a._t5=!a.st.keyboardNavEnabled&&a.st.fullscreen.keyboardNav;if(a.st.fullscreen.nativeFS){a._u5={supportsFullScreen:!1,isFullScreen:function(){return!1},requestFullScreen:function(){},cancelFullScreen:function(){},fullScreenEventName:"",
+prefix:""};var b=["webkit","moz","o","ms","khtml"];if(!a.isAndroid)if("undefined"!=typeof document.cancelFullScreen)a._u5.supportsFullScreen=!0;else for(var d=0;d| + + | ++ + | ++ Dribble.com + | ++ users + Graphic designer + | ++ Dziś, 15:48 + | +
| + + | ++ + | ++ Behance + | ++ Python Developer + | ++ Dziś, 15:48 + | +
| + + | ++ + | ++ Behance + | ++ Programista gier CC/C++ + | ++ Dziś, 15:48 + | +
| + + | ++ + | ++ Twitter + | ++ Grafik 2D + | ++ Dziś, 15:48 + | +
| + + | ++ + | ++ Behance + | ++ Python Developer + | ++ Dziś, 15:48 + | +
| + + | ++ + | ++ Behance + | ++ Programista gier CC/C++ + | ++ Dziś, 15:48 + | +
| + + | ++ + | ++ Behance + | ++ Python Developer + | ++ Dziś, 15:48 + | +
| + + | ++ + | ++ Behance + | ++ Programista gier CC/C++ + | ++ Dziś, 15:48 + | +
| + + | ++ + | ++ Behance + | ++ Python Developer + | ++ Dziś, 15:48 + | +
| + + | ++ + | ++ Behance + | ++ Programista gier CC/C++ + | ++ Dziś, 15:48 + | +
| + + | ++ + | ++ Behance + | ++ Python Developer + | ++ Dziś, 15:48 + | +
+
\ No newline at end of file
diff --git a/app/partials/top-bar.mustache b/app/partials/top-bar.mustache
new file mode 100644
index 000000000..56392c38e
--- /dev/null
+++ b/app/partials/top-bar.mustache
@@ -0,0 +1,21 @@
+
+
+
+
+
+
+
+
+
+
+
+
+ Wypromuj swoją twórczość już teraz!
+
+
+
\ No newline at end of file
diff --git a/app/partials/topics.mustache b/app/partials/topics.mustache
index 703793450..ba3fb2c4a 100644
--- a/app/partials/topics.mustache
+++ b/app/partials/topics.mustache
@@ -1,7 +1,97 @@
-
+
+ Witaj, Nieznajomy. Obecnie jesteś niezalogowany.
+ + Zaloguj się + + bądź + + zarejestruj + +
+
+
+ Wypromuj swoją twórczość już teraz!
+
+ -
- {{#topics}}
-
- - {{title}} - - {{/topics}} -
+
+
+
+
+
+
+
+
+
+
diff --git a/app/sass/.sass-cache/bfc489dea4f63003fb24b17b48e6b576319d32dc/main.scssc b/app/sass/.sass-cache/bfc489dea4f63003fb24b17b48e6b576319d32dc/main.scssc
new file mode 100644
index 000000000..994dcc323
Binary files /dev/null and b/app/sass/.sass-cache/bfc489dea4f63003fb24b17b48e6b576319d32dc/main.scssc differ
diff --git a/app/sass/blocks/_additions.scss b/app/sass/blocks/_additions.scss
new file mode 100755
index 000000000..243436b00
--- /dev/null
+++ b/app/sass/blocks/_additions.scss
@@ -0,0 +1,149 @@
+.additions {
+ width: 640px;
+ margin: 0 auto 50px auto;
+
+ @media screen and ( min-width: $tablet_landscape + 1 + px ) {
+ float: right;
+ width: grid(740, 760);
+ }
+
+ @media screen and ( max-width: $smartphone_landscape + px ) {
+ width: 100%;
+ padding: 0 20px;
+ }
+
+ h4 {
+ margin-bottom: 15px;
+ line-height: 1;
+ text-align: left;
+ font: {
+ family: $proxima;
+ size: em(18);
+ weight: $bold;
+ }
+ color: white;
+ }
+
+ .about {
+ float: left;
+ width: grid(340, 740);
+ margin-bottom: 30px;
+
+ @media
+ screen and ( min-width: $tablet_landscape + 1 + px ) and ( max-width: $ultrabook + px ),
+ screen and ( max-width: $smartphone_landscape + px ) {
+
+ float: none;
+ width: 100%;
+ }
+
+ p {
+ @include antialias;
+ margin-bottom: 1em;
+ line-height: 2;
+ font-size: em(12);
+ color: $gray-silver;
+ }
+
+ a {
+ color: white;
+
+ &:hover {
+ color: $turquoise;
+ }
+ }
+ }
+
+ .language {
+ float: right;
+ width: grid(360, 740);
+ text-align: center;
+
+ @media
+ screen and ( min-width: $tablet_landscape + 1 + px ) and ( max-width: $ultrabook + px ),
+ screen and ( max-width: $smartphone_landscape + px ) {
+
+ float: none;
+ width: 100%;
+ text-align: left;
+ }
+
+ h4 {
+ margin-bottom: 30px;
+ }
+
+ li {
+ display: inline-block;
+ padding: 0 2px 5px 2px;
+
+ &.active {
+ .lang {
+ &:after {
+ color: white;
+ }
+ }
+ }
+ }
+
+ .lang-list {
+ @include border-radius(5px);
+ @include box-shadow( rgba(black, 0.2) 0 0 3px 1px inset );
+ display: inline-block;
+ padding: 10px;
+ background-color: rgba(black, .1);
+ border-bottom: 1px solid rgba(white, .1);
+ text-align: center;
+ }
+
+ .lang {
+ position: relative;
+ display: inline-block;
+ width: 35px;
+ height: 24px;
+ background: {
+ image: url(../assets/lang.png);
+ repeat: no-repeat;
+ position: center top;
+ }
+
+ &.gb {
+ background-position: -185px -5px;
+ }
+
+ &.fr {
+ background-position: -140px -5px;
+ }
+
+ &.de {
+ background-position: -50px -5px;
+ }
+
+ &.pl {
+ background-position: -230px -5px;
+ }
+
+ &.es {
+ background-position: -95px -5px;
+ }
+
+ &.ch {
+ background-position: -5px -5px;
+ }
+
+ &:after {
+ position: absolute;
+ left: 0; bottom: -14px;
+ display: block;
+ width: 100%;
+ text-align: center;
+ font: {
+ family: $icons;
+ size: 9px;
+ }
+ content: '\e80b';
+ color: #333;
+ }
+ }
+
+ }
+}
diff --git a/app/sass/blocks/_content-list.scss b/app/sass/blocks/_content-list.scss
new file mode 100755
index 000000000..a50de6452
--- /dev/null
+++ b/app/sass/blocks/_content-list.scss
@@ -0,0 +1,87 @@
+.content-list {
+ @include border-radius(5px);
+ margin-bottom: 25px;
+ color: white;
+
+ header {
+ @include clear;
+ position: relative;
+
+ h3, .topic-nav {
+ float: left;
+
+ @media
+ screen and ( min-width: $tablet_landscape + 1 + px ) and ( max-width: $grid-base-width+px ),
+ screen and ( min-width: $smartphone_portrait + 1 + px ) and ( max-width: $tablet_portrait + px ) {
+
+ float: none;
+ }
+ }
+
+ h3 {
+ font: {
+ size: em(20);
+ weight: $bold;
+ }
+ color: $gray-mercury;
+ }
+
+ .buttons {
+ float: right;
+
+ @media
+ screen and ( min-width: $tablet_landscape + 1 + px ) and ( max-width: $grid-base-width+px ),
+ screen and ( max-width: $tablet_portrait + px ) {
+
+ float: none;
+ position: absolute; right: 20px; top: 25px;
+ }
+
+ .btn {
+ float: right;
+ height: 38px;
+ margin-left: 5px;
+ padding: 0 20px;
+ line-height: 36px;
+ text-transform: uppercase;
+ font: {
+ family: $proxima;
+ size: em(12);
+ weight: $bold;
+ }
+
+ @media
+ screen and ( min-width: $tablet_landscape + 1 + px ) and ( max-width: $netbook + px ),
+ screen and ( max-width: $tablet_portrait + px ) {
+
+ padding: 0 10px;
+ font-size: em(11);
+ }
+
+ &:hover {
+ @include gradient(#29a98b, #33bba3);
+ }
+
+ &.add-post {
+ @media screen and ( max-width: $smartphone_portrait + px ) {
+ display: none;
+ }
+ }
+
+ i {
+ margin-right: 5px;
+ }
+
+ .icon-bell {
+ font-size: 10px;
+ }
+
+ .icon-plus {
+ font-size: 8px;
+ }
+ }
+ }
+ }
+}
+
+
diff --git a/app/sass/blocks/_footer.scss b/app/sass/blocks/_footer.scss
new file mode 100755
index 000000000..aa44207f4
--- /dev/null
+++ b/app/sass/blocks/_footer.scss
@@ -0,0 +1,65 @@
+body .container > footer {
+ @include border-radius(5px);
+ @include clear;
+ background-color: $gray-thunder;
+ margin-bottom: 80px;
+ height: 60px;
+ padding: 0 20px;
+
+ .copyrights {
+ @include antialias;
+ float: left;
+ font: {
+ size: em(13);
+ weight: $semibold;
+ }
+ line-height: 60px;
+ color: $gray2;
+
+ a {
+ color: $turquoise;
+
+ &:hover {
+ color: white;
+ }
+ }
+ }
+
+ .go-top {
+ @include antialias;
+ float: right;
+ border-left: 1px solid #464545;
+ padding: 0 0 0 20px;
+ text-transform: uppercase;
+ font-size: em(14);
+ line-height: 60px;
+ color: $gray-silver2;
+
+ &:after {
+ margin-left: 10px;
+ font: {
+ family: $icons;
+ size: 16px;
+ }
+ content: '\e80c';
+ color: #d3d2d2;
+ }
+
+ &:hover {
+ color: $turquoise;
+
+ &:after {
+ color: $turquoise;
+ }
+ }
+ }
+
+ .nav-social {
+ float: right;
+ margin-right: 10px;
+
+ [class^="icon-"] {
+ line-height: 60px;
+ }
+ }
+}
\ No newline at end of file
diff --git a/app/sass/blocks/_forum.scss b/app/sass/blocks/_forum.scss
new file mode 100755
index 000000000..f3392aced
--- /dev/null
+++ b/app/sass/blocks/_forum.scss
@@ -0,0 +1,338 @@
+.forum {
+ background-color: $black-shark;
+
+ @media screen and ( max-width: $tablet_landscape + px ) {
+ margin-bottom: 10px;
+ }
+
+ header {
+ padding: 25px 20px;
+
+ h3 {
+ margin: 3px 15px 0 0;
+
+ @media screen and ( max-width: $grid-base-width+px ) {
+ margin-bottom: 5px;
+ }
+ }
+ }
+
+ .logo {
+ margin-right: 20px;
+
+ @media screen and ( min-width: $grid-base-width+px ) {
+ float: right;
+ }
+
+ @media screen and ( max-width: $smartphone_portrait + px ) {
+ display: none;
+ }
+ }
+
+ .nav-topics {
+ float: left;
+ vertical-align: middle;
+
+ @media screen and ( max-width: $grid-base-width+px ) {
+ margin-right: 10px;
+ }
+
+ a {
+ @include border-radius(50%);
+ @include box-shadow( rgba(0,0,0,.28) 0 1px 1px);
+ @include gradient(#36393b, #2c2f31);
+ @include transition-property(none);
+ display: inline-block;
+ width: 28px; height: 28px;
+ border: 1px solid rgba(white, .05);
+ border-bottom: none;
+ text-align: center;
+ font-size: em(12);
+ speak: none;
+ line-height: 26px;
+ color: rgba(white, .3);
+
+ @media screen and ( max-width: $smartphone_portrait + px ) {
+ width: 20px; height: 20px;
+ line-height: 18px;
+ font-size: em(10);
+ }
+
+ &:hover {
+ @include gradient(#29a98b, #33bba3);
+ color: white;
+ }
+ }
+ }
+
+ .topic-list {
+ width: 100%;
+
+ th {
+ text-transform: uppercase;
+ font: {
+ family: $proxima;
+ size: em(12);
+ weight: $light;
+ }
+ color: $gray-oslo;
+
+ @media
+ screen and ( min-width: $tablet_landscape + 1 + px ) and ( max-width: 1160px ),
+ screen and ( max-width: $smartphone_landscape + px ) {
+
+ &:nth-of-type(2),
+ &:nth-of-type(3),
+ &:nth-of-type(4),
+ &:nth-of-type(5) {
+ display: none;
+ }
+ }
+ }
+
+ td {
+ font: {
+ family: $mont;
+ }
+
+ .topic {
+ display: inline-block;
+ background: {
+ image: url(../assets/icon-arrow-right.png);
+ repeat: no-repeat;
+ position: left top;
+ }
+ padding: 0 0 5px 35px;
+
+ @media
+ screen and (min-width: 1161px) and ( max-width: $netbook + px ),
+ screen and (max-width: $smartphone_portrait + px) {
+
+ font-size: em(13);
+ }
+
+ &:hover {
+ color: $turquoise;
+ }
+ }
+ }
+
+ th, td {
+ border-bottom: 1px solid #363637;
+ padding: 10px;
+
+ @media screen and ( max-width: $ultrabook + px ) {
+ padding: 10px 5px;
+ }
+
+ @media
+ screen and ( min-width: $tablet_landscape + 1 + px ) and ( max-width: 1160px ),
+ screen and ( max-width: $smartphone_landscape + px ) {
+
+ float: left;
+ border: none;
+ }
+ }
+
+ tr {
+ @media
+ screen and ( min-width: $tablet_landscape + 1 + px ) and ( max-width: 1160px ),
+ screen and ( max-width: $smartphone_landscape + px ) {
+
+ float: left;
+ width: 100%;
+ border-bottom: 1px solid #363637;
+ }
+
+ &:first-child {
+ th {
+ &:first-child {
+ padding-left: 20px;
+ }
+ }
+ }
+
+ td {
+ @media
+ screen and ( min-width: $tablet_landscape + 1 + px ) and ( max-width: 1160px ),
+ screen and ( max-width: $smartphone_landscape + px ) {
+
+ padding: 0;
+ }
+
+ &:last-child {
+ white-space: nowrap;
+ }
+
+ &:first-child {
+ padding-left: 20px;
+
+ @media
+ screen and ( min-width: $tablet_landscape + 1 + px ) and ( max-width: 1160px ),
+ screen and ( max-width: $smartphone_landscape + px ) {
+
+ width: 100%;
+ padding: 10px 10px 0 20px;
+ }
+ }
+
+ &:nth-of-type(2) {
+ @media
+ screen and ( min-width: $tablet_landscape + 1 + px ) and ( max-width: 1160px ),
+ screen and ( max-width: $smartphone_landscape + px ) {
+
+ width: 100%;
+ padding-left: 55px;
+ padding-bottom: 5px;
+ }
+ }
+
+ &:nth-of-type(3) {
+ @media
+ screen and ( min-width: $tablet_landscape + 1 + px ) and ( max-width: 1160px ),
+ screen and ( max-width: $smartphone_landscape + px ) {
+
+ width: 120px;
+ padding-left: 55px;
+ padding-bottom: 10px;
+ text-align: left;
+ }
+ }
+
+ &:nth-of-type(5) {
+ @media
+ screen and ( min-width: $tablet_landscape + 1 + px ) and ( max-width: 1160px ),
+ screen and ( max-width: $smartphone_landscape + px ) {
+
+ padding-left: 40px;
+ padding-bottom: 10px;
+ margin-top: -10px;
+ text-align: left;
+ }
+ }
+ }
+ }
+
+ tbody {
+ tr {
+ &:nth-child(even) {
+ @include gradient(#2e2e2e, $black-shark);
+ }
+ }
+ }
+
+ i {
+ font-family: $icons;
+ font-style: normal;
+ font-weight: normal;
+ speak: none;
+ }
+
+ .answer {
+ display: inline-block;
+ width: 18px; height: 18px;
+ background: {
+ image: url(../assets/icon-answer.png);
+ repeat: no-repeat;
+ }
+ padding: 0 0 0 25px;
+ line-height: 15px;
+ }
+
+ .btn {
+ @include antialias;
+ @include border-radius(3px);
+ display: block;
+ padding: 6px 10px;
+ line-height: 1;
+ white-space: nowrap;
+ text: {
+ transform: uppercase;
+ align: center;
+ }
+ font: {
+ family: $proxima;
+ size: em(12);
+ weight: $bold;
+ }
+ color: white;
+
+ @media screen and ( max-width: $netbook + px ) {
+ font-size: em(10);
+ }
+
+ @media
+ screen and ( min-width: $tablet_landscape + 1 + px ) and ( max-width: 1160px ),
+ screen and ( max-width: $smartphone_landscape + px ) {
+
+ display: inline-block;
+ }
+ }
+
+ .views i {
+ font-size: 18px;
+ color: #d0474b;
+ }
+
+ .num {
+ font: {
+ family: $mont;
+ }
+ color: $gray-nobel;
+ }
+
+ .user {
+ @include border-radius(50%);
+ @include box-sizing(content-box);
+ display: inline-block;
+ width: 25px; height: 25px;
+ overflow: hidden;
+ border: 3px solid transparent;
+
+ &.border {
+ border-color: #85c2e0;
+ }
+ }
+ }
+
+ .topic-slider {
+ display: none;
+ }
+
+ .topic-slider-pagination {
+ padding: 15px 20px;
+ text-align: right;
+
+ .text {
+ margin-right: 5px;
+ font: {
+ size: em(14);
+ weight: $light;
+ }
+ color: #bebebe;
+ }
+
+ .bullets {
+ display: inline-block;
+ }
+
+ .bullet {
+ @include border-radius( 50% );
+ @include hover;
+ position: relative;
+ background-color: #adadad;
+ display: inline-block;
+ width: 12px; height: 12px;
+ margin: 0 3px;
+ cursor: pointer;
+
+ &.rsNavSelected {
+ background-color: $turquoise;
+ }
+
+ &:hover {
+ background-color: white;
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/app/sass/blocks/_header.scss b/app/sass/blocks/_header.scss
new file mode 100755
index 000000000..b96192750
--- /dev/null
+++ b/app/sass/blocks/_header.scss
@@ -0,0 +1,209 @@
+#header {
+ position: relative;
+ z-index: 30;
+ height: 100px;
+ background-color: $gray-shark;
+ margin-bottom: 30px;
+
+ @media screen and ( max-width: 1023px ) {
+ height: 110px;
+ background-color: black;
+ margin-bottom: 0;
+ }
+
+ .fixed & {
+ position: fixed;
+ left: 0;
+ top: -110px;
+ width: 100%;
+ height: 200px;
+ background-color: #1e1e1e;
+ }
+
+ .logo {
+ @include antialias;
+ position: absolute;
+ left: 20px; top: 20px;
+ display: block;
+ text-transform: uppercase;
+ font: {
+ family: $proxima;
+ size: em(44);
+ weight: $bold;
+ }
+ line-height: 60px;
+ color: white;
+
+ @media
+ screen and ( min-width: $tablet_landscape+px ) and ( max-width: $netbook+px ),
+ screen and ( max-width: $smartphone_landscape+px ) {
+ font-size: em(34);
+ }
+
+ img {
+ display: inline-block;
+ height: auto;
+ margin-right: 10px;
+ vertical-align: bottom;
+
+ @media
+ screen and ( min-width: $tablet_landscape+px ) and ( max-width: $netbook+px ),
+ screen and ( max-width: $smartphone_landscape+px ) {
+
+ width: 50px;
+ margin-right: 5px;
+ vertical-align: middle;
+ }
+ }
+
+ .turquoise {
+ font-weight: $light;
+ }
+ }
+
+ .login {
+ @include antialias;
+ display: block;
+ position: absolute; right: 110px; top: 0; z-index: 5;
+ background-color: #343434;
+ height: 110px;
+ padding: 0 30px;
+ text-align: center;
+ line-height: 110px;
+ font: {
+ size: em(16);
+ weight: $bold;
+ }
+ color: white;
+
+ @media screen and ( max-width: $smartphone_landscape + px ) {
+ top: 110px;
+ right: grid(90, $smartphone_portrait);
+ height: 90px;
+ background-color: transparent;
+ line-height: 90px;
+ }
+
+ &:hover {
+ background-color: $turquoise;
+ }
+ }
+
+ .nav-social {
+ position: absolute;
+ right: 120px; top: 0; z-index: 5;
+
+ @media screen and ( max-width: $netbook+px ) {
+ right: 100px;
+ }
+
+ @media screen and ( max-width: $tablet_landscape + px) {
+ right: 80px;
+ }
+
+ @media screen and ( max-width: $tablet_landscape - 1 + px ) {
+ display: none;
+ }
+
+ [class^="icon-"] {
+ line-height: 100px;
+ }
+ }
+
+ .nav-trigger {
+ @include antialias;
+ @include box-shadow($gray-emperor 1px 0 0);
+ position: absolute; left: 0; top: 110px; z-index: 5;
+ display: none;
+ height: 90px;
+ padding: 0 25px;
+ font: {
+ family: $proxima;
+ size: em(16);
+ weight: $bold;
+ }
+ line-height: 90px;
+ color: white;
+
+ @media screen and ( max-width: $smartphone_landscape + px ) {
+ display: block;
+ }
+
+ &:after, &:before {
+ position: absolute; z-index: 10;
+ display: block;
+ background-color: $turquoise;
+ }
+
+ &:after {
+ bottom: 0;
+ left: 0;
+ width: 100%;
+ height: 6px;
+ content: ' ';
+ }
+
+ &:before {
+ position: absolute; z-index: 10;
+ bottom: -12px; right: 0;
+ width: 15px; height: 12px;
+ text-align: center;
+ font: {
+ family: $icons;
+ style: normal;
+ weight: normal;
+ size: 16px;
+ }
+ speak: none;
+ content: '\e80b';
+ line-height: 10px;
+ color: white;
+ }
+
+ &:hover {
+ &:after {
+ height: 10px;
+ }
+ }
+ }
+
+ .search-trigger {
+ position: absolute; right: 0; top: 0; z-index: 5;
+ display: block;
+ width: 100px; height: 100px;
+ border-left: 1px solid $gray-shaft;
+ padding-top: 5px;
+ text-align: center;
+ line-height: 100px;
+ font-size: em(30);
+ color: $gray;
+
+ @media screen and ( max-width: $netbook+px ) {
+ width: 80px;
+ }
+
+ @media screen and ( min-width: $tablet_landscape+px ) and ( max-width: $tablet_landscape + px) {
+ width: 60px;
+ font-size: em(24);
+ }
+
+ @media screen and ( max-width: $tablet_landscape - 1 + px ) {
+ width: 110px; height: 110px;
+ background-color: #444;
+ }
+
+ @media screen and ( max-width: $smartphone_landscape + px ) {
+ top: 110px;
+ width: grid(90, $smartphone_portrait);
+ height: 90px;
+ background-color: transparent;
+ padding: 0;
+ line-height: 90px;
+ }
+
+ &:hover {
+ background-color: $turquoise;
+ color: white;
+ }
+ }
+}
\ No newline at end of file
diff --git a/app/sass/blocks/_highlights.scss b/app/sass/blocks/_highlights.scss
new file mode 100755
index 000000000..0ed0d8e24
--- /dev/null
+++ b/app/sass/blocks/_highlights.scss
@@ -0,0 +1,277 @@
+#highlights {
+ position: relative;
+
+ h2 {
+ margin-bottom: .5em;
+ font: {
+ size: em(44);
+ weight: $light;
+ }
+ color: $turquoise;
+
+ @media
+ screen and ( min-width: $tablet_landscape + px ) and ( max-width: $grid-base-width + px ),
+ screen and ( max-width: $tablet_portrait + px ) {
+
+ padding-left: 20px;
+ }
+
+ @media screen and ( max-width: $smartphone_portrait + px ) {
+ font-size: em(36);
+ }
+ }
+
+ .archive {
+ position: absolute; right: 0; top: 0;
+ padding-right: 80px;
+ text-transform: uppercase;
+ line-height: 52px;
+ color: white;
+
+ @media screen and ( max-width: $tablet_portrait + 20 + px ) {
+ right: 30px;
+ }
+
+ @media screen and ( max-width: $smartphone_portrait + px ) {
+ display: none;
+ }
+
+ &:after {
+ position: absolute; right: 0; top: 0;
+ display: block;
+ width: 54px; height: 52px;
+ background: {
+ image: url(../assets/icon-archive.png);
+ repeat: no-repeat;
+ position: right center;
+ color: $gray-emperor;
+ }
+ border-left: 6px solid $blue;
+ content: ' ';
+ }
+
+ &:hover {
+ &:after {
+ background-color: $turquoise;
+ border-color: white;
+ }
+ color: $turquoise;
+ }
+ }
+
+ .slider {
+ display: none;
+ position: relative;
+ width: 100%;
+ margin-bottom: 35px;
+
+ @media screen and ( max-width: $tablet_landscape + px ) {
+ margin-bottom: 20px;
+ }
+
+ @media screen and ( min-width: $smartphone_landscape + px ) and ( max-width: $tablet_portrait + 20 + px ) {
+ padding: 0 10px;
+ }
+
+ .rsSlide {
+ img {
+ position: relative; z-index: 5;
+ width: 100%;
+ height: auto;
+
+ @media screen and ( max-width: $smartphone_portrait - 1 + px ) {
+ width: auto;
+ }
+ }
+
+ article {
+ position: absolute; z-index: 10;
+ left: 0; bottom: 0;
+ width: 100%;
+
+ h4 {
+ @include gradient(rgba(0,0,0,0), #242424);
+ line-height: 1;
+ padding: {
+ left: 10px;
+ top: 25px;
+ }
+ font: {
+ size: em(44);
+ weight: $bold;
+ }
+ color: white;
+
+ @media screen and ( min-width: $smartphone_landscape + px ) {
+ padding: {
+ left: grid(25, 755);
+ right: grid(110, 755);
+
+ }
+ }
+
+ @media screen and ( min-width: $smartphone_portrait + px ) and ( max-width: $netbook + px ) {
+ font-size: em(34);
+ }
+ }
+
+ p {
+ @include gradient(#242424, #060606);
+ position: relative;
+ padding: {
+ left: 10px;
+ top: 10px;
+ bottom: 25px;
+ }
+ font: {
+ size: em(13);
+ weight: $light;
+ }
+ color: #bebebe;
+
+ @media screen and ( max-width: $ultrabook + px ) {
+ padding-right: grid(220, 755);
+ }
+
+ @media screen and ( min-width: $smartphone_landscape + px ) {
+ padding: {
+ right: grid(420, 755);
+ left: grid(25, 755);
+ }
+ }
+
+ @media screen and ( max-width: $smartphone_landscape - 1 + px ) {
+ padding: {
+ bottom: 50px;
+ right: 0;
+ }
+ }
+ }
+
+ .more {
+ position: absolute; right: grid(110, 755); bottom: 45px;
+ font: {
+ size: em(16);
+ weight: $light;
+ }
+ color: $green-jungle;
+
+ @media screen and ( min-width: $tablet_landscape + 1 + px ) and ( max-width: $netbook + px ) {
+ right: 26px; bottom: 25px;
+ }
+
+ @media screen and ( max-width: $smartphone_landscape - 1 + px ) {
+ display: none;
+ }
+
+ &:hover {
+ color: white;
+ }
+ }
+ }
+ }
+ }
+
+ .outerCont {
+ position: absolute; bottom: 45px; right: 25px; z-index: 10;
+ text-align: right;
+
+ @media screen and ( max-width: $smartphone_landscape - 1 + px ) {
+ bottom: 20px; right: auto; left: 10px;
+ }
+
+ .rsNav {
+ &.rsBullets {
+ display: inline-block;
+
+ .rsBullet {
+ @include border-radius( 50% );
+ @include hover;
+ position: relative;
+ background-color: #adadad;
+ display: inline-block;
+ width: 12px; height: 12px;
+ margin: 0 3px;
+ cursor: pointer;
+
+ &.rsNavSelected {
+ background-color: $turquoise;
+ }
+
+ &:hover {
+ background-color: white;
+ }
+ }
+ }
+ }
+ }
+
+ .highlights {
+ @include clear;
+
+ @media screen and ( max-width: $tablet_portrait + 20 + px ) {
+ padding: 0 10px;
+ }
+
+ .item {
+ @include border-radius(5px);
+ float: left;
+ width: grid(368, 755);
+ margin-bottom: 35px;
+ overflow: hidden;
+
+ @media screen and ( max-width: $tablet_landscape + px ) {
+ margin-bottom: 10px;
+ }
+
+ @media screen and ( max-width: $tablet_landscape + px ) {
+ width: grid(368, 768);
+ }
+
+ @media screen and ( max-width: $smartphone_portrait - 1 + px ) {
+ float: none;
+ width: 100%;
+ margin: 0 auto 10px auto;
+ }
+
+ &:nth-child(even) {
+ @media screen and ( min-width: $smartphone_portrait + px ) {
+ float: right;
+ }
+ }
+
+ img {
+ width: 100%;
+ height: auto;
+
+ @media screen and ( max-width: $smartphone_portrait - 1 + px ) {
+ display: block;
+ width: auto;
+ max-width: 100%;
+ margin: 0 auto;
+ }
+ }
+ }
+ }
+}
+
+#highlights,
+.column.right {
+ .video {
+ margin-bottom: 35px;
+
+ @media screen and ( max-width: $smartphone_portrait + px ) {
+ margin-bottom: 20px;
+ }
+
+ @media screen and ( max-width: $tablet_portrait + 20 + px ) {
+ padding: 0 10px;
+ }
+
+ img {
+ width: 100%;
+ max-width: 100%;
+ height: auto;
+ }
+ }
+}
\ No newline at end of file
diff --git a/app/sass/blocks/_jobs.scss b/app/sass/blocks/_jobs.scss
new file mode 100755
index 000000000..25cce03c2
--- /dev/null
+++ b/app/sass/blocks/_jobs.scss
@@ -0,0 +1,218 @@
+.jobs {
+ background-color: $gray-shaft2;
+ margin-bottom: 50px;
+
+ @media screen and ( max-width: $smartphone_landscape + px ) {
+ margin-bottom: 20px;
+ }
+
+ header {
+ height: 60px;
+ padding: 20px 20px 20px 80px;
+
+ @media screen and ( max-width: $smartphone_portrait + px ) {
+ height: 100px;
+ padding-left: 20px;
+ }
+
+ h3 {
+ float: left;
+ margin-right: 30px;
+
+ @media screen and ( max-width: $smartphone_portrait + px ) {
+ float: none;
+ margin-bottom: 15px;
+ }
+ }
+ }
+
+ .jobs-list {
+ width: 100%;
+ border: 1px solid rgba(white, 0.05);
+
+ tr {
+ td {
+ @include antialias;
+ padding: 21px 25px;
+ border: {
+ bottom: 1px solid rgba(white, 0.05);
+ right: 1px solid rgba(white, 0.05);
+ }
+ font: {
+ family: $mont;
+ weight: $regular;
+ }
+ line-height: 1;
+
+ @media
+ screen and ( min-width: $tablet_landscape + 1 + px ) and ( max-width: $netbook + px ),
+ screen and ( max-width: $smartphone_landscape + px ) {
+
+ padding: 16px 20px;
+ }
+
+ &:nth-child(1),
+ &:nth-child(2),
+ &:nth-child(5), {
+ @media screen and ( max-width: $smartphone_portrait + px ) {
+ display: none;
+ }
+ }
+
+ &:nth-child(3) {
+ @media screen and ( max-width: $smartphone_portrait + px ) {
+ font-size: em(12);
+ }
+ }
+
+ &:nth-child(4) {
+ font-size: em(13);
+ }
+
+ &.action {
+ padding: 0;
+ width: 60px;
+ text-align: center;
+ font-size: 24px;
+ color: rgba(white, 0.2);
+
+ .icon-cancel {
+ font-size: 14px;
+ }
+
+ .icon-star-empty {
+ font-size: 24px;
+ }
+ }
+
+ &.no-border {
+ border-right: none;
+ }
+
+ a {
+ &:hover {
+ color: $turquoise;
+ }
+ }
+
+ .dark {
+ @include opacity(0.6);
+ }
+
+ .date {
+ color: #7e7e7e;
+ }
+
+ .info {
+ margin-right: 10px;
+ line-height: 1;
+ padding: 3px 3px;
+ text-transform: uppercase;
+ font-size: 12px;
+ color: white;
+ }
+ }
+ }
+ }
+
+ .nav-buttons {
+ @include clear;
+ position: absolute; z-index: 10;
+ left: 0; top: 0;
+ width: 60px;
+
+ @media screen and ( max-width: $smartphone_portrait + px ) {
+ display: none;
+ }
+
+ .btn {
+ float: left;
+ width: 60px; height: 60px;
+ text-align: center;
+ line-height: 60px;
+ font-size: 24px;
+ color: white;
+ }
+
+ .actions {
+ position: absolute; top: 60px; left: -120px;
+ width: 240px;
+ display: none;
+
+ .btn {
+ font-size: 20px;
+ }
+
+ .icon-cancel {
+ font-size: 14px;
+ }
+
+ .icon-star-empty {
+ font-size: 24px;
+ }
+ }
+ }
+
+ .results {
+ float: right;
+ font: {
+ family: $mont;
+ weight: $regular;
+ }
+ color: rgba(white, .2);
+
+ @media screen and ( min-width: $tablet_landscape + 1 + px ) and ( max-width: $netbook + px ) {
+ font-size: em(12);
+ }
+
+ @media screen and ( max-width: $smartphone_portrait + px ) {
+ position: absolute;
+ right: 20px;
+ top: 20px;
+ }
+ }
+
+ .search-job {
+ float: left;
+ position: relative;
+ width: grid(400, 760);
+ margin-top: -2px;
+
+ @media
+ screen and ( min-width: $tablet_landscape + 1 + px ) and ( max-width: $netbook + px ),
+ screen and ( max-width: $smartphone_landscape + px ) {
+
+ width: grid(300, 760);
+ }
+
+ @media screen and ( max-width: $smartphone_portrait + px ) {
+ width: 100%;
+ }
+
+ input[type=text] {
+ position: relative; z-index: 5;
+ border-bottom: 1px solid $gray-tundora;
+ padding: 5px 0;
+ font-size: em(12);
+ color: $gray-dusty;
+ }
+
+ button[type=submit] {
+ position: absolute; right: 0; top: -10px; z-index: 10;
+ width: 40px; height: 40px;
+ background-color: $gray-shaft2;
+ text-align: center;
+ line-height: 40px;
+ font-size: 32px;
+ color: $gray;
+
+ @media screen and ( max-width: $netbook + px ) {
+ font-size: 28px;
+ }
+
+ &:hover {
+ color: white;
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/app/sass/blocks/_main-menu.scss b/app/sass/blocks/_main-menu.scss
new file mode 100755
index 000000000..013e64482
--- /dev/null
+++ b/app/sass/blocks/_main-menu.scss
@@ -0,0 +1,200 @@
+#main-menu {
+ position: relative;
+ z-index: 25;
+
+ @media screen and ( max-width: 1023px ) {
+ @include clear;
+ height: 90px;
+ background-color: #1e1e1e;
+ margin-bottom: 35px;
+ padding-top: 35px;
+ }
+
+ .fixed & {
+ position: absolute; left: 0; top: 165px;
+ width: 100%; display: none;
+ height: auto;
+ }
+
+ ul {
+ @media screen and ( max-width: $smartphone_landscape + px ) {
+ display: none;
+ position: absolute;
+ left: 0;
+ top: 90px;
+ width: 100%;
+
+ .fixed & {
+ position: fixed;
+ top: 90px;
+ }
+ }
+ }
+
+ &.opened {
+ display: block;
+ -webkit-animation: show_mobilemenu .4s;
+ -moz-animation: show_mobilemenu .4s;
+ -ms-animation: show_mobilemenu .4s;
+ -o-animation: show_mobilemenu .4s;
+ animation: show_mobilemenu .4s;
+
+ ul {
+ display: block;
+ }
+ }
+
+ li {
+ @media screen and ( min-width: $smartphone_landscape + 1 + px ) {
+ float: left;
+ }
+
+ a {
+ @include antialias;
+ display: block;
+ position: relative; z-index: 5;
+ //background-color: #1e1e1e;
+ padding: 0 25px;
+ font: {
+ family: $proxima;
+ size: em(16);
+ weight: $bold;
+ }
+ color: white;
+
+ @media screen and ( min-width: $smartphone_landscape + 1 + px ) {
+ @include box-shadow($gray-emperor 1px 0 0);
+ height: 55px;
+ }
+
+ @media screen and ( max-width: $tablet_portrait + px ) {
+ padding: 0 15px;
+ }
+
+ @media screen and ( max-width: $smartphone_landscape + px ) {
+ background-color: #1e1e1e;
+ padding: {
+ top: 15px;
+ bottom: 15px;
+ }
+ }
+
+ #header & {
+ @media screen and ( min-width: 1125px ) and ( max-width: $netbook+px ) {
+ padding: {
+ left: 20px;
+ right: 20px;
+ }
+ }
+
+ @media screen and ( min-width: $tablet_landscape+px ) and ( max-width: 1124px ) {
+ padding: {
+ left: 15px;
+ right: 15px;
+ }
+ font-size: em(14);
+ }
+ }
+
+ &:after, &:before {
+ position: absolute; z-index: 10;
+ display: block;
+ background-color: $turquoise;
+ }
+
+ &:after {
+ bottom: 0px;
+ left: 0;
+ width: 100%;
+ height: 6px;
+ content: ' ';
+ }
+
+ &:before {
+ position: absolute; z-index: 10;
+ bottom: -12px; right: 0;
+ width: 15px; height: 12px;
+ text-align: center;
+ font: {
+ family: $icons;
+ style: normal;
+ weight: normal;
+ size: 16px;
+ }
+ speak: none;
+ content: '\e80b';
+ line-height: 10px;
+ color: white;
+
+ @media screen and ( max-width: $smartphone_landscape + px ) {
+ display: none;
+ }
+
+ }
+
+ &:hover {
+ &:after {
+ height: 10px;
+ }
+ }
+ }
+
+ &:nth-child(2) a {
+ &:after, &:before {
+ background-color: $blue;
+ }
+ }
+
+ &:nth-child(3) a {
+ &:after, &:before {
+ background-color: $yellow;
+ }
+ }
+
+ &:nth-child(4) a {
+ &:after, &:before {
+ background-color: $green;
+ }
+ }
+
+ &:nth-child(5) a {
+ &:after, &:before {
+ background-color: $red;
+ }
+ }
+
+ &.current-menu-item a {
+ &:before {
+ display: none;
+ }
+ }
+ }
+
+ #header & {
+ position: absolute;
+ right: 395px;
+ top: 45px;
+
+ @media screen and ( max-width: $ultrabook + px ) {
+ right: 320px;
+ }
+
+ @media screen and ( max-width: $netbook+px ) {
+ right: 280px;
+ }
+
+ @media screen and ( max-width: $tablet_landscape + px) {
+ right: 260px;
+ }
+
+ @media screen and ( max-width: $tablet_landscape - 1 + px) {
+ top: 60px;
+ }
+ }
+}
+
+#top-bar {
+ #main-menu {
+
+ }
+}
\ No newline at end of file
diff --git a/app/sass/blocks/_nav-account.scss b/app/sass/blocks/_nav-account.scss
new file mode 100755
index 000000000..53c19c188
--- /dev/null
+++ b/app/sass/blocks/_nav-account.scss
@@ -0,0 +1,263 @@
+@keyframes show_submenu {
+ 0% {
+ @include opacity(0);
+ @include transform(translateY(-20px));
+ }
+
+ 100% {
+ @include opacity(1);
+ @include transform(translateY(0));
+ }
+}
+
+@keyframes show_mobilemenu {
+ 0% {
+ @include opacity(0);
+ //@include transform(translateY(-20px));
+ }
+
+ 100% {
+ @include opacity(1);
+ //@include transform(translateY(0));
+ }
+}
+
+
+.nav-account {
+ display: inline-block;
+ vertical-align: middle;
+
+ > ul {
+ position: relative;
+
+ > li {
+ display: inline-block;
+ height: 68px;
+ margin-right: 5px;
+ padding: 15px 10px 0 10px;
+
+ [class^="icon--"] {
+ display: block;
+ height: 40px;
+ background: {
+ image: url(../assets/icons-nav-account.png);
+ repeat: no-repeat;
+ }
+ }
+
+ a {
+ @include transition-property(none);
+ }
+
+ .icon--mail {
+ width: 38px;
+ background-position: -5px -5px;
+ }
+
+ .icon--comment {
+ width: 41px;
+ background-position: -101px -5px;
+ }
+
+ .icon--watch {
+ width: 45px;
+ background-position: -203px -5px;
+ }
+
+ [class^="icon--"] {
+ position: relative;
+ color: #535353;
+ font-size: em(42);
+ }
+
+ &:hover {
+ background-color: #2b2d2e;
+
+ .icon--mail {
+ background-position: -53px -5px;
+ }
+
+ .icon--comment {
+ background-position: -152px -5px;
+ }
+
+ .icon--watch {
+ background-position: -258px -5px;
+ }
+ }
+
+ .tooltip {
+ position: absolute; right: -5px; top: -3px;
+ display: inline-block;
+ padding: 2px;
+ line-height: 1;
+ font: {
+ size: 11px;
+ weight: $bold;
+ }
+ color: white;
+
+ &:after {
+ position: absolute; right: 5px; bottom: -4px;
+ display: block;
+ width: 0;
+ height: 0;
+ border-style: solid;
+ border-width: 4px 4px 0 4px;
+ content: ' ';
+ }
+
+ &.blue {
+ background-color: #12b0cc;
+
+ &:after {
+ border-color: #12b0cc transparent transparent transparent;
+ }
+ }
+
+ &.red {
+ background-color: #ec0f21;
+
+ &:after {
+ border-color: #ec0f21 transparent transparent transparent;
+ }
+ }
+ }
+
+ &:last-child {
+ .tooltip {
+ right: 10px;
+ }
+ }
+
+ &:hover {
+ .sub-menu {
+ display: block;
+ -webkit-animation: show_submenu .4s;
+ -moz-animation: show_submenu .4s;
+ -ms-animation: show_submenu .4s;
+ -o-animation: show_submenu .4s;
+ animation: show_submenu .4s;
+ }
+ }
+ }
+ }
+
+ .sub-menu {
+ @include box-shadow( rgba(black, .6) 0 5px 5px );
+ position: absolute;
+ left: 0; top: 68px;
+ display: none;
+ width: 420px;
+ background-color: #2b2d2e;
+ padding: 10px 15px;
+
+ .lead {
+ @include box-shadow( #414141 0 1px 0 );
+ display: block;
+ margin-bottom: 10px;
+ padding-bottom: 5px;
+ border-bottom: 1px solid black;
+ font: {
+ size: em(13);
+ weight: $light;
+ }
+ color: #8d8d8d;
+ }
+
+ .messages {
+ li {
+ @include clear;
+ margin-bottom: 5px;
+
+ &:last-child {
+ margin: 0;
+ }
+
+ .meta {
+ -webkit-font-smoothing: inherit;
+ display: block;
+ font: {
+ family: $open;
+ size: 10px;
+ }
+ color: $gray-boulder;
+
+ .name {
+ color: #b5b5b5;
+
+ &:after {
+ content: ' | ';
+ color: $gray-boulder;
+ }
+ }
+ }
+
+ figure {
+ float: left;
+ margin-right: 10px;
+ }
+
+ article {
+ float: right;
+ width: 320px;
+ font: {
+ size: 12px;
+ weight: $light;
+ }
+ color: #d7d7d7;
+ }
+
+ a {
+ &:hover {
+ text-decoration: underline;
+ }
+ }
+ }
+ }
+
+ .projects {
+ li {
+ float: left;
+ margin: 0 10px 5px 0;
+
+ &:nth-child(5n) {
+ margin-right: 0;
+ }
+
+ a {
+ &:hover {
+ img {
+ @include hover;
+ border: 2px solid transparent;
+ }
+ }
+ }
+ }
+ }
+
+ .more {
+ font-size: em(13);
+ text-align: right;
+
+ a {
+ color: #8d8d8d;
+
+ &:after {
+ margin-left: 5px;
+ font-family: $icons;
+ content: '\e811';
+ color: #7f7f7f;
+ }
+
+ &:hover {
+ color: $green-cari;
+
+ &:after {
+ color: #7f7f7f;
+ }
+ }
+ }
+ }
+ }
+}
diff --git a/app/sass/blocks/_nav-social.scss b/app/sass/blocks/_nav-social.scss
new file mode 100755
index 000000000..8c22512c8
--- /dev/null
+++ b/app/sass/blocks/_nav-social.scss
@@ -0,0 +1,22 @@
+.nav-social {
+ li {
+ display: inline-block;
+ }
+
+ [class^="icon-"] {
+ color: $gray-iron;
+ font-size: em(26);
+
+ @media screen and ( max-width: $ultrabook+px ) {
+ font-size: em(24);
+ }
+
+ @media screen and ( max-width: $netbook+px ) {
+ font-size: em(20);
+ }
+
+ &:hover {
+ color: $turquoise;
+ }
+ }
+}
\ No newline at end of file
diff --git a/app/sass/blocks/_nav.scss b/app/sass/blocks/_nav.scss
new file mode 100755
index 000000000..a27647fc3
--- /dev/null
+++ b/app/sass/blocks/_nav.scss
@@ -0,0 +1 @@
+// Styles for main navigation
diff --git a/app/sass/blocks/_top-bar.scss b/app/sass/blocks/_top-bar.scss
new file mode 100755
index 000000000..fbbad991d
--- /dev/null
+++ b/app/sass/blocks/_top-bar.scss
@@ -0,0 +1,258 @@
+#top-bar {
+ position: relative; z-index: 15;
+ background-color: $gray-shark;
+ height: 68px;
+ margin-bottom: 20px;
+ color: white;
+
+ @media screen and ( max-width: $tablet_landscape - 1 + px ) {
+ display: none;
+ }
+
+ .text {
+ display: inline-block;
+ margin-right: 15px;
+ line-height: 68px;
+ font-size: em(14);
+ }
+
+ .panel-select {
+ position: absolute;
+ top: 15px; z-index: 10;
+
+ .text {
+ float: right;
+ margin-right: 15px;
+ line-height: 36px;
+ font: {
+ size: em(12);
+ weight: $light;
+ }
+ color: #959595;
+
+ @media screen and ( max-width: $netbook+px ) {
+ display: none;
+ }
+ }
+
+ .sbHolder {
+ float: right;
+ width: 180px;
+ }
+
+ .sbSelector {
+ @include antialias;
+ @include gradient(#313536, #292c2d);
+ @include border-radius(3px);
+ @include box-shadow( rgba(0,0,0,.28) 0 1px 1px);
+ @include text-shadow( rgba(0,0,0,.28) 0 1px 1px);
+ border: 1px solid rgba(white, .1);
+ border-bottom: none;
+ text-transform: uppercase;
+ font: {
+ family: $proxima;
+ size: em(14);
+ weight: $semibold;
+ }
+ color: $gray-mercury;
+ }
+
+ .sbOptions {
+ @include box-shadow(rgba(0,0,0,.3) 0 2px 4px);
+ background-color: #2c2d2f;
+
+ li {
+ a {
+ margin: 1px 0;
+ padding: 3px 10px;
+ text-transform: uppercase;
+ font: {
+ size: em(11);
+ weight: $light;
+ }
+ color: $gray-mercury;
+
+ &:hover {
+ color: white;
+ }
+ }
+ }
+ }
+
+ .sbToggle {
+ @include border-top-right-radius(5px);
+ @include border-bottom-right-radius(5px);
+
+ &:after {
+ position: absolute;
+ left: 0; top: 0; z-index: 5;
+ width: 100%; height: 100%;
+ line-height: 34px;
+ font: {
+ family: $icons;
+ size: 12px;
+ }
+ content: '\e80f';
+ color: white;
+ }
+ }
+ }
+
+ &.not-logged {
+ .btn {
+ @include antialias;
+ height: 28px;
+ border: 1px solid white;
+ padding: 0 50px 0 10px;
+ line-height: 26px;
+ text-transform: uppercase;
+ font: {
+ family: $proxima;
+ weight: $bold;
+ }
+
+ &:hover {
+ color: $turquoise;
+ }
+
+ &:after {
+ position: absolute; right: 0; top: 0;
+ display: block;
+ width: 32px; height: 26px;
+ border-left: 1px solid white;
+ }
+
+ &.login {
+ margin-right: 15px;
+
+ &:after {
+ background: {
+ image: url(../assets/icon-login.png);
+ repeat: no-repeat;
+ position: center center;
+ }
+ content: ' ';
+ }
+ }
+
+ &.register {
+ &:after {
+ text-align: center;
+ font: {
+ family: $icons;
+ size: em(12);
+ style: normal;
+ weight: normal;
+ }
+ speak: none;
+ line-height: 24px;
+ content: '\e80a';
+ }
+ }
+ }
+
+ .container {
+ padding: 0 50px;
+ }
+
+ .panel-select {
+ right: 50px;
+
+ .sbOptions {
+ li {
+ a {
+ &:hover {
+ background-color: $turquoise;
+ }
+ }
+ }
+ }
+
+ .sbToggle {
+ @include gradient(#00daa8, #009271);
+ border-top: 1px solid #33ffd1;
+ }
+ }
+ }
+
+ &.logged {
+ .container {
+ padding: 0 10px;
+ }
+
+ .panel-select {
+ right: 50px;
+
+ .sbOptions {
+ li {
+ a {
+ &:hover {
+ @include gradient(#ff0015, #d20414);
+ }
+ }
+ }
+ }
+
+ .sbToggle {
+ @include gradient(#ff0015, #d20414);
+ border-top: 1px solid #ff0015;
+ }
+ }
+ }
+
+ .user-info {
+ display: inline-block;
+ margin-right: 35px;
+ padding-top: 11px;
+ font-size: em(14);
+
+ .info {
+ display: inline-block;
+ vertical-align: middle;
+ line-height: 1.2;
+ }
+
+ .name {
+ white-space: nowrap;
+ font: {
+ size: 16px;
+ weight: $semibold;
+ }
+ color: $green-cari;
+
+ &:hover {
+ text-decoration: underline;
+ }
+ }
+
+ .logout {
+ display: block;
+ font-size: em(11);
+ color: $gray-boulder;
+
+ &:after {
+ margin-left: 5px;
+ font-family: $icons;
+ content: '\e811';
+ color: #7c7c7c;
+ }
+
+ &:hover {
+ color: $green-cari;
+
+ &:after {
+ color: #7c7c7c;
+ }
+ }
+ }
+
+ .photo {
+ display: inline-block;
+ width: 50px; height: 46px;
+ border: 1px solid #5e5e5e;
+ margin-right: 10px;
+ vertical-align: middle;
+ }
+ }
+}
+
diff --git a/app/sass/inc/_buttons.scss b/app/sass/inc/_buttons.scss
new file mode 100755
index 000000000..6175d695f
--- /dev/null
+++ b/app/sass/inc/_buttons.scss
@@ -0,0 +1,4 @@
+.btn {
+ display: inline-block;
+ position: relative;
+}
\ No newline at end of file
diff --git a/app/sass/inc/_fonts.scss b/app/sass/inc/_fonts.scss
new file mode 100755
index 000000000..db4b8743c
--- /dev/null
+++ b/app/sass/inc/_fonts.scss
@@ -0,0 +1,5 @@
+@include font-face-db( "Icons", "fontello", normal);
+@include font-face-db( "Proxima Nova", "ProximaNovaLight", 300);
+@include font-face-db( "Proxima Nova", "ProximaNovaBold", 700);
+@import url( "http://fonts.googleapis.com/css?family=Open+Sans:300,400italic,400,600&subset=latin" );
+@import url( "http://fonts.googleapis.com/css?family=Montserrat" );
diff --git a/app/sass/inc/_form.scss b/app/sass/inc/_form.scss
new file mode 100755
index 000000000..7daecb53f
--- /dev/null
+++ b/app/sass/inc/_form.scss
@@ -0,0 +1,28 @@
+button,
+input[type='submit'] {
+ @include hover;
+ cursor: pointer;
+}
+
+input,
+textarea {
+ -webkit-appearance: none;
+ border-radius: 0;
+}
+
+input, button, textarea {
+ background-color: transparent;
+ border: none;
+ outline: none;
+ line-height: 1.5;
+ font-family: $text;
+ font-size: #{$base-font-size}px;
+}
+
+textarea {
+ resize: none;
+}
+
+input[type=text] {
+ width: 100%;
+}
\ No newline at end of file
diff --git a/app/sass/inc/_functions.scss b/app/sass/inc/_functions.scss
new file mode 100755
index 000000000..8bb3e375c
--- /dev/null
+++ b/app/sass/inc/_functions.scss
@@ -0,0 +1,7 @@
+@function em( $target, $context: $base-font-size ) {
+ @return ( $target / $context ) * 1em;
+}
+
+@function grid( $width, $context: $grid-base-width ) {
+ @return percentage( $width / $context );
+}
\ No newline at end of file
diff --git a/app/sass/inc/_icons.scss b/app/sass/inc/_icons.scss
new file mode 100755
index 000000000..53867f93b
--- /dev/null
+++ b/app/sass/inc/_icons.scss
@@ -0,0 +1,20 @@
+.icon-twitter:before { content: '\e800'; } /* '' */
+.icon-facebook:before { content: '\e801'; } /* '' */
+.icon-linkedin:before { content: '\e802'; } /* '' */
+.icon-youtube:before { content: '\e803'; } /* '' */
+.icon-rss:before { content: '\e804'; } /* '' */
+.icon-heart-empty:before { content: '\e805'; } /* '' */
+.icon-heart:before { content: '\e806'; } /* '' */
+.icon-cancel:before { content: '\e807'; } /* '' */
+.icon-search:before { content: '\e808'; } /* '' */
+.icon-ok:before { content: '\e809'; } /* '' */
+.icon-plus:before { content: '\e80a'; } /* '' */
+.icon-down-dir:before { content: '\e80b'; } /* '' */
+.icon-up-open:before { content: '\e80c'; } /* '' */
+.icon-star-empty:before { content: '\e80d'; } /* '' */
+.icon-cw:before { content: '\e80e'; } /* '' */
+.icon-down-open:before { content: '\e80f'; } /* '' */
+.icon-left-open:before { content: '\e810'; } /* '' */
+.icon-right-open:before { content: '\e811'; } /* '' */
+.icon-bell:before { content: '\e812'; } /* '' */
+.icon-reply:before { content: '\e813'; } /* '' */
\ No newline at end of file
diff --git a/app/sass/inc/_mixins.scss b/app/sass/inc/_mixins.scss
new file mode 100755
index 000000000..68770dac9
--- /dev/null
+++ b/app/sass/inc/_mixins.scss
@@ -0,0 +1,80 @@
+@mixin antialias {
+ -webkit-font-smoothing: antialiased;
+ -moz-osx-font-smoothing: grayscale;
+}
+
+@mixin clear {
+ clear: both;
+
+ &:after {
+ clear: both;
+ display: block;
+ content: '';
+ }
+}
+
+@mixin font( $font-name, $font-size, $line-height ) {
+ @include antialias;
+ font-family: '#{$font-name}';
+ font-size: em($font-size);
+ line-height: #{$line-height}em;
+}
+
+@mixin font-face-db( $font-name, $font-filename, $font-weight ){
+ @font-face {
+ font-family: $font-name;
+ src: url('../font/' + $font-filename + '.eot');
+ src: url('../font/' + $font-filename + '.eot?#iefix') format('embedded-opentype'),
+ url('../font/' + $font-filename + '.woff') format('woff'),
+ url('../font/' + $font-filename + '.ttf') format('truetype'),
+ url('../font/' + $font-filename + '.svg#' + $font-filename ) format('svg');
+ font-weight: $font-weight; font-style: normal;
+ }
+}
+
+@mixin gradient( $start, $stop: darken( $start, 8% ), $dir: top ){
+ $experimental-support-for-svg: true;
+ //@include background( linear-gradient( $dir, $start, $stop ) );
+ @include background( linear-gradient( $dir, $start, $stop ) );
+ @include filter-gradient($start, $stop, $dir);
+}
+/* @include gradient( darken( red, 10% ), white ); */
+
+@mixin hide-text{
+ text-indent: -2007px;
+ overflow: hidden;
+}
+
+@mixin hover {
+ @include transition-property(all);
+ @include transition-duration(0.2s);
+}
+
+@mixin input-placeholder($selector: "") {
+ @if $experimental-support-for-webkit {
+ #{$selector}::-webkit-input-placeholder { @content; }
+ }
+ @if $experimental-support-for-mozilla {
+ #{$selector}:-moz-placeholder { @content; }
+ }
+ @if $experimental-support-for-microsoft {
+ #{$selector}:-ms-input-placeholder { @content; }
+ }
+}
+
+$prefixes: ("-webkit-","-moz-", "-o-", "");
+@mixin selection($color, $background) {
+ @each $prefix in $prefixes {
+ ::#{$prefix}selection {
+ color: $color;
+ background: $background;
+ }
+ }
+}
+
+@mixin wrapper {
+ @include clear;
+ position: relative; z-index: 10;
+ max-width: $grid-base-width+px;
+ margin: 0 auto;
+}
\ No newline at end of file
diff --git a/app/sass/inc/_select.scss b/app/sass/inc/_select.scss
new file mode 100755
index 000000000..aa4209afe
--- /dev/null
+++ b/app/sass/inc/_select.scss
@@ -0,0 +1,74 @@
+.sbHolder {
+ position: relative; z-index: 30;
+ width: 100%; height: 36px;
+}
+
+.sbSelector {
+ position: absolute;
+ left: 0; top: 0; z-index: 5;
+ display: block;
+ width: 100%; height: 36px;
+ line-height: 36px;
+ outline: none;
+ overflow: hidden;
+ text-indent: 10px;
+}
+
+.sbSelector:link, .sbSelector:visited, .sbSelector:hover{
+}
+
+.sbToggle {
+ display: block;
+ position: absolute; right: 0; top: 0; z-index: 10;
+ width: 36px; height: 36px;
+ text-align: center;
+ line-height: 36px;
+}
+
+.sbOptions {
+ @include border-bottom-left-radius(5px);
+ @include border-bottom-right-radius(5px);
+ position: absolute; top: 36px; left: 0; z-index: 1;
+ width: 100%;
+ overflow: hidden;
+ overflow-y: auto;
+ padding: 5px 0;
+
+ li {
+ a {
+ @include border-radius(3px);
+ display: block;
+ outline: none;
+ }
+ }
+}
+
+.sbOptions a:hover,
+.sbOptions a:focus,
+.sbOptions a.sbFocus{
+
+}
+
+.sbOptions li.last a {
+
+}
+
+.sbOptions .sbDisabled {
+
+}
+
+.sbOptions .sbGroup {
+
+}
+
+.sbOptions .sbSub {
+}
+
+
+.short {
+ .sbHolder,
+ .sbSelector,
+ .sbOptions {
+ width: 70px;
+ }
+}
\ No newline at end of file
diff --git a/app/sass/inc/_shared.scss b/app/sass/inc/_shared.scss
new file mode 100755
index 000000000..812480f94
--- /dev/null
+++ b/app/sass/inc/_shared.scss
@@ -0,0 +1,78 @@
+.align-center {
+ text-align: center;
+}
+
+.align-right {
+ text-align: right;
+}
+
+.clear {
+ @include clear;
+}
+
+.column {
+ width: 768px;
+ margin: 0 auto;
+
+ @media screen and ( max-width: $tablet_portrait + px ) {
+ width: 100%;
+ }
+
+ &.left {
+ @media screen and ( min-width: $tablet_landscape + 1 + px ) {
+ float: left;
+ width: grid(755);
+ }
+ }
+
+ &.right {
+ @media screen and ( min-width: $tablet_landscape + 1 + px ) {
+ float: right;
+ width: grid(760);
+ }
+ }
+}
+
+.container {
+ @include wrapper;
+
+ .fixed & {
+ padding-top: 235px;
+ }
+}
+
+[class^="icon-"]:before, [class*=" icon-"]:before {
+ font-family: $icons;
+ font-style: normal;
+ font-weight: normal;
+ speak: none;
+
+ display: inline-block;
+ text-decoration: inherit;
+ width: 1em;
+ margin-right: .2em;
+ text-align: center;
+ /* opacity: .8; */
+
+ /* For safety - reset parent styles, that can break glyph codes*/
+ font-variant: normal;
+ text-transform: none;
+
+ /* fix buttons height, for twitter bootstrap */
+ line-height: 1em;
+
+ /* Animation center compensation - margins should be symmetric */
+ /* remove if not needed */
+ margin-left: .2em;
+
+ /* you can be more comfortable with increased icons size */
+ /* font-size: 120%; */
+
+ /* Font smoothing. That was taken from TWBS */
+ -webkit-font-smoothing: antialiased;
+ -moz-osx-font-smoothing: grayscale;
+
+ /* Uncomment for 3D effect */
+ /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
+}
+
diff --git a/app/sass/inc/_typography.scss b/app/sass/inc/_typography.scss
new file mode 100755
index 000000000..26e296210
--- /dev/null
+++ b/app/sass/inc/_typography.scss
@@ -0,0 +1,116 @@
+body {
+ line-height: 1.5;
+ font: {
+ family: $text;
+ size: #{$base-font-size}px;
+ weight: $regular;
+ }
+ color: black;
+}
+
+a {
+ @include hover;
+ text-decoration: none;
+ color: inherit;
+ cursor: pointer;
+
+ &:after, &:before {
+ @include hover;
+ }
+}
+
+strong {
+ font-weight: $bold;
+}
+
+h1,h2,h3,h4,h5,h6 {
+ @include antialias;
+ line-height: 1;
+ font-family: $proxima;
+
+ &.bordered {
+ position: relative;
+ border-bottom: 1px solid $gray-boulder;
+ padding-bottom: 15px;
+
+ &:after {
+ position: absolute; left: 0; bottom: 0;
+ width: 90px; height: 3px;
+ display: block;
+ content: ' ';
+ }
+
+ &.blue-border {
+ &:after {
+ background-color: $blue;
+ }
+ }
+
+ &.yellow-border {
+ &:after {
+ background-color: $yellow;
+ }
+ }
+ }
+}
+
+// Colors
+
+.gray-nobel {
+ color: $gray-nobel;
+}
+
+.turquoise {
+ color: $turquoise;
+}
+
+.black-gradient {
+ @include antialias;
+ @include gradient(#313536, #292c2d);
+ @include border-radius(3px);
+ @include box-shadow( rgba(0,0,0,.28) 0 1px 1px);
+ @include text-shadow( rgba(0,0,0,.28) 0 1px 1px);
+ border: 1px solid rgba(white, .1);
+ border-bottom: none;
+ color: $gray-mercury;
+}
+
+.blue-bg {
+ background-color: $blue;
+
+ &:hover {
+ background-color: darken($blue, 10%);
+ }
+}
+
+.yellow-bg {
+ background-color: $yellow;
+
+ &:hover {
+ background-color: darken($yellow, 10%);
+ }
+}
+
+.red-bg {
+ background-color: $red;
+
+ &:hover {
+ background-color: darken($red, 10%);
+ }
+}
+
+.green-bg {
+ background-color: $green;
+
+ &:hover {
+ background-color: darken($green, 10%);
+ }
+}
+
+.green-light-bg {
+ background-color: $green-cari;
+
+ &:hover {
+ background-color: darken($green-cari, 10%);
+ }
+}
\ No newline at end of file
diff --git a/app/sass/inc/_variables.scss b/app/sass/inc/_variables.scss
new file mode 100755
index 000000000..2399010e6
--- /dev/null
+++ b/app/sass/inc/_variables.scss
@@ -0,0 +1,60 @@
+// Fonts
+
+$icons: 'Icons';
+$mont: 'Montserrat';
+$open: 'Open Sans', sans-serif;
+$proxima: 'Proxima Nova';
+
+
+// Typography
+
+$bold: 700;
+$light: 300;
+$regular: 400;
+$semibold: 600;
+
+
+// Colors
+
+$black-shark: #1d2123;
+$blue: #16b0ca;
+$gray: #878787;
+$gray2: #929191;
+$gray-boulder: #747474;
+$gray-dusty: #979797;
+$gray-emperor: #505050;
+$gray-iron: #d2d3d3;
+$gray-mercury: #e5e5e5;
+$gray-nobel: #b6b6b6;
+$gray-oslo: #909497;
+$gray-shaft: #3b3b3b;
+$gray-shaft2: #232323;
+$gray-shark: #1d2123;
+$gray-silver: #c4c4c4;
+$gray-silver2: #a3a3a3;
+$gray-thunder: #231f20;
+$gray-tundora: #454545;
+$green: #4a9f64;
+$green-cari: #00e2af;
+$green-jungle: #2fb69c;
+$red: #e4162a;
+$turquoise: #00e4ac;
+$yellow: #d0c70a;
+
+
+// Default
+
+$base-font-size: 15;
+$text: $open;
+$grid-base-width: 1546;
+
+
+// Breakpoints
+
+$tablet_landscape: 1024;
+$tablet_portrait: 768;
+$smartphone_landscape: 640;
+$smartphone_portrait: 480;
+
+$ultrabook: 1366;
+$netbook: 1280;
\ No newline at end of file
diff --git a/app/sass/main.scss b/app/sass/main.scss
new file mode 100755
index 000000000..cd8191ee9
--- /dev/null
+++ b/app/sass/main.scss
@@ -0,0 +1,72 @@
+// Compass imports
+@import "compass/reset";
+@import "compass/css3";
+
+// Custom includes
+@import "inc/variables";
+@import "inc/functions";
+@import "inc/mixins";
+@import "inc/fonts";
+@import "inc/icons";
+@import "inc/typography";
+@import "inc/buttons";
+@import "inc/shared";
+@import "inc/form";
+@import "inc/select";
+
+// Blocks includes
+@import "blocks/additions";
+@import "blocks/content-list";
+@import "blocks/footer";
+@import "blocks/forum";
+@import "blocks/header";
+@import "blocks/jobs";
+@import "blocks/highlights";
+@import "blocks/main-menu";
+@import "blocks/nav";
+@import "blocks/nav-account";
+@import "blocks/nav-social";
+@import "blocks/top-bar";
+
+body {
+ background-color: $gray-tundora;
+
+ &:after, &:before {
+ @include background-size(cover);
+ position: absolute;
+ left: 0;
+ z-index: 5;
+ display: block;
+ width: 100%; height: 900px;
+ background: {
+ repeat: no-repeat;
+ position: center top;
+ }
+ content: ' ';
+ }
+
+ &:before {
+ top: 0;
+ background-image: url(../assets/bg-top.png);
+ }
+
+ &:after {
+ position: fixed;
+ bottom: 0;
+ background-image: url(../assets/bg-bottom.png);
+ }
+}
+
+
+body, html {
+ width: 100%; min-height: 100%; height: 100%;
+}
+
+html {
+ box-sizing: border-box;
+}
+
+*, *:before, *:after {
+ box-sizing: inherit;
+}
+
diff --git a/app/templates/index.mustache b/app/templates/index.mustache
index e3b8d5447..37dc3e464 100644
--- a/app/templates/index.mustache
+++ b/app/templates/index.mustache
@@ -1,46 +1,196 @@
+
| temat | +kategoria | +odpowiedzi | +odsłony | +użytkownicy | +
|---|---|---|---|---|
| + {{title}} + | ++ Forum i warsztat + | ++ 12 + | ++ + 166 + + | +
+
+ 
+
+
+
+
+
+
+
+ |
+
| temat | +kategoria | +odpowiedzi | +odsłony | +użytkownicy | +
|---|---|---|---|---|
| + {{title}} + | ++ Forum i warsztat + | ++ 12 + | ++ + 166 + + | +
+
+
+
+
+
+
+
+
+
+ |
+
-
+
+
+ {{> ../partials/top-bar}}
+
+
+ Witaj, Nieznajomy. Obecnie jesteś niezalogowany. bądź
-
-
-
+
+ {{> ../partials/javascript}}
+
\ No newline at end of file
diff --git a/gulpfile.js b/gulpfile.js
index ecebc40e4..887bceb35 100644
--- a/gulpfile.js
+++ b/gulpfile.js
@@ -5,6 +5,9 @@ var ghPages = require('gulp-gh-pages');
var runSequence = require('run-sequence');
var watch = require('gulp-watch');
var shell = require('gulp-shell').task;
+var sass = require('gulp-sass')
+var compass = require('compass-importer')
+
gulp.task('serve', ['build', 'watch'], serve('./dist/public'));
@@ -117,9 +120,37 @@ gulp.task('assets-highlights', function() {
.pipe(gulp.dest('./dist/public/assets/highlights'));
});
-gulp.task('assets', ['assets-app', 'assets-highlights']);
+gulp.task('assets-js', function() {
+ return gulp.src('app/js/**/*')
+ .pipe(gulp.dest('./dist/public/js'));
+});
+
+gulp.task('assets-css', function() {
+ return gulp.src('app/css/**/*')
+ .pipe(gulp.dest('./dist/public/css'));
+});
+
+gulp.task('assets-font', function() {
+ return gulp.src('app/font/**/*')
+ .pipe(gulp.dest('./dist/public/font'));
+});
+
+gulp.task('assets', ['assets-app', 'assets-js', 'assets-css', 'assets-font', 'assets-highlights']);
gulp.task('CNAME', function() {
return gulp.src('CNAME')
.pipe(gulp.dest('./dist/public'));
});
+
+gulp.task('sass', function()
+{
+ return gulp.src('./app/sass/**/*.scss')
+ .pipe(sass({ importer: compass }).on('error', sass.logError))
+ .pipe(sass({outputStyle: 'compressed'}))
+ .pipe(gulp.dest('./app/css'));
+
+});
+
+gulp.task('sass:watch', function () {
+ gulp.watch('./app/sass/**/*.scss', ['sass']);
+});
diff --git a/package.json b/package.json
index c8ee44766..cb1715946 100644
--- a/package.json
+++ b/package.json
@@ -9,6 +9,7 @@
"gulp-run": "^1.6.10"
},
"devDependencies": {
+ "compass-importer": "^0.1.3",
"gulp": "^3.9.0",
"gulp-concat": "^2.6.0",
"gulp-ext-replace": "^0.2.0",
@@ -19,6 +20,7 @@
"gulp-mustache": "^1.1.1",
"gulp-rename": "^1.2.2",
"gulp-rm": "^1.0.0",
+ "gulp-sass": "^2.1.1",
"gulp-serve": "^1.0.0",
"gulp-shell": "^0.5.1",
"gulp-watch": "^4.3.5",
-
-
-
-
-
- {{> ../partials/highlights }}
-
-
- {{#topics}}
- {{#topic_list}}
- {{> ../partials/topics }}
- {{/topic_list}}
- {{/topics}}
-
-
-
-
-
-
-
+
+
+ - Gamedev.pl -
- - -
+ gamedev
+
+
+
+
+ Co nowego?
+ + archiwum + + {{> ../partials/highlights }} +
+
+
+
+
+
+
+
+
+
+ 
+
+
+
+ {{#topics}}
+ {{#topic_list}}
+ {{> ../partials/topics }}
+ {{/topic_list}}
+ {{/topics}}
+
+
+
+
+
+
+ {{> ../partials/jobs }}
+
+
+
+
+
+
+
+
+
+ Oferty pracy
+ + + + + + 1-50 z 300 +
+
+
+
+
+
+
+ O Gamedev.pl
+ ++ Lorem Ipsum jest tekstem stosowanym jako przykładowy wypełniacz w przemyśle poligraficznym. Został po raz pierwszy użyty w XV w. przez nieznanego drukarza do wypełnienia tekstem próbnej książki. +
+ ++ Pięć wieków później zaczął być używany przemyśle elektronicznym, pozostając praktycznie niezmienionym. Spopularyzował się w latach 60. XX w. wraz z publikacją arkuszy Letrasetu. +
+ + +