Merge branch 'master' of https://code.grnet.gr/git/astakos
[astakos] / snf-astakos-app / astakos / im / static / im / css / styles.less
diff --git a/snf-astakos-app/astakos/im/static/im/css/styles.less b/snf-astakos-app/astakos/im/static/im/css/styles.less
deleted file mode 100644 (file)
index 1c50719..0000000
+++ /dev/null
@@ -1,865 +0,0 @@
-@import "../less/bootstrap.less";
-@import "../less/django_forms.less";
-@import "../less/tables.less";
-@import "../less/xtra.less";
-
-
-// mixins
-
-.border-box {
-    -moz-box-sizing: border-box;
-    -webkit-box-sizing: border-box;
-    box-sizing: border-box;
-    *behavior: url(boxsizing.htc);
-}
-
-.clearme { .clearfix() }
-
-@verticalSpacing: @gridGutterWidth/1.5;
-@gradCol: #ddd;
-body {
-    #font.main();
-    font-size: 12px;
-}
-
-.topbar {
-    background-color: @shadowColor;
-    .head {
-        float: left;    
-            padding: @verticalSpacing/2-5;
-    }
-    .links {
-        .clearfix();
-        a {
-            color: @black;
-            text-decoration: none;
-            display: block;
-            float: left;
-            margin-left: 10px;
-            padding: @verticalSpacing/2+1;
-
-            &:hover {
-                background-color: lighten(@black, 10%);
-                color: @white;
-            }
-        }
-
-        float: right;    
-    }
-}
-
-// default link styles
-section a, p a, form a, .section a, .styledlinks a, a.styled {
-    color: @black;
-    text-decoration: none;
-    border-bottom: 1px solid @linkColor;
-
-    &:hover {
-        color: @linkColor;
-    }
-
-    &.noborder {
-        border: none;   
-    }
-
-    em {
-        color: @blue;    
-    }
-}
-
-a.simple {
-    border: none;
-
-}
-a.action {
-    color: @linkColor;
-    border-bottom: none;
-}
-
-a img {
-    border-bottom: none;
-}
-
-// body borders
-.content-border {
-    border-right: 1px solid @mainBorderColor;
-    border-left: 1px solid @mainBorderColor;
-}
-
-.hidden {
-    display: none !important;
-}
-
-// container sizing
-.container, .topbar, .footer {
-    .fixed-container();
-    .content-border();
-    padding: 0 @siteWhiteSpace;
-}
-
-.container {
-    padding-bottom: @siteWhiteSpace;
-    background-color: @white;
-}
-
-.topbar {
-}
-
-
-div.header {
-    position: relative;
-    margin-top: 2.5*@verticalSpacing;
-    margin-bottom: @verticalSpacing;
-    h1 {
-        color: @shadowColor;
-        display: inline;
-        font-size: 2.3em;
-        border-bottom: 1px solid @shadowColor;
-        padding-bottom: 3px;
-    }
-}
-.mainlogo {
-    height: 36px;
-
-    h1 { height: 36px }
-    img {
-        margin-left: -10px;
-    }
-}
-
-.footer {
-    border-bottom: 1px solid @mainBorderColor;
-    border-top: 1px solid lighten(@mainBorderColor, 15%);
-    padding-top: @verticalSpacing;
-    padding-bottom: @verticalSpacing;
-}
-
-ul.inline {
-    .clearfix();
-    li {
-        display: block;    
-        float: left;
-        margin-right: 1em;
-    }
-}
-
-.mainnav.quicknav {
-    position: absolute;
-    right: 0;
-    top: -2.6*@verticalSpacing;
-    margin:0;
-
-    li {
-        margin-right:0;
-        margin-left: 1em;
-    }
-}
-
-.navigation {
-    height: 83px;    
-    position: absolute;
-    right: -15px;
-    top: -23px;
-}
-
-.mainnav {
-    font-size: 1.3em;
-    
-    &.subnav {
-        margin-bottom: -@verticalSpacing;
-        li {
-            margin-top: 0.4*@verticalSpacing;
-            float: right;
-        }
-    }
-
-    li {
-        margin-top: 2*@verticalSpacing;
-    }
-
-    li.active {
-        a {
-            /*border-bottom: 1px solid @linkColor;*/
-            border-bottom: none;
-            color: @linkColor;
-        }
-    }
-    a {
-        color: @black;
-        text-decoration: none;
-
-        &:hover {
-            border-bottom: 1px solid @linkColor;
-        }
-
-        &.active, &:active {
-            border-bottom: 1px solid @linkColor;
-            color: @linkColor;
-        }
-    }
-}
-
-.bottom-section {
-    .clearfix();
-
-    .section {
-        img {
-            width: 200px;    
-        }
-    }
-}
-
-.top-section {
-    .clearfix();
-}
-
-div.page {
-    .makeRow();
-    margin-top: 5*@verticalSpacing;
-    font-size: 1.1em;
-    .page-inner {
-        position: relative;    
-    }
-}
-
-// columnlayout
-.maincol {
-    position: relative;
-    .makeColumn(5);
-    
-    &.wide {
-        .makeColumn(6);    
-    }
-
-    &.full {
-        .makeRow();
-        margin-left: 0;
-        .makeColumn(10);
-    }
-
-    .nextlink {
-         margin-top: 60px;
-         text-align: right;
-         float: right;
-         margin-right: 50px;
-         font-size: 1.1em;
-    }   
-
-    .content-bottom { position: relative; .clearfix(); }
-}
-
-.backlink {
-    margin: 30px 0;    
-}
-
-.appbar {
-    height: 30px;
-    background-color: @blue;
-}
-
-.rightcol {
-    .makeColumn(4);
-    margin-left: 4*@gridGutterWidth + 14;
-
-    &.narrow {
-        .makeColumn(3);
-        margin-left: 4*@gridGutterWidth + 14;
-    }
-
-    input[type=text], input[type=password] {
-        width: 3*@gridColumnWidth + 4*@gridGutterWidth + 5;    
-    }
-}
-
-/* generic form styles */
-input, textarea, .form-widget {
-    background-color: @white;
-    color: @gray;
-    border-color: @black;
-}
-
-#forms {
-    .input, input {
-        #font.main();
-        border: 1px solid @gray;
-        height:21px;
-        display: inline-block;
-        margin-bottom: -1px;
-        padding: 0.8em;
-        padding-left: 1.5em;
-        z-index: 2;
-        &:focus {
-            position: relative;
-            border: 1px solid #000;
-            z-index: 100;
-
-            label {
-                z-index: 300;    
-            }
-        }
-    }
-}
-
-.altcol {
-    background-color: @altColor !important;
-
-    &:hover {
-        background-color: @linkColor !important;
-    }
-}
-
-.section {
-    
-    em {
-        color: @blue;
-    }
-
-    &.positioned {
-        margin-bottom: 0;
-        .content {
-            .makeColumn(4);
-        }
-
-        img {
-        }
-
-        &.withimg {
-            .img {
-                .makeColumn(4);
-            }
-
-            img {
-                float: left;    
-            }
-        }
-        
-        h3 {
-            font-size: 1.2em;
-            margin-bottom: @verticalSpacing;    
-        }
-
-        .text {
-            color: @black;    
-        }
-    }
-
-    margin-bottom: 3*@verticalSpacing; 
-
-    .left, .right {
-        width: 50%;
-        float: left;
-    }
-
-    &.imagelist {
-        margin-top: 2em;
-        .clearfix();
-        img {
-            float: left;    
-            margin-right: 4em;
-            vertical-align: middle;
-        }    
-    }
-}
-
-input[readonly=true] {
-    background-color: #ddd;
-    color: darken(#ddd, 50%);
-}
-
-form.withlabels {
-    label {
-        width: 3*@gridColumnWidth + 2*@gridGutterWidth;
-        display: block;
-        float: left;
-        padding-top: 1em;
-    }
-
-    input[type=text], input[type=password], textarea {
-        width: 3*@gridColumnWidth + 2*@gridGutterWidth;
-
-        &.long {
-            width: 3*@gridColumnWidth + 2*@gridGutterWidth;
-        }
-    }
-}
-
-
-.login-section {
-    a.button {
-        margin-bottom: 0.2*@gridColumnWidth;    
-        
-        &:last-child {
-            margin-bottom: none;    
-        }
-
-        &.withicon {
-            background-repeat: no-repeat;
-            background-position: 15px 50%;
-            padding-left: 40px;
-        }
-    }    
-
-    &.loggedin {
-        padding-bottom: 0 !important;
-        background-image: none !important;
-    }
-}
-
-
-@errorColor: lighten(@red, 30%);
-// forms
-form {
-    
-    &.login {
-        margin-bottom: 1.5*@verticalSpacing; 
-    }
-
-    h2 {
-        color: @black;
-        margin-bottom: @verticalSpacing;
-        font-size: 1.1em;
-
-        span {
-            padding-bottom: 3px;
-        }
-    }
-
-    .form-row {
-        min-height: 2*@verticalSpacing;
-        position: relative;
-        &.submit {
-            margin-top: 1.5*@verticalSpacing;
-        }
-
-        &.with-checkbox {
-            margin-top: 7px;    
-        }
-
-        .extra-link {
-            color: @gray;
-            text-decoration: none;
-            border: none;
-            font-size: 0.8em;
-            margin-top: 1.3em;
-            float: right;
-        }
-
-        label {
-            font-size: 1.1em;    
-        }
-    }
-    
-    &.innerlabels label { 
-        position: absolute;
-        top: 1.1em;
-        left: 1.5em;
-        color: #aaa;
-    }
-
-    &.innerlabels p {
-        display: table;
-        position: relative;    
-    }
-
-    textarea, input.text, input[type="text"], input[type="password"] {
-        #forms.input();
-    }
-
-    input.submit, input[type="submit"] {
-        .button();
-    }
-
-    
-    textarea {
-        height: 200px;
-        width: 350px !important;
-    }
-    .with-errors {
-        input, textarea, select {
-            color: @red;
-        }
-        label {
-            color: @errorColor;
-        }
-    }
-}
-
-.form-error {
-    background-color: @red;
-    color: #fff;
-    font-size: 0.8em;
-    padding: 5px 5px;
-}
-
-.form-errors.all {
-    .form-error {
-        position: relative;
-        border-radius: 0;
-        margin-bottom: 1.3em;
-        padding: 0.5em;
-    }
-}
-
-div.form-stacked {
-    margin-bottom: 4em;
-}
-// content types
-
-.rightcol .section {
-    background-image: url("../images/dashed_border.png");
-    background-repeat: repeat-x;
-    background-position: left bottom;
-    padding-bottom: 2*@verticalSpacing;
-    margin-bottom: 2*@verticalSpacing;
-
-}
-
-.section {
-    h2 {
-        font-size: 1.1em;
-        line-height: 1.3em;
-        margin-bottom: 1.5*@verticalSpacing;    
-
-        a {
-            color: #4085A6;
-            border: none;
-            line-height: 1.3em;
-        }
-    }
-
-    h3 {
-        font-size: 1.1em;    
-        line-height: 1.3em;
-        margin-bottom: 1.5*@verticalSpacing;    
-    }
-
-    p {
-        line-height: 1.7em;    
-    }
-
-    .section-img {
-        margin-bottom: 1*@verticalSpacing;    
-    }
-}
-
-
-// page messages
-.messages {
-    .makeColumn(10);
-
-    margin: 2em 0;
-    background-color: #ddd;
-    margin-left: 0;
-    font-size: 1.1em;
-    li {
-        padding: 1em;    
-
-        &.success { background-color: @green; color: @white }
-        &.error { background-color: @red; color: @white }
-        &.warning { background-color: #AF6906; color: @black }
-    }
-
-    .warning {
-        color: @white !important;   
-        a {
-            color: inherit;
-            font-weight: bold;
-        }
-    }
-
-}
-
-form.innerlabels label.checkbox-label {
-    position: relative !important; 
-    margin-left: 10px !important;
-    padding-top: 1em !important;
-    top:11px !important; 
-    left:10px;
-    cursor: pointer;
-}
-
-
-
-// accounts specific styles
-.service-desc {
-    margin-top: 4em;    
-
-}
-
-
-// invitations table
-table {
-
-    td.consumed {
-        color: @red;
-    }
-
-    tr.consumed {
-        td.consumed {
-            color: @green;    
-        }
-    }
-}
-
-
-.row { .makeRow() }
-
-// footer
-.footer {
-    .clearfix();
-    color: lighten(@gray, 20%);
-    .transit();
-
-    a { .transit() }
-
-    &:hover {
-        color: @gray !important;
-        a {
-            color: @gray !important;
-        }
-    }
-
-    a {
-        color: lighten(@gray, 20%);    
-        text-decoration: none;
-
-        &:hover {
-            color: #000 !important;
-        }
-    }
-
-    li {
-        margin-bottom: @verticalSpacing/2;
-
-        &.header {
-            margin-bottom: @verticalSpacing;    
-        }
-    }
-
-    .col {
-        .makeColumn(4);
-        &:last-child, &.last {
-            width: 140px;
-            margin-right:0;
-        }
-    }
-    
-    .top.row, .last.row {
-        .makeRow();
-        margin: 20px 0;
-
-        .col {
-            .makeColumn(4);    
-
-            &.first {
-                margin-left: 0 !important;    
-            }
-            &.last {
-                .makeColumn(2);    
-            }
-        }
-    }
-    .top.row {
-        margin-top: 0;
-    }
-    
-    .last.row { 
-        text-align: left; 
-        font-size: 0.8em;
-        margin-bottom: 0;
-    }
-
-    .bottom.row {
-        .col {
-            .makeColumn(2);    
-            &:last-child, &.last {
-                width: 140px;
-                margin-right:0;
-            }
-        }
-    }
-}
-
-
-/*pagination*/
-.pagination {
-    a.page {
-        display: inline !important;
-
-    }    
-}
-
-/*blog styles*/
-.blog-entries {
-
-}
-
-.blog-entry {
-
-    .section();
-    .clearfix();
-    margin-bottom: 2*@verticalSpacing;    
-
-    .title {
-        margin-bottom: 1em;    
-        font-size: 1.1em;
-        line-height: 1.4em;
-    }    
-
-    .media {
-        img {
-            border: 1px solid @gray;    
-        }    
-    }
-    
-    .intro-content, .content {
-        margin-top: @verticalSpacing;
-
-        object {
-            margin: @verticalSpacing 0;    
-        }
-    }
-
-    .entry-info {
-        font-size: 0.7em;
-        margin-top: @verticalSpacing;    
-    }
-
-    &.single {
-        .entry-info {
-            margin-top: 0;
-            margin-bottom: @verticalSpacing;
-        }    
-    }
-}
-
-.section.twitter-feed {
-    
-    font-size: 1.1em;
-    .tweet {
-        &:last-child { margin-bottom:0; padding-bottom:0; border-bottom: none }
-        line-height: 1.3em;
-        font-size: 0.9em;
-        margin-bottom: @verticalSpacing;
-        color: @gray;
-
-        .date {
-            display: block;
-            font-size: 0.7em;
-            a {
-                text-decoration: none !important;
-                border: none;
-            }
-        }
-    }
-}
-
-.pagination .page {
-    margin-left: 0;    
-}
-
-
-.entry-list {
-    
-    .since {
-        font-size: 0.8em;    
-    }
-
-    .title {
-        margin-bottom: 1em;    
-    }
-
-    .content, .text {
-        margin-bottom: 2em;
-        font-size: 0.8em;
-    }
-}
-
-
-.initially-hidden {
-    display: none;    
-}
-
-/* recaptcha */
-#recaptcha_widget_div {
-    margin-top: 10px;
-    margin-left: -4px;
-
-    #recaptcha_instructions_image {
-        font-size: 0.8em;
-        margin-bottom: 10px;
-        display: block !important;
-    }
-
-    th, td {
-        line-height: 1;    
-    }
-}
-
-.checkbox-widget.checked {
-    background-color: #f00;
-    background-image: url("../images/checkbox.png");
-    background-position: 50% 50%;
-}
-
-.checkbox-widget {
-    border: 1px solid @gray;
-    width: 25px;
-    height: 25px;
-    display: block;
-    float: left;
-    cursor: pointer;
-    margin-top: @verticalSpacing/2 - 2;
-}
-
-
-// generic headings
-@hColor: @blue;
-.textcontent, .terms-content {
-    h1 {
-        font-size: 1.9em;    
-        margin-bottom: 0.2em;
-        margin-top: 1.2em;
-        color: @hColor;
-
-        &:first-child {
-            margin-top: 0;    
-        }
-    }
-
-    h2 {
-        font-size: 1.6em;
-        margin-bottom: 1.1em;
-        margin-top: 1.1em;
-
-        &:first-child {
-            margin-top: 0;    
-        }
-        color: lighten(@hColor, 5%);
-    }
-
-    h3 {
-        font-size: 1.3em;
-        margin-bottom: 1em;
-        margin-top: 1em;
-
-        &:first-child {
-            margin-top: 0;    
-        }
-        color: lighten(@hColor, 5%);
-    }
-
-    p {
-        margin-bottom: 1em;    
-        line-height: 1.5em;
-    }
-
-    .date {
-        margin: 1em 0;
-        font-size: 0.9em;
-        margin-bottom: 2em;
-        color: @gray;
-    }
-}
-