Cleans scss files

This commit is contained in:
Alberto Garcia Cabeza
2015-08-15 01:20:26 +02:00
parent 510a5c8332
commit 3ab3285ce4
2 changed files with 168 additions and 124 deletions

View File

@@ -13,7 +13,7 @@
@mixin votes {
background: $votes-bg;
border-top: 1px solid $votes-border;
margin: 0 -12px;
margin: 0 rem-calc(-12);
padding: rem-calc(14) rem-calc(12);
position: relative;
@@ -21,7 +21,7 @@
background: white;
border: 2px solid $votes-border;
border-radius: rem-calc(3);
color: $votes-neutral;
color: $text-light;
display: inline-block;
font-size: rem-calc(30);
line-height: rem-calc(30);
@@ -45,7 +45,7 @@
background: white;
border: 2px solid $votes-border;
border-radius: rem-calc(3);
color: $votes-neutral;
color: $text-light;
display: inline-block;
font-size: rem-calc(30);
line-height: rem-calc(30);
@@ -70,7 +70,7 @@
vertical-align: super;
span {
color: $votes-text;
color: white;
display: inline-block;
font-size: rem-calc(16);
font-weight: lighter;
@@ -107,7 +107,7 @@
}
.total-votes {
color: $votes-text;
color: white;
float: right;
line-height: $line-height*2;
}
@@ -117,12 +117,12 @@
}
.not-logged {
background: $not-logged-bg;
background: rgba(22,99,135,.9);
color: white;
height: 100%;
left: 0;
line-height: $line-height*2;
padding-top: $line-height/2;
padding-top: rem-calc(12);
position: absolute;
text-align: center;
top: 0;
@@ -149,11 +149,11 @@
border: 1px solid;
border-color: #e5e6e9 #dfe0e4 #d0d1d5;
border-radius: rem-calc(3);
margin-bottom: $line-height;
margin-bottom: rem-calc(24);
padding: rem-calc(24) rem-calc(12) 0 rem-calc(12);
.debate-content {
min-height: $line-height*14.71;
min-height: rem-calc(353);
}
.label {
@@ -173,7 +173,7 @@
line-height: $line-height;
position: absolute;
right: rem-calc(18);
top: rem-calc(24);
top: rem-calc(12);
}
h3 {
@@ -183,7 +183,7 @@
a {
clear: both;
color: $header-color;
color: $text;
display: block;
font-size: rem-calc(16);
line-height: $line-height;
@@ -191,7 +191,7 @@
}
.debate-info {
color: $text-light;
color: $text-medium;
font-weight: lighter;
margin-bottom: 0;
@@ -201,22 +201,22 @@
}
a {
color: $text-light;
color: $text-medium;
}
}
.debate-description {
color: $text-color;
color: $text;
font-size: rem-calc(13);
height: $line-height*6.5;
height: rem-calc(156);
line-height: $line-height;
margin-bottom: $line-height/2;
margin-top: $line-height;
margin-bottom: rem-calc(12);
margin-top: rem-calc(24);
overflow: hidden;
position: relative;
a {
color: $text-color;
color: $text;
}
}
@@ -230,10 +230,10 @@
}
p {
color: $text-color;
color: $text;
font-size: rem-calc(13);
line-height: $line-height;
margin-bottom: $line-height/2;
margin-bottom: rem-calc(12);
}
}
@@ -243,8 +243,8 @@
}
.debates-list {
margin-bottom: $line-height*2;
margin-top: $line-height;
margin-bottom: rem-calc(48);
margin-top: rem-calc(24);
}
.debate {
@@ -253,12 +253,13 @@
margin-top: 0;
.panel {
border: 0;
margin-bottom: 0;
min-height: $line-height*8;
min-height: rem-calc(192);
padding: 0 rem-calc(12) rem-calc(2) rem-calc(12);
&:first-child {
padding-top: $line-height;
padding-top: rem-calc(24);
}
.label {
@@ -268,7 +269,7 @@
h3 {
margin-top: 0;
min-height: $line-height*2;
min-height: rem-calc(48);
}
p {
@@ -291,13 +292,29 @@
}
.debate-description {
height: $line-height*3;
height: rem-calc(72);
margin-top: 0;
}
}
.votes {
border: 0;
border: 1px solid $votes-border;
border-top-left-radius: 3px;
border-bottom-left-radius: 3px;
margin: 0 rem-calc(-24) 0 rem-calc(12);
&:after {
content: "";
position: absolute;
display: block;
border-style: solid;
border-color: #166387 transparent transparent transparent;
bottom: rem-calc(-14);
border-left-width: 0;
border-right-color: transparent;
right: rem-calc(-1);
border-width: 1em 1em 0 0;
}
.total-votes {
display: block;
@@ -308,7 +325,7 @@
.like {
span {
color: $votes-text;
color: white;
display: block;
line-height: $line-height/2;
}
@@ -316,21 +333,17 @@
.not-logged {
line-height: $line-height;
padding-top: $line-height*1.5;
padding-top: rem-calc(36);
}
}
}
.sidebar {
margin-top: $line-height;
}
// 03. Show
// - - - - - - - - - - - - - - - - - - - - - - - - -
.debate-show {
background: white;
padding: rem-calc(24) rem-calc(12) rem-calc(48);
padding: rem-calc(24) rem-calc(12) 0;
.back {
@include back;
@@ -344,19 +357,18 @@
clear: both;
font-size: rem-calc(24);
font-weight: bold;
line-height: $line-height*2;
margin: 0;
}
.debate-info {
clear: both;
color: $text-light;
color: $text-medium;
font-weight: lighter;
line-height: $line-height*2;
text-align: justify;
a {
color: $text-light;
color: $text-medium;
}
.bullet {
@@ -375,29 +387,19 @@
display: inline-block;
height: 32px;
line-height: $line-height*2;
margin-right: $line-height/4;
margin-right: rem-calc(6);
vertical-align: middle;
width: 32px;
}
.author {
color: $text-color;
color: $text;
font-weight: bold;
}
.sidebar-divider {
border-top: 1px solid $border;
margin-top: $line-height;
&:first-child {
margin-top: 0;
}
}
h3 {
border-top: 1px solid $votes-border;
display: inline-block;
font-family: $font-family-sans-serif;
font-size: rem-calc(16);
margin: -1px 0 rem-calc(12);
padding-top: rem-calc(6);
@@ -406,7 +408,8 @@
.votes {
@include votes;
border: 0;
border: 1px solid $votes-border;
border-radius: rem-calc(3);
margin: 0;
.total-votes {
@@ -417,18 +420,22 @@
.not-logged {
line-height: $line-height;
padding: $line-height;
padding: rem-calc(24);
}
}
.leave-comment {
display: inline-block;
margin-top: $line-height;
margin-top: rem-calc(24);
}
.tags {
display: block;
margin-top: $line-height;
margin-top: rem-calc(24);
a {
margin-right: rem-calc(6);
}
}
}
@@ -437,7 +444,7 @@
.debate-new {
background: white;
padding-top: $line-height;
padding-top: rem-calc(24);
.back {
@include back;
@@ -448,7 +455,7 @@
font-size: rem-calc(36);
font-weight: bold;
line-height: $line-height*2;
margin-bottom: $line-height;
margin-bottom: rem-calc(24);
}
.icon-comment-quotes {
@@ -469,7 +476,7 @@
.recommendations {
list-style-type: none;
margin-left: 0;
margin-top: $line-height;
margin-top: rem-calc(24);
li {
font-size: rem-calc(12);
@@ -488,34 +495,42 @@
// - - - - - - - - - - - - - - - - - - - - - - - - -
.comments {
background: $comments-bg;
background-image: url('comments_divider.png');
background: $white;
background-repeat: repeat-x;
padding-top: $line-height;
padding-bottom: $line-height*4;
padding-top: rem-calc(24);
padding-bottom: rem-calc(96);
h2 {
margin: 0;
font-weight: bold;
span {
font-size: rem-calc(14);
font-weight: normal;
opacity: .8;
}
}
.comment {
margin: $line-height/4 0;
margin: rem-calc(6) 0;
p {
color: $comments-text;
margin-bottom: 0;
}
.comment-votes {
color: $comments-info;
color: $text-medium;
font-weight: lighter;
margin: rem-calc(15) rem-calc(6) 0;
a {
color: $comments-info;
color: $text-light;
display: inline-block;
vertical-align: top;
&:hover {
color: $text-medium;
}
}
[class^="icon-"] {
@@ -535,7 +550,7 @@
}
.comment-body {
margin-left: $line-height*1.6;
margin-left: rem-calc(36);
.reply {
background: white;
@@ -549,24 +564,24 @@
.comment-children {
border-left: 1px dashed $border;
margin-left: $line-height*1.6;
padding-left: $line-height/4;
margin-left: rem-calc(36);
padding-left: rem-calc(6);
@media only screen and (max-width: 40em) {
margin-left: $line-height/1.5;
margin-left: rem-calc(16);
}
}
.comment-info {
color: $comments-info;
color: $text-light;
font-size: rem-calc(13);
font-weight: lighter;
vertical-align: middle;
span {
color: $text-color;
color: $text;
font-weight: bold;
}
}
}
}
}

View File

@@ -2,7 +2,7 @@
//
// 01. Variables
// 02. Mixins
// 02. Global styles
// 03. Global styles
// 04. Header
// 05. Footer
// 06. Tags
@@ -30,7 +30,7 @@
a {
color: white;
font-family: 'Lato';
font-family: 'Lato' !important;
font-size: rem-calc(20);
font-weight: lighter;
line-height: $line-height*4;
@@ -43,7 +43,7 @@
}
@media (min-width: 480px) {
font-size: rem-calc(30);
font-size: rem-calc(28);
span {
font-size: rem-calc(20);
}
@@ -60,17 +60,22 @@
}
body {
background: $background;
background: $body;
font-family: $font-family-sans-serif;
font-size: rem-calc(13);
font-weight: normal;
text-rendering: optimizeLegibility;
&::selection, ::-moz-selection {
background: $brand !important;
color: white !important;
}
}
p {
font-size: rem-calc(13);
line-height: $line-height;
margin-bottom: $line-height/2;
margin-bottom: rem-calc(12);
}
a {
@@ -81,6 +86,10 @@ a {
}
}
h1, h2, h3, h4, h5, h6 {
font-family: $font-family-sans-serif;
}
.button {
padding: rem-calc(15) rem-calc(32);
}
@@ -101,9 +110,18 @@ a {
max-width: 100% !important;
}
::selection, ::-moz-selection {
background: $brand;
color: white;
.sidebar {
margin-top: rem-calc(24);
margin-bottom: rem-calc(48);
}
.sidebar-divider {
border-top: 1px solid $border;
margin-top: rem-calc(24);
&:first-child {
margin-top: 0;
}
}
// 04. Header
@@ -113,10 +131,10 @@ header {
background: url('home_header_bg.jpg');
background-position: 50% 50%;
background-size: cover;
min-height: $line-height*20;
min-height: rem-calc(480);
&.results {
min-height: $line-height*8;
min-height: rem-calc(192);
}
h1 {
@@ -124,7 +142,7 @@ header {
font-size: rem-calc(45);
font-weight: bolder;
line-height: $line-height*3;
margin: $line-height 0 0 0;
margin: rem-calc(24) 0 0 0;
padding: 0;
}
@@ -139,14 +157,14 @@ header {
.button {
color: white;
font-family: inherit;
margin-top: $line-height;
margin-top: rem-calc(24);
}
.home-page {
.button {
color: white;
font-family: inherit;
margin-top: $line-height*2;
margin-top: rem-calc(48);
}
}
@@ -192,7 +210,7 @@ header {
.top-bar {
background: rgba(0,0,0,.5);
color: white;
height: $line-height*4;
height: rem-calc(96);
max-width: 1170px !important;
.name a {
@@ -209,13 +227,13 @@ header {
}
img {
margin-right: $line-height/2;
margin-right: rem-calc(12);
}
}
}
.top-bar-section {
margin-right: $line-height;
margin-right: rem-calc(24);
ul li > a {
font-size: rem-calc(14);
@@ -238,7 +256,7 @@ header {
li.active:not(.has-form) a:not(.button) {
background: none;
height: $line-height*4;
height: rem-calc(96);
line-height: $line-height*4;
}
}
@@ -246,11 +264,11 @@ header {
.top-links {
color: white;
font-size: rem-calc(14);
height: $line-height*3;
padding: $line-height/2 0;
height: rem-calc(72);
padding: rem-calc(12) 0;
@media (min-width: 480px) {
height: $line-height*2;
height: rem-calc(48);
}
a {
@@ -289,28 +307,26 @@ footer {
padding-top: $line-height;
}
// 06. Tags
// - - - - - - - - - - - - - - - - - - - - - - - - -
.tags {
a {
background: $tags-bg;
border: 1px solid $tags-border;
background: $background;
border: 1px solid $border;
border-radius: 3px;
color: $tags-color;
color: $text-medium;
display: inline-block;
font-size: rem-calc(13);
line-height: rem-calc(22);
margin-bottom: rem-calc(8);
margin-right: rem-calc(8);
padding: 0 rem-calc(6);
&:hover {
color: $link;
cursor: pointer;
background: $tags-bg-hover;
background: #E5F1F8;
border: 1px solid $brand;
}
}
@@ -320,14 +336,17 @@ footer {
@extend .tags;
h3 {
font-size: rem-calc(24);
font-weight: bold;
line-height: $line-height*2;
margin: 0;
border-top: 1px solid $votes-border;
display: inline-block;
font-family: $font-family-sans-serif;
font-size: rem-calc(16);
margin: -1px 0 rem-calc(12);
padding-top: rem-calc(6);
text-transform: uppercase;
}
a {
padding: $line-height/4 $line-height/3;
padding: rem-calc(6) rem-calc(8);
.label {
color: white;
@@ -347,10 +366,10 @@ footer {
.auth-page {
background: url('auth_bg.jpg');
margin-top: $line-height;
margin-top: rem-calc(24);
@media (min-width: 480px) {
margin-top: $line-height*2;
margin-top: rem-calc(48);
}
h1 {
@@ -359,7 +378,7 @@ footer {
}
.auth {
min-height: $line-height*20;
min-height: rem-calc(480);
h2 {
clear: both;
@@ -372,10 +391,6 @@ footer {
@include back;
}
.simple_captcha {
margin-bottom: $line-height/2;
}
.panel {
background: white;
border: 0;
@@ -399,10 +414,15 @@ form {
input[type]:not([type=submit]):not([type=file]) {
background: $input-bg;
height: $line-height*2;
height: rem-calc(48);
margin-bottom: rem-calc(16);
}
input[type="checkbox"] {
height: rem-calc(24) !important;
margin: 0 !important;
}
input[type=file] {
margin: rem-calc(12) 0;
}
@@ -414,18 +434,31 @@ form {
}
.ckeditor {
margin-bottom: $line-height;
min-height: $line-height*14;
margin-bottom: rem-calc(24);
min-height: rem-calc(336);
}
.checkbox {
display: inline-block;
font-size: rem-calc(14);
font-weight: normal;
line-height: $line-height*2;
line-height: $line-height;
margin: 0 0 0 rem-calc(6);
vertical-align: top;
}
.captcha {
border: 0;
padding: rem-calc(12) 0;
input {
margin-bottom: 0 !important;
}
}
.button {
margin-top: rem-calc(24);
}
}
// 09. Alerts
@@ -463,18 +496,14 @@ form {
.account {
background: white;
padding-top: $line-height;
input[type="checkbox"], .checkbox {
margin-top: -(rem-calc(12));
}
padding-top: rem-calc(24);
h1 {
clear: both;
font-size: rem-calc(36);
font-weight: bold;
line-height: $line-height*2;
margin-bottom: $line-height;
margin-bottom: rem-calc(24);
}
.icon-comment-quotes {
@@ -485,7 +514,7 @@ form {
}
.avatar {
margin-bottom: $line-height;
margin-bottom: rem-calc(24);
}
h2 {
@@ -494,7 +523,7 @@ form {
font-weight: bold;
line-height: $line-height;
margin: 0;
margin-bottom: $line-height/2;
margin-bottom: rem-calc(12);
}
h3 {
@@ -503,13 +532,13 @@ form {
font-weight: bold;
line-height: $line-height;
margin: 0;
margin-bottom: $line-height/2;
margin-bottom: rem-calc(12);
}
.recommendations {
list-style-type: none;
margin-left: 0;
margin-top: $line-height;
margin-top: rem-calc(24);
li {
font-size: rem-calc(12);
@@ -522,4 +551,4 @@ form {
}
}
}
}
}