off-canvas.button.css
Visual styling for buttons in the off-canvas dialog.
See also
seven/css/components/buttons.css
File
-
core/
themes/ stable/ css/ core/ dialog/ off-canvas.button.css
View source
- /**
- * @file
- * Visual styling for buttons in the off-canvas dialog.
- *
- * @see seven/css/components/buttons.css
- */
-
- #drupal-off-canvas button,
- #drupal-off-canvas .button {
- margin: 0 0 10px;
- padding: 0;
- cursor: pointer;
- text-decoration: none;
- text-transform: none;
- border: 0;
- box-shadow: none;
- font-family: "Lucida Grande", "Lucida Sans Unicode", "liberation sans", sans-serif;
- line-height: normal;
- -webkit-appearance: none;
- -moz-appearance: none;
- }
- #drupal-off-canvas button.link {
- display: inline;
- transition: color 0.5s ease;
- color: #85bef4;
- background: transparent;
- font-size: 14px;
- }
- #drupal-off-canvas button.link:hover,
- #drupal-off-canvas button.link:focus {
- text-decoration: none;
- color: #46a0f5;
- }
- #drupal-off-canvas input[type="submit"].button {
- position: relative;
- display: inline-block;
- width: 100%;
- height: auto;
- padding: 4px 20px;
- cursor: pointer;
- transition: background 0.5s ease;
- text-align: center;
- color: #f5f5f5;
- border: 0;
- border-radius: 20em;
- background: #777;
- font-size: 14px;
- font-weight: 600;
- }
- #drupal-off-canvas input[type="submit"].button:hover,
- #drupal-off-canvas input[type="submit"].button:focus,
- #drupal-off-canvas input[type="submit"].button:active {
- z-index: 10;
- text-decoration: none;
- color: #fff;
- border: 0;
- outline: none;
- }
- #drupal-off-canvas input[type="submit"].button:focus,
- #drupal-off-canvas input[type="submit"].button:active {
- box-shadow: 0 3px 3px 2px rgba(0, 0, 0, 0.1);
- }
- #drupal-off-canvas input[type="submit"].button--primary {
- margin-top: 15px;
- color: #fff;
- border: 0;
- background: #277abd;
- }
- #drupal-off-canvas input[type="submit"].button--primary:hover,
- #drupal-off-canvas input[type="submit"].button--primary:focus,
- #drupal-off-canvas input[type="submit"].button--primary:active {
- outline: none;
- background: #236aaf;
- }
- #drupal-off-canvas .button-action:before {
- margin-left: -0.2em; /* LTR */
- padding-right: 0.2em; /* LTR */
- font-size: 14px;
- line-height: 16px;
- }
- [dir="rtl"] #drupal-off-canvas .button-action:before {
- margin-right: -0.2em;
- margin-left: 0;
- padding-right: 0;
- padding-left: 0.2em;
- }
- #drupal-off-canvas .no-touchevents .button--small {
- padding: 2px 1em;
- font-size: 13px;
- }
- #drupal-off-canvas .button:disabled,
- #drupal-off-canvas .button:disabled:active,
- #drupal-off-canvas .button.is-disabled,
- #drupal-off-canvas .button.is-disabled:active {
- cursor: default;
- color: #5c5c5c;
- border: 0;
- background: #555;
- font-weight: normal;
- }
- #drupal-off-canvas .button--danger {
- text-decoration: none;
- color: #c72100;
- border-radius: 0;
- font-weight: 400;
- }
- #drupal-off-canvas .button--danger:hover,
- #drupal-off-canvas .button--danger:focus,
- #drupal-off-canvas .button--danger:active {
- text-decoration: none;
- color: #ff2a00;
- text-shadow: none;
- }
- #drupal-off-canvas .button--danger:disabled,
- #drupal-off-canvas .button--danger.is-disabled {
- cursor: default;
- color: #737373;
- }
Buggy or inaccurate documentation? Please file an issue. Need support? Need help programming? Connect with the Drupal community.