-// Generic helper classes that could be used in many elements/layouts
-
-// --------------------------------------------------------------------------
-// Positioning
-// --------------------------------------------------------------------------
-
-@import "../mixins/utilities";
+// Utilities
+//
+// Other things which effect the behaviour of components
+//
+// Styleguide 4.
+// Flush left
+//
+// Used when you want to push an element to the left of its containing element
+//
+// Markup:
+// <div class="mw-ui-vform-field">
+// <label>Username <a href="#" class="mw-ui-flush-left">?</a></label>
+// <input>
+// </div>
+//
+// Styleguide 4.1.
.mw-ui-flush-left {
- .agora-flush-left();
+ float: left;
+ margin-left: 0;
+ padding-left: 0;
}
+// Flush right
+//
+// Used when you want to push an element to the right of its containing element
+//
+// Markup:
+// <div class="mw-ui-vform-field">
+// <label>Username <a href="#" class="mw-ui-flush-right">?</a></label>
+// <input>
+// </div>
+//
+// Styleguide 4.2.
.mw-ui-flush-right {
- .agora-flush-right();
+ float: right;
+ padding-right: 0;
+ margin-right: 0;
}
+// Center block
+//
+// Centers the element in its containing element
+//
+// Markup:
+// <div>
+// <button class="mw-ui-center-block">click me</button>
+// </div>
+//
+// Styleguide 4.3.
.mw-ui-center-block {
- .agora-center-block();
+ display: block;
+ margin-left: auto;
+ margin-right: auto;
}