Initial coomit for AAI-UI(sparky-fe)
[aai/sparky-fe.git] / resources / scss / bootstrap / _scaffolding.scss
1 //
2 // Scaffolding
3 // --------------------------------------------------
4
5 // Reset the box-sizing
6 //
7 // Heads up! This reset may cause conflicts with some third-party widgets.
8 // For recommendations on resolving such conflicts, see
9 // http://getbootstrap.com/getting-started/#third-box-sizing
10 * {
11   @include box-sizing(border-box);
12 }
13
14 *:before,
15 *:after {
16   @include box-sizing(border-box);
17 }
18
19 // Body reset
20
21 html {
22   font-size: 10px;
23   -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
24 }
25
26 body {
27   font-family: $font-family-base;
28   font-size: $font-size-base;
29   line-height: $line-height-base;
30   color: $text-color;
31   background-color: $body-bg;
32 }
33
34 // Reset fonts for relevant elements
35 input,
36 button,
37 select,
38 textarea {
39   font-family: inherit;
40   font-size: inherit;
41   line-height: inherit;
42 }
43
44 // Links
45
46 a {
47   color: $link-color;
48   text-decoration: none;
49
50   &:hover,
51   &:focus {
52         color: $link-hover-color;
53         text-decoration: $link-hover-decoration;
54   }
55
56   &:focus {
57         @include tab-focus;
58   }
59 }
60
61 // Figures
62 //
63 // We reset this here because previously Normalize had no `figure` margins. This
64 // ensures we don't break anyone's use of the element.
65
66 figure {
67   margin: 0;
68 }
69
70 // Images
71
72 img {
73   vertical-align: middle;
74 }
75
76 // Responsive images (ensure images don't scale beyond their parents)
77 .img-responsive {
78   @include img-responsive;
79 }
80
81 // Rounded corners
82 .img-rounded {
83   border-radius: $border-radius-large;
84 }
85
86 // Image thumbnails
87 //
88 // Heads up! This is mixin-ed into thumbnails.less for `.thumbnail`.
89 .img-thumbnail {
90   padding: $thumbnail-padding;
91   line-height: $line-height-base;
92   background-color: $thumbnail-bg;
93   border: 1px solid $thumbnail-border;
94   border-radius: $thumbnail-border-radius;
95   @include transition(all .2s ease-in-out);
96
97   // Keep them at most 100% wide
98   @include img-responsive(inline-block);
99 }
100
101 // Perfect circle
102 .img-circle {
103   border-radius: 50%; // set radius in percents
104 }
105
106 // Horizontal rules
107
108 hr {
109   margin-top: $line-height-computed;
110   margin-bottom: $line-height-computed;
111   border: 0;
112   border-top: 1px solid $hr-border;
113 }
114
115 // Only display content to screen readers
116 //
117 // See: http://a11yproject.com/posts/how-to-hide-content/
118
119 .sr-only {
120   position: absolute;
121   width: 1px;
122   height: 1px;
123   margin: -1px;
124   padding: 0;
125   overflow: hidden;
126   clip: rect(0, 0, 0, 0);
127   border: 0;
128 }
129
130 // Use in conjunction with .sr-only to only display content when it's focused.
131 // Useful for "Skip to main content" links; see http://www.w3.org/TR/2013/NOTE-WCAG20-TECHS-20130905/G1
132 // Credit: HTML5 Boilerplate
133
134 .sr-only-focusable {
135   &:active,
136   &:focus {
137         position: static;
138         width: auto;
139         height: auto;
140         margin: 0;
141         overflow: visible;
142         clip: auto;
143   }
144 }
145
146 // iOS "clickable elements" fix for role="button"
147 //
148 // Fixes "clickability" issue (and more generally, the firing of events such as focus as well)
149 // for traditionally non-focusable elements with role="button"
150 // see https://developer.mozilla.org/en-US/docs/Web/Events/click#Safari_Mobile
151
152 [role="button"] {
153   cursor: pointer;
154 }

© 2017 ONAP. Copyright © The Linux Foundation ®. All Rights Reserved.
The Linux Foundation has registered trademarks and uses trademarks.
For a list of trademarks of The Linux Foundation, please see our Trademark Usage page.
Linux is a registered trademark of Linus Torvalds.
Privacy Policy and Terms of Use