src/pyams_skin/resources/less/typo.less
changeset 0 bb4aabe07487
child 32 8419f7c811e7
equal deleted inserted replaced
-1:000000000000 0:bb4aabe07487
       
     1 /*
       
     2  * Typos styles
       
     3  */
       
     4 
       
     5 @font-face {
       
     6   font-family: 'Ubuntu';
       
     7   src: url('./fonts/Ubuntu-C.eot');
       
     8   src: url('./fonts/Ubuntu-C.eot?#iefix') format('embedded-opentype'),
       
     9 	   url('./fonts/Ubuntu-C.woff') format('woff'),
       
    10 	   url('./fonts/Ubuntu-C.ttf') format('truetype'),
       
    11 	   url('./fonts/Ubuntu-C.svg') format('svg');
       
    12   font-weight: normal;
       
    13   font-style: normal;
       
    14 }
       
    15 
       
    16 @font-face {
       
    17   font-family: 'Ubuntu-Light';
       
    18   src: url('./fonts/Ubuntu-L.eot');
       
    19   src: url('./fonts/Ubuntu-L.eot?#iefix') format('embedded-opentype'),
       
    20 	   url('./fonts/Ubuntu-L.woff') format('woff'),
       
    21 	   url('./fonts/Ubuntu-L.ttf') format('truetype'),
       
    22 	   url('./fonts/Ubuntu-L.svg') format('svg');
       
    23   font-weight: normal;
       
    24   font-style: normal;
       
    25 }
       
    26 
       
    27 @font-face {
       
    28   font-family: 'Ubuntu-Bold';
       
    29   src: url('./fonts/Ubuntu-B.eot');
       
    30   src: url('./fonts/Ubuntu-B.eot?#iefix') format('embedded-opentype'),
       
    31 	   url('./fonts/Ubuntu-B.woff') format('woff'),
       
    32 	   url('./fonts/Ubuntu-B.ttf') format('truetype'),
       
    33 	   url('./fonts/Ubuntu-B.svg') format('svg');
       
    34   font-weight: bold;
       
    35   font-style: normal;
       
    36 }
       
    37 
       
    38 html,
       
    39 body {
       
    40 	font-family: Ubuntu, Arial, Helvetica, sans-serif;
       
    41 }
       
    42 
       
    43 a:active,
       
    44 a:focus,
       
    45 a:hover,
       
    46 button,
       
    47 button:active,
       
    48 button:focus,
       
    49 embed,
       
    50 input::-moz-focus-inner,
       
    51 object {
       
    52 	outline: 0;
       
    53 }
       
    54 
       
    55 .hidden {
       
    56 	display: none;
       
    57 }
       
    58 .hidden-desktop {
       
    59 	display: none!important;
       
    60 }
       
    61 
       
    62 .no-visible {
       
    63 	visibility: hidden!important;
       
    64 }
       
    65 
       
    66 .pull-right {
       
    67 	float: right!Important;
       
    68 }
       
    69 .pull-left {
       
    70 	float: left!Important;
       
    71 }
       
    72 
       
    73 .align-top {
       
    74 	vertical-align: top!important;
       
    75 }
       
    76 .align-base {
       
    77 	vertical-align: baseline!important;
       
    78 }
       
    79 
       
    80 .opacity-25 {
       
    81 	opacity: 0.25!important;
       
    82 }
       
    83 .opacity-50 {
       
    84 	opacity: 0.5!important;
       
    85 }
       
    86 .opacity-75 {
       
    87 	opacity: 0.75!important;
       
    88 }
       
    89 .opacity-100,
       
    90 .opaque {
       
    91 	opacity: 1!important;
       
    92 }
       
    93 
       
    94 .disabled {
       
    95 	color: #fff;
       
    96 	.btn-default& {
       
    97 		color: #999;
       
    98 	}
       
    99 }
       
   100 
       
   101 xmp {
       
   102 	overflow: auto;
       
   103 }
       
   104 
       
   105 .nowrap {
       
   106 	white-space: nowrap;
       
   107 }
       
   108 .truncated {
       
   109 	white-space: nowrap;
       
   110 	overflow: hidden;
       
   111 	text-overflow: ellipsis;
       
   112 }
       
   113 
       
   114 .no-space {
       
   115 	margin: 0;
       
   116 
       
   117 	>[class*=col-] {
       
   118 		margin: 0!important;
       
   119 		padding-right: 0;
       
   120 		padding-left: 0;
       
   121 	}
       
   122 }
       
   123 
       
   124 .no-margin {
       
   125 	margin: 0!important;
       
   126 }
       
   127 .no-x-margin {
       
   128 	margin-left: 0!important;
       
   129 	margin-right: 0!important;
       
   130 }
       
   131 .no-y-margin {
       
   132 	margin-top: 0!important;
       
   133 	margin-bottom: 0!important;
       
   134 }
       
   135 
       
   136 .margin {
       
   137 	&-5 {
       
   138 		margin: 5px !important;
       
   139 	}
       
   140 	&-10 {
       
   141 		margin: 10px !important;
       
   142 	}
       
   143 	&-20 {
       
   144 		margin: 20px !important;
       
   145 	}
       
   146 	&-x-0 {
       
   147 		margin-left: 0px!important;
       
   148 		margin-right: 0px!important;
       
   149 	}
       
   150 	&-x-5 {
       
   151 		margin-left: 5px!important;
       
   152 		margin-right: 5px!important;
       
   153 	}
       
   154 	&-x-10 {
       
   155 		margin-left: 10px!important;
       
   156 		margin-right: 10px!important;
       
   157 	}
       
   158 	&-x-20 {
       
   159 		margin-left: 20px!important;
       
   160 		margin-right: 20px!important;
       
   161 	}
       
   162 	&-y-0 {
       
   163 		margin-top: 0px!important;
       
   164 		margin-bottom: 0px!important;
       
   165 	}
       
   166 	&-y-5 {
       
   167 		margin-top: 5px!important;
       
   168 		margin-bottom: 5px!important;
       
   169 	}
       
   170 	&-y-10 {
       
   171 		margin-top: 10px!important;
       
   172 		margin-bottom: 10px!important;
       
   173 	}
       
   174 	&-y-20 {
       
   175 		margin-top: 20px!important;
       
   176 		margin-bottom: 20px!important;
       
   177 	}
       
   178 	&-top-0 {
       
   179 		margin-top: 0!important;
       
   180 	}
       
   181 	&-top-2 {
       
   182 		margin-top: 2px!important;
       
   183 	}
       
   184 	&-top-5 {
       
   185 		margin-top: 5px!important;
       
   186 	}
       
   187 	&-top-10 {
       
   188 		margin-top: 10px!important;
       
   189 	}
       
   190 	&-top-20 {
       
   191 		margin-top: 20px!important;
       
   192 	}
       
   193 	&-bottom-0 {
       
   194 		margin-bottom: 0!important;
       
   195 	}
       
   196 	&-bottom-2 {
       
   197 		margin-bottom: 2px!important;
       
   198 	}
       
   199 	&-bottom-5 {
       
   200 		margin-bottom: 5px!important;
       
   201 	}
       
   202 	&-bottom-10 {
       
   203 		margin-bottom: 10px!important;
       
   204 	}
       
   205 	&-bottom-20 {
       
   206 		margin-bottom: 20px!important;
       
   207 	}
       
   208 	&-left-0 {
       
   209 		margin-left: 0!important;
       
   210 	}
       
   211 	&-left-2 {
       
   212 		margin-left: 2px!important;
       
   213 	}
       
   214 	&-left-5 {
       
   215 		margin-left: 5px!important;
       
   216 	}
       
   217 	&-left-10 {
       
   218 		margin-left: 10px!important;
       
   219 	}
       
   220 	&-left-20 {
       
   221 		margin-left: 20px!important;
       
   222 	}
       
   223 	&-right-0 {
       
   224 		margin-right: 0!important;
       
   225 	}
       
   226 	&-right-2 {
       
   227 		margin-right: 2px!important;
       
   228 	}
       
   229 	&-right-5 {
       
   230 		margin-right: 5px!important;
       
   231 	}
       
   232 	&-right-10 {
       
   233 		margin-right: 10px!important;
       
   234 	}
       
   235 	&-right-20 {
       
   236 		margin-right: 20px!important;
       
   237 	}
       
   238 }
       
   239 
       
   240 .shift {
       
   241 	&-topleft {
       
   242 		&-2 {
       
   243 			margin-top: -2px !important;
       
   244 			margin-left: -2px !important;
       
   245 		}
       
   246 		&-4 {
       
   247 			margin-top: -4px !important;
       
   248 			margin-left: -4px !important;
       
   249 		}
       
   250 	}
       
   251 	&-topright {
       
   252 		&-2 {
       
   253 			margin-top: -2px !important;
       
   254 			margin-right: -2px !important;
       
   255 		}
       
   256 		&-4 {
       
   257 			margin-top: -4px !important;
       
   258 			margin-right: -4px !important;
       
   259 		}
       
   260 	}
       
   261 	&-bottomleft {
       
   262 		&-2 {
       
   263 			margin-bottom: -2px !important;
       
   264 			margin-left: -2px !important;
       
   265 		}
       
   266 		&-4 {
       
   267 			margin-bottom: -4px !important;
       
   268 			margin-left: -4px !important;
       
   269 		}
       
   270 	}
       
   271 	&-bottomright {
       
   272 		&-2 {
       
   273 			margin-bottom: -2px !important;
       
   274 			margin-right: -2px !important;
       
   275 		}
       
   276 		&-4 {
       
   277 			margin-bottom: -4px !important;
       
   278 			margin-right: -4px !important;
       
   279 		}
       
   280 	}
       
   281 }
       
   282 
       
   283 .bordered {
       
   284 	border: 1px solid #dddddd;
       
   285 
       
   286 	&:hover {
       
   287 		border: 1px solid #bbbbbb;
       
   288 	}
       
   289 	&.nohover:hover {
       
   290 		border-color: #dddddd;
       
   291 	}
       
   292 }
       
   293 
       
   294 .no-border {
       
   295 	&,
       
   296 	.well[class*=" bg-"]& {
       
   297 		border-width: 0!important;
       
   298 	}
       
   299 	&-transparent {
       
   300 		border-color: transparent!important;
       
   301 	}
       
   302 	&-radius {
       
   303 		border-radius: 0;
       
   304 	}
       
   305 }
       
   306 
       
   307 .border {
       
   308 	&-0 {
       
   309 		border-width: 0!important;
       
   310 	}
       
   311 	&-1 {
       
   312 		border-width: 1px!important;
       
   313 	}
       
   314 }
       
   315 
       
   316 .radius {
       
   317 	&-4 {
       
   318 		border-radius: 4px!important;
       
   319 	}
       
   320 	&-top-4 {
       
   321 		border-top-left-radius: 4px!important;
       
   322 		border-top-right-radius: 4px!important;
       
   323 	}
       
   324 	&-bottom-4 {
       
   325 		border-bottom-left-radius: 4px!important;
       
   326 		border-bottom-right-radius: 4px!important;
       
   327 	}
       
   328 	&-left-4 {
       
   329 		border-top-left-radius: 4px!important;
       
   330 		border-bottom-left-radius: 4px!important;
       
   331 	}
       
   332 	&-right-4 {
       
   333 		border-top-right-radius: 4px!important;
       
   334 		border-bottom-right-radius: 4px!important;
       
   335 	}
       
   336 }
       
   337 
       
   338 .width {
       
   339 	&-100 {
       
   340 		width: 100px;
       
   341 		max-width: 100px;
       
   342 	}
       
   343 	&-200 {
       
   344 		width: 200px;
       
   345 		max-width: 200px;
       
   346 	}
       
   347 	&-300 {
       
   348 		width: 300px;
       
   349 		max-width: 300px;
       
   350 	}
       
   351 	&-400 {
       
   352 		width: 400px;
       
   353 		max-width: 400px;
       
   354 	}
       
   355 	&-500 {
       
   356 		width: 500px;
       
   357 		max-width: 500px;
       
   358 	}
       
   359 }
       
   360 
       
   361 .padding {
       
   362 	&-5 {
       
   363 		padding: 5px!important;
       
   364 	}
       
   365 	&-7 {
       
   366 		padding: 7px!important;
       
   367 	}
       
   368 	&-10 {
       
   369 		padding: 10px!important;
       
   370 	}
       
   371 	&-20 {
       
   372 		padding: 20px!important;
       
   373 	}
       
   374 	&-x-0 {
       
   375 		padding-left: 0px!important;
       
   376 		padding-right: 0px!important;
       
   377 	}
       
   378 	&-x-5 {
       
   379 		padding-left: 5px!important;
       
   380 		padding-right: 5px!important;
       
   381 	}
       
   382 	&-x-10 {
       
   383 		padding-left: 10px!important;
       
   384 		padding-right: 10px!important;
       
   385 	}
       
   386 	&-x-20 {
       
   387 		padding-left: 20px!important;
       
   388 		padding-right: 20px!important;
       
   389 	}
       
   390 	&-y-0 {
       
   391 		padding-top: 0px!important;
       
   392 		padding-bottom: 0px!important;
       
   393 	}
       
   394 	&-y-5 {
       
   395 		padding-top: 5px!important;
       
   396 		padding-bottom: 5px!important;
       
   397 	}
       
   398 	&-y-10 {
       
   399 		padding-top: 10px!important;
       
   400 		padding-bottom: 10px!important;
       
   401 	}
       
   402 	&-y-20 {
       
   403 		padding-top: 20px!important;
       
   404 		padding-bottom: 20px!important;
       
   405 	}
       
   406 	&-top-0 {
       
   407 		padding-top: 0!important;
       
   408 	}
       
   409 	&-top-5 {
       
   410 		padding-top: 5px!important;
       
   411 	}
       
   412 	&-top-10 {
       
   413 		padding-top: 10px!important;
       
   414 	}
       
   415 	&-top-20 {
       
   416 		padding-top: 20px!important;
       
   417 	}
       
   418 	&-bottom-0 {
       
   419 		padding-bottom: 0!important;
       
   420 	}
       
   421 	&-bottom-5 {
       
   422 		padding-bottom: 5px!important;
       
   423 	}
       
   424 	&-bottom-10 {
       
   425 		padding-bottom: 10px!important;
       
   426 	}
       
   427 	&-bottom-20 {
       
   428 		padding-bottom: 20px!important;
       
   429 	}
       
   430 	&-left-0 {
       
   431 		padding-left: 0!important;
       
   432 	}
       
   433 	&-left-5 {
       
   434 		padding-left: 5px!important;
       
   435 	}
       
   436 	&-left-10 {
       
   437 		padding-left: 10px!important;
       
   438 	}
       
   439 	&-left-20 {
       
   440 		padding-left: 20px!important;
       
   441 	}
       
   442 	&-right-0 {
       
   443 		padding-right: 0!important;
       
   444 	}
       
   445 	&-right-5 {
       
   446 		padding-right: 5px!important;
       
   447 	}
       
   448 	&-right-10 {
       
   449 		padding-right: 10px!important;
       
   450 	}
       
   451 	&-right-20 {
       
   452 		padding-right: 20px!important;
       
   453 	}
       
   454 }
       
   455 
       
   456 .no-padding {
       
   457 	padding: 0!important;
       
   458 
       
   459 	.md-editor,
       
   460 	.widget-body& .cke_chrome {
       
   461 		border: 0;
       
   462 	}
       
   463 	>pre {
       
   464 		margin: 30px;
       
   465 	}
       
   466 	.dataTables_wrapper table,
       
   467 	>table {
       
   468 		border: 0!important;
       
   469 		margin-bottom: 0!important;
       
   470 		border-bottom-width: 0!important;
       
   471 	}
       
   472 	.dataTables_wrapper table,
       
   473 	>table {
       
   474 		tr td:first-child,
       
   475 		tr th:first-child {
       
   476 			border-left: 0!important;
       
   477 		}
       
   478 		tr td:last-child,
       
   479 		tr th:last-child {
       
   480 			border-right: 0!important;
       
   481 		}
       
   482 		tr:last-child td {
       
   483 			border-bottom: 0;
       
   484 		}
       
   485 	}
       
   486 	&-bottom {
       
   487 		padding-bottom: 0!important;
       
   488 	}
       
   489 }
       
   490 .no-x-padding {
       
   491 	padding-left: 0!important;
       
   492 	padding-right: 0!important;
       
   493 }
       
   494 .no-y-padding {
       
   495 	padding-top: 0!important;
       
   496 	padding-bottom: 0!important;
       
   497 }
       
   498 
       
   499 .no-content-padding {
       
   500 	margin: -10px -14px 0 -14px;
       
   501 
       
   502 	@media (min-width:768px) and (max-width:880px) {
       
   503 		margin: 0 -14px!important;
       
   504 	}
       
   505 	@media (max-width:767px) {
       
   506 		margin: 0 -5px!important;
       
   507 	}
       
   508 	@media only screen and (min-width:0) and (max-width:679px) {
       
   509 		margin: 0 -5px!important;
       
   510 	}
       
   511 	@media only screen and (min-width:320px) and (max-width:479px) {
       
   512 		margin: 0 -5px!important;
       
   513 	}
       
   514 }
       
   515 
       
   516 .no-height {
       
   517 	line-height: 0;
       
   518 }
       
   519 
       
   520 .clearfix,
       
   521 .inner-space:after {
       
   522 	zoom: 1;
       
   523 }
       
   524 
       
   525 .clearfix,
       
   526 .inner-space {
       
   527 	&:after {
       
   528 		clear: both;
       
   529 	}
       
   530 	&:after,
       
   531 	&:before {
       
   532 		display: block;
       
   533 		visibility: hidden;
       
   534 		overflow: hidden;
       
   535 		content: "\0020";
       
   536 		height: 0;
       
   537 		font-size: 0;
       
   538 		line-height: 0;
       
   539 	}
       
   540 }
       
   541 
       
   542 .display-inline {
       
   543 	display: inline-block!important;
       
   544 }
       
   545 
       
   546 .display-normal {
       
   547 	display: inline!important;
       
   548 }
       
   549 
       
   550 .hover-transparent {
       
   551 	opacity: .5;
       
   552 
       
   553 	&:hover {
       
   554 		opacity: 1;
       
   555 	}
       
   556 }
       
   557 
       
   558 .row-seperator-header {
       
   559 	margin: 15px 14px 20px;
       
   560 	border-bottom: 0;
       
   561 	display: block;
       
   562 	color: #646464;
       
   563 	font-size: 20px;
       
   564 	font-weight: 400;
       
   565 }
       
   566 
       
   567 .text-align-center,
       
   568 .text-center {
       
   569 	text-align: center!important;
       
   570 }
       
   571 
       
   572 .text-align-left,
       
   573 .text-left {
       
   574 	text-align: left!important;
       
   575 }
       
   576 
       
   577 .text-align-right,
       
   578 .text-right {
       
   579 	text-align: right!important;
       
   580 }
       
   581 
       
   582 .center-canvas,
       
   583 .center-child-canvas >canvas {
       
   584 	display: block!important;
       
   585 	margin: 0 auto!important;
       
   586 }
       
   587 
       
   588 .semi-bold {
       
   589 	font-weight: 400!important;
       
   590 }
       
   591 .bold {
       
   592 	font-weight: 900!important;
       
   593 }
       
   594 
       
   595 .ultra-light {
       
   596 	font-weight: 300!important;
       
   597 }
       
   598 
       
   599 .font-xs {
       
   600 	font-size: 85%!important;
       
   601 }
       
   602 
       
   603 .font-sm {
       
   604 	font-size: 95%!important;
       
   605 }
       
   606 
       
   607 .font-md {
       
   608 	font-size: 130%!important;
       
   609 }
       
   610 
       
   611 .font-lg {
       
   612 	font-size: 160%!important;
       
   613 }
       
   614 
       
   615 .font-xl {
       
   616 	font-size: 200%!important;
       
   617 }
       
   618 
       
   619 .font-400 {
       
   620 	font-size: 400%!important;
       
   621 }
       
   622 
       
   623 .badge {
       
   624 	font-size: 11px;
       
   625 	padding: 4px 6px 1px;
       
   626 }
       
   627 
       
   628 .label {
       
   629 	padding: 0.3em .6em .1em;
       
   630 }
       
   631 
       
   632 .cursor-pointer {
       
   633 	cursor: pointer;
       
   634 }
       
   635 
       
   636 .selected {
       
   637 	border: 1px solid #0091d9!important;
       
   638 
       
   639 	tr& {
       
   640 		background-color: rgb(220, 235, 255);
       
   641 	}
       
   642 	&:before {
       
   643 		display: block;
       
   644 		position: absolute;
       
   645 		content: "\f00c";
       
   646 		color: #fff;
       
   647 		right: 4px;
       
   648 		font-family: FontAwesome;
       
   649 		z-index: 1002;
       
   650 
       
   651 		tr& {
       
   652 			display: none;
       
   653 		}
       
   654 	}
       
   655 	&:after {
       
   656 		width: 0;
       
   657 		height: 0;
       
   658 		border-top: 35px solid #0091d9;
       
   659 		border-left: 35px solid rgba(0, 0, 0, 0);
       
   660 		position: absolute;
       
   661 		display: block;
       
   662 		right: 0;
       
   663 		content: ".";
       
   664 		top: 0;
       
   665 		z-index: 1001;
       
   666 
       
   667 		tr& {
       
   668 			display: none;
       
   669 		}
       
   670 	}
       
   671 }