2 * Stylesheet for Funky Guy Theme.
4 * Copyright 2010, Antoine Mercadal - Capgemini
5 * Copyright 2010, Franck Villaume - Capgemini
6 * Copyright 2011, IƱigo Martinez
7 * Copyright 2013-2014,2017, Franck Villaume - TrivialDev
8 * Copyright 2014, Benoit Debaenst - TrivialDev
9 * Copyright 2015, Roland Mas
10 * Copyright 2021, Guy Morin - DGFiP
11 * http://fusionforge.org
13 * This file is part of FusionForge. FusionForge is free software;
14 * you can redistribute it and/or modify it under the terms of the
15 * GNU General Public License as published by the Free Software
16 * Foundation; either version 2 of the Licence, or (at your option)
19 * FusionForge is distributed in the hope that it will be useful,
20 * but WITHOUT ANY WARRANTY; without even the implied warranty of
21 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
22 * GNU General Public License for more details.
24 * You should have received a copy of the GNU General Public License along
25 * with FusionForge; if not, write to the Free Software Foundation, Inc.,
26 * 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA.
31 font-family: 'Manjari-Bold';
32 src: url('Manjari-Bold.ttf') format('truetype');
39 background-color: #efefef;
44 font-family: Helvetica, Helv, swiss, sans-serif;
46 background-color:white;
62 vertical-align: middle;
68 .widget_titlebar_title {
69 font-family: Arial, sans-serif;
92 list-style-type: circle;
101 text-decoration:none;
104 transition-property: background-color, color, height, shadow;
105 transition-duration: 0.3s;
109 text-decoration: none;
117 border-collapse: collapse;
120 input[type="text"], input[type="password"], input[type="url"], input[type="email"], textarea {
123 border: 1px solid #c6c6c6;
125 font-family:"Lucida Grande",sans-serif;
130 background-color: #E2E2E2;
154 background-color: #21293C;
157 header .skipLink:focus {
160 transition: all ease-out 0.3s;
168 padding: .4em 0 0 .5em;
171 header a, header a:visited {
186 padding:.5em 0 0 .5em;
192 text-decoration:none;
194 transition-property: color;
195 transition-duration: 0.3s;
199 text-decoration: none;
206 padding: .2em 1.2em .2em .4em;
208 border: 1px solid #789;
210 background: #51596c url("../images/header/select_down.png") center right no-repeat;
219 #searchBox input[type=text] {
221 padding: .1em 26px .1em .4em;
223 border: 1px solid #789;
232 #searchBox input[type=submit] {
239 border: none !important;
240 background: transparent url("../images/header/search.png") center center no-repeat !important;
258 padding:0 1em .8em 0;
273 /* =hamburgerMenuOff */
276 #userlinkshamburgerdiv {
296 .tabGenerator ul:first-child {
297 padding-bottom: .2em;
301 display: inline-block;
304 .tabGenerator .tg-middle span {
305 transition-property: background-color, color, height, shadow;
306 transition-duration: 0.3s;
313 .tabGenerator .tg-middle span:hover {
317 .tabGenerator .tg-middle span.selected {
330 .innertabs .tabGenerator ul {
335 border-left: 1px solid #505d77;
338 .innertabs .tabGenerator li {
344 .innertabs .tabGenerator a {
346 flex-direction: column;
353 .innertabs .tabGenerator .tg-middle span {
355 padding: .2em .4em .3em .4em;
358 justify-content: center;
359 background-color:none;
365 text-overflow:ellipsis;
368 transition-property: background, color;
369 transition-duration: .4s;
370 border-right: 1px solid #505d77;
373 .innertabs .tabGenerator .tg-middle span:hover,
374 .innertabs .tabGenerator .tg-middle span.selected {
379 .topTab, a.topTab, a.topTab:visited, a.topTab:hover,
380 .topTabSelected, a.topTabSelected, a.topTabSelected:visited,
381 a.topTabSelected:hover {
382 text-decoration: none;
384 color: rgb(68, 68, 68);
385 font-family: arial, helvetica, sans-serif;
389 .bottomTab, a.bottomTab, a.bottomTab:visited, a.bottomTab:hover {
390 text-decoration: none;
393 font-family: arial, helvetica, sans-serif;
397 .bottomTabSelected, a.bottomTabSelected, a.bottomTabSelected:visited, a.bottomTabSelected:hover {
398 text-decoration: none;
400 color: rgb(68, 68, 68);
401 font-family: arial, helvetica, sans-serif;
411 vertical-align: middle;
416 color: rgb(112, 112, 112);
417 background-color: white;
424 /* Boxes (top / middle / bottom)
425 ----------------------------------------------- */
427 /* margin-bottom: 1em;*/
428 background-color: #f0f0f0;
429 border: 1px solid #c2c3c4;
431 padding:4px 8px 12px 8px;
433 box-shadow: 1px 1px 4px #c2c3c4;
441 border-bottom: 1px solid #E2E3E4;
446 border-bottom: 1px solid #E2E3E4;
448 padding: 8px 8px 8px 18px;
471 background-color: #f7f7f7;
472 border: 1px solid #929394;
474 box-shadow: 1px 1px 4px #b2b3b4;
477 .widget_titlebar_handle {
478 border-bottom: 2px solid #cfcfcf;
487 border-top-left-radius: 3px;
488 border-top-right-radius: 3px;
492 color:#505d77 !important;
495 .widget_titlebar_title {
500 .widget_titlebar_close img {
505 .widget_titlebar_minimize img {
510 .widget_titlebar_maximize img {
516 border-bottom: 1px solid #d2d3d4;
517 border-bottom-left-radius: 3px;
518 border-bottom-right-radius: 3px;
523 .widget_preferences {
526 .widget_preferences fieldset {
528 margin: .4em 0 .1em 0;
530 .widget_preferences fieldset fieldset {
534 .widget_content table {
535 border-collapse: collapse;
536 border: 1px solid #D5D5D5;
538 .widget_content table td {
542 .widget-sticker-container {
547 background-color: white;
548 border: 1px solid #D5D5D5;
553 .widget-sticker-header {
554 background-color: #CDDCF3;
558 .widget-sticker-body {
565 .widget-sticker-footer {
569 #widget-categories a {
574 #widget-categories a.selected {
575 background-color: #36c;
580 border-bottom: 1px solid #ccc;
583 display: inline-block;
590 .widget_toolbar li.current a,
591 .widget_toolbar li.current a:hover {
592 border-bottom: 2px solid #38f;
596 .widget_toolbar li a {
597 padding-bottom: .35em !important;
601 .widget_toolbar li a:hover {
602 border-bottom: 2px solid #999;
606 table.listing tbody tr:nth-child(even),
608 background-color: #CDDCF3;
611 table.listing tbody tr:nth-child(odd),
613 background-color: #FFFFFF;
621 border-collapse: collapse;
624 .listTable table td {
626 border: 1px solid gray;
634 margin-bottom: 1.25em;
636 /*border-collapse: collapse;*/
637 border-bottom: 1px solid #61697C;
638 border-spacing: 6px 0;
645 border-top-left-radius: 6px;
646 border-top-right-radius: 6px;
647 display: inline-block;
663 ----------------------------------------------- */
669 padding: 1.5em .5em .5em .5em;
671 border-top: 1px solid #ccc;
693 opacity: 1 !important;
694 transition: opacity ease-in 1s;
697 border: 8px solid #fff;
699 border-top: 8px solid #0000;
702 -webkit-animation: spin 2s linear infinite; /* Safari */
703 animation: spin 2s linear infinite;
709 @-webkit-keyframes spin {
710 0% { -webkit-transform: rotate(0deg); }
711 100% { -webkit-transform: rotate(360deg); }
715 0% { transform: rotate(0deg); }
716 100% { transform: rotate(360deg); }
719 /* error_msg, warning_msg or feedback function
720 ----------------------------------------------- */
721 span.active, span.deleted, span.pending, span.suspended {
725 .active {background-color: #cfc;}
726 .deleted {background-color: #cff;}
727 .pending {background-color: #ddd;}
728 .suspended {background-color: #fc6;}
730 background-color: #ff4940; /* red */
731 border: 1px solid red;
734 text-shadow: 1px 1px #ff7c73;
742 .warning_msg, .warning, .tips, .important {
743 background-color: #ffd297; /* orange */
744 border: 1px solid #ffa500; /* orange */
747 text-shadow: 1px 1px #fff5CA;
755 background-color: #aef26d; /* green */
756 border: 1px solid green;
759 text-shadow: 1px 1px #DFF59f;
767 background-color: #bdd0f2;
768 border: 1px solid #3a5fa5;
771 text-shadow: 1px 1px #bcf;
779 background-color: #ff4940; /* red */
780 border: 1px solid red;
783 text-shadow: 1px 1px #ff7c73;
789 background-color: #ff4940; /* red */
790 border: 1px solid red;
793 text-shadow: 1px 1px #ff7c73;
800 border-radius: 0.5em 0.5em 0 0;
801 border-bottom: 1px solid #E2E3E4;
802 padding: 3px 3px 3px 10px;
803 margin: 0 -4px 0 -4px;
812 border-radius: 0.7em;
813 border:1px solid #c2c3c4;
814 box-shadow: 1px 1px 4px #c2c3c4;
817 .priority1 { background-color: #f3f4db}
818 .priority2 { background-color: #fcecc2}
819 .priority3 { background-color: #fde4aa}
820 .priority4 { background-color: #fcd986}
821 .priority5 { background-color: #fac955}
823 .table-header-rotated {
824 border-collapse: collapse;
827 .table-header-rotated td {
831 border: 1px solid #ccc;
834 .table-header-rotated th.rotate {
839 .table-header-rotated th.rotate>div {
840 transform: translate(25px, 51px) rotate(315deg);
844 .table-header-rotated th.rotate>div>span {
845 border-bottom: 1px solid #ccc;
849 .table-header-rotated th.row-header {
851 border-bottom: 1px solid #ccc;
854 table.listing thead tr th {
855 background-color: #707d97 !important;
860 table.listing thead tr th,
861 table.listing tbody tr td {
862 padding: 4px 8px !important;
865 table.listing thead tr th a {
869 table.listing tbody tr:nth-child(2n), .even {
870 background-color: #e0dfd6 !important;
873 table.listing tbody tr:nth-child(2n+1), .odd {
874 background-color: #e6e6e0 !important;
878 vertical-align: middle;
882 background-color: #e10;
885 text-shadow: 0 0 1px #300;
890 .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active {
891 background:none !important;
892 background-color: #d7d7d7 !important;
893 border:1px solid #a7a7a7 !important;
894 color: #222 !important;
895 text-shadow:1px 1px #eee;
896 transition-property: background-color, text-shadow;
897 transition-duration: 0.3s;
899 .ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus, .ui-button:hover, .ui-button:focus {
900 border: 1px solid #505d77;
901 background-color: #f7f7f7 !important;
902 border:1px solid #878787 !important;
903 color: black !important;
904 text-shadow:1px 1px #fff;
907 /* Hide number input spinners */
908 input[type='number'] {
909 -moz-appearance:textfield;
911 input::-webkit-outer-spin-button,
912 input::-webkit-inner-spin-button { -webkit-appearance: none; }
913 /* end Hide number input spinners */
915 @media only screen and (max-width:1023px) {
918 padding-bottom: .3em;
921 /* =hamburgerMenuOn */
924 padding: .8em 0 0 .8em;
925 display: inline-block;
939 #userlinkshamburgerdiv {
944 #menudiv input:checked ~ #hamburgermenudiv {
950 transition: all ease-out .4s;
953 #menudiv input:not(:checked) ~ #hamburgermenudiv {
961 #hamburgermenudiv .tabGenerator {
963 flex-direction: column;
967 #userlinkshamburgerdiv ul,
968 #hamburgermenudiv .tabGenerator ul {
970 flex-direction: column;
976 #userlinkshamburgerdiv li,
977 #hamburgermenudiv .tabGenerator li {
978 display: inline-block;
981 border-top: 1px solid #707d97;
985 #userlinkshamburgerdiv {
990 #userlinkshamburgerdiv li {
994 #userlinkshamburgerdiv li a {
998 white-space: no-wrap;
1001 #hamburgermenudiv .tabGenerator span{