<?php /** * CSS buttons * * @package Elgg.Core * @subpackage UI */ ?> /* ************************** BUTTONS ************************** */ /* Base */ .elgg-button { font-size: 14px; font-weight: bold; -webkit-border-radius: 5px; -moz-border-radius: 5px; width: auto; padding: 2px 4px; cursor: pointer; outline: none; -webkit-box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.40); -moz-box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.40); } a.elgg-button { padding: 3px 6px; } /* Submit: This button should convey, "you're about to take some definitive action" */ .elgg-button-submit { color: white; text-shadow: 1px 1px 0px black; text-decoration: none; border: 1px solid #4690d6; background-color: #4690d6; background-image: url(<?php echo elgg_get_site_url(); ?>_graphics/button_graduation.png); background-repeat: repeat-x; background-position: left 10px; } .elgg-button-submit:hover { border-color: #0054a7; text-decoration: none; color: white; background-color: #0054a7; background-image: url(<?php echo elgg_get_site_url(); ?>_graphics/button_graduation.png); background-repeat: repeat-x; background-position: left 10px; } /* Cancel: This button should convey a negative but easily reversible action (e.g., turning off a plugin) */ .elgg-button-cancel { color: #333333; background-color: #dddddd; background-image: url(<?php echo elgg_get_site_url(); ?>_graphics/button_graduation.png); background-repeat: repeat-x; background-position: left 10px; border: 1px solid #999999; } .elgg-button-cancel:hover { color: #444444; background-color: #999999; background-position: left 10px; text-decoration: none; } /* Action: This button should convey a normal, inconsequential action, such as clicking a link */ .elgg-button-action { background-color:#cccccc; background-image: url(<?php echo elgg_get_site_url(); ?>_graphics/button_background.gif); background-repeat: repeat-x; background-position: 0 0; border:1px solid #999999; color: #333333; padding: 2px 15px 2px 15px; text-align: center; font-weight: bold; text-decoration: none; text-shadow: 0 1px 0 white; cursor: pointer; -webkit-border-radius: 5px; -moz-border-radius: 5px; -webkit-box-shadow: none; -moz-box-shadow: none; } .elgg-button-action:hover, .elgg-button-action:focus { background-position: 0 -15px; background-image: url(<?php echo elgg_get_site_url(); ?>_graphics/button_background.gif); background-repeat: repeat-x; color: #111111; text-decoration: none; background-color: #cccccc; border: 1px solid #999999; } /* Delete: This button should convey "be careful before you click me" */ .elgg-button-delete { color: #bbbbbb; text-decoration: none; border: 1px solid #333333; background-color: #555555; background-image: url(<?php echo elgg_get_site_url(); ?>_graphics/button_graduation.png); background-repeat: repeat-x; background-position: left 10px; text-shadow: 1px 1px 0px black; } .elgg-button-delete:hover { color: #999999; background-color: #333333; background-position: left 10px; text-decoration: none; } .elgg-button-dropdown { padding:3px 6px; text-decoration:none; display:block; font-weight:bold; position:relative; margin-left:0; color: white; border:1px solid #71B9F7; -webkit-border-radius:4px; -moz-border-radius:4px; border-radius:4px; -webkit-box-shadow: 0 0 0; -moz-box-shadow: 0 0 0; /*background-image:url(<?php echo elgg_get_site_url(); ?>_graphics/elgg_sprites.png); background-position:-150px -51px; background-repeat:no-repeat;*/ } .elgg-button-dropdown:after { content: " \25BC "; font-size:smaller; } .elgg-button-dropdown:hover { background-color:#71B9F7; text-decoration:none; } .elgg-button-dropdown.elgg-state-active { background: #cccccc; outline: none; color: #333333; border:1px solid #cccccc; -webkit-border-radius:4px 4px 0 0; -moz-border-radius:4px 4px 0 0; border-radius:4px 4px 0 0; }