twbs
/
ratchet
зеркало из
1
0
Форкнуть 0
Код Задачи Пакеты Проекты Релизы Вики Активность

Adding basic alerts. Inline ones too.

This commit is contained in:
connors 2013-10-19 20:14:53 -07:00
Родитель cea7a11a2e
Коммит 847fc1d3c4
3 изменённых файлов: 182 добавлений и 131 удалений
Показать статистику Скачать Patch файл Скачать Diff файл Показать все файлы Свернуть все файлы

24
dist/ratchet.css поставляемый
Просмотреть файл

@ -993,6 +993,30 @@ input[type="button"] {
background-color: rgba(0, 0, 0, 0.15);
}
.alert {
position: fixed;
right: 15px;
left: 15px;
bottom: 65px;
padding: 15px;
color: #fff;
border-radius: 3px;
z-index: 10;
}
.alert-positive {
background-color: rgba(76, 217, 100, 0.97);
}
.alert-negative {
background-color: rgba(221, 82, 77, 0.97);
}
.alert-inline {
position: static;
margin: 15px;
}
.modal {
position: fixed;
top: 0;

8
examples/app-default/index.html
Просмотреть файл

@ -18,6 +18,11 @@
</head>
<body>
<!-- Alert -->
<div class="alert alert-negative">
<strong>This</strong> is an alert.
</div>
<header class="bar-nav">
<h1 class="title">Movie finder</h1>
</header>
@ -51,7 +56,6 @@
</nav>
<div class="content">
<div class="slider">
<ul>
<li>
@ -154,7 +158,7 @@
</a>
</li>
</ul>
</div>
</body>
</html>

25
lib/sass/alerts.scss
Просмотреть файл

@ -3,5 +3,28 @@
// --------------------------------------------------
.alert {
position: fixed;
right: 15px;
left: 15px;
bottom: $bar-tab-height + 15px;
padding: 15px;
color: #fff;
border-radius: 3px;
z-index: 10;
}
// Positive alert (Default color is green)
.alert-positive {
background-color: transparentize($positive-color, .03);
}
// Negative alert (Default color is red)
.alert-negative {
background-color: transparentize($negative-color, .03);
}
// Inline alert
.alert-inline {
position: static;
margin: 15px;
}