244 lines
		
	
	
		
			5.1 KiB
		
	
	
	
		
			CSS
		
	
	
	
	
	
			
		
		
	
	
			244 lines
		
	
	
		
			5.1 KiB
		
	
	
	
		
			CSS
		
	
	
	
	
	
| /* 
 | |
|   Algo: a dekstop environment look-a-like in your web browser
 | |
|   Copyright (C) 2009  Niels Serup
 | |
|   
 | |
| 	This file is part of Algo.
 | |
| 
 | |
| 	Algo 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 3 of the License, or
 | |
| 	(at your option) any later version.
 | |
| 
 | |
| 	Algo 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 Algo.  If not, see <http://www.gnu.org/licenses/>.
 | |
| */
 | |
| 
 | |
| /* Standard stuff
 | |
|    This file holds all standard css stuff that must not
 | |
|    (and cannot) be changed in any css theme file. */
 | |
| 
 | |
| * {
 | |
|   margin: 0;
 | |
|   padding: 0;
 | |
|   font-size: 12px;
 | |
|   font-family: 'dejavu sans' arial;
 | |
| }
 | |
| 
 | |
| body {
 | |
|   overflow: hidden;
 | |
| }
 | |
| 
 | |
| /* Navigation bar (normally there are two navigation bars - 
 | |
|    one at the top of the page and one at the bottom of the page). */
 | |
| .navbar {
 | |
|   position: absolute;
 | |
|   z-index: 100;
 | |
|   width: 100%;
 | |
| }
 | |
| 
 | |
| /* Dropdowns */
 | |
| .dropdown {
 | |
|   display: block;
 | |
|   float: left;
 | |
|   position: relative;
 | |
| }
 | |
| 
 | |
| .dropdown * {
 | |
|   display: none;
 | |
|   position: relative;
 | |
| }
 | |
| 
 | |
| .dropdown .top {
 | |
|   display: block;
 | |
| }
 | |
| 
 | |
| .dropdown .group {
 | |
|   position: relative;
 | |
| }
 | |
| 
 | |
| .dropdown .entries {
 | |
|   position: absolute;
 | |
| }
 | |
| 
 | |
| .dropdown .entry, .dropdown .header {
 | |
|   overflow: hidden;
 | |
| }
 | |
| 
 | |
| .dropdown .side {
 | |
|   position: absolute;
 | |
| }
 | |
| 
 | |
| .dropdown:hover * {
 | |
|   display: block;
 | |
| }
 | |
| 
 | |
| .dropdown:hover .top {
 | |
|   position: relative;
 | |
| }
 | |
| 
 | |
| .dropdown:hover .entries {
 | |
|   display: none;
 | |
| }
 | |
| 
 | |
| .dropdown .group:hover > .entries {
 | |
|   display: block;
 | |
| }
 | |
| 
 | |
| /* When an entry in a dropdown list is clicked, the .dropdown class receives
 | |
|    another class: the .dropdownh class. This takes care of hiding the box. */
 | |
| .dropdownh *, .dropdownh:hover * {
 | |
|   display: none;
 | |
| }
 | |
| 
 | |
| 
 | |
| /* Area - the area where the windows are */
 | |
| .area {
 | |
|   position: absolute;
 | |
|   overflow: hidden;
 | |
| }
 | |
| 
 | |
| /* Windows */
 | |
| .window {
 | |
|   position: absolute;
 | |
| }
 | |
| 
 | |
| .window > * {
 | |
|   position: absolute;
 | |
|   top: 0;
 | |
|   left: 0;
 | |
| }
 | |
| 
 | |
| /* The handle is there, but it's transparent */
 | |
| .window > .handle {
 | |
|   background: #000;
 | |
|   filter: alpha(opacity=0);
 | |
|   -moz-opacity: 0;
 | |
|   opacity: 0;
 | |
| }
 | |
| 
 | |
| /* The following stuff features the divs around the window. */
 | |
| .window > .tl {
 | |
|   cursor: nw-resize;
 | |
| }
 | |
| 
 | |
| .window > .tr {
 | |
|   cursor: ne-resize;
 | |
| }
 | |
| 
 | |
| .window > .r {
 | |
|   cursor: e-resize;
 | |
| }
 | |
| 
 | |
| .window > .br {
 | |
|   cursor: se-resize;
 | |
| }
 | |
| 
 | |
| .window > .b {
 | |
|   cursor: s-resize;
 | |
| }
 | |
| 
 | |
| .window > .bl {
 | |
|   cursor: sw-resize;
 | |
| }
 | |
| 
 | |
| .window > .l {
 | |
|   cursor: w-resize;
 | |
| }
 | |
| 
 | |
| /* The .t class (the top, or header, of the window) is only for showing
 | |
|    a background image (read: css theme files). The .resize_handle acts as
 | |
|    the top resizer. */
 | |
| .window > .resize_handle {
 | |
|   cursor: n-resize;
 | |
| }
 | |
| 
 | |
| .window > .title {
 | |
|   overflow: hidden;
 | |
|   white-space: nowrap;
 | |
| }
 | |
| 
 | |
| /* .data is the object/iframe */
 | |
| .window > .data {
 | |
|   overflow: auto;
 | |
| }
 | |
| 
 | |
| /* .data_overlay is showed whenever moving or adjusting a window.
 | |
|    If it is not on, the object/iframe might catch focus of the mouse */
 | |
| .window > .data_overlay {
 | |
|   display: none;
 | |
|   background: #000;
 | |
|   filter: alpha(opacity=0);
 | |
|   -moz-opacity: 0;
 | |
|   opacity: 0;
 | |
| }
 | |
| 
 | |
| /* .options is the div that holds the minimize, maximize and close button */
 | |
| .window > .options > *, .window_max > .options > * {
 | |
|   position: absolute;
 | |
|   height: 100%;
 | |
| }
 | |
| 
 | |
| /* When a window is maximized, it receives a new class - the .window_max class
 | |
|    Resize cursors must not be visible when in maximized mode */
 | |
| .window_max > .tl, .window_max > .resize_handle, .window_max > .tr, .window_max > .r, .window_max > .br, .window_max > .b, .window_max > .bl, .window_max > .l, .nrsz > .tl, .nrsz > .resize_handle, .nrsz > .tr, .nrsz > .r, .nrsz > .br, .nrsz > .b, .nrsz > .bl, .nrsz > .l  {
 | |
|   cursor: default;
 | |
| }
 | |
| 
 | |
| /* .overlay is the general overlay that is displayed (yes, it's transparent)
 | |
|    whenever moving or adjusting a window. Same reasons as .data_overlay */
 | |
| .overlay {
 | |
|   display: none;
 | |
|   position: absolute;
 | |
|   width: 100%;
 | |
|   height: 100%;
 | |
|   background: #000;
 | |
|   filter: alpha(opacity=0);
 | |
|   -moz-opacity: 0;
 | |
|   opacity: 0;
 | |
| }
 | |
| 
 | |
| /* .appboxes holds information about the text boxes,
 | |
|    normally placed in the bottom navigation bar,
 | |
|    that show which windows are open */
 | |
| .appboxes * {
 | |
|   white-space: nowrap;
 | |
|   overflow: hidden;
 | |
| }
 | |
| 
 | |
| /* .abs is shown when there is not enough space for all appboxes on one line.
 | |
|    .scrollup and .scrolldown are the buttons used for scrolling. */
 | |
| .abs {
 | |
|   position: absolute;
 | |
|   top: 0;
 | |
|   right: 0;
 | |
|   height: 100%;
 | |
|   display: none;
 | |
| }
 | |
| 
 | |
| .scrollup {
 | |
|   width: 100%;
 | |
|   height: 50%;
 | |
|   position: absolute;
 | |
| }
 | |
| 
 | |
| .scrolldown {
 | |
|   width: 100%;
 | |
|   height: 50%;
 | |
|   position: absolute;
 | |
|   top: 50%;
 | |
| }
 | |
| 
 | |
| 
 | |
| /* .highlightfix is a fix needed (at least in Firefox).
 | |
|    When moving or adjusting a window, some text will
 | |
|    automatically turn highlighted. This fix fixes that. */
 | |
| .highlightfix {
 | |
|   position: absolute;
 | |
|   width: 1px;
 | |
|   height: 1px;
 | |
| } |