Warning, /webapps/ocs-webserver/httpdocs/theme/react/assets/less/header.less is written in an unsupported language. File is not indexed.
0001 // out: ../css/header.css, sourcemap: true, compress: true
0002 @import "elements.less";
0003
0004 #site-header-container {
0005 font-family: Arial,sans-serif;
0006
0007 }
0008
0009 #site-header {
0010 /*padding: 0 80px;*/
0011 font-size: 14px;
0012 background-color: #ccc;
0013 padding-right:0px;
0014 .dropdown-menu {
0015 position: absolute;
0016 z-index: 1000;
0017 display: none;
0018 float: left;
0019 min-width: 160px;
0020 padding: 5px 0;
0021 margin: 2px 0 0;
0022 font-size: 14px;
0023 text-align: left;
0024 list-style: none;
0025 background-color: #fff;
0026 -webkit-background-clip: padding-box;
0027 background-clip: padding-box;
0028 border: 1px solid #ccc;
0029 border: 1px solid rgba(0,0,0,.15);
0030 border-radius: 4px;
0031 -webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175);
0032 box-shadow: 0 6px 12px rgba(0,0,0,.175);
0033 background-color: white;
0034
0035 &.dropdown-menu-right {
0036 right: 0;
0037 left: auto;
0038 }
0039
0040 li {
0041 padding: 0;
0042 }
0043
0044
0045
0046
0047 }
0048
0049 ul {
0050 list-style-type: none;
0051 padding: 0;
0052 margin: 0;
0053 float: left;
0054 }
0055
0056 #siter-header-pling
0057 {
0058 position: absolute;
0059 right: 0;
0060 height: 100%;
0061
0062 display: flex;
0063 align-items: center;
0064
0065 .pling-section-header{
0066
0067 display: flex;
0068 height: 25px;
0069 & > div{
0070 text-align: center;
0071 }
0072 span{
0073 /*line-height: 300px;*/
0074 }
0075
0076 .supporter-container{
0077 position: relative;
0078 a{
0079 cursor: pointer;
0080 font-size: small;
0081 font-weight: bold;
0082 }
0083 a.header-supporters
0084 {
0085 color:#4e4e4e;
0086 }
0087 z-index: 1000;
0088 &.open {
0089
0090 .dropdown-menu {
0091 display: block;
0092 left: auto;
0093 width: 350px;
0094 }
0095 .dropdown-menu::before {
0096 content: "";
0097 position: absolute;
0098 right:30px;
0099 top: -8px;
0100 width: 0;
0101 height: 0;
0102 border-style: solid;
0103 border-width: 0 8.5px 8.5px;
0104 border-color: transparent transparent #b7bcc4 transparent;
0105 border-bottom-color: rgb(183, 188, 196);
0106 border-bottom-color: #fff;
0107 border-style: dashed dashed solid;
0108 z-index: 1;
0109 }
0110 }
0111
0112 .user-pling-section-container
0113 {
0114
0115 display: flex;
0116 flex-direction: column;
0117 max-height: 600px;
0118 overflow-y: auto;
0119
0120 width: 100%;
0121 .pling-nav-tabs
0122 {
0123 display: block;
0124 }
0125 .title{
0126 text-align: center;
0127 border-bottom: 1px solid #ccc;
0128 padding:5px;
0129 }
0130 .section{
0131 padding: 5px;
0132 display: block;
0133 margin-bottom: 16px;
0134 .section-name{
0135 flex: 1;
0136 float:left;
0137 width:100px;
0138 position: relative;
0139 img{
0140 width: 100px;
0141 height: 100px;
0142 }
0143
0144
0145 span{
0146 line-height: 16px;
0147 display: inline-block;
0148 position: absolute;
0149 left: 0;
0150 bottom: -16px;
0151 width: 100px;
0152 height: 16px;
0153 font-size: small;
0154 text-align: center;
0155 background-color: #000;
0156 color: #fff;
0157 a{
0158 color:#fff;
0159 }
0160 }
0161
0162 }
0163 .section-value{
0164 display: flex;
0165 align-items: center;
0166 line-height: 100px;
0167 float: right;
0168
0169 }
0170 }
0171 }
0172 }
0173
0174 .header-body{
0175 display: flex;
0176 .supporter-container {
0177 line-height: 25px;
0178 padding-left:5px;
0179 a.header-supporters
0180 {
0181 color:#4e4e4e;
0182 }
0183 }
0184 .score-container
0185 {
0186 line-height: 25px;
0187 &>span{
0188 font-size: small;
0189 font-weight: bold;
0190 padding:5px;
0191 }
0192
0193 .score-bar-container {
0194 width: 200px;
0195 height: 20px;
0196 background: #f1f1f1;
0197 margin-bottom: 5px;
0198 display: inline-block;
0199 font-size: small;
0200 white-space: nowrap;
0201 .score-bar {
0202 height: 20px;
0203 line-height: 20px;
0204 background-color: #ccc;
0205 border-bottom: 0px solid darken( #286090,5%);
0206 color:#4e4e4e;
0207 text-align: left;
0208 padding-left: 3px;
0209 }
0210 }
0211 }
0212 }
0213
0214
0215 &.header-supporter-dark
0216 {
0217 .header-body .score-container
0218 {
0219 >span {
0220 color: #fff;
0221 }
0222
0223 }
0224 .header-body .supporter-container{
0225 a.header-supporters{
0226 color:#fff;
0227 }
0228 }
0229
0230
0231 }
0232 }
0233 }
0234
0235
0236 #site-header-wrapper {
0237 position: relative;
0238 width: 100%;
0239 float: left;
0240 height: 100%;
0241
0242 #site-header-logo-container {
0243 position: absolute;
0244 overflow: hidden;
0245 > a {
0246 width: 100%;
0247 display: block;
0248 img {
0249 width: 100%;
0250 }
0251 }
0252 }
0253
0254 .header-links-display {
0255 font-size: 24px;
0256 color: white;
0257 display: inline-block;
0258 margin-left: 20px;
0259 > a {
0260 color: white;
0261 &:hover {
0262 color: #2673b0;
0263 }
0264 }
0265 }
0266
0267 #site-header-store-name-container {
0268 font-size: 24px;
0269 position: absolute;
0270 bottom: 0;
0271 padding-left: 15px;
0272 > a {
0273 color: white;
0274 &:hover {
0275 color: #337ab7;
0276 }
0277 }
0278 }
0279 #site-header-cat-name-container {
0280 font-size: 24px;
0281 position: absolute;
0282 bottom: 0;
0283 padding-left: 15px;
0284 > a {
0285 color: white;
0286 &:hover {
0287 color: #337ab7;
0288 }
0289 }
0290 }
0291
0292 #site-header-middle {
0293 display: block;
0294 margin: 0 auto;
0295 width: 100px;
0296 .test{
0297
0298 }
0299 }
0300
0301 #site-header-right {
0302 float: right;
0303 height: 100%;
0304 width: 100%;
0305
0306 #site-header-right-top {
0307 /*height: 40px;*/
0308 height: 100%;
0309 width: 100%;
0310 padding-right: 5px;
0311 display: flex;
0312 justify-content: center;
0313
0314 .btnAddProduct{
0315 width:100px;
0316 display:flex;
0317 align-items:flex-end;
0318 margin:0 auto;
0319 >span >a{
0320 border: 0;
0321 border-bottom-color: currentcolor;
0322 border-bottom-style: none;
0323 border-bottom-width: 0px;
0324 position: relative;
0325 color: #777;
0326 font-size: 13px;
0327 transition: color 0s;
0328 bottom: 2px;
0329 border-bottom-width: 2px;
0330 border-bottom-style: solid;
0331 border-bottom-color: transparent;
0332 background-color: transparent;
0333 cursor: pointer;
0334 color: #2673b0;
0335 border-bottom-color: #2673b0;
0336 font-weight: 700;
0337 }
0338 }
0339
0340
0341 }
0342
0343 #site-header-search-form {
0344 /* float: left;*/
0345
0346 max-width: 16em;
0347 display: block;
0348 vertical-align: middle;
0349 margin: 0 auto;
0350 display: flex;
0351 align-items: center;
0352 #search-form {
0353 /*margin: 6.5px 0;*/
0354 margin:0;
0355 padding:0;
0356 }
0357 }
0358
0359 #search-form {
0360 height: 25px;
0361 padding: 0;
0362 margin: 6.5px 15px;
0363 line-height: 25px;
0364 position: relative;
0365
0366 input[type="text"]{
0367 width: 100%;
0368 min-width: 16em;
0369 height: 25px;
0370 padding: 0;
0371 border: 1px solid #fff;
0372 margin-bottom: -1px;
0373 padding-right: 30px;
0374 text-indent: 5px;
0375 color: #6a7686;
0376 float: left;
0377 border-radius: 6px;
0378 box-shadow: none;
0379
0380 }
0381
0382 > a {
0383 top: 2px;
0384 right: 0;
0385 display: block;
0386 width: 25px;
0387 height: 25px;
0388 background-image: url(/theme/flatui/img/icon-search-input-2.png);
0389 background-position: center center;
0390 position: absolute;
0391 cursor: pointer;
0392 }
0393 }
0394
0395 #site-header-user-menu-container {
0396 float: right;
0397 margin-right: 6px;
0398 margin-left: 6px;
0399
0400 #user-menu-toggle {
0401 position: relative;
0402 height: 40px;
0403 float: right;
0404 cursor: pointer;
0405 line-height: 40px;
0406
0407 a.profile-menu-toggle {
0408 display: block;
0409 width: 100%;
0410 height: 100%;
0411 padding-left: 50px;
0412 padding-right: 15px;
0413 }
0414
0415 img {
0416 position: absolute;
0417 top: 5px;
0418 left: 10px;
0419 height: 30px;
0420 width: 30px;
0421 border-radius: 100%;
0422 }
0423
0424 span {
0425 color:white;
0426 }
0427
0428 &:hover {
0429 span {
0430 color: black;
0431 }
0432 }
0433
0434 ul {
0435 display: none;
0436 width: 165px;
0437 margin-left: 0;
0438 position: absolute;
0439 top: 40px;
0440 border: none;
0441 font-size: 14px;
0442 color: #7f8c8d;
0443 font-weight: 400;
0444 padding: 0;
0445 z-index: 10000;
0446 -webkit-border-radius: 5px;
0447 -moz-border-radius: 5px;
0448 border-radius: 5px;
0449 -webkit-background-clip: padding-box;
0450 -moz-background-clip: padding;
0451 background-clip: padding-box;
0452
0453 .dropdown-header {
0454 display: block;
0455 padding: 3px 20px;
0456 font-size: 12px;
0457 line-height: 1.42857143;
0458 color: #777;
0459 white-space: nowrap;
0460 width: 175px;
0461 height: 12px;
0462 background-image: url(../img/bg_sheet.png);
0463 background-position: -385px 0;
0464 }
0465
0466 li {
0467 text-align: left;
0468 display: block;
0469 width: 100%;
0470 background: #ecf0f1;
0471 margin: 0;
0472 padding: 0;
0473 height: 40px;
0474 border-bottom: 1px solid #d6d7d9;
0475
0476 &:first-of-type {
0477 -webkit-border-radius: 5px 5px 0 0;
0478 -moz-border-radius: 5px 5px 0 0;
0479 border-radius: 5px 5px 0 0;
0480 -webkit-background-clip: padding-box;
0481 -moz-background-clip: padding;
0482 background-clip: padding-box;
0483 }
0484
0485 &:last-of-type {
0486 -webkit-border-radius: 0 0 5px 5px;
0487 -moz-border-radius: 0 0 5px 5px;
0488 border-radius: 0 0 5px 5px;
0489 -webkit-background-clip: padding-box;
0490 -moz-background-clip: padding;
0491 background-clip: padding-box;
0492 }
0493
0494 a {
0495 float: left;
0496 display: block;
0497 padding: 0 20px;
0498 color: #6a7686;
0499 text-align: left;
0500 height: 40px;
0501 line-height: 40px;
0502 width: 100%;
0503 }
0504 }
0505 }
0506
0507 &.open {
0508 ul {
0509 display: block;
0510 }
0511 }
0512 }
0513 }
0514
0515 #site-header-right-bottom {
0516 height: 52px;
0517 width: 100%;
0518
0519 #site-header-login-menu {
0520 width: 100%;
0521 float: left;
0522 height: 100%;
0523
0524 ul {
0525 position: absolute;
0526 bottom: 0px;
0527 display: inline-table;
0528 list-style-type: none;
0529 margin: 0;
0530 padding: 0;
0531 z-index: 999;
0532 right: 0;
0533 width: 175px;
0534
0535 li {
0536 background-color: #609dca;
0537 border-color: #a3acfd;
0538 border-image: none;
0539 border-radius: 5px 5px 0 0;
0540 border-style: solid solid none;
0541 border-width: 2px 2px 0;
0542 height: 24px;
0543 line-height: 24px;
0544 margin-right: 2px;
0545 float: left;
0546
0547 a {
0548 float: left;
0549 display: block;
0550 height: inherit;
0551 line-height: inherit;
0552 padding: 0 20px;
0553 font-size: 13px;
0554 color: white;
0555 }
0556
0557 &.active {
0558 background: #60bcff none repeat scroll 0 0;
0559 }
0560 }
0561 }
0562 }
0563 }
0564 }
0565 }
0566
0567 &.appimagehubcc,
0568 &.appimagehub,
0569 &.appimageshub,
0570 &.appimagehub.com {
0571 #site-header-wrapper {
0572 #site-header-right {
0573 #site-header-user-menu-container,
0574 #site-header-right-bottom,
0575 #site-header-login-menu {
0576 display: none;
0577 }
0578
0579 #site-header-right-top {
0580 height:100%;
0581 }
0582 }
0583 }
0584 }
0585
0586 &.pling {
0587 margin:0 !important;
0588 }
0589 }
0590
0591 /*
0592 @media (max-width:767px) {
0593 #site-header {
0594 height: 180px !important;
0595 padding: 0 5px !important;
0596
0597 #site-header-wrapper {
0598 padding: 0 !important;
0599
0600 #site-header-logo-container {
0601 margin: 0 auto;
0602 position: relative;
0603 max-height: 90px!important;
0604 }
0605
0606 #site-header-store-name-container {
0607 width: 100%;
0608 text-align: center;
0609 padding: 15px 0;
0610 height: auto;
0611
0612 }
0613
0614 #site-header-right {
0615 position: absolute;
0616 bottom: 0;
0617 left: 0;
0618 width: 100%;
0619 height: 40px;
0620
0621 #site-header-right-top {
0622 padding-right: 185px;
0623 width: 100%;
0624 padding-left: 10px;
0625
0626 #site-header-search-form {
0627 width: 100%;
0628 max-width: 100%;
0629
0630 input[type="text"]{
0631 min-width: 100%;
0632 font-size: 16px;
0633 }
0634 }
0635
0636 ul#site-header-user-menu-container {
0637 position: absolute;
0638 top: 0;
0639 right: 0;
0640 }
0641 }
0642
0643 #user-profile-menu {
0644 left: -34px;
0645
0646 .dropdown-header {
0647 background-position: -351px 0 !important;
0648 }
0649 }
0650 }
0651 }
0652 }
0653 }
0654 */
0655
0656 @media (min-width:612px) and (max-width:720px){
0657 #site-header {
0658 padding: 0 50px 0 10px;
0659 }
0660 }
0661
0662 @media (max-width: 610px){
0663
0664
0665 #site-header-container {
0666 height: 50px;
0667
0668 #site-header {
0669 height: 50px !important;
0670 padding: 0;
0671 }
0672 }
0673
0674 #mobile-site-header {
0675 height: 70px;
0676 padding: 5px;
0677 padding-right: 10px;
0678 position: relative;
0679
0680 #mobile-thumb-block {
0681 display: none;
0682 height: 100%;
0683 width: 40px;
0684 position: absolute;
0685 top: 0;
0686 left: 0;
0687 }
0688
0689 .header-links-display {
0690 float: right;
0691 padding: 11px;
0692 }
0693
0694 #mobile-site-header-logo {
0695 height: 40px;
0696 width: auto;
0697 float: left;
0698
0699 > a {
0700 width: auto;
0701 height: 100%;
0702
0703 > img {
0704 max-height: 40px;
0705 }
0706 }
0707
0708 &.mini-version {
0709 width: 40px;
0710 overflow: hidden;
0711
0712 &.Android {
0713 width: 24px;
0714 height: 27px;
0715 }
0716
0717 &.Books {
0718 width: 38px;
0719 }
0720
0721 &.Mate {
0722 width: 41px;
0723 }
0724
0725 &.XFCE {
0726 width: 56px;
0727 }
0728
0729 &.Images {
0730 width: 44px;
0731 }
0732
0733 &.Gnome {
0734 width: 25px;
0735 }
0736
0737 &.Window-Managers, &.Arch-Packages,&.Games, &.OpenSuse-RPMs, &.OSX-Packages, &.VLC-Addons, &.Krita-Addons {
0738 overflow: visible;
0739 }
0740 }
0741
0742 &.KFCE-Pling-CC {
0743 width: 100px !important;
0744 height: 32px;
0745 }
0746 }
0747
0748 #mobile-site-header-menus-container {
0749 float: right;
0750 height: 40px;
0751
0752 #switch-menu,
0753 #mobile-user-menu,
0754 #mobile-search-menu {
0755 height: 40px;
0756 padding: 5px;
0757 float: right;
0758 padding-right: 3px;
0759 #siter-header-pling
0760 {
0761 .score-bar-container
0762 {
0763 width: 100px;
0764 }
0765 right: 50px;
0766 height: 20px;
0767
0768 }
0769 .menu-item {
0770 display: block;
0771 height: 30px;
0772 width: 30px;
0773 position: relative;
0774 line-height: 30px;
0775 float: right;
0776 color: white;
0777 cursor: pointer;
0778 border: 2px solid;
0779 border-radius: 5px;
0780
0781 > span {
0782 color: white;
0783 position: absolute;
0784 top: 50%;
0785 left: 50%;
0786 margin: -6px 0 0 -7px;
0787 }
0788 }
0789
0790 .menu-item + .menu-item {
0791 margin-left: 5px;
0792 }
0793
0794 #switch-menu-seperator {
0795 display: block;
0796 float: left;
0797 height: 20px;
0798 border-right: 1px solid black;
0799 border-left: 1px solid black;
0800 margin: 10px;
0801 display: none;
0802 }
0803
0804 .menu-content-wrapper {
0805 float: left;
0806 height: 30px;
0807 line-height: 30px;
0808 padding: 0 5px;
0809
0810 #site-header-search-form {
0811 width: 240px;
0812 }
0813
0814
0815
0816 #search-form {
0817 height: 27px;
0818 padding: 0;
0819 margin: 1.5px 20px 0;
0820 line-height: 27px;
0821 position: relative;
0822 margin-right: 40px;
0823
0824 input[type="text"]{
0825 width: 100%;
0826 height: 27px;
0827 padding: 0;
0828 border: 1px solid #fff;
0829 margin-bottom: -1px;
0830 padding-right: 30px;
0831 text-indent: 5px;
0832 color: #6a7686;
0833 float: left;
0834 border-radius: 5px;
0835 box-shadow: none;
0836 font-size: 16px;
0837 }
0838
0839 > a {
0840 top: 2px;
0841 right: 0;
0842 display: block;
0843 width: 25px;
0844 height: 25px;
0845 background-image: url(/theme/flatui/img/icon-search-input-2.png);
0846 background-position: center center;
0847 position: absolute;
0848 cursor: pointer;
0849 }
0850 }
0851
0852 #site-header-login-menu {
0853 width: 100%;
0854 float: left;
0855 height: 100%;
0856
0857 ul {
0858 position: relative;
0859 bottom: 0;
0860 display: inline-table;
0861 list-style-type: none;
0862 margin: 0;
0863 padding: 0;
0864 z-index: 999;
0865 right: 0;
0866 width: 185px;
0867
0868 li {
0869 border-image: none;
0870 border-radius: 5px;
0871 border-style: solid;
0872 border-width: 2px;
0873 height: 30px;
0874 line-height: 26px;
0875 margin-right: 5px;
0876 float: left;
0877
0878 a {
0879 float: left;
0880 display: block;
0881 height: inherit;
0882 line-height: inherit;
0883 padding: 0 20px;
0884 font-size: 13px;
0885 color: white;
0886 }
0887
0888 &.active {
0889 background: #60bcff none repeat scroll 0 0;
0890 }
0891 }
0892 }
0893 }
0894
0895 #site-header-user-menu-container {
0896 float: right;
0897 margin-right: 6px;
0898 margin-left: 6px;
0899 margin-top: -5px;
0900
0901 #user-menu-toggle {
0902 position: relative;
0903 height: 40px;
0904 float: right;
0905 cursor: pointer;
0906 line-height: 40px;
0907
0908 a.profile-menu-toggle {
0909 display: block;
0910 width: 100%;
0911 height: 100%;
0912 padding-left: 50px;
0913 padding-right: 15px;
0914 }
0915
0916 img {
0917 position: absolute;
0918 top: 5px;
0919 left: 10px;
0920 height: 30px;
0921 width: 30px;
0922 border-radius: 100%;
0923 }
0924
0925 span {
0926 color:white;
0927 }
0928
0929 &:hover {
0930 span {
0931 color: black;
0932 }
0933 }
0934
0935 ul {
0936 display: none;
0937 width: 165px;
0938 margin-left: 0;
0939 position: absolute;
0940 top: 40px;
0941 border: none;
0942 font-size: 14px;
0943 color: #7f8c8d;
0944 font-weight: 400;
0945 padding: 0;
0946 z-index: 10000;
0947 -webkit-border-radius: 5px;
0948 -moz-border-radius: 5px;
0949 border-radius: 5px;
0950 -webkit-background-clip: padding-box;
0951 -moz-background-clip: padding;
0952 background-clip: padding-box;
0953
0954 .dropdown-header {
0955 display: block;
0956 padding: 3px 20px;
0957 font-size: 12px;
0958 line-height: 1.42857143;
0959 color: #777;
0960 white-space: nowrap;
0961 width: 175px;
0962 height: 12px;
0963 background-image: url(../img/bg_sheet.png);
0964 background-position: -385px 0;
0965 }
0966
0967 li {
0968 text-align: left;
0969 display: block;
0970 width: 100%;
0971 background: #ecf0f1;
0972 margin: 0;
0973 padding: 0;
0974 height: 40px;
0975 border-bottom: 1px solid #d6d7d9;
0976
0977 &:first-of-type {
0978 -webkit-border-radius: 5px 5px 0 0;
0979 -moz-border-radius: 5px 5px 0 0;
0980 border-radius: 5px 5px 0 0;
0981 -webkit-background-clip: padding-box;
0982 -moz-background-clip: padding;
0983 background-clip: padding-box;
0984 }
0985
0986 &:last-of-type {
0987 -webkit-border-radius: 0 0 5px 5px;
0988 -moz-border-radius: 0 0 5px 5px;
0989 border-radius: 0 0 5px 5px;
0990 -webkit-background-clip: padding-box;
0991 -moz-background-clip: padding;
0992 background-clip: padding-box;
0993 }
0994
0995 a {
0996 float: left;
0997 display: block;
0998 padding: 0 20px;
0999 color: #6a7686;
1000 text-align: left;
1001 height: 40px;
1002 line-height: 40px;
1003 width: 100%;
1004 }
1005 }
1006 }
1007
1008 &.open {
1009 ul {
1010 display: block;
1011 }
1012 }
1013 }
1014 }
1015
1016 }
1017 }
1018 }
1019 }
1020 }