@salaxy/ng1/less/salaxy-component/functional.less

AngularJS libraries for Salaxy platform (Palkkaus.fi)

@charset "UTF-8";

/* 
    Functional additions to affect small things around the site 
    Avoid strong styling here
*/

/* 
    Allow Angular being load at the end of file.
    Typically, we avoid making style changes outside salaxy-component, but this we add as it is an Angular recommendation.
    Also, it affects the site only some seconds. Make your custom less or override it if it bothers you.

    Ref: https://docs.angularjs.org/api/ng/directive/ngCloak: 
    For the best result, the angular.js script must be loaded in the head section of the html document; alternatively, the css rule above must be included in the external stylesheet of the application.
*/
[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak {
    display: none !important;
}

/* Expose as global css variables */
:root {
  --salaxy-brand-primary: @brand-primary;
  --salaxy-brand-success: @brand-success;
  --salaxy-brand-info: @brand-info;
  --salaxy-brand-warning: @brand-warning;
  --salaxy-brand-danger: @brand-danger;
}

/* Shown when Angular is loading */
.salaxy-splash { 
  display: none; 
}
[ng\:cloak].salaxy-splash, 
[ng-cloak].salaxy-splash, 
.ng-cloak.salaxy-splash{ 
  display: block !important; 
}



.salaxy-component {
    // Angular
    a[ng-click],
    .clickable,
    &a[ng-click],
    &.clickable {
        cursor: pointer;
    }
    // Text special styles
    .uppercase {
        text-transform: uppercase;
    }
    .text-disabled {
        text-decoration: line-through;
        color: #777777;
    }
    .text-small, .text-small td, .text-small th {
        font-size: 0.9em;
    }
    .truncate {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    // Table defaults
    table {
        width: 100%;
    }
    td, th {
        vertical-align: top;
        text-align: left;
        font-size: @font-size-base;
        padding-left: 2px;
        padding-right: 2px;
    }
    td.text-right, th.text-right,
    td.right, th.right {
        text-align: right;
    }
   
    td.middle, td.middle-align, th.middle, th.middle-align {
        vertical-align: middle;
    }
    td.bottom, td.bottom-align, th.bottom, th.bottom-align{
      vertical-align: bottom;
    }
    tr.total td, tr.total th {
        border-top: 1px solid black;
        border-bottom: 3px double black;
    }
    
    .table tr.no-border > th,
    .table tr.no-border > td,
    .table.no-border tr > th,
    .table.no-border tr > td {
      border-top: 0px none;
    }
    

    .valign-middle {
        vertical-align: middle !important;
    }

    .spacer-bottom {
      margin-bottom: 10px;
    }

    .spacer-top {
      margin-top: 10px;
    }

    .height100 {
      height: 100%;
    }
}