Gitiles
Code Review Sign In
gerrit.openbmc.org / openbmc / phosphor-webui / 6f4e12e3bcd0fda9775f1630557c40e8eddd8a2c / . / app / common / styles / base / buttons.scss
blob: 541d15e9b7bffe110e3f78faaa0a1036a1114600 [file] [log] [blame]
beccabroek44da4712019-03-20 13:24:23 -0500[diff] [blame]1button,
2.button,
3.submit {
Michael Davis19475752017-02-23 18:30:23 -0600[diff] [blame]4 font-size: 1em;
Michael Davis51946552017-05-01 10:30:38 -0500[diff] [blame]5 @include fontFamilyBold;
Michael Davis19475752017-02-23 18:30:23 -0600[diff] [blame]6 text-transform: none;
7 border-radius: 3px;
beccabroek44da4712019-03-20 13:24:23 -0500[diff] [blame]8 padding: 0.5rem 2rem 0.5rem;
Michael Davis19475752017-02-23 18:30:23 -0600[diff] [blame]9 height: auto;
Michael Davisc5626182017-03-10 15:48:05 -0600[diff] [blame]10 border: 0;
Michael Davis3a0d4712017-03-27 14:01:34 -0500[diff] [blame]11 overflow: hidden;
Michael Davis19475752017-02-23 18:30:23 -0600[diff] [blame]12 &:hover {
13 cursor: pointer;
14 }
Iftekharul Islam8947e702017-07-27 10:28:07 -0500[diff] [blame]15 &.disabled {
beccabroek44da4712019-03-20 13:24:23 -0500[diff] [blame]16 pointer-events: none;
Michael Davis0f03ad12017-02-27 16:54:18 -0600[diff] [blame]17 color: $btn__disabled-txt;
beccabroek44da4712019-03-20 13:24:23 -0500[diff] [blame]18 background-color: $btn__disabled-bg;
19 border-color: $btn__disabled-bg;
20 border-style: solid;
21 border-width: 2px;
Michael Davis19475752017-02-23 18:30:23 -0600[diff] [blame]22 &:hover {
23 cursor: default;
24 background: transparent;
Iftekharul Islam8947e702017-07-27 10:28:07 -0500[diff] [blame]25 text-decoration: none;
Michael Davis19475752017-02-23 18:30:23 -0600[diff] [blame]26 }
27 }
28}
29
Michael Davisc96980f2017-06-19 11:47:36 -0500[diff] [blame]30.btn-primary {
Michael Davis19475752017-02-23 18:30:23 -0600[diff] [blame]31 color: $primebtn__text;
32 background: $primebtn__bg;
Michael Davis51946552017-05-01 10:30:38 -0500[diff] [blame]33 min-height: 40px;
Michael Davis0f03ad12017-02-27 16:54:18 -0600[diff] [blame]34 &:hover {
Michael Davis5d014692017-03-02 13:37:40 -0600[diff] [blame]35 background: lighten($primebtn__bg, 8%);
Michael Davis0f03ad12017-02-27 16:54:18 -0600[diff] [blame]36 @include fastTransition-all;
37 }
38 &.disabled {
dixsie565efda2019-04-16 13:30:30 -0500[diff] [blame]39 background: $primebtn__disabled-bg;
40 color: $primebtn__disabled-txt;
Michael Davis0f03ad12017-02-27 16:54:18 -0600[diff] [blame]41 @include fastTransition-all;
42 &:hover {
43 cursor: default;
44 }
45 }
beccabroek44da4712019-03-20 13:24:23 -0500[diff] [blame]46 i {
47 //button symbol
Michael Davisc5626182017-03-10 15:48:05 -0600[diff] [blame]48 font-style: normal;
49 text-transform: none;
50 font-size: 1.5em;
51 transform: rotate(80deg);
52 display: inline-block;
53 }
beccabroek44da4712019-03-20 13:24:23 -0500[diff] [blame]54 img {
Michael Davisc5626182017-03-10 15:48:05 -0600[diff] [blame]55 width: 18px;
56 height: 18px;
57 display: inline-block;
58 }
Michael Davis19475752017-02-23 18:30:23 -0600[diff] [blame]59}
60.btn-secondary {
61 color: $secbtn__text;
Iftekharul Islam4390b022017-06-05 09:44:50 -0500[diff] [blame]62 background: transparent;
Michael Davis19475752017-02-23 18:30:23 -0600[diff] [blame]63 border: 2px solid $secbtn__border;
Michael Davis51946552017-05-01 10:30:38 -0500[diff] [blame]64 min-height: 40px;
Michael Davis19475752017-02-23 18:30:23 -0600[diff] [blame]65 &:hover {
beccabroekf6cdacf2019-03-11 13:47:00 -0500[diff] [blame]66 color: $secbtn__text;
Michael Davis19475752017-02-23 18:30:23 -0600[diff] [blame]67 cursor: pointer;
68 background: $secbtn__bg;
Michael Davis0f03ad12017-02-27 16:54:18 -0600[diff] [blame]69 @include fastTransition-all;
70 }
71 &.disabled {
beccabroek44da4712019-03-20 13:24:23 -0500[diff] [blame]72 pointer-events: none;
73 color: $btn__disabled-txt;
74 background-color: $btn__disabled-bg;
75 border-color: $btn__disabled-bg;
76 border-style: solid;
77 border-width: 2px;
Michael Davis0f03ad12017-02-27 16:54:18 -0600[diff] [blame]78 &:hover {
79 background: $btn__disabled-bg;
80 }
Michael Davis19475752017-02-23 18:30:23 -0600[diff] [blame]81 }
beccabroek44da4712019-03-20 13:24:23 -0500[diff] [blame]82 i {
83 // button symbol
Michael Davisc5626182017-03-10 15:48:05 -0600[diff] [blame]84 font-style: normal;
85 font-weight: 400;
86 text-transform: none;
87 font-size: 1.5em;
88 transform: rotate(80deg) translate(-2px);
89 display: inline-block;
90 vertical-align: middle;
91 }
beccabroek44da4712019-03-20 13:24:23 -0500[diff] [blame]92 img {
Michael Davisc5626182017-03-10 15:48:05 -0600[diff] [blame]93 width: 18px;
94 height: 18px;
95 display: inline-block;
beccabroek44da4712019-03-20 13:24:23 -0500[diff] [blame]96 margin-right: 0.5em;
Michael Davisc5626182017-03-10 15:48:05 -0600[diff] [blame]97 margin-top: -3px;
98 }
Michael Davis19475752017-02-23 18:30:23 -0600[diff] [blame]99}
Michael Davis51946552017-05-01 10:30:38 -0500[diff] [blame]100
101.btn-pop-out {
102 position: relative;
103 padding: 0 0 1em 2em;
104 color: $black;
105 &:hover {
106 text-decoration: underline;
107 }
108 &:before {
beccabroek44da4712019-03-20 13:24:23 -0500[diff] [blame]109 content: "";
Michael Davis51946552017-05-01 10:30:38 -0500[diff] [blame]110 position: absolute;
111 left: 0;
Michael Davisf0504852017-07-27 15:42:39 -0500[diff] [blame]112 top: 0px;
Michael Davis51946552017-05-01 10:30:38 -0500[diff] [blame]113 width: 25px;
114 height: 20px;
115 display: inline-block;
116 border: 1px solid $black;
117 border-top: 4px solid $black;
118 }
119 &:after {
beccabroek44da4712019-03-20 13:24:23 -0500[diff] [blame]120 content: "\2794";
Michael Davis51946552017-05-01 10:30:38 -0500[diff] [blame]121 position: absolute;
122 transform: rotate(-45deg);
beccabroek44da4712019-03-20 13:24:23 -0500[diff] [blame]123 font-size: 0.9em;
Michael Davis51946552017-05-01 10:30:38 -0500[diff] [blame]124 font-weight: 700;
125 vertical-align: middle;
126 display: inline-block;
127 left: 11px;
Iftekharul Islamdb28a382017-11-02 13:16:17 -0500[diff] [blame]128 top: 0px;
Michael Davis51946552017-05-01 10:30:38 -0500[diff] [blame]129 }
beccabroek44da4712019-03-20 13:24:23 -0500[diff] [blame]130}