activeadmin_blaze_theme 0.1.0
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +7 -0
- data/.gitignore +3 -0
- data/Gemfile +3 -0
- data/LICENSE.txt +22 -0
- data/README.md +55 -0
- data/Rakefile +2 -0
- data/activeadmin_blaze_theme.gemspec +20 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/blaze.colors.scss +14 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/blaze.scss +41 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.addresses.scss +12 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.alerts.scss +59 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.avatars.scss +36 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.badges.scss +60 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.breadcrumbs.scss +20 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.bubbles.scss +49 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.buttons.scss +77 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.calendars.scss +69 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.cards.scss +200 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.headings.scss +38 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.hints.scss +27 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.input-groups.scss +163 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.inputs.scss +138 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.links.scss +31 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.lists.scss +60 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.navs.scss +126 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.overlays.scss +26 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.pagination.scss +42 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.progress.scss +51 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.ranges.scss +114 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.tables.scss +88 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.tabs.scss +57 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.tags.scss +42 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.toggles.scss +74 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.tooltips.scss +96 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.trees.scss +39 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.typography.scss +94 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/generics.global.scss +13 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.alerts.scss +6 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.badges.scss +8 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.buttons.scss +83 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.inputs.scss +45 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.links.scss +22 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.lists.scss +10 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.navs.scss +29 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.ranges.scss +89 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.tabs.scss +5 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.toggles.scss +6 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.typography.scss +25 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_objects.containers.scss +10 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_objects.grid.scss +112 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_settings.global.scss +864 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_tools.mediaqueries.scss +73 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_utilities.alignment.scss +24 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_utilities.boxing.scss +125 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/objects.containers.scss +31 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/objects.drawers.scss +88 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/objects.forms.scss +25 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/objects.grid.responsive.scss +124 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/objects.grid.scss +62 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/objects.images.scss +5 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/objects.media.scss +36 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/objects.modals.scss +55 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/objects.panels.scss +27 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/themes/blaze.example.scss +7 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/utilities.alignment.scss +22 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/utilities.boxing.scss +101 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/utilities.elevation.scss +19 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/utilities.sizes.scss +25 -0
- data/app/assets/stylesheets/activeadmin_blaze_theme/theme.scss +365 -0
- data/lib/activeadmin_blaze_theme/version.rb +3 -0
- data/lib/activeadmin_blaze_theme.rb +8 -0
- data/screenshot1.jpg +0 -0
- data/screenshot2.jpg +0 -0
- metadata +116 -0
checksums.yaml
ADDED
@@ -0,0 +1,7 @@
|
|
1
|
+
---
|
2
|
+
SHA1:
|
3
|
+
metadata.gz: 5792a8922432b6dfc0afdf71da5fd7d69baa24c3
|
4
|
+
data.tar.gz: d7d9126b01e68eb300c248b69ec0b2f4d3bca0f2
|
5
|
+
SHA512:
|
6
|
+
metadata.gz: 8788266dbd5f1b2f453b5f06a6fcb3dc6a8413cb417351fd675bfe783b66e8b5eee9ffed84fe6994f4e2df974af7ce741590b3ea68de4ecb9fd803b5f3578b0c
|
7
|
+
data.tar.gz: 40bc3ee73dc57262e9cfe13b95243cd09af5b70be216842486efada44c2e247b257688e90926841eb586e5f4f3fd8333f382df3ac3cd5af4ad48409b4b4b627a
|
data/.gitignore
ADDED
data/Gemfile
ADDED
data/LICENSE.txt
ADDED
@@ -0,0 +1,22 @@
|
|
1
|
+
Copyright (c) 2017 Mattia Roccoberton
|
2
|
+
|
3
|
+
MIT License
|
4
|
+
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining
|
6
|
+
a copy of this software and associated documentation files (the
|
7
|
+
"Software"), to deal in the Software without restriction, including
|
8
|
+
without limitation the rights to use, copy, modify, merge, publish,
|
9
|
+
distribute, sublicense, and/or sell copies of the Software, and to
|
10
|
+
permit persons to whom the Software is furnished to do so, subject to
|
11
|
+
the following conditions:
|
12
|
+
|
13
|
+
The above copyright notice and this permission notice shall be
|
14
|
+
included in all copies or substantial portions of the Software.
|
15
|
+
|
16
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
|
17
|
+
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
|
18
|
+
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
|
19
|
+
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
|
20
|
+
LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
|
21
|
+
OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
|
22
|
+
WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
data/README.md
ADDED
@@ -0,0 +1,55 @@
|
|
1
|
+
# Active Admin Blaze Theme [![Gem Version](https://badge.fury.io/rb/activeadmin_blaze_theme.svg)](https://badge.fury.io/rb/activeadmin_blaze_theme)
|
2
|
+
|
3
|
+
A theme for Active Admin using [Blaze CSS](http://blazecss.com/)
|
4
|
+
|
5
|
+
Features:
|
6
|
+
|
7
|
+
- clean UI
|
8
|
+
- compact edit form
|
9
|
+
- Blaze CSS widgets
|
10
|
+
|
11
|
+
## Install
|
12
|
+
|
13
|
+
- Add to your Gemfile:
|
14
|
+
|
15
|
+
`gem 'activeadmin_blaze_theme'`
|
16
|
+
|
17
|
+
- Execute bundle
|
18
|
+
|
19
|
+
- Add at the end of your ActiveAdmin styles (_app/assets/stylesheets/active_admin.scss_):
|
20
|
+
|
21
|
+
`@import "activeadmin_blaze_theme/theme";`
|
22
|
+
|
23
|
+
## Customize
|
24
|
+
|
25
|
+
- To change colors add before your ActiveAdmin styles (_app/assets/stylesheets/active_admin.scss_):
|
26
|
+
|
27
|
+
```css
|
28
|
+
$bg-form1: #f4f4f4;
|
29
|
+
$bg-form2: darken($bg-form1, 3%);
|
30
|
+
$bg-form3: darken($bg-form1, 6%);
|
31
|
+
$bg-form4: darken($bg-form1, 9%);
|
32
|
+
$bg-header: $color-brand;
|
33
|
+
$bg-inputs: #fff;
|
34
|
+
$fg-box-title: #fff;
|
35
|
+
$fg-link2: #eee;
|
36
|
+
$fg-table-borders: #e4e4e4;
|
37
|
+
```
|
38
|
+
|
39
|
+
## Screenshots
|
40
|
+
|
41
|
+
Index:
|
42
|
+
|
43
|
+
![index](screenshot1.jpg)
|
44
|
+
|
45
|
+
Edit:
|
46
|
+
|
47
|
+
![edit](screenshot2.jpg)
|
48
|
+
|
49
|
+
## Contributors
|
50
|
+
|
51
|
+
- [Mattia Roccoberton](http://blocknot.es) - creator, maintainer
|
52
|
+
|
53
|
+
## License
|
54
|
+
|
55
|
+
[MIT](LICENSE)
|
data/Rakefile
ADDED
@@ -0,0 +1,20 @@
|
|
1
|
+
# coding: utf-8
|
2
|
+
lib = File.expand_path('../lib', __FILE__)
|
3
|
+
$LOAD_PATH.unshift(lib) unless $LOAD_PATH.include?(lib)
|
4
|
+
require 'activeadmin_blaze_theme/version'
|
5
|
+
|
6
|
+
Gem::Specification.new do |spec|
|
7
|
+
spec.name = "activeadmin_blaze_theme"
|
8
|
+
spec.version = ActiveAdminBlazeTheme::VERSION
|
9
|
+
spec.authors = ["Mattia Roccoberton"]
|
10
|
+
spec.email = ["mat@blocknot.es"]
|
11
|
+
spec.summary = "ActiveAdmin Blaze Theme"
|
12
|
+
spec.description = "An ActiveAdmin theme which use Blaze CSS toolkit"
|
13
|
+
spec.homepage = "https://github.com/blocknotes/activeadmin_blaze_theme"
|
14
|
+
spec.license = "MIT"
|
15
|
+
|
16
|
+
spec.files = `git ls-files -z`.split("\x0")
|
17
|
+
spec.executables = spec.files.grep(%r{^bin/}) { |f| File.basename(f) }
|
18
|
+
spec.test_files = spec.files.grep(%r{^(test|spec|features)/})
|
19
|
+
spec.require_paths = ["lib"]
|
20
|
+
end
|
@@ -0,0 +1,41 @@
|
|
1
|
+
@import "generics.global";
|
2
|
+
@import "objects.containers";
|
3
|
+
@import "objects.grid";
|
4
|
+
@import "objects.grid.responsive";
|
5
|
+
@import "objects.images";
|
6
|
+
@import "objects.panels";
|
7
|
+
@import "objects.media";
|
8
|
+
@import "objects.forms";
|
9
|
+
@import "objects.modals";
|
10
|
+
@import "objects.drawers";
|
11
|
+
@import "components.typography";
|
12
|
+
@import "components.badges";
|
13
|
+
@import "components.headings";
|
14
|
+
@import "components.addresses";
|
15
|
+
@import "components.tables";
|
16
|
+
@import "components.cards";
|
17
|
+
@import "components.buttons";
|
18
|
+
@import "components.links";
|
19
|
+
@import "components.lists";
|
20
|
+
@import "components.breadcrumbs";
|
21
|
+
@import "components.trees";
|
22
|
+
@import "components.tabs";
|
23
|
+
@import "components.inputs";
|
24
|
+
@import "components.input-groups";
|
25
|
+
@import "components.hints";
|
26
|
+
@import "components.toggles";
|
27
|
+
@import "components.tags";
|
28
|
+
@import "components.ranges";
|
29
|
+
@import "components.pagination";
|
30
|
+
@import "components.overlays";
|
31
|
+
@import "components.bubbles";
|
32
|
+
@import "components.tooltips";
|
33
|
+
@import "components.alerts";
|
34
|
+
@import "components.calendars";
|
35
|
+
@import "components.navs";
|
36
|
+
@import "components.progress";
|
37
|
+
@import "components.avatars";
|
38
|
+
@import "utilities.alignment";
|
39
|
+
@import "utilities.boxing";
|
40
|
+
@import "utilities.elevation";
|
41
|
+
@import "utilities.sizes";
|
@@ -0,0 +1,59 @@
|
|
1
|
+
@import "mixins/components.alerts";
|
2
|
+
|
3
|
+
.c-alerts {
|
4
|
+
display: block;
|
5
|
+
position: absolute;
|
6
|
+
width: $alerts-width;
|
7
|
+
max-height: 100%;
|
8
|
+
background-color: $alerts-background-color;
|
9
|
+
z-index: $alerts-z-index;
|
10
|
+
overflow-y: auto;
|
11
|
+
}
|
12
|
+
|
13
|
+
.c-alerts--topleft {
|
14
|
+
top: $alerts-margin;
|
15
|
+
left: $alerts-margin;
|
16
|
+
}
|
17
|
+
|
18
|
+
.c-alerts--topright {
|
19
|
+
top: $alerts-margin;
|
20
|
+
right: $alerts-margin;
|
21
|
+
}
|
22
|
+
|
23
|
+
.c-alerts--bottomleft {
|
24
|
+
bottom: 0;
|
25
|
+
left: $alerts-margin;
|
26
|
+
}
|
27
|
+
|
28
|
+
.c-alerts--bottomright {
|
29
|
+
right: $alerts-margin;
|
30
|
+
bottom: 0;
|
31
|
+
}
|
32
|
+
|
33
|
+
.c-alert {
|
34
|
+
@include alert-color;
|
35
|
+
position: relative;
|
36
|
+
margin: $alert-margin;
|
37
|
+
padding: $alert-padding;
|
38
|
+
border-radius: $alert-border-radius;
|
39
|
+
}
|
40
|
+
|
41
|
+
.c-alert--brand {
|
42
|
+
@include alert-color($alert-brand-background-color);
|
43
|
+
}
|
44
|
+
|
45
|
+
.c-alert--info {
|
46
|
+
@include alert-color($alert-info-background-color);
|
47
|
+
}
|
48
|
+
|
49
|
+
.c-alert--warning {
|
50
|
+
@include alert-color($alert-warning-background-color);
|
51
|
+
}
|
52
|
+
|
53
|
+
.c-alert--success {
|
54
|
+
@include alert-color($alert-success-background-color);
|
55
|
+
}
|
56
|
+
|
57
|
+
.c-alert--error {
|
58
|
+
@include alert-color($alert-error-background-color);
|
59
|
+
}
|
@@ -0,0 +1,36 @@
|
|
1
|
+
@import "mixins/settings.global";
|
2
|
+
|
3
|
+
.c-avatar {
|
4
|
+
display: inline-block;
|
5
|
+
position: relative;
|
6
|
+
width: $avatar-medium-size;
|
7
|
+
height: $avatar-medium-size;
|
8
|
+
margin: $avatar-margin;
|
9
|
+
border-radius: $avatar-img-border-radius;
|
10
|
+
background-color: $avatar-background-color;
|
11
|
+
color: $avatar-color;
|
12
|
+
}
|
13
|
+
|
14
|
+
.c-avatar[data-text]:after {
|
15
|
+
position: absolute;
|
16
|
+
top: 50%;
|
17
|
+
left: 50%;
|
18
|
+
transform: translate(-50%, -50%);
|
19
|
+
content: attr(data-text);
|
20
|
+
}
|
21
|
+
|
22
|
+
.c-avatar__img {
|
23
|
+
display: block;
|
24
|
+
width: 100%;
|
25
|
+
height: 100%;
|
26
|
+
border-radius: $avatar-img-border-radius;
|
27
|
+
overflow: hidden;
|
28
|
+
}
|
29
|
+
|
30
|
+
.c-avatar__img + .c-avatar__img {
|
31
|
+
position: absolute;
|
32
|
+
right: 0;
|
33
|
+
bottom: 0;
|
34
|
+
width: $avatar-inner-img-size;
|
35
|
+
height: $avatar-inner-img-size;
|
36
|
+
}
|
@@ -0,0 +1,60 @@
|
|
1
|
+
@import "mixins/components.badges";
|
2
|
+
|
3
|
+
.c-badge {
|
4
|
+
@include badge($badge-background-color, $badge-color, $badge-background-color);
|
5
|
+
display: inline-block;
|
6
|
+
margin: $badge-margin;
|
7
|
+
padding: $badge-padding;
|
8
|
+
border-radius: $badge-border-radius;
|
9
|
+
font-size: $badge-font-size;
|
10
|
+
font-weight: $badge-font-weight;
|
11
|
+
line-height: $badge-line-height;
|
12
|
+
|
13
|
+
&.c-badge--ghost {
|
14
|
+
@include badge($badge-ghost-background-color, $badge-ghost-color)
|
15
|
+
}
|
16
|
+
}
|
17
|
+
|
18
|
+
.c-badge--rounded {
|
19
|
+
border-radius: $badge-border-radius-rounded;
|
20
|
+
}
|
21
|
+
|
22
|
+
.c-badge--brand {
|
23
|
+
@include badge($badge-brand-background-color, $badge-brand-color, $badge-brand-background-color);
|
24
|
+
|
25
|
+
&.c-badge--ghost {
|
26
|
+
@include badge($badge-ghost-brand-background-color, $badge-ghost-brand-color)
|
27
|
+
}
|
28
|
+
}
|
29
|
+
|
30
|
+
.c-badge--info {
|
31
|
+
@include badge($badge-info-background-color, $badge-info-color, $badge-info-background-color);
|
32
|
+
|
33
|
+
&.c-badge--ghost {
|
34
|
+
@include badge($badge-ghost-info-background-color, $badge-ghost-info-color)
|
35
|
+
}
|
36
|
+
}
|
37
|
+
|
38
|
+
.c-badge--warning {
|
39
|
+
@include badge($badge-warning-background-color, $badge-warning-color, $badge-warning-background-color);
|
40
|
+
|
41
|
+
&.c-badge--ghost {
|
42
|
+
@include badge($badge-ghost-warning-background-color, $badge-ghost-warning-color)
|
43
|
+
}
|
44
|
+
}
|
45
|
+
|
46
|
+
.c-badge--success {
|
47
|
+
@include badge($badge-success-background-color, $badge-success-color, $badge-success-background-color);
|
48
|
+
|
49
|
+
&.c-badge--ghost {
|
50
|
+
@include badge($badge-ghost-success-background-color, $badge-ghost-success-color)
|
51
|
+
}
|
52
|
+
}
|
53
|
+
|
54
|
+
.c-badge--error {
|
55
|
+
@include badge($badge-error-background-color, $badge-error-color, $badge-error-background-color);
|
56
|
+
|
57
|
+
&.c-badge--ghost {
|
58
|
+
@include badge($badge-ghost-error-background-color, $badge-ghost-error-color)
|
59
|
+
}
|
60
|
+
}
|
@@ -0,0 +1,20 @@
|
|
1
|
+
@import "mixins/settings.global";
|
2
|
+
|
3
|
+
.c-breadcrumbs {
|
4
|
+
display: block;
|
5
|
+
margin: $breadcrumb-margin;
|
6
|
+
padding: $breadcrumb-padding;
|
7
|
+
list-style: none;
|
8
|
+
}
|
9
|
+
|
10
|
+
.c-breadcrumbs__crumb {
|
11
|
+
display: inline-block;
|
12
|
+
width: auto;
|
13
|
+
padding: $breadcrumb-crumb-padding;
|
14
|
+
|
15
|
+
&:not(:last-child):after {
|
16
|
+
padding: $breadcrumb-crumb-separator-padding;
|
17
|
+
color: $breadcrumb-crumb-separator-color;
|
18
|
+
content: $breadcrumb-crumb-separator-content;
|
19
|
+
}
|
20
|
+
}
|
@@ -0,0 +1,49 @@
|
|
1
|
+
@import "mixins/settings.global";
|
2
|
+
|
3
|
+
.c-bubble {
|
4
|
+
display: inline-block;
|
5
|
+
position: relative;
|
6
|
+
padding: $bubble-padding;
|
7
|
+
border-radius: $bubble-border-radius;
|
8
|
+
background-color: $bubble-background-color;
|
9
|
+
color: $bubble-color;
|
10
|
+
text-align: $bubble-text-align;
|
11
|
+
white-space: nowrap;
|
12
|
+
|
13
|
+
&:after {
|
14
|
+
display: block;
|
15
|
+
position: absolute;
|
16
|
+
width: 0;
|
17
|
+
height: 0;
|
18
|
+
border: $bubble-arrow-width solid transparent;
|
19
|
+
content: "";
|
20
|
+
}
|
21
|
+
}
|
22
|
+
|
23
|
+
.c-bubble--top:after {
|
24
|
+
bottom: -($bubble-arrow-width * 2);
|
25
|
+
left: 50%;
|
26
|
+
transform: translateX(-50%);
|
27
|
+
border-top-color: $bubble-background-color;
|
28
|
+
}
|
29
|
+
|
30
|
+
.c-bubble--right:after {
|
31
|
+
top: 50%;
|
32
|
+
left: -($bubble-arrow-width * 2);
|
33
|
+
transform: translateY(-50%);
|
34
|
+
border-right-color: $bubble-background-color;
|
35
|
+
}
|
36
|
+
|
37
|
+
.c-bubble--bottom:after {
|
38
|
+
top: -($bubble-arrow-width * 2);
|
39
|
+
left: 50%;
|
40
|
+
transform: translateX(-50%);
|
41
|
+
border-bottom-color: $bubble-background-color;
|
42
|
+
}
|
43
|
+
|
44
|
+
.c-bubble--left:after {
|
45
|
+
top: 50%;
|
46
|
+
right: -($bubble-arrow-width * 2);
|
47
|
+
transform: translateY(-50%);
|
48
|
+
border-left-color: $bubble-background-color;
|
49
|
+
}
|
@@ -0,0 +1,77 @@
|
|
1
|
+
@import "mixins/components.buttons";
|
2
|
+
|
3
|
+
.c-button {
|
4
|
+
@include button;
|
5
|
+
}
|
6
|
+
|
7
|
+
.c-button--close {
|
8
|
+
@include button-color(transparent, inherit);
|
9
|
+
position: absolute;
|
10
|
+
right: $spacing-small;
|
11
|
+
padding: 0;
|
12
|
+
outline: 0;
|
13
|
+
font-size: $button-close-font-size;
|
14
|
+
font-weight: $button-close-font-weight;
|
15
|
+
line-height: 1;
|
16
|
+
}
|
17
|
+
|
18
|
+
.c-button--block {
|
19
|
+
display: inline-block;
|
20
|
+
width: 100%;
|
21
|
+
}
|
22
|
+
|
23
|
+
.c-button--rounded {
|
24
|
+
border-radius: $button-rounded-border-radius;
|
25
|
+
}
|
26
|
+
|
27
|
+
.c-button--brand {
|
28
|
+
@include button-color($button-brand-background-color, $button-brand-color);
|
29
|
+
}
|
30
|
+
|
31
|
+
.c-button--info {
|
32
|
+
@include button-color($button-info-background-color, $button-info-color);
|
33
|
+
}
|
34
|
+
|
35
|
+
.c-button--warning {
|
36
|
+
@include button-color($button-warning-background-color, $button-warning-color);
|
37
|
+
}
|
38
|
+
|
39
|
+
.c-button--success {
|
40
|
+
@include button-color($button-success-background-color, $button-success-color);
|
41
|
+
}
|
42
|
+
|
43
|
+
.c-button--error {
|
44
|
+
@include button-color($button-error-background-color, $button-error-color);
|
45
|
+
}
|
46
|
+
|
47
|
+
.c-button--ghost {
|
48
|
+
@include button-ghost;
|
49
|
+
}
|
50
|
+
|
51
|
+
.c-button--ghost-brand {
|
52
|
+
@include button-ghost($button-ghost-brand-color, $button-ghost-brand-hover-color);
|
53
|
+
}
|
54
|
+
|
55
|
+
.c-button--ghost-info {
|
56
|
+
@include button-ghost($button-ghost-info-color, $button-ghost-info-hover-color);
|
57
|
+
}
|
58
|
+
|
59
|
+
.c-button--ghost-warning {
|
60
|
+
@include button-ghost($button-ghost-warning-color, $button-ghost-warning-hover-color);
|
61
|
+
}
|
62
|
+
|
63
|
+
.c-button--ghost-success {
|
64
|
+
@include button-ghost($button-ghost-success-color, $button-ghost-success-hover-color);
|
65
|
+
}
|
66
|
+
|
67
|
+
.c-button--ghost-error {
|
68
|
+
@include button-ghost($button-ghost-error-color, $button-ghost-error-hover-color);
|
69
|
+
}
|
70
|
+
|
71
|
+
.c-button__icon-left {
|
72
|
+
padding-right: $button-icon-left-padding;
|
73
|
+
}
|
74
|
+
|
75
|
+
.c-button__icon-right {
|
76
|
+
padding-left: $button-icon-right-padding;
|
77
|
+
}
|
@@ -0,0 +1,69 @@
|
|
1
|
+
@import "mixins/settings.global";
|
2
|
+
@import "mixins/objects.grid";
|
3
|
+
@import "mixins/components.buttons";
|
4
|
+
|
5
|
+
.c-calendar {
|
6
|
+
@include grid;
|
7
|
+
@include grid--wrap;
|
8
|
+
@include grid--center;
|
9
|
+
@include grid__cell--no-gutter;
|
10
|
+
max-width: $calendar-max-width;
|
11
|
+
padding: $calendar-padding;
|
12
|
+
border: $calendar-border;
|
13
|
+
border-radius: $calendar-border-radius;
|
14
|
+
background-color: $calendar-background-color;
|
15
|
+
text-align: $calendar-text-align;
|
16
|
+
z-index: $z-over-control;
|
17
|
+
}
|
18
|
+
|
19
|
+
.c-calendar__control,
|
20
|
+
.c-calendar__date {
|
21
|
+
@include button-color($calendar-control-background-color, $calendar-control-color);
|
22
|
+
display: inline;
|
23
|
+
flex: 0 0 14.28%;
|
24
|
+
max-width: 14.28%;
|
25
|
+
margin: 0;
|
26
|
+
padding: $calendar-control-padding;
|
27
|
+
border: $calendar-control-border-width $calendar-control-border-style transparent;
|
28
|
+
border-radius: $calendar-control-border-radius;
|
29
|
+
outline: 0;
|
30
|
+
font-size: $calendar-control-font-size;
|
31
|
+
cursor: pointer;
|
32
|
+
user-select: none;
|
33
|
+
}
|
34
|
+
|
35
|
+
.c-calendar__header {
|
36
|
+
@include grid__cell;
|
37
|
+
@include grid__cell--no-gutter;
|
38
|
+
@include grid__cell--width(70%);
|
39
|
+
padding: $calendar-header-padding;
|
40
|
+
}
|
41
|
+
|
42
|
+
.c-calendar__day {
|
43
|
+
@include grid__cell;
|
44
|
+
@include grid__cell--no-gutter;
|
45
|
+
flex: 0 0 14.28%;
|
46
|
+
max-width: 14.28%;
|
47
|
+
padding: $calendar-day-padding;
|
48
|
+
font-weight: $calendar-day-font-weight;
|
49
|
+
}
|
50
|
+
|
51
|
+
.c-calendar__date {
|
52
|
+
&:hover {
|
53
|
+
border: $calendar-control-border-hover;
|
54
|
+
}
|
55
|
+
}
|
56
|
+
|
57
|
+
.c-calendar__date--in-month {
|
58
|
+
color: $calendar-control-date-in-month-color;
|
59
|
+
}
|
60
|
+
|
61
|
+
.c-calendar__date--today {
|
62
|
+
border-color: $calendar-today-border-color;
|
63
|
+
}
|
64
|
+
|
65
|
+
.c-calendar__date--selected,
|
66
|
+
.c-calendar__date--selected:hover {
|
67
|
+
@include button-color($calendar-control-selected-background-color, $calendar-control-selected-color);
|
68
|
+
border-color: $calendar-control-selected-border-color;
|
69
|
+
}
|