rtl tweaks
Julian Lam
8 years ago
parent
b94085f9c3
commit
36a3dcd3b7
@ -1,34 +0,0 @@
|
||||
|
||||
//
|
||||
// Right-to-Left for Bootstrap 3.0.0
|
||||
// Morteza Ansarinia <ansarinia@me.com>
|
||||
// --------------------------------------------------
|
||||
|
||||
// Original LESS files from the latest bootstrap
|
||||
@import "../bootstrap/variables.less";
|
||||
@import "../bootstrap/mixins.less";
|
||||
|
||||
// Core RTL CSS
|
||||
@import "type-rtl.less";
|
||||
|
||||
// Right-to-left the original bootstrap - to be removed
|
||||
@import "merged-rtl.less";
|
||||
|
||||
// Button groups
|
||||
@import "button-groups-rtl.less";
|
||||
|
||||
// Right-to-left the grid system
|
||||
@import "grid-rtl.less";
|
||||
|
||||
// List groups and badges inside them
|
||||
@import "list-group-rtl.less";
|
||||
|
||||
// Components
|
||||
@import "pagination-rtl.less";
|
||||
@import "pager-rtl.less";
|
||||
|
||||
// Components w/ JavaScript
|
||||
@import "carousel-rtl.less";
|
||||
|
||||
// Theme for visual enhancement
|
||||
@import "theme.less";
|
||||
@ -1,71 +0,0 @@
|
||||
//
|
||||
// Button groups
|
||||
// --------------------------------------------------
|
||||
|
||||
// Make the div behave like a button
|
||||
.btn-group,
|
||||
.btn-group-vertical {
|
||||
> .btn {
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
|
||||
// Prevent double borders when buttons are next to each other
|
||||
.btn-group {
|
||||
.btn + .btn,
|
||||
.btn + .btn-group,
|
||||
.btn-group + .btn,
|
||||
.btn-group + .btn-group {
|
||||
margin-right: -1px;
|
||||
}
|
||||
}
|
||||
|
||||
// Optional: Group multiple button groups together for a toolbar
|
||||
.btn-toolbar {
|
||||
margin-right: -5px; // Offset the first child's margin
|
||||
|
||||
.btn-group,
|
||||
.input-group {
|
||||
float: right;
|
||||
}
|
||||
> .btn,
|
||||
> .btn-group,
|
||||
> .input-group {
|
||||
margin-right: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
// Set corners individual because sometimes a single button can be in a .btn-group and we need :first-child and :last-child to both match
|
||||
.btn-group > .btn:first-child {
|
||||
margin-right: 0;
|
||||
&:not(:last-child):not(.dropdown-toggle) {
|
||||
.border-left-radius(0);
|
||||
.border-right-radius(@border-radius-base);
|
||||
}
|
||||
}
|
||||
// Need .dropdown-toggle since :last-child doesn't apply given a .dropdown-menu immediately after it
|
||||
.btn-group > .btn:last-child:not(:first-child),
|
||||
.btn-group > .dropdown-toggle:not(:first-child) {
|
||||
.border-right-radius(0);
|
||||
.border-left-radius(@border-radius-base);
|
||||
}
|
||||
|
||||
// Custom edits for including btn-groups within btn-groups (useful for including dropdown buttons within a btn-group)
|
||||
.btn-group > .btn-group {
|
||||
float: right;
|
||||
}
|
||||
.btn-group > .btn-group:not(:first-child):not(:last-child) > .btn {
|
||||
/*border-radius: 0;*/
|
||||
}
|
||||
.btn-group > .btn-group:first-child {
|
||||
> .btn:last-child,
|
||||
> .dropdown-toggle {
|
||||
.border-left-radius(0);
|
||||
.border-right-radius(@border-radius-base);
|
||||
}
|
||||
}
|
||||
.btn-group > .btn-group:last-child > .btn:first-child {
|
||||
.border-right-radius(0);
|
||||
.border-left-radius(@border-radius-base);
|
||||
|
||||
}
|
||||
@ -1,9 +0,0 @@
|
||||
//
|
||||
// TODO: Carousel
|
||||
// --------------------------------------------------
|
||||
|
||||
.carousel-inner {
|
||||
> .item {
|
||||
.transition(.6s ease-in-out left);
|
||||
}
|
||||
}
|
||||
@ -1,385 +0,0 @@
|
||||
//
|
||||
// Grid system
|
||||
// --------------------------------------------------
|
||||
|
||||
|
||||
// Set the container width, and override it for fixed navbars in media queries
|
||||
.container {
|
||||
.container-fixed();
|
||||
}
|
||||
|
||||
// Mobile-first defaults
|
||||
.row {
|
||||
.make-row();
|
||||
}
|
||||
|
||||
// Common styles for small and large grid columns
|
||||
.col-xs-1,
|
||||
.col-xs-2,
|
||||
.col-xs-3,
|
||||
.col-xs-4,
|
||||
.col-xs-5,
|
||||
.col-xs-6,
|
||||
.col-xs-7,
|
||||
.col-xs-8,
|
||||
.col-xs-9,
|
||||
.col-xs-10,
|
||||
.col-xs-11,
|
||||
.col-xs-12,
|
||||
.col-sm-1,
|
||||
.col-sm-2,
|
||||
.col-sm-3,
|
||||
.col-sm-4,
|
||||
.col-sm-5,
|
||||
.col-sm-6,
|
||||
.col-sm-7,
|
||||
.col-sm-8,
|
||||
.col-sm-9,
|
||||
.col-sm-10,
|
||||
.col-sm-11,
|
||||
.col-sm-12,
|
||||
.col-md-1,
|
||||
.col-md-2,
|
||||
.col-md-3,
|
||||
.col-md-4,
|
||||
.col-md-5,
|
||||
.col-md-6,
|
||||
.col-md-7,
|
||||
.col-md-8,
|
||||
.col-md-9,
|
||||
.col-md-10,
|
||||
.col-md-11,
|
||||
.col-md-12,
|
||||
.col-lg-1,
|
||||
.col-lg-2,
|
||||
.col-lg-3,
|
||||
.col-lg-4,
|
||||
.col-lg-5,
|
||||
.col-lg-6,
|
||||
.col-lg-7,
|
||||
.col-lg-8,
|
||||
.col-lg-9,
|
||||
.col-lg-10,
|
||||
.col-lg-11,
|
||||
.col-lg-12 {
|
||||
position: relative;
|
||||
// Prevent columns from collapsing when empty
|
||||
min-height: 1px;
|
||||
// Inner gutter via padding
|
||||
padding-left: (@grid-gutter-width / 2);
|
||||
padding-right: (@grid-gutter-width / 2);
|
||||
margin-left:0;
|
||||
}
|
||||
|
||||
|
||||
// Extra small grid
|
||||
//
|
||||
// Grid classes for extra small devices like smartphones. No offset, push, or
|
||||
// pull classes are present here due to the size of the target.
|
||||
//
|
||||
// Note that `.col-xs-12` doesn't get floated on purpose—there's no need since
|
||||
// it's full-width.
|
||||
|
||||
.col-xs-1,
|
||||
.col-xs-2,
|
||||
.col-xs-3,
|
||||
.col-xs-4,
|
||||
.col-xs-5,
|
||||
.col-xs-6,
|
||||
.col-xs-7,
|
||||
.col-xs-8,
|
||||
.col-xs-9,
|
||||
.col-xs-10,
|
||||
.col-xs-11 {
|
||||
float: right;
|
||||
}
|
||||
.col-xs-1 { width: percentage((1 / @grid-columns)); }
|
||||
.col-xs-2 { width: percentage((2 / @grid-columns)); }
|
||||
.col-xs-3 { width: percentage((3 / @grid-columns)); }
|
||||
.col-xs-4 { width: percentage((4 / @grid-columns)); }
|
||||
.col-xs-5 { width: percentage((5 / @grid-columns)); }
|
||||
.col-xs-6 { width: percentage((6 / @grid-columns)); }
|
||||
.col-xs-7 { width: percentage((7 / @grid-columns)); }
|
||||
.col-xs-8 { width: percentage((8 / @grid-columns)); }
|
||||
.col-xs-9 { width: percentage((9 / @grid-columns)); }
|
||||
.col-xs-10 { width: percentage((10/ @grid-columns)); }
|
||||
.col-xs-11 { width: percentage((11/ @grid-columns)); }
|
||||
.col-xs-12 { width: 100%; }
|
||||
|
||||
|
||||
// Small grid
|
||||
//
|
||||
// Columns, offsets, pushes, and pulls for the small device range, from phones
|
||||
// to tablets.
|
||||
//
|
||||
// Note that `.col-sm-12` doesn't get floated on purpose—there's no need since
|
||||
// it's full-width.
|
||||
|
||||
@media (min-width: @screen-tablet) {
|
||||
.container {
|
||||
max-width: @container-tablet;
|
||||
}
|
||||
|
||||
.col-sm-1,
|
||||
.col-sm-2,
|
||||
.col-sm-3,
|
||||
.col-sm-4,
|
||||
.col-sm-5,
|
||||
.col-sm-6,
|
||||
.col-sm-7,
|
||||
.col-sm-8,
|
||||
.col-sm-9,
|
||||
.col-sm-10,
|
||||
.col-sm-11 {
|
||||
float: right;
|
||||
}
|
||||
.col-sm-1 { width: percentage((1 / @grid-columns)); }
|
||||
.col-sm-2 { width: percentage((2 / @grid-columns)); }
|
||||
.col-sm-3 { width: percentage((3 / @grid-columns)); }
|
||||
.col-sm-4 { width: percentage((4 / @grid-columns)); }
|
||||
.col-sm-5 { width: percentage((5 / @grid-columns)); }
|
||||
.col-sm-6 { width: percentage((6 / @grid-columns)); }
|
||||
.col-sm-7 { width: percentage((7 / @grid-columns)); }
|
||||
.col-sm-8 { width: percentage((8 / @grid-columns)); }
|
||||
.col-sm-9 { width: percentage((9 / @grid-columns)); }
|
||||
.col-sm-10 { width: percentage((10/ @grid-columns)); }
|
||||
.col-sm-11 { width: percentage((11/ @grid-columns)); }
|
||||
.col-sm-12 { width: 100%; }
|
||||
|
||||
// Push and pull columns for source order changes
|
||||
.col-sm-push-1 { right: percentage((1 / @grid-columns)); }
|
||||
.col-sm-push-2 { right: percentage((2 / @grid-columns)); }
|
||||
.col-sm-push-3 { right: percentage((3 / @grid-columns)); }
|
||||
.col-sm-push-4 { right: percentage((4 / @grid-columns)); }
|
||||
.col-sm-push-5 { right: percentage((5 / @grid-columns)); }
|
||||
.col-sm-push-6 { right: percentage((6 / @grid-columns)); }
|
||||
.col-sm-push-7 { right: percentage((7 / @grid-columns)); }
|
||||
.col-sm-push-8 { right: percentage((8 / @grid-columns)); }
|
||||
.col-sm-push-9 { right: percentage((9 / @grid-columns)); }
|
||||
.col-sm-push-10 { right: percentage((10/ @grid-columns)); }
|
||||
.col-sm-push-11 { right: percentage((11/ @grid-columns)); }
|
||||
|
||||
.col-sm-pull-1 { left: percentage((1 / @grid-columns)); }
|
||||
.col-sm-pull-2 { left: percentage((2 / @grid-columns)); }
|
||||
.col-sm-pull-3 { left: percentage((3 / @grid-columns)); }
|
||||
.col-sm-pull-4 { left: percentage((4 / @grid-columns)); }
|
||||
.col-sm-pull-5 { left: percentage((5 / @grid-columns)); }
|
||||
.col-sm-pull-6 { left: percentage((6 / @grid-columns)); }
|
||||
.col-sm-pull-7 { left: percentage((7 / @grid-columns)); }
|
||||
.col-sm-pull-8 { left: percentage((8 / @grid-columns)); }
|
||||
.col-sm-pull-9 { left: percentage((9 / @grid-columns)); }
|
||||
.col-sm-pull-10 { left: percentage((10/ @grid-columns)); }
|
||||
.col-sm-pull-11 { left: percentage((11/ @grid-columns)); }
|
||||
|
||||
// Offsets
|
||||
.col-sm-offset-1 { margin-right: percentage((1 / @grid-columns)); }
|
||||
.col-sm-offset-2 { margin-right: percentage((2 / @grid-columns)); }
|
||||
.col-sm-offset-3 { margin-right: percentage((3 / @grid-columns)); }
|
||||
.col-sm-offset-4 { margin-right: percentage((4 / @grid-columns)); }
|
||||
.col-sm-offset-5 { margin-right: percentage((5 / @grid-columns)); }
|
||||
.col-sm-offset-6 { margin-right: percentage((6 / @grid-columns)); }
|
||||
.col-sm-offset-7 { margin-right: percentage((7 / @grid-columns)); }
|
||||
.col-sm-offset-8 { margin-right: percentage((8 / @grid-columns)); }
|
||||
.col-sm-offset-9 { margin-right: percentage((9 / @grid-columns)); }
|
||||
.col-sm-offset-10 { margin-right: percentage((10/ @grid-columns)); }
|
||||
.col-sm-offset-11 { margin-right: percentage((11/ @grid-columns)); }
|
||||
|
||||
.col-sm-offset-1,
|
||||
.col-sm-offset-2,
|
||||
.col-sm-offset-3,
|
||||
.col-sm-offset-4,
|
||||
.col-sm-offset-5,
|
||||
.col-sm-offset-6,
|
||||
.col-sm-offset-7,
|
||||
.col-sm-offset-8,
|
||||
.col-sm-offset-9,
|
||||
.col-sm-offset-10,
|
||||
.col-sm-offset-11 {
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Medium grid
|
||||
//
|
||||
// Columns, offsets, pushes, and pulls for the desktop device range.
|
||||
//
|
||||
// Note that `.col-md-12` doesn't get floated on purpose—there's no need since
|
||||
// it's full-width.
|
||||
|
||||
@media (min-width: @screen-desktop) {
|
||||
.container {
|
||||
max-width: @container-desktop;
|
||||
}
|
||||
.col-md-1,
|
||||
.col-md-2,
|
||||
.col-md-3,
|
||||
.col-md-4,
|
||||
.col-md-5,
|
||||
.col-md-6,
|
||||
.col-md-7,
|
||||
.col-md-8,
|
||||
.col-md-9,
|
||||
.col-md-10,
|
||||
.col-md-11 {
|
||||
float: right;
|
||||
}
|
||||
.col-md-1 { width: percentage((1 / @grid-columns)); }
|
||||
.col-md-2 { width: percentage((2 / @grid-columns)); }
|
||||
.col-md-3 { width: percentage((3 / @grid-columns)); }
|
||||
.col-md-4 { width: percentage((4 / @grid-columns)); }
|
||||
.col-md-5 { width: percentage((5 / @grid-columns)); }
|
||||
.col-md-6 { width: percentage((6 / @grid-columns)); }
|
||||
.col-md-7 { width: percentage((7 / @grid-columns)); }
|
||||
.col-md-8 { width: percentage((8 / @grid-columns)); }
|
||||
.col-md-9 { width: percentage((9 / @grid-columns)); }
|
||||
.col-md-10 { width: percentage((10/ @grid-columns)); }
|
||||
.col-md-11 { width: percentage((11/ @grid-columns)); }
|
||||
.col-md-12 { width: 100%; }
|
||||
|
||||
// Push and pull columns for source order changes
|
||||
.col-md-push-1 { right: percentage((1 / @grid-columns)); }
|
||||
.col-md-push-2 { right: percentage((2 / @grid-columns)); }
|
||||
.col-md-push-3 { right: percentage((3 / @grid-columns)); }
|
||||
.col-md-push-4 { right: percentage((4 / @grid-columns)); }
|
||||
.col-md-push-5 { right: percentage((5 / @grid-columns)); }
|
||||
.col-md-push-6 { right: percentage((6 / @grid-columns)); }
|
||||
.col-md-push-7 { right: percentage((7 / @grid-columns)); }
|
||||
.col-md-push-8 { right: percentage((8 / @grid-columns)); }
|
||||
.col-md-push-9 { right: percentage((9 / @grid-columns)); }
|
||||
.col-md-push-10 { right: percentage((10/ @grid-columns)); }
|
||||
.col-md-push-11 { right: percentage((11/ @grid-columns)); }
|
||||
|
||||
.col-md-pull-1 { left: percentage((1 / @grid-columns)); }
|
||||
.col-md-pull-2 { left: percentage((2 / @grid-columns)); }
|
||||
.col-md-pull-3 { left: percentage((3 / @grid-columns)); }
|
||||
.col-md-pull-4 { left: percentage((4 / @grid-columns)); }
|
||||
.col-md-pull-5 { left: percentage((5 / @grid-columns)); }
|
||||
.col-md-pull-6 { left: percentage((6 / @grid-columns)); }
|
||||
.col-md-pull-7 { left: percentage((7 / @grid-columns)); }
|
||||
.col-md-pull-8 { left: percentage((8 / @grid-columns)); }
|
||||
.col-md-pull-9 { left: percentage((9 / @grid-columns)); }
|
||||
.col-md-pull-10 { left: percentage((10/ @grid-columns)); }
|
||||
.col-md-pull-11 { left: percentage((11/ @grid-columns)); }
|
||||
|
||||
// Offsets
|
||||
.col-md-offset-1 { margin-right: percentage((1 / @grid-columns)); }
|
||||
.col-md-offset-2 { margin-right: percentage((2 / @grid-columns)); }
|
||||
.col-md-offset-3 { margin-right: percentage((3 / @grid-columns)); }
|
||||
.col-md-offset-4 { margin-right: percentage((4 / @grid-columns)); }
|
||||
.col-md-offset-5 { margin-right: percentage((5 / @grid-columns)); }
|
||||
.col-md-offset-6 { margin-right: percentage((6 / @grid-columns)); }
|
||||
.col-md-offset-7 { margin-right: percentage((7 / @grid-columns)); }
|
||||
.col-md-offset-8 { margin-right: percentage((8 / @grid-columns)); }
|
||||
.col-md-offset-9 { margin-right: percentage((9 / @grid-columns)); }
|
||||
.col-md-offset-10 { margin-right: percentage((10/ @grid-columns)); }
|
||||
.col-md-offset-11 { margin-right: percentage((11/ @grid-columns)); }
|
||||
|
||||
.col-md-offset-1,
|
||||
.col-md-offset-2,
|
||||
.col-md-offset-3,
|
||||
.col-md-offset-4,
|
||||
.col-md-offset-5,
|
||||
.col-md-offset-6,
|
||||
.col-md-offset-7,
|
||||
.col-md-offset-8,
|
||||
.col-md-offset-9,
|
||||
.col-md-offset-10,
|
||||
.col-md-offset-11 {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
// Large grid
|
||||
//
|
||||
// Columns, offsets, pushes, and pulls for the large desktop device range.
|
||||
//
|
||||
// Note that `.col-lg-12` doesn't get floated on purpose—there's no need since
|
||||
// it's full-width.
|
||||
|
||||
@media (min-width: @screen-lg-desktop) {
|
||||
.container {
|
||||
max-width: @container-large-desktop;
|
||||
}
|
||||
|
||||
.col-lg-1,
|
||||
.col-lg-2,
|
||||
.col-lg-3,
|
||||
.col-lg-4,
|
||||
.col-lg-5,
|
||||
.col-lg-6,
|
||||
.col-lg-7,
|
||||
.col-lg-8,
|
||||
.col-lg-9,
|
||||
.col-lg-10,
|
||||
.col-lg-11 {
|
||||
float: right;
|
||||
}
|
||||
.col-lg-1 { width: percentage((1 / @grid-columns)); }
|
||||
.col-lg-2 { width: percentage((2 / @grid-columns)); }
|
||||
.col-lg-3 { width: percentage((3 / @grid-columns)); }
|
||||
.col-lg-4 { width: percentage((4 / @grid-columns)); }
|
||||
.col-lg-5 { width: percentage((5 / @grid-columns)); }
|
||||
.col-lg-6 { width: percentage((6 / @grid-columns)); }
|
||||
.col-lg-7 { width: percentage((7 / @grid-columns)); }
|
||||
.col-lg-8 { width: percentage((8 / @grid-columns)); }
|
||||
.col-lg-9 { width: percentage((9 / @grid-columns)); }
|
||||
.col-lg-10 { width: percentage((10/ @grid-columns)); }
|
||||
.col-lg-11 { width: percentage((11/ @grid-columns)); }
|
||||
.col-lg-12 { width: 100%; }
|
||||
|
||||
// Push and pull columns for source order changes
|
||||
.col-lg-push-1 { right: percentage((1 / @grid-columns)); }
|
||||
.col-lg-push-2 { right: percentage((2 / @grid-columns)); }
|
||||
.col-lg-push-3 { right: percentage((3 / @grid-columns)); }
|
||||
.col-lg-push-4 { right: percentage((4 / @grid-columns)); }
|
||||
.col-lg-push-5 { right: percentage((5 / @grid-columns)); }
|
||||
.col-lg-push-6 { right: percentage((6 / @grid-columns)); }
|
||||
.col-lg-push-7 { right: percentage((7 / @grid-columns)); }
|
||||
.col-lg-push-8 { right: percentage((8 / @grid-columns)); }
|
||||
.col-lg-push-9 { right: percentage((9 / @grid-columns)); }
|
||||
.col-lg-push-10 { right: percentage((10/ @grid-columns)); }
|
||||
.col-lg-push-11 { right: percentage((11/ @grid-columns)); }
|
||||
|
||||
.col-lg-pull-1 { left: percentage((1 / @grid-columns)); }
|
||||
.col-lg-pull-2 { left: percentage((2 / @grid-columns)); }
|
||||
.col-lg-pull-3 { left: percentage((3 / @grid-columns)); }
|
||||
.col-lg-pull-4 { left: percentage((4 / @grid-columns)); }
|
||||
.col-lg-pull-5 { left: percentage((5 / @grid-columns)); }
|
||||
.col-lg-pull-6 { left: percentage((6 / @grid-columns)); }
|
||||
.col-lg-pull-7 { left: percentage((7 / @grid-columns)); }
|
||||
.col-lg-pull-8 { left: percentage((8 / @grid-columns)); }
|
||||
.col-lg-pull-9 { left: percentage((9 / @grid-columns)); }
|
||||
.col-lg-pull-10 { left: percentage((10/ @grid-columns)); }
|
||||
.col-lg-pull-11 { left: percentage((11/ @grid-columns)); }
|
||||
|
||||
// Offsets
|
||||
.col-lg-offset-1 { margin-right: percentage((1 / @grid-columns)); }
|
||||
.col-lg-offset-2 { margin-right: percentage((2 / @grid-columns)); }
|
||||
.col-lg-offset-3 { margin-right: percentage((3 / @grid-columns)); }
|
||||
.col-lg-offset-4 { margin-right: percentage((4 / @grid-columns)); }
|
||||
.col-lg-offset-5 { margin-right: percentage((5 / @grid-columns)); }
|
||||
.col-lg-offset-6 { margin-right: percentage((6 / @grid-columns)); }
|
||||
.col-lg-offset-7 { margin-right: percentage((7 / @grid-columns)); }
|
||||
.col-lg-offset-8 { margin-right: percentage((8 / @grid-columns)); }
|
||||
.col-lg-offset-9 { margin-right: percentage((9 / @grid-columns)); }
|
||||
.col-lg-offset-10 { margin-right: percentage((10/ @grid-columns)); }
|
||||
.col-lg-offset-11 { margin-right: percentage((11/ @grid-columns)); }
|
||||
|
||||
.col-lg-offset-1,
|
||||
.col-lg-offset-2,
|
||||
.col-lg-offset-3,
|
||||
.col-lg-offset-4,
|
||||
.col-lg-offset-5,
|
||||
.col-lg-offset-6,
|
||||
.col-lg-offset-7,
|
||||
.col-lg-offset-8,
|
||||
.col-lg-offset-9,
|
||||
.col-lg-offset-10,
|
||||
.col-lg-offset-11 {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
}
|
||||
@ -1,15 +0,0 @@
|
||||
// Individual list items
|
||||
//
|
||||
// Use on `li`s or `div`s within the `.list-group` parent.
|
||||
|
||||
.list-group-item {
|
||||
|
||||
// Align badges within list items
|
||||
> .badge {
|
||||
float: left;
|
||||
}
|
||||
> .badge + .badge {
|
||||
margin-left: 5px;
|
||||
margin-right: 0px;
|
||||
}
|
||||
}
|
||||
@ -1,480 +0,0 @@
|
||||
// Typography
|
||||
// -------------------------
|
||||
@rtl-font-family-sans-serif: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
@rtl-font-family-serif: Georgia, "Times New Roman", Times, serif;
|
||||
@rtl-font-family-base: @rtl-font-family-sans-serif;
|
||||
|
||||
@rtl-headings-font-family: @rtl-font-family-base;
|
||||
|
||||
|
||||
body {
|
||||
direction: rtl;
|
||||
font-family: @rtl-font-family-base;
|
||||
}
|
||||
|
||||
// Headings
|
||||
// -------------------------
|
||||
|
||||
h1, h2, h3, h4, h5, h6,
|
||||
.h1, .h2, .h3, .h4, .h5, .h6 {
|
||||
font-family: @rtl-headings-font-family;
|
||||
}
|
||||
|
||||
// Brand/project name
|
||||
|
||||
.navbar-brand {
|
||||
float: right;
|
||||
|
||||
@media (min-width: @grid-float-breakpoint) {
|
||||
.navbar > .container & {
|
||||
margin-right: -@navbar-padding-horizontal;
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Navbar heading
|
||||
//
|
||||
// Groups `.navbar-brand` and `.navbar-toggle` into a single component for easy
|
||||
// styling of responsive aspects.
|
||||
|
||||
.navbar-header {
|
||||
|
||||
@media (min-width: @grid-float-breakpoint) {
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
|
||||
// Navbar toggle
|
||||
//
|
||||
// Custom button for toggling the `.navbar-collapse`, powered by the collapse
|
||||
// JavaScript plugin.
|
||||
|
||||
.navbar-toggle {
|
||||
float: left;
|
||||
margin-left: @navbar-padding-horizontal;
|
||||
}
|
||||
|
||||
.navbar-collapse {
|
||||
@media (min-width: @grid-float-breakpoint) {
|
||||
width: auto;
|
||||
border-top: 0;
|
||||
box-shadow: none;
|
||||
|
||||
.navbar-nav.navbar-right:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Navbar form
|
||||
//
|
||||
// Extension of the `.form-inline` with some extra flavor for optimum display in
|
||||
// our navbars.
|
||||
|
||||
.navbar-form {
|
||||
margin-left: -@navbar-padding-horizontal;
|
||||
margin-right: -@navbar-padding-horizontal;
|
||||
}
|
||||
|
||||
// Text in navbars
|
||||
//
|
||||
// Add a class to make any element properly align itself vertically within the navbars.
|
||||
|
||||
.navbar-text {
|
||||
float: right;
|
||||
|
||||
@media (min-width: @grid-float-breakpoint) {
|
||||
margin-left: @navbar-padding-horizontal;
|
||||
margin-right: @navbar-padding-horizontal;
|
||||
}
|
||||
}
|
||||
|
||||
// Navbar nav links
|
||||
//
|
||||
// Builds on top of the `.nav` components with it's own modifier class to make
|
||||
// the nav the full height of the horizontal nav (above 768px).
|
||||
|
||||
.navbar-nav {
|
||||
|
||||
@media (max-width: @screen-xs-max) {
|
||||
// Dropdowns get custom display when collapsed
|
||||
.open .dropdown-menu {
|
||||
> li > a,
|
||||
.dropdown-header {
|
||||
padding: 5px 25px 5px 15px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Uncollapse the nav
|
||||
@media (min-width: @grid-float-breakpoint) {
|
||||
float: right;
|
||||
|
||||
> li {
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.nav-justified {
|
||||
width: 100%;
|
||||
|
||||
> li {
|
||||
float: none;
|
||||
> a {
|
||||
text-align: center;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: @screen-sm-min) {
|
||||
> li {
|
||||
display: table-cell;
|
||||
width: 1%;
|
||||
> a {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Tabs
|
||||
// -------------------------
|
||||
|
||||
// Tabs
|
||||
// -------------------------
|
||||
|
||||
// Give the tabs something to sit on
|
||||
.nav-tabs {
|
||||
border-bottom: 1px solid @nav-tabs-border-color;
|
||||
> li {
|
||||
float: right;
|
||||
// Make the list-items overlay the bottom border
|
||||
margin-bottom: -1px;
|
||||
|
||||
// Actual tabs (as links)
|
||||
> a {
|
||||
margin-right: -2px;
|
||||
border-radius: @border-radius-base @border-radius-base 0 0;
|
||||
}
|
||||
}
|
||||
// pulling this in mainly for less shorthand
|
||||
&.nav-justified {
|
||||
.nav-justified();
|
||||
.nav-tabs-justified();
|
||||
}
|
||||
}
|
||||
|
||||
.nav-tabs-justified {
|
||||
|
||||
> li > a {
|
||||
// Override margin from .nav-tabs
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
@media (min-width: @screen-sm-min) {
|
||||
> li > a {
|
||||
border-radius: @border-radius-base @border-radius-base 0 0;
|
||||
color:blue;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// progress-bar
|
||||
// Bar of progress
|
||||
.progress-bar {
|
||||
float: right;
|
||||
}
|
||||
|
||||
// Alerts
|
||||
|
||||
// Dismissable alerts
|
||||
//
|
||||
// Expand the right padding and account for the close button's positioning.
|
||||
|
||||
.alert-dismissable {
|
||||
//padding-left: (@alert-padding + 20);
|
||||
|
||||
// Adjust close link position
|
||||
.close {
|
||||
font-family: @font-family-base;
|
||||
top: -2px;
|
||||
left: 21px;
|
||||
right: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
//
|
||||
// Close icons
|
||||
// --------------------------------------------------
|
||||
|
||||
.close {
|
||||
font-family: @font-family-base;
|
||||
float: left;
|
||||
}
|
||||
|
||||
|
||||
//
|
||||
// Dropdown menus
|
||||
// --------------------------------------------------
|
||||
|
||||
|
||||
// Dropdown arrow/caret
|
||||
.caret {
|
||||
margin-right: 2px;
|
||||
}
|
||||
|
||||
// The dropdown menu (ul)
|
||||
.dropdown-menu {
|
||||
right: 0;
|
||||
float: left;
|
||||
left: auto;
|
||||
|
||||
// Aligns the dropdown menu to left
|
||||
&.pull-left {
|
||||
left: 0;
|
||||
float: right;
|
||||
right: auto;
|
||||
}
|
||||
}
|
||||
|
||||
// Left aligned dropdowns
|
||||
.pull-left > .dropdown-menu {
|
||||
left: 0;
|
||||
float: right;
|
||||
right: auto;
|
||||
}
|
||||
|
||||
// Right aligned menus need alt position
|
||||
.navbar-nav.pull-left > li > .dropdown-menu,
|
||||
.navbar-nav > li > .dropdown-menu.pull-left {
|
||||
right: auto;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
// Justified navbar
|
||||
|
||||
.nav-tabs-justified {
|
||||
|
||||
> li > a {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
@media (min-width: @screen-sm-min) {
|
||||
> li > a {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Give the tabs something to sit on
|
||||
.nav-tabs {
|
||||
> li {
|
||||
float: right;
|
||||
|
||||
// Actual tabs (as links)
|
||||
> a {
|
||||
margin-left: 2px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Pills
|
||||
// -------------------------
|
||||
.nav-pills {
|
||||
> li {
|
||||
float: right;
|
||||
|
||||
// Links rendered as pills
|
||||
> a {
|
||||
border-radius: @nav-pills-border-radius;
|
||||
}
|
||||
+ li {
|
||||
margin-right: 2px;
|
||||
margin-left: 0px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Stacked pills
|
||||
.nav-stacked {
|
||||
> li {
|
||||
float: none;
|
||||
+ li {
|
||||
margin-right: 0; // no need for this gap between nav items
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Base nav class
|
||||
|
||||
.nav {
|
||||
padding-right: 0; // Override default ul/ol
|
||||
}
|
||||
|
||||
|
||||
// Justified nav links
|
||||
// -------------------------
|
||||
|
||||
.nav-tabs.nav-justified,
|
||||
.nav-pills.nav-justified {
|
||||
width: 100%;
|
||||
> li {
|
||||
float: none!important;
|
||||
> a {
|
||||
text-align: center;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
> .dropdown .dropdown-menu {
|
||||
top: auto;
|
||||
left: auto;
|
||||
}
|
||||
|
||||
@media (min-width: @screen-sm-min) {
|
||||
> li {
|
||||
display: table-cell;
|
||||
width: 1%;
|
||||
> a {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.nav-tabs.nav-justified > li > a {
|
||||
color:@link-color;
|
||||
}
|
||||
|
||||
|
||||
// Reverse input group round corners in RTL
|
||||
|
||||
// Reset rounded corners
|
||||
.input-group .form-control:first-child,
|
||||
.input-group-addon:first-child,
|
||||
.input-group-btn:first-child > .btn,
|
||||
.input-group-btn:first-child > .dropdown-toggle,
|
||||
.input-group-btn:last-child > .btn:not(:last-child):not(.dropdown-toggle) {
|
||||
.border-right-radius(@border-radius-base);
|
||||
.border-left-radius(0);
|
||||
}
|
||||
.input-group-addon:first-child {
|
||||
border-right: 1px solid @input-group-addon-border-color;
|
||||
border-left: 0px;
|
||||
}
|
||||
|
||||
.input-group .form-control:last-child,
|
||||
.input-group-addon:last-child,
|
||||
.input-group-btn:last-child > .btn,
|
||||
.input-group-btn:last-child > .dropdown-toggle,
|
||||
.input-group-btn:first-child > .btn:not(:first-child) {
|
||||
.border-left-radius(@border-radius-base);
|
||||
.border-right-radius(0);
|
||||
}
|
||||
|
||||
.input-group-addon:last-child {
|
||||
border-left: 1px solid @input-group-addon-border-color;
|
||||
border-right: 0px;
|
||||
}
|
||||
|
||||
// Button input groups
|
||||
// -------------------------
|
||||
.input-group-btn {
|
||||
// Negative margin to only have a 1px border between the two
|
||||
&:first-child > .btn {
|
||||
margin-left: -1px;
|
||||
}
|
||||
&:last-child > .btn {
|
||||
margin-right: -1px;
|
||||
}
|
||||
}
|
||||
|
||||
.input-group-btn > .btn {
|
||||
position: relative;
|
||||
// Jankily prevent input button groups from wrapping
|
||||
+ .btn {
|
||||
margin-right: -4px;
|
||||
}
|
||||
// Bring the "active" button to the front
|
||||
&:hover,
|
||||
&:active {
|
||||
z-index: 2;
|
||||
}
|
||||
}
|
||||
|
||||
.radio,
|
||||
.checkbox {
|
||||
padding-right: 20px;
|
||||
}
|
||||
|
||||
.radio input[type="radio"],
|
||||
.radio-inline input[type="radio"],
|
||||
.checkbox input[type="checkbox"],
|
||||
.checkbox-inline input[type="checkbox"] {
|
||||
float: right;
|
||||
margin-right: -20px;
|
||||
}
|
||||
|
||||
.radio-inline + .radio-inline,
|
||||
.checkbox-inline + .checkbox-inline {
|
||||
margin-right: 10px; // space out consecutive inline controls
|
||||
}
|
||||
|
||||
.form-inline {
|
||||
|
||||
// Remove default margin on radios/checkboxes that were used for stacking, and
|
||||
// then undo the floating of radios and checkboxes to match (which also avoids
|
||||
// a bug in WebKit: https://github.com/twbs/bootstrap/issues/1969).
|
||||
.radio,
|
||||
.checkbox {
|
||||
padding-right: 0;
|
||||
}
|
||||
.radio input[type="radio"],
|
||||
.checkbox input[type="checkbox"] {
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
// Horizontal forms
|
||||
//
|
||||
.form-horizontal {
|
||||
// Only right align form labels here when the columns stop stacking
|
||||
@media (min-width: @screen-sm-min) {
|
||||
.control-label {
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Popovers
|
||||
// -------------------------
|
||||
.popover.top,
|
||||
.popover.bottom {
|
||||
direction:ltr
|
||||
}
|
||||
|
||||
.popover.top .popover-title,
|
||||
.popover.top .popover-content,
|
||||
.popover.bottom .popover-title,
|
||||
.popover.bottom .popover-content {
|
||||
direction:rtl;
|
||||
text-align:right;
|
||||
}
|
||||
|
||||
// Tables
|
||||
// -----------------
|
||||
th {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.list-group
|
||||
{
|
||||
padding-right: 0;
|
||||
}
|
||||
@ -1,22 +0,0 @@
|
||||
//
|
||||
// RTL Pager pagination
|
||||
// --------------------------------------------------
|
||||
|
||||
|
||||
.pager {
|
||||
padding-right: 0;
|
||||
|
||||
.next {
|
||||
> a,
|
||||
> span {
|
||||
float: left;
|
||||
}
|
||||
}
|
||||
|
||||
.previous {
|
||||
> a,
|
||||
> span {
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,32 +0,0 @@
|
||||
//
|
||||
// RTL Pagination (multiple pages)
|
||||
// --------------------------------------------------
|
||||
.pagination {
|
||||
padding-right: 0;
|
||||
|
||||
> li {
|
||||
> a,
|
||||
> span {
|
||||
float: right; // Collapse white-space
|
||||
margin-right: -1px;
|
||||
margin-left: 0px;
|
||||
}
|
||||
&:first-child {
|
||||
> a,
|
||||
> span {
|
||||
margin-left: 0;
|
||||
.border-right-radius(@border-radius-base);
|
||||
.border-left-radius(0);
|
||||
}
|
||||
}
|
||||
&:last-child {
|
||||
> a,
|
||||
> span {
|
||||
margin-right: -1px;
|
||||
.border-left-radius(@border-radius-base);
|
||||
.border-right-radius(0);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
@ -1,32 +0,0 @@
|
||||
// Blockquotes
|
||||
|
||||
blockquote {
|
||||
border-right: 5px solid @blockquote-border-color;
|
||||
border-left: 0;
|
||||
|
||||
// Float left with text-align: left
|
||||
&.pull-left {
|
||||
p,
|
||||
small,
|
||||
.small {
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Horizontal description lists
|
||||
|
||||
@media (min-width: @grid-float-breakpoint) {
|
||||
.dl-horizontal {
|
||||
dt {
|
||||
float: right;
|
||||
width: (@component-offset-horizontal - 20);
|
||||
clear: right;
|
||||
text-align: left;
|
||||
}
|
||||
dd {
|
||||
margin-left: 0;
|
||||
margin-right: @component-offset-horizontal;
|
||||
}
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue