From 93eda9d9c1deb50cfa36392dbcbc4dc56883160f Mon Sep 17 00:00:00 2001 From: Fabio Comuni Date: Fri, 22 Jul 2011 17:37:51 +0200 Subject: Initial work on new UI --- view/theme/quattro/LIBERATION-FONTS-COPYING | 339 +++++++++++++++++++++ view/theme/quattro/LiberationSans-Bold.ttf | Bin 0 -> 136664 bytes view/theme/quattro/LiberationSans-Italic.ttf | Bin 0 -> 161532 bytes view/theme/quattro/LiberationSans-Regular.ttf | Bin 0 -> 139036 bytes .../quattro/liberation-fonts-ttf-1.07.0.tar.gz | Bin 0 -> 1326750 bytes view/theme/quattro/style.css | 168 ++++++++++ view/theme/quattro/style.less | 193 ++++++++++++ 7 files changed, 700 insertions(+) create mode 100644 view/theme/quattro/LIBERATION-FONTS-COPYING create mode 100644 view/theme/quattro/LiberationSans-Bold.ttf create mode 100644 view/theme/quattro/LiberationSans-Italic.ttf create mode 100644 view/theme/quattro/LiberationSans-Regular.ttf create mode 100644 view/theme/quattro/liberation-fonts-ttf-1.07.0.tar.gz create mode 100644 view/theme/quattro/style.css create mode 100644 view/theme/quattro/style.less (limited to 'view/theme/quattro') diff --git a/view/theme/quattro/LIBERATION-FONTS-COPYING b/view/theme/quattro/LIBERATION-FONTS-COPYING new file mode 100644 index 000000000..d511905c1 --- /dev/null +++ b/view/theme/quattro/LIBERATION-FONTS-COPYING @@ -0,0 +1,339 @@ + GNU GENERAL PUBLIC LICENSE + Version 2, June 1991 + + Copyright (C) 1989, 1991 Free Software Foundation, Inc., + 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA + Everyone is permitted to copy and distribute verbatim copies + of this license document, but changing it is not allowed. + + Preamble + + The licenses for most software are designed to take away your +freedom to share and change it. By contrast, the GNU General Public +License is intended to guarantee your freedom to share and change free +software--to make sure the software is free for all its users. This +General Public License applies to most of the Free Software +Foundation's software and to any other program whose authors commit to +using it. (Some other Free Software Foundation software is covered by +the GNU Lesser General Public License instead.) You can apply it to +your programs, too. + + When we speak of free software, we are referring to freedom, not +price. Our General Public Licenses are designed to make sure that you +have the freedom to distribute copies of free software (and charge for +this service if you wish), that you receive source code or can get it +if you want it, that you can change the software or use pieces of it +in new free programs; and that you know you can do these things. + + To protect your rights, we need to make restrictions that forbid +anyone to deny you these rights or to ask you to surrender the rights. +These restrictions translate to certain responsibilities for you if you +distribute copies of the software, or if you modify it. + + For example, if you distribute copies of such a program, whether +gratis or for a fee, you must give the recipients all the rights that +you have. You must make sure that they, too, receive or can get the +source code. And you must show them these terms so they know their +rights. + + We protect your rights with two steps: (1) copyright the software, and +(2) offer you this license which gives you legal permission to copy, +distribute and/or modify the software. + + Also, for each author's protection and ours, we want to make certain +that everyone understands that there is no warranty for this free +software. If the software is modified by someone else and passed on, we +want its recipients to know that what they have is not the original, so +that any problems introduced by others will not reflect on the original +authors' reputations. + + Finally, any free program is threatened constantly by software +patents. We wish to avoid the danger that redistributors of a free +program will individually obtain patent licenses, in effect making the +program proprietary. To prevent this, we have made it clear that any +patent must be licensed for everyone's free use or not licensed at all. + + The precise terms and conditions for copying, distribution and +modification follow. + + GNU GENERAL PUBLIC LICENSE + TERMS AND CONDITIONS FOR COPYING, DISTRIBUTION AND MODIFICATION + + 0. This License applies to any program or other work which contains +a notice placed by the copyright holder saying it may be distributed +under the terms of this General Public License. The "Program", below, +refers to any such program or work, and a "work based on the Program" +means either the Program or any derivative work under copyright law: +that is to say, a work containing the Program or a portion of it, +either verbatim or with modifications and/or translated into another +language. (Hereinafter, translation is included without limitation in +the term "modification".) Each licensee is addressed as "you". + +Activities other than copying, distribution and modification are not +covered by this License; they are outside its scope. The act of +running the Program is not restricted, and the output from the Program +is covered only if its contents constitute a work based on the +Program (independent of having been made by running the Program). +Whether that is true depends on what the Program does. + + 1. You may copy and distribute verbatim copies of the Program's +source code as you receive it, in any medium, provided that you +conspicuously and appropriately publish on each copy an appropriate +copyright notice and disclaimer of warranty; keep intact all the +notices that refer to this License and to the absence of any warranty; +and give any other recipients of the Program a copy of this License +along with the Program. + +You may charge a fee for the physical act of transferring a copy, and +you may at your option offer warranty protection in exchange for a fee. + + 2. You may modify your copy or copies of the Program or any portion +of it, thus forming a work based on the Program, and copy and +distribute such modifications or work under the terms of Section 1 +above, provided that you also meet all of these conditions: + + a) You must cause the modified files to carry prominent notices + stating that you changed the files and the date of any change. + + b) You must cause any work that you distribute or publish, that in + whole or in part contains or is derived from the Program or any + part thereof, to be licensed as a whole at no charge to all third + parties under the terms of this License. + + c) If the modified program normally reads commands interactively + when run, you must cause it, when started running for such + interactive use in the most ordinary way, to print or display an + announcement including an appropriate copyright notice and a + notice that there is no warranty (or else, saying that you provide + a warranty) and that users may redistribute the program under + these conditions, and telling the user how to view a copy of this + License. (Exception: if the Program itself is interactive but + does not normally print such an announcement, your work based on + the Program is not required to print an announcement.) + +These requirements apply to the modified work as a whole. If +identifiable sections of that work are not derived from the Program, +and can be reasonably considered independent and separate works in +themselves, then this License, and its terms, do not apply to those +sections when you distribute them as separate works. But when you +distribute the same sections as part of a whole which is a work based +on the Program, the distribution of the whole must be on the terms of +this License, whose permissions for other licensees extend to the +entire whole, and thus to each and every part regardless of who wrote it. + +Thus, it is not the intent of this section to claim rights or contest +your rights to work written entirely by you; rather, the intent is to +exercise the right to control the distribution of derivative or +collective works based on the Program. + +In addition, mere aggregation of another work not based on the Program +with the Program (or with a work based on the Program) on a volume of +a storage or distribution medium does not bring the other work under +the scope of this License. + + 3. You may copy and distribute the Program (or a work based on it, +under Section 2) in object code or executable form under the terms of +Sections 1 and 2 above provided that you also do one of the following: + + a) Accompany it with the complete corresponding machine-readable + source code, which must be distributed under the terms of Sections + 1 and 2 above on a medium customarily used for software interchange; or, + + b) Accompany it with a written offer, valid for at least three + years, to give any third party, for a charge no more than your + cost of physically performing source distribution, a complete + machine-readable copy of the corresponding source code, to be + distributed under the terms of Sections 1 and 2 above on a medium + customarily used for software interchange; or, + + c) Accompany it with the information you received as to the offer + to distribute corresponding source code. (This alternative is + allowed only for noncommercial distribution and only if you + received the program in object code or executable form with such + an offer, in accord with Subsection b above.) + +The source code for a work means the preferred form of the work for +making modifications to it. For an executable work, complete source +code means all the source code for all modules it contains, plus any +associated interface definition files, plus the scripts used to +control compilation and installation of the executable. However, as a +special exception, the source code distributed need not include +anything that is normally distributed (in either source or binary +form) with the major components (compiler, kernel, and so on) of the +operating system on which the executable runs, unless that component +itself accompanies the executable. + +If distribution of executable or object code is made by offering +access to copy from a designated place, then offering equivalent +access to copy the source code from the same place counts as +distribution of the source code, even though third parties are not +compelled to copy the source along with the object code. + + 4. You may not copy, modify, sublicense, or distribute the Program +except as expressly provided under this License. Any attempt +otherwise to copy, modify, sublicense or distribute the Program is +void, and will automatically terminate your rights under this License. +However, parties who have received copies, or rights, from you under +this License will not have their licenses terminated so long as such +parties remain in full compliance. + + 5. You are not required to accept this License, since you have not +signed it. However, nothing else grants you permission to modify or +distribute the Program or its derivative works. These actions are +prohibited by law if you do not accept this License. Therefore, by +modifying or distributing the Program (or any work based on the +Program), you indicate your acceptance of this License to do so, and +all its terms and conditions for copying, distributing or modifying +the Program or works based on it. + + 6. Each time you redistribute the Program (or any work based on the +Program), the recipient automatically receives a license from the +original licensor to copy, distribute or modify the Program subject to +these terms and conditions. You may not impose any further +restrictions on the recipients' exercise of the rights granted herein. +You are not responsible for enforcing compliance by third parties to +this License. + + 7. If, as a consequence of a court judgment or allegation of patent +infringement or for any other reason (not limited to patent issues), +conditions are imposed on you (whether by court order, agreement or +otherwise) that contradict the conditions of this License, they do not +excuse you from the conditions of this License. If you cannot +distribute so as to satisfy simultaneously your obligations under this +License and any other pertinent obligations, then as a consequence you +may not distribute the Program at all. For example, if a patent +license would not permit royalty-free redistribution of the Program by +all those who receive copies directly or indirectly through you, then +the only way you could satisfy both it and this License would be to +refrain entirely from distribution of the Program. + +If any portion of this section is held invalid or unenforceable under +any particular circumstance, the balance of the section is intended to +apply and the section as a whole is intended to apply in other +circumstances. + +It is not the purpose of this section to induce you to infringe any +patents or other property right claims or to contest validity of any +such claims; this section has the sole purpose of protecting the +integrity of the free software distribution system, which is +implemented by public license practices. Many people have made +generous contributions to the wide range of software distributed +through that system in reliance on consistent application of that +system; it is up to the author/donor to decide if he or she is willing +to distribute software through any other system and a licensee cannot +impose that choice. + +This section is intended to make thoroughly clear what is believed to +be a consequence of the rest of this License. + + 8. If the distribution and/or use of the Program is restricted in +certain countries either by patents or by copyrighted interfaces, the +original copyright holder who places the Program under this License +may add an explicit geographical distribution limitation excluding +those countries, so that distribution is permitted only in or among +countries not thus excluded. In such case, this License incorporates +the limitation as if written in the body of this License. + + 9. The Free Software Foundation may publish revised and/or new versions +of the General Public License from time to time. Such new versions will +be similar in spirit to the present version, but may differ in detail to +address new problems or concerns. + +Each version is given a distinguishing version number. If the Program +specifies a version number of this License which applies to it and "any +later version", you have the option of following the terms and conditions +either of that version or of any later version published by the Free +Software Foundation. If the Program does not specify a version number of +this License, you may choose any version ever published by the Free Software +Foundation. + + 10. If you wish to incorporate parts of the Program into other free +programs whose distribution conditions are different, write to the author +to ask for permission. For software which is copyrighted by the Free +Software Foundation, write to the Free Software Foundation; we sometimes +make exceptions for this. Our decision will be guided by the two goals +of preserving the free status of all derivatives of our free software and +of promoting the sharing and reuse of software generally. + + NO WARRANTY + + 11. BECAUSE THE PROGRAM IS LICENSED FREE OF CHARGE, THERE IS NO WARRANTY +FOR THE PROGRAM, TO THE EXTENT PERMITTED BY APPLICABLE LAW. EXCEPT WHEN +OTHERWISE STATED IN WRITING THE COPYRIGHT HOLDERS AND/OR OTHER PARTIES +PROVIDE THE PROGRAM "AS IS" WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESSED +OR IMPLIED, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF +MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE. THE ENTIRE RISK AS +TO THE QUALITY AND PERFORMANCE OF THE PROGRAM IS WITH YOU. SHOULD THE +PROGRAM PROVE DEFECTIVE, YOU ASSUME THE COST OF ALL NECESSARY SERVICING, +REPAIR OR CORRECTION. + + 12. IN NO EVENT UNLESS REQUIRED BY APPLICABLE LAW OR AGREED TO IN WRITING +WILL ANY COPYRIGHT HOLDER, OR ANY OTHER PARTY WHO MAY MODIFY AND/OR +REDISTRIBUTE THE PROGRAM AS PERMITTED ABOVE, BE LIABLE TO YOU FOR DAMAGES, +INCLUDING ANY GENERAL, SPECIAL, INCIDENTAL OR CONSEQUENTIAL DAMAGES ARISING +OUT OF THE USE OR INABILITY TO USE THE PROGRAM (INCLUDING BUT NOT LIMITED +TO LOSS OF DATA OR DATA BEING RENDERED INACCURATE OR LOSSES SUSTAINED BY +YOU OR THIRD PARTIES OR A FAILURE OF THE PROGRAM TO OPERATE WITH ANY OTHER +PROGRAMS), EVEN IF SUCH HOLDER OR OTHER PARTY HAS BEEN ADVISED OF THE +POSSIBILITY OF SUCH DAMAGES. + + END OF TERMS AND CONDITIONS + + How to Apply These Terms to Your New Programs + + If you develop a new program, and you want it to be of the greatest +possible use to the public, the best way to achieve this is to make it +free software which everyone can redistribute and change under these terms. + + To do so, attach the following notices to the program. It is safest +to attach them to the start of each source file to most effectively +convey the exclusion of warranty; and each file should have at least +the "copyright" line and a pointer to where the full notice is found. + + + Copyright (C) + + This program is free software; you can redistribute it and/or modify + it under the terms of the GNU General Public License as published by + the Free Software Foundation; either version 2 of the License, or + (at your option) any later version. + + This program is distributed in the hope that it will be useful, + but WITHOUT ANY WARRANTY; without even the implied warranty of + MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + GNU General Public License for more details. + + You should have received a copy of the GNU General Public License along + with this program; if not, write to the Free Software Foundation, Inc., + 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA. + +Also add information on how to contact you by electronic and paper mail. + +If the program is interactive, make it output a short notice like this +when it starts in an interactive mode: + + Gnomovision version 69, Copyright (C) year name of author + Gnomovision comes with ABSOLUTELY NO WARRANTY; for details type `show w'. + This is free software, and you are welcome to redistribute it + under certain conditions; type `show c' for details. + +The hypothetical commands `show w' and `show c' should show the appropriate +parts of the General Public License. Of course, the commands you use may +be called something other than `show w' and `show c'; they could even be +mouse-clicks or menu items--whatever suits your program. + +You should also get your employer (if you work as a programmer) or your +school, if any, to sign a "copyright disclaimer" for the program, if +necessary. Here is a sample; alter the names: + + Yoyodyne, Inc., hereby disclaims all copyright interest in the program + `Gnomovision' (which makes passes at compilers) written by James Hacker. + + , 1 April 1989 + Ty Coon, President of Vice + +This General Public License does not permit incorporating your program into +proprietary programs. If your program is a subroutine library, you may +consider it more useful to permit linking proprietary applications with the +library. If this is what you want to do, use the GNU Lesser General +Public License instead of this License. diff --git a/view/theme/quattro/LiberationSans-Bold.ttf b/view/theme/quattro/LiberationSans-Bold.ttf new file mode 100644 index 000000000..169fac34d Binary files /dev/null and b/view/theme/quattro/LiberationSans-Bold.ttf differ diff --git a/view/theme/quattro/LiberationSans-Italic.ttf b/view/theme/quattro/LiberationSans-Italic.ttf new file mode 100644 index 000000000..8b9dc760a Binary files /dev/null and b/view/theme/quattro/LiberationSans-Italic.ttf differ diff --git a/view/theme/quattro/LiberationSans-Regular.ttf b/view/theme/quattro/LiberationSans-Regular.ttf new file mode 100644 index 000000000..ceeaa2740 Binary files /dev/null and b/view/theme/quattro/LiberationSans-Regular.ttf differ diff --git a/view/theme/quattro/liberation-fonts-ttf-1.07.0.tar.gz b/view/theme/quattro/liberation-fonts-ttf-1.07.0.tar.gz new file mode 100644 index 000000000..0c86f7347 Binary files /dev/null and b/view/theme/quattro/liberation-fonts-ttf-1.07.0.tar.gz differ diff --git a/view/theme/quattro/style.css b/view/theme/quattro/style.css new file mode 100644 index 000000000..055f8e9b6 --- /dev/null +++ b/view/theme/quattro/style.css @@ -0,0 +1,168 @@ +/** + * Fabio Comuni + **/ +/* fonts */ +@font-face { + font-family: "LiberationSans"; + src: local("Liberation Sans"), url(LiberationSans-Regular.ttf) format("truetype"); + font-weight: normal; + font-style: normal; +} +@font-face { + font-family: "LiberationSans"; + src: local("Liberation Sans"), url(LiberationSans-Bold.ttf) format("truetype"); + font-weight: bold; + font-style: normal; +} +@font-face { + font-family: "LiberationSans"; + src: local("Liberation Sans"), url(LiberationSans-Italic.ttf) format("truetype"); + font-weight: normal; + font-style: italic; +} +/* global */ +body { + font-family: LiberationSans, helvetica, arial, freesans, clean, sans-serif; + font-size: 12px; + background-color: #FFFFFF; + color: #2d2d2d; + margin: 0px; +} +a, a:visited, a:link { + color: #005c94; + text-decoration: none; +} +a:hover { + text-decoration: underline; +} +.left { + float: left; +} +.right { + float: right; +} +/* nav */ +nav { + width: 100%; + height: 50px; + background-color: #0e232e; + color: #FFFFFF; +} +nav a, +nav a:visited, +nav a:link, +nav a:hover { + color: #FFFFFF; + text-decoration: none; +} +nav #site-location { + font-size: 8px; + float: left; + background-color: #364e59; + padding: 1px 5px; + margin-left: 20px; + -moz-border-radius: 0 0 5px 5px; + -webkit-border-radius: 0 0 5px 5px; + border-radius: 0 0 5px 5px; +} +nav #nav { + clear: both; + padding: 0px 20px; + height: auto; + padding-top: 6px; +} +nav #nav .nav-menu-icon { + position: relative; + height: 22px; + padding: 5px; + margin: 0px 10px; + -moz-border-radius: 5px 5px 0 0; + -webkit-border-radius: 5px 5px 0 0; + border-radius: 5px 5px 0 0; +} +nav #nav .nav-menu-icon.selected { + background-color: #364e59; +} +nav #nav .nav-menu-icon img { + width: 22px; + height: 22px; +} +nav #nav .nav-menu { + position: relative; + height: 16px; + padding: 5px; + margin: 3px 15px 0px; + font-size: 14px; + border-bottom: 3px solid #0e232e; +} +nav #nav .nav-menu.selected { + border-bottom: 3px solid #9eabb0; +} +nav #nav .nav-menu .nav-notify { + position: absolute; + background-color: #19aeff; + -moz-border-radius: 5px 5px 5px 5px; + -webkit-border-radius: 5px 5px 5px 5px; + border-radius: 5px 5px 5px 5px; + font-size: 10px; + padding: 1px 3px; + top: 0px; + right: -10px; + min-width: 15px; + text-align: right; +} +ul.menu-popup { + position: absolute; + /*display: none;*/ + + width: auto; + background: #FFFFFF; + color: #2d2d2d; + margin: 0px; + padding: 0px; + list-style: none; + border: 3px solid #364e59; + z-index: 100000; +} +ul.menu-popup a { + display: block; + color: #2d2d2d; + padding: 5px 10px; +} +ul.menu-popup a:hover { + background-color: #bdcdd4; +} +ul.menu-popup .menu-sep { + border-top: 1px solid #9eabb0; +} +.left .menu-popup { + left: 0px; +} +.right .menu-popup { + right: 0px; +} +/* icons */ +.icon { + background-color: transparent ; + background-repeat: no-repeat; + background-position: center center; + display: block; +} +.icon.s22 { + width: 22px; + height: 22px; +} +.icon.s22.notify_off { + background-image: url("../../../images/icons/notify_off_22.png"); +} +.icon.s22.notify_on { + background-image: url("../../../images/icons/notify_on_22.png"); +} +/* aside */ +aside { + display: none; +} +/* section */ +section { + display: none; +} diff --git a/view/theme/quattro/style.less b/view/theme/quattro/style.less new file mode 100644 index 000000000..e267834a6 --- /dev/null +++ b/view/theme/quattro/style.less @@ -0,0 +1,193 @@ +/** + * Fabio Comuni + **/ +// Less file http://lesscss.org/ +// compile with lessc +// $ lessc style.less > style.css + +// "Echo" palette from Inkscape +@Blue1:rgb(25,174,255); +@Blue2:rgb(0,132,200); +@Blue3:rgb(0,92,148); +@Red1:rgb(255,65,65); +@Red2:rgb(220,0,0); +@Red3:rgb(181,0,0); +@Orange1:rgb(255,255,62); +@Orange2:rgb(255,153,0); +@Orange3:rgb(255,102,0); +@Brown1:rgb(255,192,34); +@Brown2:rgb(184,129,0); +@Brown3:rgb(128,77,0); +@Green1:rgb(204,255,66); +@Green2:rgb(154,222,0); +@Green3:rgb(0,145,0); +@Purple1:rgb(241,202,255); +@Purple2:rgb(215,108,255); +@Purple3:rgb(186,0,255); +@Metalic1:rgb(189,205,212); +@Metalic2:rgb(158,171,176); +@Metalic3:rgb(54,78,89); +@Metalic4:rgb(14,35,46); +@Grey1:rgb(255,255,255); +@Grey2:rgb(204,204,204); +@Grey3:rgb(153,153,153); +@Grey4:rgb(102,102,102); +@Grey5:rgb(45,45,45); + + + +/* fonts */ +@font-face { + font-family: "LiberationSans"; + src: local("Liberation Sans"), url( LiberationSans-Regular.ttf ) format("truetype"); + font-weight: normal; font-style: normal; +} +@font-face { + font-family: "LiberationSans"; + src: local("Liberation Sans"), url( LiberationSans-Bold.ttf ) format("truetype"); + font-weight: bold; font-style: normal; +} +@font-face { + font-family: "LiberationSans"; + src: local("Liberation Sans"), url( LiberationSans-Italic.ttf ) format("truetype"); + font-weight: normal; font-style: italic; +} + +/* global */ +body { + font-family: LiberationSans,helvetica,arial,freesans,clean,sans-serif; + font-size: 12px; + background-color: #FFFFFF; + color: @Grey5; + margin: 0px; +} + +.rounded(@tr: 5px, @tl: 5px, @bl: 5px, @br: 5px){ + -moz-border-radius: @arguments; + -webkit-border-radius: @arguments; + border-radius: @arguments; +} + +.roundbottom (@radius: 5px){ .rounded(0, 0, @radius, @radius); } +.roundtop (@radius: 5px){ .rounded(@radius, @radius, 0, 0); } + +a, a:visited, a:link { color: @Blue3; text-decoration: none; } +a:hover {text-decoration: underline; } + +.left { float: left; } +.right { float: right; } + +/* nav */ +nav { + width: 100%; height: 50px; + background-color: @Metalic4; + color: #FFFFFF; + a, a:visited, a:link, a:hover { color: #FFFFFF; text-decoration: none; } + + #site-location { + font-size:8px; + float:left; + background-color: @Metalic3; + padding: 1px 5px; + margin-left: 20px; + .roundbottom() + } + + #nav { + clear: both; + padding: 0px 20px; + height: auto; + padding-top: 6px; + + .nav-menu-icon { + position: relative; + height: 22px; + padding: 5px; + margin: 0px 10px; + .roundtop(); + + &.selected { + background-color: @Metalic3; + } + + img { width: 22px; height: 22px; } + } + + .nav-menu { + position: relative; + height: 16px; + padding: 5px; + margin: 3px 15px 0px; + font-size: 14px; + border-bottom: 3px solid @Metalic4; + &.selected { + border-bottom: 3px solid @Metalic2; + } + + .nav-notify { + position: absolute; + background-color: @Blue1; + .rounded(); + font-size: 10px; + padding: 1px 3px; + top: 0px; + right: -10px; + min-width: 15px; + text-align: right; + } + + } + + } +} + +ul.menu-popup { + position: absolute; + /*display: none;*/ + width: auto; + background: #FFFFFF; + color: @Grey5; + margin: 0px; + padding: 0px; + list-style: none; + border: 3px solid @Metalic3; + a { display: block; color: @Grey5; padding: 5px 10px;} + a:hover { background-color: @Metalic1; } + z-index: 100000; + + .menu-sep { + border-top: 1px solid @Metalic2; + } +} +.left .menu-popup{ left: 0px; } +.right .menu-popup{ right: 0px; } + +/* icons */ + + +.icons(@size: 22) { + &.notify_off { background-image: url("../../../images/icons/notify_off_@{size}.png"); } + &.notify_on { background-image: url("../../../images/icons/notify_on_@{size}.png"); } +} + + +.icon { + background-color: transparent ; + background-repeat: no-repeat; + background-position: center center; + display: block; + + &.s22 { + width:22px; height: 22px; + .icons(22); + } + +} + + + +/* aside */ +aside { display: none; } + +/* section */ +section { display: none;} -- cgit v1.2.3 From ba4ea589d00d8d79291191156a64e903b36509aa Mon Sep 17 00:00:00 2001 From: Fabio Comuni Date: Mon, 25 Jul 2011 16:55:43 +0200 Subject: update style --- view/theme/quattro/style.css | 166 ++++++++++++++++++++++--------------- view/theme/quattro/style.less | 187 +++++++++++++++++++++++++----------------- 2 files changed, 213 insertions(+), 140 deletions(-) (limited to 'view/theme/quattro') diff --git a/view/theme/quattro/style.css b/view/theme/quattro/style.css index 055f8e9b6..ec5231290 100644 --- a/view/theme/quattro/style.css +++ b/view/theme/quattro/style.css @@ -2,27 +2,9 @@ * Fabio Comuni **/ /* fonts */ -@font-face { - font-family: "LiberationSans"; - src: local("Liberation Sans"), url(LiberationSans-Regular.ttf) format("truetype"); - font-weight: normal; - font-style: normal; -} -@font-face { - font-family: "LiberationSans"; - src: local("Liberation Sans"), url(LiberationSans-Bold.ttf) format("truetype"); - font-weight: bold; - font-style: normal; -} -@font-face { - font-family: "LiberationSans"; - src: local("Liberation Sans"), url(LiberationSans-Italic.ttf) format("truetype"); - font-weight: normal; - font-style: italic; -} /* global */ body { - font-family: LiberationSans, helvetica, arial, freesans, clean, sans-serif; + font-family: Liberation Sans, helvetica, arial, clean, sans-serif; font-size: 12px; background-color: #FFFFFF; color: #2d2d2d; @@ -41,37 +23,81 @@ a:hover { .right { float: right; } +/* icons */ +.icon { + background-color: transparent ; + background-repeat: no-repeat; + background-position: center center; + display: block; + overflow: hidden; + text-indent: -9999px; +} +.icon.s22 { + width: 22px; + height: 22px; + padding: 1px; +} +.icon.s22.notify { + background-image: url("../../../images/icons/notify_off_22.png"); +} +.icon.s22.gear { + background-image: url("../../../images/icons/gear_22.png"); +} +/* header */ +header { + position: fixed; + left: 0px; + top: 0px; + margin: 0px; + padding: 0px; + width: 100%; + height: 12px; + color: #FFFFFF; +} +header #site-location { + /*font-size:8px; + float:left; + background-color: @Metalic3; + padding: 1px 5px; + margin-left: 20px; + .roundbottom()*/ + + display: none; +} /* nav */ nav { width: 100%; - height: 50px; + height: 32px; + position: fixed; + left: 0px; + top: 0px; background-color: #0e232e; color: #FFFFFF; } nav a, +nav a:active, nav a:visited, nav a:link, nav a:hover { color: #FFFFFF; text-decoration: none; + outline: none; } -nav #site-location { - font-size: 8px; - float: left; - background-color: #364e59; - padding: 1px 5px; - margin-left: 20px; - -moz-border-radius: 0 0 5px 5px; - -webkit-border-radius: 0 0 5px 5px; - border-radius: 0 0 5px 5px; -} -nav #nav { - clear: both; +nav ul { + margin: 0px; padding: 0px 20px; - height: auto; - padding-top: 6px; } -nav #nav .nav-menu-icon { +nav ul li { + list-style: none; + margin: 0px; + padding: 0px; + float: left; +} +nav ul li .menu-popup { + left: 0px; + right: auto; +} +nav .nav-menu-icon { position: relative; height: 22px; padding: 5px; @@ -80,14 +106,17 @@ nav #nav .nav-menu-icon { -webkit-border-radius: 5px 5px 0 0; border-radius: 5px 5px 0 0; } -nav #nav .nav-menu-icon.selected { +nav .nav-menu-icon.selected { background-color: #364e59; } -nav #nav .nav-menu-icon img { +nav .nav-menu-icon img { width: 22px; height: 22px; } -nav #nav .nav-menu { +nav .nav-menu-icon .nav-notify { + top: 3px; +} +nav .nav-menu { position: relative; height: 16px; padding: 5px; @@ -95,10 +124,11 @@ nav #nav .nav-menu { font-size: 14px; border-bottom: 3px solid #0e232e; } -nav #nav .nav-menu.selected { +nav .nav-menu.selected { border-bottom: 3px solid #9eabb0; } -nav #nav .nav-menu .nav-notify { +nav .nav-notify { + display: none; position: absolute; background-color: #19aeff; -moz-border-radius: 5px 5px 5px 5px; @@ -111,10 +141,22 @@ nav #nav .nav-menu .nav-notify { min-width: 15px; text-align: right; } +nav .nav-notify.show { + display: block; +} +nav #nav-site-link { + float: right; +} +nav #nav-site-link .menu-popup { + right: 0px; + left: auto; +} +nav #nav-notifications-link.selected .icon.s22.notify { + background-image: url("../../../images/icons/notify_on_22.png"); +} ul.menu-popup { position: absolute; - /*display: none;*/ - + display: none; width: auto; background: #FFFFFF; color: #2d2d2d; @@ -135,34 +177,26 @@ ul.menu-popup a:hover { ul.menu-popup .menu-sep { border-top: 1px solid #9eabb0; } -.left .menu-popup { - left: 0px; -} -.right .menu-popup { - right: 0px; -} -/* icons */ -.icon { - background-color: transparent ; - background-repeat: no-repeat; - background-position: center center; +ul.menu-popup li { + float: none; + overflow: auto; + height: auto; display: block; } -.icon.s22 { - width: 22px; - height: 22px; +#nav-notifications-menu { + width: 400px; } -.icon.s22.notify_off { - background-image: url("../../../images/icons/notify_off_22.png"); +#nav-notifications-menu img { + float: left; + margin-right: 5px; } -.icon.s22.notify_on { - background-image: url("../../../images/icons/notify_on_22.png"); +#nav-notifications-menu .contactname { + font-weight: bold; } -/* aside */ -aside { - display: none; +#nav-notifications-menu .notif-when { + font-size: 10px; + color: #9eabb0; + display: block; } +/* aside */ /* section */ -section { - display: none; -} diff --git a/view/theme/quattro/style.less b/view/theme/quattro/style.less index e267834a6..53f833cfd 100644 --- a/view/theme/quattro/style.less +++ b/view/theme/quattro/style.less @@ -37,25 +37,27 @@ /* fonts */ -@font-face { - font-family: "LiberationSans"; - src: local("Liberation Sans"), url( LiberationSans-Regular.ttf ) format("truetype"); - font-weight: normal; font-style: normal; -} -@font-face { - font-family: "LiberationSans"; - src: local("Liberation Sans"), url( LiberationSans-Bold.ttf ) format("truetype"); - font-weight: bold; font-style: normal; -} -@font-face { - font-family: "LiberationSans"; - src: local("Liberation Sans"), url( LiberationSans-Italic.ttf ) format("truetype"); - font-weight: normal; font-style: italic; -} - +// @font-face { +// font-family: "LiberationSans"; +// src: local("Liberation Sans"),url( LiberationSans-Regular.ttf ) format("truetype"); +// font-weight: bold; font-style: italic; +// } +// +// @font-face { +// font-family: "LiberationSans"; +// src: local("Liberation Sans"),url( LiberationSans-Bold.ttf ) format("truetype"); +// font-weight: bold; font-style: normal; +// } +// @font-face { +// font-family: "LiberationSans"; +// src: local("Liberation Sans"),url( LiberationSans-Italic.ttf ) format("truetype"); +// font-weight: normal; font-style: italic; +// } + + /* global */ body { - font-family: LiberationSans,helvetica,arial,freesans,clean,sans-serif; + font-family: Liberation Sans,helvetica,arial,clean,sans-serif; font-size: 12px; background-color: #FFFFFF; color: @Grey5; @@ -77,28 +79,70 @@ a:hover {text-decoration: underline; } .left { float: left; } .right { float: right; } -/* nav */ -nav { - width: 100%; height: 50px; - background-color: @Metalic4; - color: #FFFFFF; - a, a:visited, a:link, a:hover { color: #FFFFFF; text-decoration: none; } +/* icons */ + + +.icons(@size: 22) { + &.notify { background-image: url("../../../images/icons/notify_off_@{size}.png"); } + &.gear { background-image: url("../../../images/icons/gear_@{size}.png"); } +} + + +.icon { + background-color: transparent ; + background-repeat: no-repeat; + background-position: center center; + display: block; + overflow: hidden; + text-indent: -9999px; + + &.s22 { + width:22px; height: 22px; + padding: 1px; + .icons(22); + } + +} + + +/* header */ +header { + position: fixed; left: 0px; top: 0px; + margin: 0px; padding: 0px; + width: 100%; height: 12px; + color: #FFFFFF; #site-location { - font-size:8px; + /*font-size:8px; float:left; background-color: @Metalic3; padding: 1px 5px; margin-left: 20px; - .roundbottom() + .roundbottom()*/ + display: none; } +} +/* nav */ +nav { + width: 100%; height: 32px; + position: fixed; left: 0px; top: 0px; + background-color: @Metalic4; + color: #FFFFFF; + + a, a:active, a:visited, a:link, a:hover { color: #FFFFFF; text-decoration: none; outline: none; } + + ul { + margin: 0px; + padding: 0px 20px; + li { + list-style: none; + margin: 0px; padding: 0px; + float: left; + .menu-popup{ left: 0px; right: auto; } + } + + } - #nav { - clear: both; - padding: 0px 20px; - height: auto; - padding-top: 6px; - .nav-menu-icon { position: relative; height: 22px; @@ -110,7 +154,8 @@ nav { background-color: @Metalic3; } - img { width: 22px; height: 22px; } + img { width: 22px; height: 22px; } + .nav-notify { top: 3px; } } .nav-menu { @@ -124,26 +169,37 @@ nav { border-bottom: 3px solid @Metalic2; } - .nav-notify { - position: absolute; - background-color: @Blue1; - .rounded(); - font-size: 10px; - padding: 1px 3px; - top: 0px; - right: -10px; - min-width: 15px; - text-align: right; - } + } + + .nav-notify { + display: none; + position: absolute; + background-color: @Blue1; + .rounded(); + font-size: 10px; + padding: 1px 3px; + top: 0px; + right: -10px; + min-width: 15px; + text-align: right; + &.show{ display: block; } } - } + + + #nav-site-link { + float: right; + .menu-popup{ right: 0px; left: auto; } + } + + #nav-notifications-link.selected .icon.s22.notify { background-image: url("../../../images/icons/notify_on_22.png") } + } ul.menu-popup { position: absolute; - /*display: none;*/ + display: none; width: auto; background: #FFFFFF; color: @Grey5; @@ -151,43 +207,26 @@ ul.menu-popup { padding: 0px; list-style: none; border: 3px solid @Metalic3; - a { display: block; color: @Grey5; padding: 5px 10px;} - a:hover { background-color: @Metalic1; } z-index: 100000; - - .menu-sep { - border-top: 1px solid @Metalic2; - } + + a { display: block; color: @Grey5; padding: 5px 10px;} + a:hover { background-color: @Metalic1; } + .menu-sep { border-top: 1px solid @Metalic2; } + li { float: none; overflow: auto; height: auto; display: block; } } -.left .menu-popup{ left: 0px; } -.right .menu-popup{ right: 0px; } - -/* icons */ - -.icons(@size: 22) { - &.notify_off { background-image: url("../../../images/icons/notify_off_@{size}.png"); } - &.notify_on { background-image: url("../../../images/icons/notify_on_@{size}.png"); } +#nav-notifications-menu { + width: 400px; + img { float: left; margin-right: 5px; } + .contactname { font-weight: bold; } + .notif-when { font-size: 10px; color: @Metalic2; display: block; } } -.icon { - background-color: transparent ; - background-repeat: no-repeat; - background-position: center center; - display: block; - - &.s22 { - width:22px; height: 22px; - .icons(22); - } - -} - /* aside */ -aside { display: none; } +// aside { display: none; } /* section */ -section { display: none;} +// section { display: none;} -- cgit v1.2.3 From 23d6339a4152759d8dcf68afc6e7dea652336d8c Mon Sep 17 00:00:00 2001 From: Fabio Comuni Date: Mon, 25 Jul 2011 17:12:42 +0200 Subject: change to some nav ids, notice in empty notifications popup --- view/theme/quattro/style.css | 11 ++++++++--- view/theme/quattro/style.less | 10 ++++++++-- 2 files changed, 16 insertions(+), 5 deletions(-) (limited to 'view/theme/quattro') diff --git a/view/theme/quattro/style.css b/view/theme/quattro/style.css index ec5231290..9ded41721 100644 --- a/view/theme/quattro/style.css +++ b/view/theme/quattro/style.css @@ -144,14 +144,14 @@ nav .nav-notify { nav .nav-notify.show { display: block; } -nav #nav-site-link { +nav #nav-site-linkmenu { float: right; } -nav #nav-site-link .menu-popup { +nav #nav-site-linkmenu .menu-popup { right: 0px; left: auto; } -nav #nav-notifications-link.selected .icon.s22.notify { +nav #nav-notifications-linkmenu.selected .icon.s22.notify { background-image: url("../../../images/icons/notify_on_22.png"); } ul.menu-popup { @@ -183,6 +183,11 @@ ul.menu-popup li { height: auto; display: block; } +ul.menu-popup .empty { + padding: 5px; + text-align: center; + color: #9eabb0; +} #nav-notifications-menu { width: 400px; } diff --git a/view/theme/quattro/style.less b/view/theme/quattro/style.less index 53f833cfd..a2c1a1eae 100644 --- a/view/theme/quattro/style.less +++ b/view/theme/quattro/style.less @@ -188,12 +188,12 @@ nav { - #nav-site-link { + #nav-site-linkmenu { float: right; .menu-popup{ right: 0px; left: auto; } } - #nav-notifications-link.selected .icon.s22.notify { background-image: url("../../../images/icons/notify_on_22.png") } + #nav-notifications-linkmenu.selected .icon.s22.notify { background-image: url("../../../images/icons/notify_on_22.png") } } @@ -213,6 +213,12 @@ ul.menu-popup { a:hover { background-color: @Metalic1; } .menu-sep { border-top: 1px solid @Metalic2; } li { float: none; overflow: auto; height: auto; display: block; } + + .empty { + padding: 5px; + text-align: center; + color: @Metalic2; + } } #nav-notifications-menu { -- cgit v1.2.3 From 97eea6ecd60ef9cafaec8e91a902c7d3b88758da Mon Sep 17 00:00:00 2001 From: Fabio Comuni Date: Fri, 29 Jul 2011 16:24:18 +0200 Subject: style update --- view/theme/quattro/style.css | 61 ++++++++++++++++++++++++++++++++++++------- view/theme/quattro/style.less | 56 +++++++++++++++++++++++++++++---------- 2 files changed, 93 insertions(+), 24 deletions(-) (limited to 'view/theme/quattro') diff --git a/view/theme/quattro/style.css b/view/theme/quattro/style.css index 9ded41721..9b4005037 100644 --- a/view/theme/quattro/style.css +++ b/view/theme/quattro/style.css @@ -1,14 +1,14 @@ /** * Fabio Comuni **/ -/* fonts */ /* global */ body { font-family: Liberation Sans, helvetica, arial, clean, sans-serif; font-size: 12px; - background-color: #FFFFFF; + background-color: #ffffff; color: #2d2d2d; margin: 0px; + display: table-row; } a, a:visited, a:link { color: #005c94; @@ -46,13 +46,15 @@ a:hover { /* header */ header { position: fixed; - left: 0px; + left: 43%; + right: 43%; top: 0px; margin: 0px; padding: 0px; - width: 100%; - height: 12px; - color: #FFFFFF; + /*width: 100%; height: 12px; */ + + z-index: 110; + color: #ffffff; } header #site-location { /*font-size:8px; @@ -64,6 +66,27 @@ header #site-location { display: none; } +header #banner { + text-align: center; + width: 100%; +} +header #banner a, +header #banner a:active, +header #banner a:visited, +header #banner a:link, +header #banner a:hover { + color: #ffffff; + text-decoration: none; + outline: none; + vertical-align: bottom; +} +header #banner #logo-img { + height: 22px; + margin-top: 5px; +} +header #banner #logo-text { + font-size: 22px; +} /* nav */ nav { width: 100%; @@ -71,15 +94,20 @@ nav { position: fixed; left: 0px; top: 0px; + padding: 0px; background-color: #0e232e; - color: #FFFFFF; + color: #ffffff; + z-index: 100; + -webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.7); + -moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.7); + box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.7); } nav a, nav a:active, nav a:visited, nav a:link, nav a:hover { - color: #FFFFFF; + color: #ffffff; text-decoration: none; outline: none; } @@ -157,14 +185,17 @@ nav #nav-notifications-linkmenu.selected .icon.s22.notify { ul.menu-popup { position: absolute; display: none; - width: auto; - background: #FFFFFF; + width: 10em; + background: #ffffff; color: #2d2d2d; margin: 0px; padding: 0px; list-style: none; border: 3px solid #364e59; z-index: 100000; + -webkit-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.7); + -moz-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.7); + box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.7); } ul.menu-popup a { display: block; @@ -204,4 +235,14 @@ ul.menu-popup .empty { display: block; } /* aside */ +aside { + display: table-cell; + width: 200px; + padding: 50px 10px 0px 20px; +} /* section */ +section { + display: table-cell; + width: 800px; + padding: 50px 20px 0px 10px; +} diff --git a/view/theme/quattro/style.less b/view/theme/quattro/style.less index a2c1a1eae..1444ffdc1 100644 --- a/view/theme/quattro/style.less +++ b/view/theme/quattro/style.less @@ -34,9 +34,7 @@ @Grey4:rgb(102,102,102); @Grey5:rgb(45,45,45); - - -/* fonts */ +///* fonts */ // @font-face { // font-family: "LiberationSans"; // src: local("Liberation Sans"),url( LiberationSans-Regular.ttf ) format("truetype"); @@ -59,9 +57,16 @@ body { font-family: Liberation Sans,helvetica,arial,clean,sans-serif; font-size: 12px; - background-color: #FFFFFF; + background-color: @Grey1; color: @Grey5; margin: 0px; + display:table-row; +} + +.shadow(@x: 0px, @y: 5px){ + -webkit-box-shadow:@x @y 10px rgba(0, 0, 0, 0.7); + -moz-box-shadow:@x @y 10px rgba(0, 0, 0, 0.7); + box-shadow:@x @y 10px rgba(0, 0, 0, 0.7); } .rounded(@tr: 5px, @tl: 5px, @bl: 5px, @br: 5px){ @@ -108,10 +113,11 @@ a:hover {text-decoration: underline; } /* header */ header { - position: fixed; left: 0px; top: 0px; + position: fixed; left: 43%; right: 43%; top: 0px; margin: 0px; padding: 0px; - width: 100%; height: 12px; - color: #FFFFFF; + /*width: 100%; height: 12px; */ + z-index: 110; + color: @Grey1; #site-location { /*font-size:8px; float:left; @@ -121,15 +127,27 @@ header { .roundbottom()*/ display: none; } + + #banner { + + text-align: center; + width: 100%; + a, a:active, a:visited, a:link, a:hover { color: @Grey1; text-decoration: none; outline: none; vertical-align: bottom; } + #logo-img { height: 22px; margin-top:5px;} + #logo-text { font-size: 22px } + } } /* nav */ nav { width: 100%; height: 32px; position: fixed; left: 0px; top: 0px; + padding: 0px; background-color: @Metalic4; - color: #FFFFFF; + color: @Grey1; + z-index: 100; + .shadow(0px, 0px); - a, a:active, a:visited, a:link, a:hover { color: #FFFFFF; text-decoration: none; outline: none; } + a, a:active, a:visited, a:link, a:hover { color: @Grey1; text-decoration: none; outline: none; } ul { margin: 0px; @@ -200,15 +218,17 @@ nav { ul.menu-popup { position: absolute; display: none; - width: auto; - background: #FFFFFF; + width: 10em; + background: @Grey1; color: @Grey5; margin: 0px; padding: 0px; list-style: none; border: 3px solid @Metalic3; z-index: 100000; - + + .shadow(); + a { display: block; color: @Grey5; padding: 5px 10px;} a:hover { background-color: @Metalic1; } .menu-sep { border-top: 1px solid @Metalic2; } @@ -232,7 +252,15 @@ ul.menu-popup { /* aside */ -// aside { display: none; } +aside { + display: table-cell; + width: 200px; + padding:50px 10px 0px 20px; +} /* section */ -// section { display: none;} +section { + display: table-cell; + width: 800px; + padding:50px 20px 0px 10px; +} -- cgit v1.2.3 From 6c423feed2d8bc5bd36d2a1cbac073915e523749 Mon Sep 17 00:00:00 2001 From: Fabio Comuni Date: Fri, 29 Jul 2011 16:32:01 +0200 Subject: add missing link to navbar --- view/theme/quattro/style.css | 8 ++++++++ view/theme/quattro/style.less | 5 ++++- 2 files changed, 12 insertions(+), 1 deletion(-) (limited to 'view/theme/quattro') diff --git a/view/theme/quattro/style.css b/view/theme/quattro/style.css index 9b4005037..ea0ed8eac 100644 --- a/view/theme/quattro/style.css +++ b/view/theme/quattro/style.css @@ -172,9 +172,17 @@ nav .nav-notify { nav .nav-notify.show { display: block; } +nav #nav-help-link, +nav #nav-search-link, +nav #nav-directory-link, +nav #nav-apps-link, nav #nav-site-linkmenu { float: right; } +nav #nav-help-link .menu-popup, +nav #nav-search-link .menu-popup, +nav #nav-directory-link .menu-popup, +nav #nav-apps-link .menu-popup, nav #nav-site-linkmenu .menu-popup { right: 0px; left: auto; diff --git a/view/theme/quattro/style.less b/view/theme/quattro/style.less index 1444ffdc1..5f3958f9d 100644 --- a/view/theme/quattro/style.less +++ b/view/theme/quattro/style.less @@ -205,7 +205,10 @@ nav { } - + #nav-help-link, + #nav-search-link, + #nav-directory-link, + #nav-apps-link, #nav-site-linkmenu { float: right; .menu-popup{ right: 0px; left: auto; } -- cgit v1.2.3 From 62295af1f2c3434fbf40aff6d29fd08859259ddf Mon Sep 17 00:00:00 2001 From: Fabio Comuni Date: Wed, 31 Aug 2011 16:19:17 +0200 Subject: quattro: cleanup and split of less files --- view/theme/quattro/LIBERATION-FONTS-COPYING | 339 --------------------- view/theme/quattro/LiberationSans-Bold.ttf | Bin 136664 -> 0 bytes view/theme/quattro/LiberationSans-Italic.ttf | Bin 161532 -> 0 bytes view/theme/quattro/LiberationSans-Regular.ttf | Bin 139036 -> 0 bytes view/theme/quattro/colors.less | 50 +++ view/theme/quattro/experimental | 0 .../quattro/liberation-fonts-ttf-1.07.0.tar.gz | Bin 1326750 -> 0 bytes view/theme/quattro/quattro.less | 212 +++++++++++++ view/theme/quattro/style.css | 17 +- view/theme/quattro/style.less | 260 +--------------- 10 files changed, 273 insertions(+), 605 deletions(-) delete mode 100644 view/theme/quattro/LIBERATION-FONTS-COPYING delete mode 100644 view/theme/quattro/LiberationSans-Bold.ttf delete mode 100644 view/theme/quattro/LiberationSans-Italic.ttf delete mode 100644 view/theme/quattro/LiberationSans-Regular.ttf create mode 100644 view/theme/quattro/colors.less create mode 100644 view/theme/quattro/experimental delete mode 100644 view/theme/quattro/liberation-fonts-ttf-1.07.0.tar.gz create mode 100644 view/theme/quattro/quattro.less (limited to 'view/theme/quattro') diff --git a/view/theme/quattro/LIBERATION-FONTS-COPYING b/view/theme/quattro/LIBERATION-FONTS-COPYING deleted file mode 100644 index d511905c1..000000000 --- a/view/theme/quattro/LIBERATION-FONTS-COPYING +++ /dev/null @@ -1,339 +0,0 @@ - GNU GENERAL PUBLIC LICENSE - Version 2, June 1991 - - Copyright (C) 1989, 1991 Free Software Foundation, Inc., - 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA - Everyone is permitted to copy and distribute verbatim copies - of this license document, but changing it is not allowed. - - Preamble - - The licenses for most software are designed to take away your -freedom to share and change it. By contrast, the GNU General Public -License is intended to guarantee your freedom to share and change free -software--to make sure the software is free for all its users. This -General Public License applies to most of the Free Software -Foundation's software and to any other program whose authors commit to -using it. (Some other Free Software Foundation software is covered by -the GNU Lesser General Public License instead.) You can apply it to -your programs, too. - - When we speak of free software, we are referring to freedom, not -price. Our General Public Licenses are designed to make sure that you -have the freedom to distribute copies of free software (and charge for -this service if you wish), that you receive source code or can get it -if you want it, that you can change the software or use pieces of it -in new free programs; and that you know you can do these things. - - To protect your rights, we need to make restrictions that forbid -anyone to deny you these rights or to ask you to surrender the rights. -These restrictions translate to certain responsibilities for you if you -distribute copies of the software, or if you modify it. - - For example, if you distribute copies of such a program, whether -gratis or for a fee, you must give the recipients all the rights that -you have. You must make sure that they, too, receive or can get the -source code. And you must show them these terms so they know their -rights. - - We protect your rights with two steps: (1) copyright the software, and -(2) offer you this license which gives you legal permission to copy, -distribute and/or modify the software. - - Also, for each author's protection and ours, we want to make certain -that everyone understands that there is no warranty for this free -software. If the software is modified by someone else and passed on, we -want its recipients to know that what they have is not the original, so -that any problems introduced by others will not reflect on the original -authors' reputations. - - Finally, any free program is threatened constantly by software -patents. We wish to avoid the danger that redistributors of a free -program will individually obtain patent licenses, in effect making the -program proprietary. To prevent this, we have made it clear that any -patent must be licensed for everyone's free use or not licensed at all. - - The precise terms and conditions for copying, distribution and -modification follow. - - GNU GENERAL PUBLIC LICENSE - TERMS AND CONDITIONS FOR COPYING, DISTRIBUTION AND MODIFICATION - - 0. This License applies to any program or other work which contains -a notice placed by the copyright holder saying it may be distributed -under the terms of this General Public License. The "Program", below, -refers to any such program or work, and a "work based on the Program" -means either the Program or any derivative work under copyright law: -that is to say, a work containing the Program or a portion of it, -either verbatim or with modifications and/or translated into another -language. (Hereinafter, translation is included without limitation in -the term "modification".) Each licensee is addressed as "you". - -Activities other than copying, distribution and modification are not -covered by this License; they are outside its scope. The act of -running the Program is not restricted, and the output from the Program -is covered only if its contents constitute a work based on the -Program (independent of having been made by running the Program). -Whether that is true depends on what the Program does. - - 1. You may copy and distribute verbatim copies of the Program's -source code as you receive it, in any medium, provided that you -conspicuously and appropriately publish on each copy an appropriate -copyright notice and disclaimer of warranty; keep intact all the -notices that refer to this License and to the absence of any warranty; -and give any other recipients of the Program a copy of this License -along with the Program. - -You may charge a fee for the physical act of transferring a copy, and -you may at your option offer warranty protection in exchange for a fee. - - 2. You may modify your copy or copies of the Program or any portion -of it, thus forming a work based on the Program, and copy and -distribute such modifications or work under the terms of Section 1 -above, provided that you also meet all of these conditions: - - a) You must cause the modified files to carry prominent notices - stating that you changed the files and the date of any change. - - b) You must cause any work that you distribute or publish, that in - whole or in part contains or is derived from the Program or any - part thereof, to be licensed as a whole at no charge to all third - parties under the terms of this License. - - c) If the modified program normally reads commands interactively - when run, you must cause it, when started running for such - interactive use in the most ordinary way, to print or display an - announcement including an appropriate copyright notice and a - notice that there is no warranty (or else, saying that you provide - a warranty) and that users may redistribute the program under - these conditions, and telling the user how to view a copy of this - License. (Exception: if the Program itself is interactive but - does not normally print such an announcement, your work based on - the Program is not required to print an announcement.) - -These requirements apply to the modified work as a whole. If -identifiable sections of that work are not derived from the Program, -and can be reasonably considered independent and separate works in -themselves, then this License, and its terms, do not apply to those -sections when you distribute them as separate works. But when you -distribute the same sections as part of a whole which is a work based -on the Program, the distribution of the whole must be on the terms of -this License, whose permissions for other licensees extend to the -entire whole, and thus to each and every part regardless of who wrote it. - -Thus, it is not the intent of this section to claim rights or contest -your rights to work written entirely by you; rather, the intent is to -exercise the right to control the distribution of derivative or -collective works based on the Program. - -In addition, mere aggregation of another work not based on the Program -with the Program (or with a work based on the Program) on a volume of -a storage or distribution medium does not bring the other work under -the scope of this License. - - 3. You may copy and distribute the Program (or a work based on it, -under Section 2) in object code or executable form under the terms of -Sections 1 and 2 above provided that you also do one of the following: - - a) Accompany it with the complete corresponding machine-readable - source code, which must be distributed under the terms of Sections - 1 and 2 above on a medium customarily used for software interchange; or, - - b) Accompany it with a written offer, valid for at least three - years, to give any third party, for a charge no more than your - cost of physically performing source distribution, a complete - machine-readable copy of the corresponding source code, to be - distributed under the terms of Sections 1 and 2 above on a medium - customarily used for software interchange; or, - - c) Accompany it with the information you received as to the offer - to distribute corresponding source code. (This alternative is - allowed only for noncommercial distribution and only if you - received the program in object code or executable form with such - an offer, in accord with Subsection b above.) - -The source code for a work means the preferred form of the work for -making modifications to it. For an executable work, complete source -code means all the source code for all modules it contains, plus any -associated interface definition files, plus the scripts used to -control compilation and installation of the executable. However, as a -special exception, the source code distributed need not include -anything that is normally distributed (in either source or binary -form) with the major components (compiler, kernel, and so on) of the -operating system on which the executable runs, unless that component -itself accompanies the executable. - -If distribution of executable or object code is made by offering -access to copy from a designated place, then offering equivalent -access to copy the source code from the same place counts as -distribution of the source code, even though third parties are not -compelled to copy the source along with the object code. - - 4. You may not copy, modify, sublicense, or distribute the Program -except as expressly provided under this License. Any attempt -otherwise to copy, modify, sublicense or distribute the Program is -void, and will automatically terminate your rights under this License. -However, parties who have received copies, or rights, from you under -this License will not have their licenses terminated so long as such -parties remain in full compliance. - - 5. You are not required to accept this License, since you have not -signed it. However, nothing else grants you permission to modify or -distribute the Program or its derivative works. These actions are -prohibited by law if you do not accept this License. Therefore, by -modifying or distributing the Program (or any work based on the -Program), you indicate your acceptance of this License to do so, and -all its terms and conditions for copying, distributing or modifying -the Program or works based on it. - - 6. Each time you redistribute the Program (or any work based on the -Program), the recipient automatically receives a license from the -original licensor to copy, distribute or modify the Program subject to -these terms and conditions. You may not impose any further -restrictions on the recipients' exercise of the rights granted herein. -You are not responsible for enforcing compliance by third parties to -this License. - - 7. If, as a consequence of a court judgment or allegation of patent -infringement or for any other reason (not limited to patent issues), -conditions are imposed on you (whether by court order, agreement or -otherwise) that contradict the conditions of this License, they do not -excuse you from the conditions of this License. If you cannot -distribute so as to satisfy simultaneously your obligations under this -License and any other pertinent obligations, then as a consequence you -may not distribute the Program at all. For example, if a patent -license would not permit royalty-free redistribution of the Program by -all those who receive copies directly or indirectly through you, then -the only way you could satisfy both it and this License would be to -refrain entirely from distribution of the Program. - -If any portion of this section is held invalid or unenforceable under -any particular circumstance, the balance of the section is intended to -apply and the section as a whole is intended to apply in other -circumstances. - -It is not the purpose of this section to induce you to infringe any -patents or other property right claims or to contest validity of any -such claims; this section has the sole purpose of protecting the -integrity of the free software distribution system, which is -implemented by public license practices. Many people have made -generous contributions to the wide range of software distributed -through that system in reliance on consistent application of that -system; it is up to the author/donor to decide if he or she is willing -to distribute software through any other system and a licensee cannot -impose that choice. - -This section is intended to make thoroughly clear what is believed to -be a consequence of the rest of this License. - - 8. If the distribution and/or use of the Program is restricted in -certain countries either by patents or by copyrighted interfaces, the -original copyright holder who places the Program under this License -may add an explicit geographical distribution limitation excluding -those countries, so that distribution is permitted only in or among -countries not thus excluded. In such case, this License incorporates -the limitation as if written in the body of this License. - - 9. The Free Software Foundation may publish revised and/or new versions -of the General Public License from time to time. Such new versions will -be similar in spirit to the present version, but may differ in detail to -address new problems or concerns. - -Each version is given a distinguishing version number. If the Program -specifies a version number of this License which applies to it and "any -later version", you have the option of following the terms and conditions -either of that version or of any later version published by the Free -Software Foundation. If the Program does not specify a version number of -this License, you may choose any version ever published by the Free Software -Foundation. - - 10. If you wish to incorporate parts of the Program into other free -programs whose distribution conditions are different, write to the author -to ask for permission. For software which is copyrighted by the Free -Software Foundation, write to the Free Software Foundation; we sometimes -make exceptions for this. Our decision will be guided by the two goals -of preserving the free status of all derivatives of our free software and -of promoting the sharing and reuse of software generally. - - NO WARRANTY - - 11. BECAUSE THE PROGRAM IS LICENSED FREE OF CHARGE, THERE IS NO WARRANTY -FOR THE PROGRAM, TO THE EXTENT PERMITTED BY APPLICABLE LAW. EXCEPT WHEN -OTHERWISE STATED IN WRITING THE COPYRIGHT HOLDERS AND/OR OTHER PARTIES -PROVIDE THE PROGRAM "AS IS" WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESSED -OR IMPLIED, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF -MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE. THE ENTIRE RISK AS -TO THE QUALITY AND PERFORMANCE OF THE PROGRAM IS WITH YOU. SHOULD THE -PROGRAM PROVE DEFECTIVE, YOU ASSUME THE COST OF ALL NECESSARY SERVICING, -REPAIR OR CORRECTION. - - 12. IN NO EVENT UNLESS REQUIRED BY APPLICABLE LAW OR AGREED TO IN WRITING -WILL ANY COPYRIGHT HOLDER, OR ANY OTHER PARTY WHO MAY MODIFY AND/OR -REDISTRIBUTE THE PROGRAM AS PERMITTED ABOVE, BE LIABLE TO YOU FOR DAMAGES, -INCLUDING ANY GENERAL, SPECIAL, INCIDENTAL OR CONSEQUENTIAL DAMAGES ARISING -OUT OF THE USE OR INABILITY TO USE THE PROGRAM (INCLUDING BUT NOT LIMITED -TO LOSS OF DATA OR DATA BEING RENDERED INACCURATE OR LOSSES SUSTAINED BY -YOU OR THIRD PARTIES OR A FAILURE OF THE PROGRAM TO OPERATE WITH ANY OTHER -PROGRAMS), EVEN IF SUCH HOLDER OR OTHER PARTY HAS BEEN ADVISED OF THE -POSSIBILITY OF SUCH DAMAGES. - - END OF TERMS AND CONDITIONS - - How to Apply These Terms to Your New Programs - - If you develop a new program, and you want it to be of the greatest -possible use to the public, the best way to achieve this is to make it -free software which everyone can redistribute and change under these terms. - - To do so, attach the following notices to the program. It is safest -to attach them to the start of each source file to most effectively -convey the exclusion of warranty; and each file should have at least -the "copyright" line and a pointer to where the full notice is found. - - - Copyright (C) - - This program is free software; you can redistribute it and/or modify - it under the terms of the GNU General Public License as published by - the Free Software Foundation; either version 2 of the License, or - (at your option) any later version. - - This program is distributed in the hope that it will be useful, - but WITHOUT ANY WARRANTY; without even the implied warranty of - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the - GNU General Public License for more details. - - You should have received a copy of the GNU General Public License along - with this program; if not, write to the Free Software Foundation, Inc., - 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA. - -Also add information on how to contact you by electronic and paper mail. - -If the program is interactive, make it output a short notice like this -when it starts in an interactive mode: - - Gnomovision version 69, Copyright (C) year name of author - Gnomovision comes with ABSOLUTELY NO WARRANTY; for details type `show w'. - This is free software, and you are welcome to redistribute it - under certain conditions; type `show c' for details. - -The hypothetical commands `show w' and `show c' should show the appropriate -parts of the General Public License. Of course, the commands you use may -be called something other than `show w' and `show c'; they could even be -mouse-clicks or menu items--whatever suits your program. - -You should also get your employer (if you work as a programmer) or your -school, if any, to sign a "copyright disclaimer" for the program, if -necessary. Here is a sample; alter the names: - - Yoyodyne, Inc., hereby disclaims all copyright interest in the program - `Gnomovision' (which makes passes at compilers) written by James Hacker. - - , 1 April 1989 - Ty Coon, President of Vice - -This General Public License does not permit incorporating your program into -proprietary programs. If your program is a subroutine library, you may -consider it more useful to permit linking proprietary applications with the -library. If this is what you want to do, use the GNU Lesser General -Public License instead of this License. diff --git a/view/theme/quattro/LiberationSans-Bold.ttf b/view/theme/quattro/LiberationSans-Bold.ttf deleted file mode 100644 index 169fac34d..000000000 Binary files a/view/theme/quattro/LiberationSans-Bold.ttf and /dev/null differ diff --git a/view/theme/quattro/LiberationSans-Italic.ttf b/view/theme/quattro/LiberationSans-Italic.ttf deleted file mode 100644 index 8b9dc760a..000000000 Binary files a/view/theme/quattro/LiberationSans-Italic.ttf and /dev/null differ diff --git a/view/theme/quattro/LiberationSans-Regular.ttf b/view/theme/quattro/LiberationSans-Regular.ttf deleted file mode 100644 index ceeaa2740..000000000 Binary files a/view/theme/quattro/LiberationSans-Regular.ttf and /dev/null differ diff --git a/view/theme/quattro/colors.less b/view/theme/quattro/colors.less new file mode 100644 index 000000000..75a53a68a --- /dev/null +++ b/view/theme/quattro/colors.less @@ -0,0 +1,50 @@ +// Quattro Theme LESS file + +// "Echo" palette from Inkscape +@Blue1:rgb(25,174,255); +@Blue2:rgb(0,132,200); +@Blue3:rgb(0,92,148); +@Red1:rgb(255,65,65); +@Red2:rgb(220,0,0); +@Red3:rgb(181,0,0); +@Orange1:rgb(255,255,62); +@Orange2:rgb(255,153,0); +@Orange3:rgb(255,102,0); +@Brown1:rgb(255,192,34); +@Brown2:rgb(184,129,0); +@Brown3:rgb(128,77,0); +@Green1:rgb(204,255,66); +@Green2:rgb(154,222,0); +@Green3:rgb(0,145,0); +@Purple1:rgb(241,202,255); +@Purple2:rgb(215,108,255); +@Purple3:rgb(186,0,255); +@Metalic1:rgb(189,205,212); +@Metalic2:rgb(158,171,176); +@Metalic3:rgb(54,78,89); +@Metalic4:rgb(14,35,46); +@Grey1:rgb(255,255,255); +@Grey2:rgb(204,204,204); +@Grey3:rgb(153,153,153); +@Grey4:rgb(102,102,102); +@Grey5:rgb(45,45,45); + + +// Theme colors +@BodyBackground: @Grey1; +@BodyColor: @Grey5; + +@Link: @Blue3; +@LinkHover: @Blue3; +@LinkVisited: @Blue3; + +@Banner: @Grey1; + +@NavbarBackground:@Metalic4; +@NavbarSelectedBg:@Metalic3; +@NavbarSelectedBorder: @Metalic2; +@NavbarNotifBg: @Blue1; +@Menu: @Grey5; +@MenuBg: @Grey1; +@MenuBorder: @Metalic3; + diff --git a/view/theme/quattro/experimental b/view/theme/quattro/experimental new file mode 100644 index 000000000..e69de29bb diff --git a/view/theme/quattro/liberation-fonts-ttf-1.07.0.tar.gz b/view/theme/quattro/liberation-fonts-ttf-1.07.0.tar.gz deleted file mode 100644 index 0c86f7347..000000000 Binary files a/view/theme/quattro/liberation-fonts-ttf-1.07.0.tar.gz and /dev/null differ diff --git a/view/theme/quattro/quattro.less b/view/theme/quattro/quattro.less new file mode 100644 index 000000000..4c4a002f3 --- /dev/null +++ b/view/theme/quattro/quattro.less @@ -0,0 +1,212 @@ +// Quattro Theme LESS file + +/* global */ +body { + font-family: Liberation Sans,helvetica,arial,clean,sans-serif; + font-size: 12px; + background-color: @BodyBackground; + color: @BodyColor; + margin: 0px; + display:table-row; +} + +.shadow(@x: 0px, @y: 5px){ + -webkit-box-shadow:@x @y 10px rgba(0, 0, 0, 0.7); + -moz-box-shadow:@x @y 10px rgba(0, 0, 0, 0.7); + box-shadow:@x @y 10px rgba(0, 0, 0, 0.7); +} + +.rounded(@tr: 5px, @tl: 5px, @bl: 5px, @br: 5px){ + -moz-border-radius: @arguments; + -webkit-border-radius: @arguments; + border-radius: @arguments; +} + +.roundbottom (@radius: 5px){ .rounded(0, 0, @radius, @radius); } +.roundtop (@radius: 5px){ .rounded(@radius, @radius, 0, 0); } + +a, a:link { color: @Link; text-decoration: none; } +a:visited { color: @LinkVisited; text-decoration: none; } +a:hover {color: @LinkHover; text-decoration: underline; } + +.left { float: left; } +.right { float: right; } + +/* icons */ + + +.icons(@size: 22) { + &.notify { background-image: url("../../../images/icons/notify_off_@{size}.png"); } + &.gear { background-image: url("../../../images/icons/gear_@{size}.png"); } +} + + +.icon { + background-color: transparent ; + background-repeat: no-repeat; + background-position: center center; + display: block; + overflow: hidden; + text-indent: -9999px; + + &.s22 { + width:22px; height: 22px; + padding: 1px; + .icons(22); + } + +} + + + +/* header */ +header { + position: fixed; left: 43%; right: 43%; top: 0px; + margin: 0px; padding: 0px; + /*width: 100%; height: 12px; */ + z-index: 110; + color: @Grey1; + #site-location { + display: none; + } + + #banner { + + text-align: center; + width: 100%; + a, a:active, a:visited, a:link, a:hover { color: @Grey1; text-decoration: none; outline: none; vertical-align: bottom; } + #logo-img { height: 22px; margin-top:5px;} + #logo-text { font-size: 22px } + } +} +/* nav */ +nav { + width: 100%; height: 32px; + position: fixed; left: 0px; top: 0px; + padding: 0px; + background-color: @NavbarBackground; + color: @Grey1; + z-index: 100; + .shadow(0px, 0px); + + a, a:active, a:visited, a:link, a:hover { color: @Banner; text-decoration: none; outline: none; } + + ul { + margin: 0px; + padding: 0px 20px; + li { + list-style: none; + margin: 0px; padding: 0px; + float: left; + .menu-popup{ left: 0px; right: auto; } + } + + } + + .nav-menu-icon { + position: relative; + height: 22px; + padding: 5px; + margin: 0px 10px; + .roundtop(); + + &.selected { + background-color: @NavbarSelectedBg; + } + + img { width: 22px; height: 22px; } + .nav-notify { top: 3px; } + } + + .nav-menu { + position: relative; + height: 16px; + padding: 5px; + margin: 3px 15px 0px; + font-size: 14px; + border-bottom: 3px solid @NavbarBackground; + &.selected { + border-bottom: 3px solid @NavbarSelectedBorder; + } + + } + + .nav-notify { + display: none; + position: absolute; + background-color: @NavbarNotifBg; + .rounded(); + font-size: 10px; + padding: 1px 3px; + top: 0px; + right: -10px; + min-width: 15px; + text-align: right; + + &.show{ display: block; } + } + + + #nav-help-link, + #nav-search-link, + #nav-directory-link, + #nav-apps-link, + #nav-site-linkmenu { + float: right; + .menu-popup{ right: 0px; left: auto; } + } + + #nav-notifications-linkmenu.selected .icon.s22.notify { background-image: url("../../../images/icons/notify_on_22.png") } + #nav-apps-link.selected { background-color: @NavbarSelectedBg; } +} + + +ul.menu-popup { + position: absolute; + display: none; + width: 10em; + background: @MenuBg; + color: @Menu; + margin: 0px; + padding: 0px; + list-style: none; + border: 3px solid @MenuBorder; + z-index: 100000; + + .shadow(); + + a { display: block; color: @Grey5; padding: 5px 10px;} + a:hover { background-color: @Metalic1; } + .menu-sep { border-top: 1px solid @Metalic2; } + li { float: none; overflow: auto; height: auto; display: block; } + + .empty { + padding: 5px; + text-align: center; + color: @Metalic2; + } +} + +#nav-notifications-menu { + width: 400px; + img { float: left; margin-right: 5px; } + .contactname { font-weight: bold; } + .notif-when { font-size: 10px; color: @Metalic2; display: block; } +} + + + + +/* aside */ +aside { + display: table-cell; + width: 200px; + padding:50px 10px 0px 20px; +} + +/* section */ +section { + display: table-cell; + width: 800px; + padding:50px 20px 0px 10px; +} diff --git a/view/theme/quattro/style.css b/view/theme/quattro/style.css index ea0ed8eac..e2c06125b 100644 --- a/view/theme/quattro/style.css +++ b/view/theme/quattro/style.css @@ -10,11 +10,16 @@ body { margin: 0px; display: table-row; } -a, a:visited, a:link { +a, a:link { + color: #005c94; + text-decoration: none; +} +a:visited { color: #005c94; text-decoration: none; } a:hover { + color: #005c94; text-decoration: underline; } .left { @@ -57,13 +62,6 @@ header { color: #ffffff; } header #site-location { - /*font-size:8px; - float:left; - background-color: @Metalic3; - padding: 1px 5px; - margin-left: 20px; - .roundbottom()*/ - display: none; } header #banner { @@ -190,6 +188,9 @@ nav #nav-site-linkmenu .menu-popup { nav #nav-notifications-linkmenu.selected .icon.s22.notify { background-image: url("../../../images/icons/notify_on_22.png"); } +nav #nav-apps-link.selected { + background-color: #364e59; +} ul.menu-popup { position: absolute; display: none; diff --git a/view/theme/quattro/style.less b/view/theme/quattro/style.less index 5f3958f9d..d1c677b22 100644 --- a/view/theme/quattro/style.less +++ b/view/theme/quattro/style.less @@ -5,265 +5,9 @@ // compile with lessc // $ lessc style.less > style.css -// "Echo" palette from Inkscape -@Blue1:rgb(25,174,255); -@Blue2:rgb(0,132,200); -@Blue3:rgb(0,92,148); -@Red1:rgb(255,65,65); -@Red2:rgb(220,0,0); -@Red3:rgb(181,0,0); -@Orange1:rgb(255,255,62); -@Orange2:rgb(255,153,0); -@Orange3:rgb(255,102,0); -@Brown1:rgb(255,192,34); -@Brown2:rgb(184,129,0); -@Brown3:rgb(128,77,0); -@Green1:rgb(204,255,66); -@Green2:rgb(154,222,0); -@Green3:rgb(0,145,0); -@Purple1:rgb(241,202,255); -@Purple2:rgb(215,108,255); -@Purple3:rgb(186,0,255); -@Metalic1:rgb(189,205,212); -@Metalic2:rgb(158,171,176); -@Metalic3:rgb(54,78,89); -@Metalic4:rgb(14,35,46); -@Grey1:rgb(255,255,255); -@Grey2:rgb(204,204,204); -@Grey3:rgb(153,153,153); -@Grey4:rgb(102,102,102); -@Grey5:rgb(45,45,45); +@import "colors"; +@import "quattro"; -///* fonts */ -// @font-face { -// font-family: "LiberationSans"; -// src: local("Liberation Sans"),url( LiberationSans-Regular.ttf ) format("truetype"); -// font-weight: bold; font-style: italic; -// } -// -// @font-face { -// font-family: "LiberationSans"; -// src: local("Liberation Sans"),url( LiberationSans-Bold.ttf ) format("truetype"); -// font-weight: bold; font-style: normal; -// } -// @font-face { -// font-family: "LiberationSans"; -// src: local("Liberation Sans"),url( LiberationSans-Italic.ttf ) format("truetype"); -// font-weight: normal; font-style: italic; -// } -/* global */ -body { - font-family: Liberation Sans,helvetica,arial,clean,sans-serif; - font-size: 12px; - background-color: @Grey1; - color: @Grey5; - margin: 0px; - display:table-row; -} -.shadow(@x: 0px, @y: 5px){ - -webkit-box-shadow:@x @y 10px rgba(0, 0, 0, 0.7); - -moz-box-shadow:@x @y 10px rgba(0, 0, 0, 0.7); - box-shadow:@x @y 10px rgba(0, 0, 0, 0.7); -} - -.rounded(@tr: 5px, @tl: 5px, @bl: 5px, @br: 5px){ - -moz-border-radius: @arguments; - -webkit-border-radius: @arguments; - border-radius: @arguments; -} - -.roundbottom (@radius: 5px){ .rounded(0, 0, @radius, @radius); } -.roundtop (@radius: 5px){ .rounded(@radius, @radius, 0, 0); } - -a, a:visited, a:link { color: @Blue3; text-decoration: none; } -a:hover {text-decoration: underline; } - -.left { float: left; } -.right { float: right; } - -/* icons */ - - -.icons(@size: 22) { - &.notify { background-image: url("../../../images/icons/notify_off_@{size}.png"); } - &.gear { background-image: url("../../../images/icons/gear_@{size}.png"); } -} - - -.icon { - background-color: transparent ; - background-repeat: no-repeat; - background-position: center center; - display: block; - overflow: hidden; - text-indent: -9999px; - - &.s22 { - width:22px; height: 22px; - padding: 1px; - .icons(22); - } - -} - - - -/* header */ -header { - position: fixed; left: 43%; right: 43%; top: 0px; - margin: 0px; padding: 0px; - /*width: 100%; height: 12px; */ - z-index: 110; - color: @Grey1; - #site-location { - /*font-size:8px; - float:left; - background-color: @Metalic3; - padding: 1px 5px; - margin-left: 20px; - .roundbottom()*/ - display: none; - } - - #banner { - - text-align: center; - width: 100%; - a, a:active, a:visited, a:link, a:hover { color: @Grey1; text-decoration: none; outline: none; vertical-align: bottom; } - #logo-img { height: 22px; margin-top:5px;} - #logo-text { font-size: 22px } - } -} -/* nav */ -nav { - width: 100%; height: 32px; - position: fixed; left: 0px; top: 0px; - padding: 0px; - background-color: @Metalic4; - color: @Grey1; - z-index: 100; - .shadow(0px, 0px); - - a, a:active, a:visited, a:link, a:hover { color: @Grey1; text-decoration: none; outline: none; } - - ul { - margin: 0px; - padding: 0px 20px; - li { - list-style: none; - margin: 0px; padding: 0px; - float: left; - .menu-popup{ left: 0px; right: auto; } - } - - } - - .nav-menu-icon { - position: relative; - height: 22px; - padding: 5px; - margin: 0px 10px; - .roundtop(); - - &.selected { - background-color: @Metalic3; - } - - img { width: 22px; height: 22px; } - .nav-notify { top: 3px; } - } - - .nav-menu { - position: relative; - height: 16px; - padding: 5px; - margin: 3px 15px 0px; - font-size: 14px; - border-bottom: 3px solid @Metalic4; - &.selected { - border-bottom: 3px solid @Metalic2; - } - - } - - .nav-notify { - display: none; - position: absolute; - background-color: @Blue1; - .rounded(); - font-size: 10px; - padding: 1px 3px; - top: 0px; - right: -10px; - min-width: 15px; - text-align: right; - - &.show{ display: block; } - } - - - #nav-help-link, - #nav-search-link, - #nav-directory-link, - #nav-apps-link, - #nav-site-linkmenu { - float: right; - .menu-popup{ right: 0px; left: auto; } - } - - #nav-notifications-linkmenu.selected .icon.s22.notify { background-image: url("../../../images/icons/notify_on_22.png") } - -} - -ul.menu-popup { - position: absolute; - display: none; - width: 10em; - background: @Grey1; - color: @Grey5; - margin: 0px; - padding: 0px; - list-style: none; - border: 3px solid @Metalic3; - z-index: 100000; - - .shadow(); - - a { display: block; color: @Grey5; padding: 5px 10px;} - a:hover { background-color: @Metalic1; } - .menu-sep { border-top: 1px solid @Metalic2; } - li { float: none; overflow: auto; height: auto; display: block; } - - .empty { - padding: 5px; - text-align: center; - color: @Metalic2; - } -} - -#nav-notifications-menu { - width: 400px; - img { float: left; margin-right: 5px; } - .contactname { font-weight: bold; } - .notif-when { font-size: 10px; color: @Metalic2; display: block; } -} - - - - -/* aside */ -aside { - display: table-cell; - width: 200px; - padding:50px 10px 0px 20px; -} - -/* section */ -section { - display: table-cell; - width: 800px; - padding:50px 20px 0px 10px; -} -- cgit v1.2.3 From 54f0685a038d87706ec4ecc15edc55ee171b6079 Mon Sep 17 00:00:00 2001 From: Fabio Comuni Date: Wed, 31 Aug 2011 17:30:48 +0200 Subject: quattro: more colors --- view/theme/quattro/colors.less | 10 ++++++++++ view/theme/quattro/quattro.less | 19 ++++++++++--------- view/theme/quattro/style.css | 9 +++++---- 3 files changed, 25 insertions(+), 13 deletions(-) (limited to 'view/theme/quattro') diff --git a/view/theme/quattro/colors.less b/view/theme/quattro/colors.less index 75a53a68a..d79dbca68 100644 --- a/view/theme/quattro/colors.less +++ b/view/theme/quattro/colors.less @@ -44,7 +44,17 @@ @NavbarSelectedBg:@Metalic3; @NavbarSelectedBorder: @Metalic2; @NavbarNotifBg: @Blue1; + @Menu: @Grey5; @MenuBg: @Grey1; @MenuBorder: @Metalic3; +@MenuItem: @Grey5; +@MenuItemHoverBg: @Metalic1; +@MenuItemSeparator: @Metalic2; +@MenuEmpty: @Metalic2; +@MenuItemDetail: @Metalic2; + +@AsideBorder: @Metalic1; + + diff --git a/view/theme/quattro/quattro.less b/view/theme/quattro/quattro.less index 4c4a002f3..f83cce3ce 100644 --- a/view/theme/quattro/quattro.less +++ b/view/theme/quattro/quattro.less @@ -6,8 +6,8 @@ body { font-size: 12px; background-color: @BodyBackground; color: @BodyColor; - margin: 0px; - display:table-row; + margin: 50px 0px 0px 0px; + display:table; } .shadow(@x: 0px, @y: 5px){ @@ -175,15 +175,15 @@ ul.menu-popup { .shadow(); - a { display: block; color: @Grey5; padding: 5px 10px;} - a:hover { background-color: @Metalic1; } - .menu-sep { border-top: 1px solid @Metalic2; } + a { display: block; color: @MenuItem; padding: 5px 10px;} + a:hover { background-color: @MenuItemHoverBg; } + .menu-sep { border-top: 1px solid @MenuItemSeparator; } li { float: none; overflow: auto; height: auto; display: block; } .empty { padding: 5px; text-align: center; - color: @Metalic2; + color: @MenuEmpty; } } @@ -191,7 +191,7 @@ ul.menu-popup { width: 400px; img { float: left; margin-right: 5px; } .contactname { font-weight: bold; } - .notif-when { font-size: 10px; color: @Metalic2; display: block; } + .notif-when { font-size: 10px; color: @MenuItemDetail; display: block; } } @@ -201,12 +201,13 @@ ul.menu-popup { aside { display: table-cell; width: 200px; - padding:50px 10px 0px 20px; + padding:0px 10px 0px 20px; + border-right: 1px solid @AsideBorder; } /* section */ section { display: table-cell; width: 800px; - padding:50px 20px 0px 10px; + padding:0px 20px 0px 10px; } diff --git a/view/theme/quattro/style.css b/view/theme/quattro/style.css index e2c06125b..e0d22a007 100644 --- a/view/theme/quattro/style.css +++ b/view/theme/quattro/style.css @@ -7,8 +7,8 @@ body { font-size: 12px; background-color: #ffffff; color: #2d2d2d; - margin: 0px; - display: table-row; + margin: 50px 0px 0px 0px; + display: table; } a, a:link { color: #005c94; @@ -247,11 +247,12 @@ ul.menu-popup .empty { aside { display: table-cell; width: 200px; - padding: 50px 10px 0px 20px; + padding: 0px 10px 0px 20px; + border-right: 1px solid #bdcdd4; } /* section */ section { display: table-cell; width: 800px; - padding: 50px 20px 0px 10px; + padding: 0px 20px 0px 10px; } -- cgit v1.2.3 From 058e329dfbc2678fa7e3cb2ce130fb9ffd69b84d Mon Sep 17 00:00:00 2001 From: Fabio Comuni Date: Thu, 1 Sep 2011 12:37:30 +0200 Subject: Fix profile vcard and style --- view/theme/quattro/colors.less | 3 +++ view/theme/quattro/quattro.less | 30 +++++++++++++++++++++++++++ view/theme/quattro/style.css | 46 +++++++++++++++++++++++++++++++++++++++++ 3 files changed, 79 insertions(+) (limited to 'view/theme/quattro') diff --git a/view/theme/quattro/colors.less b/view/theme/quattro/colors.less index d79dbca68..6015c61ee 100644 --- a/view/theme/quattro/colors.less +++ b/view/theme/quattro/colors.less @@ -55,6 +55,9 @@ @MenuItemDetail: @Metalic2; @AsideBorder: @Metalic1; +@AsideConnect: @Grey1; +@AsideConnectBg: @Blue3; +@AsideConnectHoverBg: @Blue1; diff --git a/view/theme/quattro/quattro.less b/view/theme/quattro/quattro.less index f83cce3ce..d21c3c182 100644 --- a/view/theme/quattro/quattro.less +++ b/view/theme/quattro/quattro.less @@ -203,8 +203,38 @@ aside { width: 200px; padding:0px 10px 0px 20px; border-right: 1px solid @AsideBorder; + + .vcard { + .fn { font-size: 16px; font-weight: bold; margin-bottom: 5px; } + .title { margin-bottom: 5px; } + dl { height: auto; overflow: auto; } + dt {float: left; margin-left: 0px; width: 35%; } + dd {float: left; margin-left: 4px; width: 60%;} + + } + + #profile-extra-links { + ul { padding: 0px; margin: 0px; } + li { padding: 0px; margin: 0px; list-style: none; } + } + + #dfrn-request-link { + display: block; + .rounded(); + color: @AsideConnect; + background: @AsideConnectBg url('../../../images/connect-bg.png') no-repeat left center; + font-weight: bold; + text-transform:uppercase; + padding: 4px 2px 2px 35px; + + &:hover { text-decoration: none; background-color: @AsideConnectHoverBg; } + } + } + + + /* section */ section { display: table-cell; diff --git a/view/theme/quattro/style.css b/view/theme/quattro/style.css index e0d22a007..28e6f5fa1 100644 --- a/view/theme/quattro/style.css +++ b/view/theme/quattro/style.css @@ -250,6 +250,52 @@ aside { padding: 0px 10px 0px 20px; border-right: 1px solid #bdcdd4; } +aside .vcard .fn { + font-size: 16px; + font-weight: bold; + margin-bottom: 5px; +} +aside .vcard .title { + margin-bottom: 5px; +} +aside .vcard dl { + height: auto; + overflow: auto; +} +aside .vcard dt { + float: left; + margin-left: 0px; + width: 35%; +} +aside .vcard dd { + float: left; + margin-left: 4px; + width: 60%; +} +aside #profile-extra-links ul { + padding: 0px; + margin: 0px; +} +aside #profile-extra-links li { + padding: 0px; + margin: 0px; + list-style: none; +} +aside #dfrn-request-link { + display: block; + -moz-border-radius: 5px 5px 5px 5px; + -webkit-border-radius: 5px 5px 5px 5px; + border-radius: 5px 5px 5px 5px; + color: #ffffff; + background: #005c94 url('../../../images/connect-bg.png') no-repeat left center; + font-weight: bold; + text-transform: uppercase; + padding: 4px 2px 2px 35px; +} +aside #dfrn-request-link:hover { + text-decoration: none; + background-color: #19aeff; +} /* section */ section { display: table-cell; -- cgit v1.2.3 From ab5bda526e9fffcfeecd384332372531c18c49dc Mon Sep 17 00:00:00 2001 From: Fabio Comuni Date: Mon, 5 Sep 2011 11:14:43 +0200 Subject: move icons style in new file --- view/theme/quattro/icons.less | 37 ++++++++++++++ view/theme/quattro/quattro.less | 47 +++++++++--------- view/theme/quattro/style.css | 104 +++++++++++++++++++++++++++++++++------- view/theme/quattro/style.less | 1 + 4 files changed, 146 insertions(+), 43 deletions(-) create mode 100644 view/theme/quattro/icons.less (limited to 'view/theme/quattro') diff --git a/view/theme/quattro/icons.less b/view/theme/quattro/icons.less new file mode 100644 index 000000000..8f7111aff --- /dev/null +++ b/view/theme/quattro/icons.less @@ -0,0 +1,37 @@ +/* icons */ + +.icons(@size: 22) { + &.notify { background-image: url("../../../images/icons/@{size}/notify_off.png"); } + &.gear { background-image: url("../../../images/icons/@{size}/gear.png"); } + + &.add { background-image: url("../../../images/icons/@{size}/add.png"); } + &.delete { background-image: url("../../../images/icons/@{size}/delete.png"); } + &.edit { background-image: url("../../../images/icons/@{size}/edit.png"); } + &.start { background-image: url("../../../images/icons/@{size}/star.png"); } +} + + +.icon { + background-color: transparent ; + background-repeat: no-repeat; + background-position: center center; + display: block; + overflow: hidden; + text-indent: -9999px; + padding: 1px; + + &.text { + text-indent: 0px; + } + + &.s16 { + width:22px; height: 22px; + .icons(16); + } + &.s22 { + width:22px; height: 22px; + .icons(22); + } + + +} diff --git a/view/theme/quattro/quattro.less b/view/theme/quattro/quattro.less index d21c3c182..c7cbe7ebb 100644 --- a/view/theme/quattro/quattro.less +++ b/view/theme/quattro/quattro.less @@ -32,33 +32,13 @@ a:hover {color: @LinkHover; text-decoration: underline; } .left { float: left; } .right { float: right; } -/* icons */ - - -.icons(@size: 22) { - &.notify { background-image: url("../../../images/icons/notify_off_@{size}.png"); } - &.gear { background-image: url("../../../images/icons/gear_@{size}.png"); } -} - - -.icon { - background-color: transparent ; - background-repeat: no-repeat; - background-position: center center; - display: block; - overflow: hidden; - text-indent: -9999px; - - &.s22 { - width:22px; height: 22px; - padding: 1px; - .icons(22); - } - +.tool { + height: auto; overflow: auto; + .label { float: left;} + .icon { float: right; } } - /* header */ header { position: fixed; left: 43%; right: 43%; top: 0px; @@ -156,7 +136,7 @@ nav { .menu-popup{ right: 0px; left: auto; } } - #nav-notifications-linkmenu.selected .icon.s22.notify { background-image: url("../../../images/icons/notify_on_22.png") } + #nav-notifications-linkmenu.selected .icon.s22.notify { background-image: url("../../../images/icons/22/notify_on.png") } #nav-apps-link.selected { background-color: @NavbarSelectedBg; } } @@ -232,6 +212,20 @@ aside { } +#contact-block { + overflow: auto; height: auto; + .contact-block-h4 { float: left; margin: 5px 0px; } + .allcontact-link { float: right; margin: 5px 0px; } + .contact-block-content { + clear: both; + overflow: auto; height: auto; + } + .contact-block-link { + float: left; + margin: 0px 2px 2px 0px; + } +} + @@ -241,3 +235,6 @@ section { width: 800px; padding:0px 20px 0px 10px; } + + + diff --git a/view/theme/quattro/style.css b/view/theme/quattro/style.css index 28e6f5fa1..2b950c3ef 100644 --- a/view/theme/quattro/style.css +++ b/view/theme/quattro/style.css @@ -1,6 +1,63 @@ /** * Fabio Comuni **/ +/* icons */ +.icon { + background-color: transparent ; + background-repeat: no-repeat; + background-position: center center; + display: block; + overflow: hidden; + text-indent: -9999px; + padding: 1px; +} +.icon.text { + text-indent: 0px; +} +.icon.s16 { + width: 22px; + height: 22px; +} +.icon.s16.notify { + background-image: url("../../../images/icons/16/notify_off.png"); +} +.icon.s16.gear { + background-image: url("../../../images/icons/16/gear.png"); +} +.icon.s16.add { + background-image: url("../../../images/icons/16/add.png"); +} +.icon.s16.delete { + background-image: url("../../../images/icons/16/delete.png"); +} +.icon.s16.edit { + background-image: url("../../../images/icons/16/edit.png"); +} +.icon.s16.start { + background-image: url("../../../images/icons/16/star.png"); +} +.icon.s22 { + width: 22px; + height: 22px; +} +.icon.s22.notify { + background-image: url("../../../images/icons/22/notify_off.png"); +} +.icon.s22.gear { + background-image: url("../../../images/icons/22/gear.png"); +} +.icon.s22.add { + background-image: url("../../../images/icons/22/add.png"); +} +.icon.s22.delete { + background-image: url("../../../images/icons/22/delete.png"); +} +.icon.s22.edit { + background-image: url("../../../images/icons/22/edit.png"); +} +.icon.s22.start { + background-image: url("../../../images/icons/22/star.png"); +} /* global */ body { font-family: Liberation Sans, helvetica, arial, clean, sans-serif; @@ -28,25 +85,15 @@ a:hover { .right { float: right; } -/* icons */ -.icon { - background-color: transparent ; - background-repeat: no-repeat; - background-position: center center; - display: block; - overflow: hidden; - text-indent: -9999px; -} -.icon.s22 { - width: 22px; - height: 22px; - padding: 1px; +.tool { + height: auto; + overflow: auto; } -.icon.s22.notify { - background-image: url("../../../images/icons/notify_off_22.png"); +.tool .label { + float: left; } -.icon.s22.gear { - background-image: url("../../../images/icons/gear_22.png"); +.tool .icon { + float: right; } /* header */ header { @@ -186,7 +233,7 @@ nav #nav-site-linkmenu .menu-popup { left: auto; } nav #nav-notifications-linkmenu.selected .icon.s22.notify { - background-image: url("../../../images/icons/notify_on_22.png"); + background-image: url("../../../images/icons/22/notify_on.png"); } nav #nav-apps-link.selected { background-color: #364e59; @@ -296,6 +343,27 @@ aside #dfrn-request-link:hover { text-decoration: none; background-color: #19aeff; } +#contact-block { + overflow: auto; + height: auto; +} +#contact-block .contact-block-h4 { + float: left; + margin: 5px 0px; +} +#contact-block .allcontact-link { + float: right; + margin: 5px 0px; +} +#contact-block .contact-block-content { + clear: both; + overflow: auto; + height: auto; +} +#contact-block .contact-block-link { + float: left; + margin: 0px 2px 2px 0px; +} /* section */ section { display: table-cell; diff --git a/view/theme/quattro/style.less b/view/theme/quattro/style.less index d1c677b22..c3dbae777 100644 --- a/view/theme/quattro/style.less +++ b/view/theme/quattro/style.less @@ -6,6 +6,7 @@ // $ lessc style.less > style.css @import "colors"; +@import "icons"; @import "quattro"; -- cgit v1.2.3 From abd65e00aba5a2581665a689e01fe9330046f001 Mon Sep 17 00:00:00 2001 From: Fabio Comuni Date: Mon, 5 Sep 2011 14:01:21 +0200 Subject: Load infos and notices via ping and show them with js popup --- view/theme/quattro/colors.less | 5 ++++- view/theme/quattro/quattro.less | 14 +++++++++++++- view/theme/quattro/style.css | 11 +++++++++++ 3 files changed, 28 insertions(+), 2 deletions(-) (limited to 'view/theme/quattro') diff --git a/view/theme/quattro/colors.less b/view/theme/quattro/colors.less index 6015c61ee..3d3074d60 100644 --- a/view/theme/quattro/colors.less +++ b/view/theme/quattro/colors.less @@ -59,5 +59,8 @@ @AsideConnectBg: @Blue3; @AsideConnectHoverBg: @Blue1; +@InfoColor: @Grey1; +@InfoBackgroundColor: @Metalic3; - +@NoticeColor: @Grey1; +@NoticeBackgroundColor: #511919; diff --git a/view/theme/quattro/quattro.less b/view/theme/quattro/quattro.less index c7cbe7ebb..2c4e0464a 100644 --- a/view/theme/quattro/quattro.less +++ b/view/theme/quattro/quattro.less @@ -38,6 +38,19 @@ a:hover {color: @LinkHover; text-decoration: underline; } .icon { float: right; } } +/* popup notifications */ +div.jGrowl div.notice { + background: @NoticeBackgroundColor url("../../../images/icons/48/notice.png") no-repeat 5px center; + color: @NoticeColor; + padding-left: 58px; +} +div.jGrowl div.info { + background: @InfoBackgroundColor url("../../../images/icons/48/info.png") no-repeat 5px center; + color: @InfoColor; + padding-left: 58px; +} + + /* header */ header { @@ -237,4 +250,3 @@ section { } - diff --git a/view/theme/quattro/style.css b/view/theme/quattro/style.css index 2b950c3ef..0fce02f03 100644 --- a/view/theme/quattro/style.css +++ b/view/theme/quattro/style.css @@ -95,6 +95,17 @@ a:hover { .tool .icon { float: right; } +/* popup notifications */ +div.jGrowl div.notice { + background: #511919 url("../../../images/icons/48/notice.png") no-repeat 5px center; + color: #ffffff; + padding-left: 58px; +} +div.jGrowl div.info { + background: #364e59 url("../../../images/icons/48/info.png") no-repeat 5px center; + color: #ffffff; + padding-left: 58px; +} /* header */ header { position: fixed; -- cgit v1.2.3 From 08e54234e30c10e3130b7d71caba9fd43e3593e3 Mon Sep 17 00:00:00 2001 From: Fabio Comuni Date: Mon, 5 Sep 2011 16:55:40 +0200 Subject: profiles popup menu in sidebar --- view/theme/quattro/quattro.less | 6 +++--- view/theme/quattro/style.css | 9 ++++++++- 2 files changed, 11 insertions(+), 4 deletions(-) (limited to 'view/theme/quattro') diff --git a/view/theme/quattro/quattro.less b/view/theme/quattro/quattro.less index 2c4e0464a..01d0b94b9 100644 --- a/view/theme/quattro/quattro.less +++ b/view/theme/quattro/quattro.less @@ -35,7 +35,7 @@ a:hover {color: @LinkHover; text-decoration: underline; } .tool { height: auto; overflow: auto; .label { float: left;} - .icon { float: right; } + .action { float: right; } } /* popup notifications */ @@ -168,11 +168,11 @@ ul.menu-popup { .shadow(); - a { display: block; color: @MenuItem; padding: 5px 10px;} + a { display: block; color: @MenuItem; padding: 5px 10px; text-decoration: none;} a:hover { background-color: @MenuItemHoverBg; } .menu-sep { border-top: 1px solid @MenuItemSeparator; } li { float: none; overflow: auto; height: auto; display: block; } - + li img { float: left; width: 16px; height: 16px; padding-right: 5px;} .empty { padding: 5px; text-align: center; diff --git a/view/theme/quattro/style.css b/view/theme/quattro/style.css index 0fce02f03..6daef77a3 100644 --- a/view/theme/quattro/style.css +++ b/view/theme/quattro/style.css @@ -92,7 +92,7 @@ a:hover { .tool .label { float: left; } -.tool .icon { +.tool .action { float: right; } /* popup notifications */ @@ -268,6 +268,7 @@ ul.menu-popup a { display: block; color: #2d2d2d; padding: 5px 10px; + text-decoration: none; } ul.menu-popup a:hover { background-color: #bdcdd4; @@ -281,6 +282,12 @@ ul.menu-popup li { height: auto; display: block; } +ul.menu-popup li img { + float: left; + width: 16px; + height: 16px; + padding-right: 5px; +} ul.menu-popup .empty { padding: 5px; text-align: center; -- cgit v1.2.3 From 2f93a4d70dbdc1c8affa05dc7a09638c542e2fa3 Mon Sep 17 00:00:00 2001 From: Fabio Comuni Date: Thu, 8 Sep 2011 10:11:57 +0200 Subject: style vcard infos --- view/theme/quattro/colors.less | 1 + view/theme/quattro/quattro.less | 3 ++- view/theme/quattro/style.css | 4 +++- 3 files changed, 6 insertions(+), 2 deletions(-) (limited to 'view/theme/quattro') diff --git a/view/theme/quattro/colors.less b/view/theme/quattro/colors.less index 3d3074d60..b5a203b94 100644 --- a/view/theme/quattro/colors.less +++ b/view/theme/quattro/colors.less @@ -58,6 +58,7 @@ @AsideConnect: @Grey1; @AsideConnectBg: @Blue3; @AsideConnectHoverBg: @Blue1; +@VCardLabelColor: @Grey3; @InfoColor: @Grey1; @InfoBackgroundColor: @Metalic3; diff --git a/view/theme/quattro/quattro.less b/view/theme/quattro/quattro.less index 01d0b94b9..54bd11806 100644 --- a/view/theme/quattro/quattro.less +++ b/view/theme/quattro/quattro.less @@ -149,6 +149,7 @@ nav { .menu-popup{ right: 0px; left: auto; } } + #nav-notifications-linkmenu.on .icon.s22.notify, #nav-notifications-linkmenu.selected .icon.s22.notify { background-image: url("../../../images/icons/22/notify_on.png") } #nav-apps-link.selected { background-color: @NavbarSelectedBg; } } @@ -201,7 +202,7 @@ aside { .fn { font-size: 16px; font-weight: bold; margin-bottom: 5px; } .title { margin-bottom: 5px; } dl { height: auto; overflow: auto; } - dt {float: left; margin-left: 0px; width: 35%; } + dt {float: left; margin-left: 0px; width: 35%; text-align: right; color: @VCardLabelColor; } dd {float: left; margin-left: 4px; width: 60%;} } diff --git a/view/theme/quattro/style.css b/view/theme/quattro/style.css index 6daef77a3..70e0a3b94 100644 --- a/view/theme/quattro/style.css +++ b/view/theme/quattro/style.css @@ -243,7 +243,7 @@ nav #nav-site-linkmenu .menu-popup { right: 0px; left: auto; } -nav #nav-notifications-linkmenu.selected .icon.s22.notify { +nav #nav-notifications-linkmenu.on .icon.s22.notify, nav #nav-notifications-linkmenu.selected .icon.s22.notify { background-image: url("../../../images/icons/22/notify_on.png"); } nav #nav-apps-link.selected { @@ -331,6 +331,8 @@ aside .vcard dt { float: left; margin-left: 0px; width: 35%; + text-align: right; + color: #999999; } aside .vcard dd { float: left; -- cgit v1.2.3 From 7e806429cca6ac39a9ef1bd1fd400d03e626389b Mon Sep 17 00:00:00 2001 From: Fabio Comuni Date: Thu, 15 Sep 2011 10:38:37 +0200 Subject: quattro --- view/theme/quattro/quattro.less | 5 ++++- view/theme/quattro/style.css | 5 ++++- 2 files changed, 8 insertions(+), 2 deletions(-) (limited to 'view/theme/quattro') diff --git a/view/theme/quattro/quattro.less b/view/theme/quattro/quattro.less index 54bd11806..14d1dfa1c 100644 --- a/view/theme/quattro/quattro.less +++ b/view/theme/quattro/quattro.less @@ -3,7 +3,7 @@ /* global */ body { font-family: Liberation Sans,helvetica,arial,clean,sans-serif; - font-size: 12px; + font-size: 10px; background-color: @BodyBackground; color: @BodyColor; margin: 50px 0px 0px 0px; @@ -179,6 +179,7 @@ ul.menu-popup { text-align: center; color: @MenuEmpty; } + } #nav-notifications-menu { @@ -224,6 +225,8 @@ aside { &:hover { text-decoration: none; background-color: @AsideConnectHoverBg; } } + #profiles-menu { width: 20em; } + } #contact-block { diff --git a/view/theme/quattro/style.css b/view/theme/quattro/style.css index 70e0a3b94..6ff9c70c7 100644 --- a/view/theme/quattro/style.css +++ b/view/theme/quattro/style.css @@ -61,7 +61,7 @@ /* global */ body { font-family: Liberation Sans, helvetica, arial, clean, sans-serif; - font-size: 12px; + font-size: 10px; background-color: #ffffff; color: #2d2d2d; margin: 50px 0px 0px 0px; @@ -363,6 +363,9 @@ aside #dfrn-request-link:hover { text-decoration: none; background-color: #19aeff; } +aside #profiles-menu { + width: 20em; +} #contact-block { overflow: auto; height: auto; -- cgit v1.2.3 From 80af4f3fe647e52add7e38cabc356597fae57a22 Mon Sep 17 00:00:00 2001 From: Fabio Comuni Date: Fri, 16 Sep 2011 12:50:15 +0200 Subject: new icons --- view/theme/quattro/icons.less | 16 +++++++++++++++- 1 file changed, 15 insertions(+), 1 deletion(-) (limited to 'view/theme/quattro') diff --git a/view/theme/quattro/icons.less b/view/theme/quattro/icons.less index 8f7111aff..c5dc1937b 100644 --- a/view/theme/quattro/icons.less +++ b/view/theme/quattro/icons.less @@ -1,3 +1,4 @@ +// Quattro Theme LESS file /* icons */ .icons(@size: 22) { @@ -7,7 +8,12 @@ &.add { background-image: url("../../../images/icons/@{size}/add.png"); } &.delete { background-image: url("../../../images/icons/@{size}/delete.png"); } &.edit { background-image: url("../../../images/icons/@{size}/edit.png"); } - &.start { background-image: url("../../../images/icons/@{size}/star.png"); } + &.star { background-image: url("../../../images/icons/@{size}/star.png"); } + &.menu { background-image: url("../../../images/icons/@{size}/menu.png"); } + &.link { background-image: url("../../../images/icons/@{size}/link.png"); } + &.lock { background-image: url("../../../images/icons/@{size}/lock.png"); } + &.unlock { background-image: url("../../../images/icons/@{size}/unlock.png"); } + } @@ -24,6 +30,10 @@ text-indent: 0px; } + &.s10 { + width:10px; height: 10px; + .icons(10); + } &.s16 { width:22px; height: 22px; .icons(16); @@ -32,6 +42,10 @@ width:22px; height: 22px; .icons(22); } + &.s48 { + width:48px; height: 48px; + .icons(22); + } } -- cgit v1.2.3 From 6b6f45f9f1c0fa5c0142c0bf1d9a93b77694ea4b Mon Sep 17 00:00:00 2001 From: Fabio Comuni Date: Fri, 16 Sep 2011 12:51:14 +0200 Subject: quattro: initial style of conversations --- view/theme/quattro/colors.less | 2 + view/theme/quattro/quattro.less | 55 ++++++++++++- view/theme/quattro/style.css | 166 +++++++++++++++++++++++++++++++++++++++- 3 files changed, 220 insertions(+), 3 deletions(-) (limited to 'view/theme/quattro') diff --git a/view/theme/quattro/colors.less b/view/theme/quattro/colors.less index b5a203b94..12b0d08a6 100644 --- a/view/theme/quattro/colors.less +++ b/view/theme/quattro/colors.less @@ -65,3 +65,5 @@ @NoticeColor: @Grey1; @NoticeBackgroundColor: #511919; + +@ThreadBackgroundColor: #f6f7f8; diff --git a/view/theme/quattro/quattro.less b/view/theme/quattro/quattro.less index 14d1dfa1c..e96095c24 100644 --- a/view/theme/quattro/quattro.less +++ b/view/theme/quattro/quattro.less @@ -31,6 +31,8 @@ a:hover {color: @LinkHover; text-decoration: underline; } .left { float: left; } .right { float: right; } +.hidden { display: none; } + .tool { height: auto; overflow: auto; @@ -253,4 +255,55 @@ section { padding:0px 20px 0px 10px; } - +/* wall item */ +.tread-wrapper { + background-color: @ThreadBackgroundColor; + position: relative; + padding: 10px; + margin-bottom: 20px; +} +.wall-item-decor { position: absolute; left: 790px; top: -10px; width: 16px;} +.wall-item-container { + display: table; + width: 780px; + margin-bottom: 10px; + + .wall-item-item, + .wall-item-bottom { display: table-row; } + .wall-item-info { + display: table-cell; + vertical-align: top; + text-align: left; + width: 60px; + + .wall-item-photo-wrapper { position: relative; } + .wall-item-photo { width: 48px; height: 48px; } + + .wall-item-photo-menu-button { + display: none; + position: absolute; + left: -4px; + top: 28px; + } + .wall-item-photo-menu { display: none; } + + } + .wall-item-content { + display: table-cell; + font-size: 12px; + max-width: 720px; + word-wrap: break-word; + } + .wall-item-content img { max-width: 710px; } + .wall-item-links, + .wall-item-actions { display: table-cell; } + + .wall-item-ago { padding-right: 40px; } +} +.wall-item-container.comment { + .wall-item-photo { width: 32px; height: 32px; margin-left: 16px;} + .wall-item-photo-menu-button { + top: 13px !important; + left: 10px !important; + } +} diff --git a/view/theme/quattro/style.css b/view/theme/quattro/style.css index 6ff9c70c7..a6ea35869 100644 --- a/view/theme/quattro/style.css +++ b/view/theme/quattro/style.css @@ -14,6 +14,40 @@ .icon.text { text-indent: 0px; } +.icon.s10 { + width: 10px; + height: 10px; +} +.icon.s10.notify { + background-image: url("../../../images/icons/10/notify_off.png"); +} +.icon.s10.gear { + background-image: url("../../../images/icons/10/gear.png"); +} +.icon.s10.add { + background-image: url("../../../images/icons/10/add.png"); +} +.icon.s10.delete { + background-image: url("../../../images/icons/10/delete.png"); +} +.icon.s10.edit { + background-image: url("../../../images/icons/10/edit.png"); +} +.icon.s10.star { + background-image: url("../../../images/icons/10/star.png"); +} +.icon.s10.menu { + background-image: url("../../../images/icons/10/menu.png"); +} +.icon.s10.link { + background-image: url("../../../images/icons/10/link.png"); +} +.icon.s10.lock { + background-image: url("../../../images/icons/10/lock.png"); +} +.icon.s10.unlock { + background-image: url("../../../images/icons/10/unlock.png"); +} .icon.s16 { width: 22px; height: 22px; @@ -33,9 +67,21 @@ .icon.s16.edit { background-image: url("../../../images/icons/16/edit.png"); } -.icon.s16.start { +.icon.s16.star { background-image: url("../../../images/icons/16/star.png"); } +.icon.s16.menu { + background-image: url("../../../images/icons/16/menu.png"); +} +.icon.s16.link { + background-image: url("../../../images/icons/16/link.png"); +} +.icon.s16.lock { + background-image: url("../../../images/icons/16/lock.png"); +} +.icon.s16.unlock { + background-image: url("../../../images/icons/16/unlock.png"); +} .icon.s22 { width: 22px; height: 22px; @@ -55,9 +101,55 @@ .icon.s22.edit { background-image: url("../../../images/icons/22/edit.png"); } -.icon.s22.start { +.icon.s22.star { background-image: url("../../../images/icons/22/star.png"); } +.icon.s22.menu { + background-image: url("../../../images/icons/22/menu.png"); +} +.icon.s22.link { + background-image: url("../../../images/icons/22/link.png"); +} +.icon.s22.lock { + background-image: url("../../../images/icons/22/lock.png"); +} +.icon.s22.unlock { + background-image: url("../../../images/icons/22/unlock.png"); +} +.icon.s48 { + width: 48px; + height: 48px; +} +.icon.s48.notify { + background-image: url("../../../images/icons/22/notify_off.png"); +} +.icon.s48.gear { + background-image: url("../../../images/icons/22/gear.png"); +} +.icon.s48.add { + background-image: url("../../../images/icons/22/add.png"); +} +.icon.s48.delete { + background-image: url("../../../images/icons/22/delete.png"); +} +.icon.s48.edit { + background-image: url("../../../images/icons/22/edit.png"); +} +.icon.s48.star { + background-image: url("../../../images/icons/22/star.png"); +} +.icon.s48.menu { + background-image: url("../../../images/icons/22/menu.png"); +} +.icon.s48.link { + background-image: url("../../../images/icons/22/link.png"); +} +.icon.s48.lock { + background-image: url("../../../images/icons/22/lock.png"); +} +.icon.s48.unlock { + background-image: url("../../../images/icons/22/unlock.png"); +} /* global */ body { font-family: Liberation Sans, helvetica, arial, clean, sans-serif; @@ -85,6 +177,9 @@ a:hover { .right { float: right; } +.hidden { + display: none; +} .tool { height: auto; overflow: auto; @@ -393,3 +488,70 @@ section { width: 800px; padding: 0px 20px 0px 10px; } +/* wall item */ +.tread-wrapper { + background-color: #f6f7f8; + position: relative; + padding: 10px; + margin-bottom: 20px; +} +.wall-item-decor { + position: absolute; + left: 790px; + top: -10px; + width: 16px; +} +.wall-item-container { + display: table; + width: 780px; + margin-bottom: 10px; +} +.wall-item-container .wall-item-item, .wall-item-container .wall-item-bottom { + display: table-row; +} +.wall-item-container .wall-item-info { + display: table-cell; + vertical-align: top; + text-align: left; + width: 60px; +} +.wall-item-container .wall-item-info .wall-item-photo-wrapper { + position: relative; +} +.wall-item-container .wall-item-info .wall-item-photo { + width: 48px; + height: 48px; +} +.wall-item-container .wall-item-info .wall-item-photo-menu-button { + display: none; + position: absolute; + left: -4px; + top: 28px; +} +.wall-item-container .wall-item-info .wall-item-photo-menu { + display: none; +} +.wall-item-container .wall-item-content { + display: table-cell; + font-size: 12px; + max-width: 720px; + word-wrap: break-word; +} +.wall-item-container .wall-item-content img { + max-width: 710px; +} +.wall-item-container .wall-item-links, .wall-item-container .wall-item-actions { + display: table-cell; +} +.wall-item-container .wall-item-ago { + padding-right: 40px; +} +.wall-item-container.comment .wall-item-photo { + width: 32px; + height: 32px; + margin-left: 16px; +} +.wall-item-container.comment .wall-item-photo-menu-button { + top: 13px !important; + left: 10px !important; +} -- cgit v1.2.3 From ec4061e6feb5be540136cf79ea4cbd048ae4d047 Mon Sep 17 00:00:00 2001 From: Fabio Comuni Date: Mon, 26 Sep 2011 11:50:48 +0200 Subject: quattro: fix star --- view/theme/quattro/quattro.less | 2 ++ view/theme/quattro/style.css | 3 +++ 2 files changed, 5 insertions(+) (limited to 'view/theme/quattro') diff --git a/view/theme/quattro/quattro.less b/view/theme/quattro/quattro.less index e96095c24..95dd61adb 100644 --- a/view/theme/quattro/quattro.less +++ b/view/theme/quattro/quattro.less @@ -263,6 +263,8 @@ section { margin-bottom: 20px; } .wall-item-decor { position: absolute; left: 790px; top: -10px; width: 16px;} +.unstarred { display: none; } + .wall-item-container { display: table; width: 780px; diff --git a/view/theme/quattro/style.css b/view/theme/quattro/style.css index a6ea35869..ad50ee327 100644 --- a/view/theme/quattro/style.css +++ b/view/theme/quattro/style.css @@ -501,6 +501,9 @@ section { top: -10px; width: 16px; } +.unstarred { + display: none; +} .wall-item-container { display: table; width: 780px; -- cgit v1.2.3