annotate StoneWebViewer/Resources/Styles/_button.scss @ 1526:61023b0d39c8

Reverted the Stone Web Viewer plugin to rev. 307a805d0587 (mistakenly changed to serve the RT Viewer and make it available in the Orthanc Explorer while it should have been done in a separate plugin)
author Benjamin Golinvaux <bgo@osimis.io>
date Sun, 02 Aug 2020 13:53:48 +0200
parents fb74ed5d8c22
children
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
rev   line source
1495
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
1 // clean icon buttons
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
2 .wvButton {
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
3 // Remove <a> default styles. Take care - this class may either be used
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
4 // with <a> or <button>.
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
5 &:hover {
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
6 text-decoration: none;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
7 color: white;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
8 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
9
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
10 // Remove <button> default styles.
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
11 outline: none;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
12 background-color: transparent;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
13 border: none;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
14 border-radius: 0;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
15
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
16 // Set relative to position button absolutely
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
17 position: relative;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
18
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
19 // Style button
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
20 display: inline-block;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
21 cursor: pointer;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
22 font-variant: small-caps;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
23 text-transform: lowercase;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
24 text-align: center;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
25 font-size: 1.3rem;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
26 font-weight: 400;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
27 color: hsl(0, 0%, 85%);
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
28 transition: 0.3s text-decoration ease, 0.3s border ease, 0.3s opacity ease;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
29
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
30 // Position button
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
31 margin: 0;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
32 min-width: 3rem;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
33 padding: 0 10px;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
34 line-height: 3.6rem;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
35 &.wvLargeButton{
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
36 font-size: 2rem;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
37 line-height: 6.2rem;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
38 padding: 0 20px;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
39 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
40 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
41
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
42 .wvButton--rotate {
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
43 @extend .wvButton;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
44 // Rotate only the icon
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
45 &:before, &:after{
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
46 transform: rotate(90deg);
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
47 display: inline-block;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
48 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
49
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
50 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
51
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
52 .wvButton--vflip {
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
53 @extend .wvButton;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
54 // flip only the icon
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
55 &:before, &:after{
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
56 transform: scaleX(-1);
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
57 display: inline-block;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
58 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
59
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
60 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
61
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
62 // button w/ blue underline
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
63 .wvButton--underline, .fa.wvButton--underline {
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
64 @extend .wvButton;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
65
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
66 position: relative;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
67
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
68 background-color:inherit;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
69 text-decoration: none;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
70 text-align:left;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
71 font-size: 1.2rem;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
72 &.wvLargeButton{
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
73 font-size: 2rem;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
74 width: 6.4rem;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
75 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
76 * {
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
77 pointer-events: none;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
78 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
79 &:hover, &:active, &:focus{
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
80 outline:0;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
81 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
82
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
83 width: 3.2rem;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
84 vertical-align: middle;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
85 color:white;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
86 opacity: 0.75;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
87 border:none;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
88 border-bottom: 2px solid rgba(255,255,255,0.1);
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
89 &:hover, &:focus{
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
90 border-color: rgba(255,255,255,1);
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
91 opacity:1;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
92 .wvButton__bottomTriangle{
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
93 border-left-color: rgba(255,255,255,1);
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
94 &.toggled{
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
95 // border-color: rgba(255, 255, 255, 1);
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
96 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
97 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
98 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
99 &.active{
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
100 opacity: 1;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
101 border-color: $primary;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
102 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
103
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
104 // Make sure the 2px border is not hidden by viewports and other parts of
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
105 // the layout (.glyphicon class sets top to 1px)
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
106 top: 0px;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
107
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
108 // Compensate glyphicon whitespace
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
109 &::before {
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
110 position: relative;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
111 top: -1px;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
112 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
113
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
114 // Adapt font-awesome icon to glyphicon styles
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
115 &.fa {
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
116 top: 0px;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
117 font-weight: 800;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
118 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
119 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
120
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
121 .wvButton__bottomTriangle{
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
122 transition: 0.3s border ease, 0.3s opacity ease;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
123
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
124 display:block;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
125 position: absolute;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
126 bottom:0;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
127 left:0;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
128
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
129 width: 0;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
130 height: 0;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
131 border-style: solid;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
132 border-width: 10px 0 0 10px;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
133 border-color: transparent transparent transparent rgba(255,255,255,0.1);
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
134 &.active{
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
135 border-color: transparent transparent transparent $primary !important;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
136 &.toggled{
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
137 border-left-color: $primary !important;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
138 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
139 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
140 &.toggled{
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
141 // border-width: 15px 0 0 15px;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
142 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
143 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
144
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
145 // button w/ border
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
146 .wvButton--border {
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
147 @extend .wvButton;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
148
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
149 // Prevent multi line buttons.
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
150 max-height: calc(2.8rem - 3px);
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
151 max-width: 100%;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
152 overflow: hidden;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
153
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
154 // Set margin
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
155 margin: 0.6rem;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
156 margin-left: 0rem;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
157 margin-right: 0rem;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
158 & + & {
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
159 margin-left: 0.7rem;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
160 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
161
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
162 // Set button size
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
163 line-height: 2rem;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
164
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
165 // Align text
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
166 padding-top: 0.1rem;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
167 padding-bottom: 0.5rem;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
168
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
169 // Style button
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
170 font-size: 1.4rem;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
171 border: 1px solid hsl(0, 0%, 27%);
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
172
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
173 // Set best looking font with small-caps.
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
174 font-family: Arial;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
175
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
176 // Change background on hover
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
177 background-color: hsl(0, 0%, 0%);
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
178 &:hover {
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
179 background-color: hsl(0, 0%, 10%);
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
180 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
181
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
182 & > .glyphicon { // used with the same element as glyphicons
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
183 // Position button
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
184 position: relative;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
185 display: inline-block;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
186 top: 3px;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
187 margin-right: 4px;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
188 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
189 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
190
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
191 // button w/ border + white modifier to use when the background is white.
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
192 .wvButton--borderAndWhite {
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
193 @extend .wvButton--border;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
194
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
195 // Text color
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
196 color: hsl(0, 0%, 10%);
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
197 border: 1px solid hsl(0, 0%, 73%);
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
198
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
199 // Change background on hover
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
200 background-color: hsl(0, 0%, 100%);
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
201 &:hover {
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
202 color: hsl(0, 0%, 10%);
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
203 background-color: hsl(0, 0%, 90%);
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
204 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
205 }