Browse Source

version 0.1

* uses silktide cookieconsent javascript
* wordpress config page
* wordpress header

themage
theMage 5 years ago
parent
commit
061f8786e0
35 changed files with 1313 additions and 15 deletions
  1. 51 2
      cookieconsent-options.php
  2. 57 11
      eu-cookie-consent.php
  3. BIN
      silktide/cookie-consent-logo.png
  4. 12 0
      silktide/sass.rb
  5. 0 0
      silktide/sass/_variables.scss
  6. 0 0
      silktide/sass/animations/_fadeinright.scss
  7. 0 0
      silktide/sass/animations/_pushdown.scss
  8. 0 0
      silktide/sass/animations/_slidedown.scss
  9. 0 0
      silktide/sass/animations/_slideup.scss
  10. 0 0
      silktide/sass/animations/_tada.scss
  11. 2 2
      silktide/styles/basic-layouts/_base.scss
  12. 0 0
      silktide/sass/basic-layouts/_bottom.scss
  13. 0 0
      silktide/sass/basic-layouts/_floating.scss
  14. 0 0
      silktide/sass/basic-layouts/_inline.scss
  15. 0 0
      silktide/sass/basic-layouts/_top-overlay.scss
  16. 0 0
      silktide/sass/basic-layouts/_top.scss
  17. 0 0
      silktide/sass/dark-bottom.scss
  18. 0 0
      silktide/sass/dark-floating-tada.scss
  19. 0 0
      silktide/sass/dark-floating.scss
  20. 0 0
      silktide/sass/dark-inline.scss
  21. 0 0
      silktide/sass/dark-top.scss
  22. 0 0
      silktide/sass/light-bottom.scss
  23. 0 0
      silktide/sass/light-floating.scss
  24. 0 0
      silktide/sass/light-top.scss
  25. 0 0
      silktide/sass/themes/_dark.scss
  26. 0 0
      silktide/sass/themes/_light.scss
  27. 147 0
      silktide/styles/dark-bottom.css
  28. 178 0
      silktide/styles/dark-floating-tada.css
  29. 150 0
      silktide/styles/dark-floating.css
  30. 102 0
      silktide/styles/dark-inline.css
  31. 145 0
      silktide/styles/dark-top.css
  32. 148 0
      silktide/styles/light-bottom.css
  33. 156 0
      silktide/styles/light-floating.css
  34. 146 0
      silktide/styles/light-top.css
  35. 19 0
      styles.css

+ 51 - 2
cookieconsent-options.php

@ -6,6 +6,17 @@ $id = (isset($_GET['id'] ) ? intval($_GET['id'] ) : 0);
6 6
$mode = (isset($_GET['mode'] ) ? trim($_GET['mode'] ) : '' );
7 7
$text = '';
8 8
9
$themes = array(
10
  'dark-bottom',
11
  'dark-floating',
12
//  'dark-inline',
13
  'dark-top',
14
  'light-bottom',
15
  'light-floating',
16
//  'light-inline',
17
  'light-top',
18
);
19
9 20
### Form Processing
10 21
if(!empty($_POST['Submit'] )) {
11 22
  check_admin_referer( 'cookieconsent_options' );
@ -15,7 +26,6 @@ if(!empty($_POST['Submit'] )) {
15 26
    'dismiss'     => eu_cookieconsent_options_parse( 'dismiss' ),
16 27
    'learnMore'   => eu_cookieconsent_options_parse( 'learnMore' ),
17 28
    'link'        => eu_cookieconsent_options_parse( 'link' ),
18
    'container'   => eu_cookieconsent_options_parse( 'container' ),
19 29
    'theme'       => eu_cookieconsent_options_parse( 'theme' ),
20 30
    'expiryDays'  => eu_cookieconsent_options_parse( 'expiryDays'),
21 31
  );
@ -55,9 +65,48 @@ $cookie_options = get_option('eu_cookieconsent_options');
55 65
56 66
  <table class="form-table">
57 67
    <tr>
68
      <td valign="top" width="30%"><strong><?php _e('Theme:', 'eu-cookie-consent'); ?></strong></td>
69
      <td valign="top">
70
<?php $selected_theme = $cookie_options['theme'];
71
    foreach ($themes as $theme) { ?>
72
        <div class="eucc-theme-select">
73
          <img src="<?php echo plugins_url("eu-cookie-consent/silktide/theme-previews/$theme.png"); ?>" align="enter" /><br/>
74
          <input type="radio" name="theme"
75
            value="<?php echo $theme?>"
76
            <?php if ($theme === $selected_theme) { echo "checked"; } ?>
77
          />
78
        </div><?php if ($theme === 'dark-top') { echo '<div class="clear"></div>'; } ?>
79
<?php } ?>
80
      </td>
81
    </tr>
82
    <tr>
58 83
      <td valign="top" width="30%"><strong><?php _e( 'Message:' , 'eu-cookie-consent'); ?></strong></td>
59 84
      <td valign="top">
60
        <textarea name='message'><?php echo htmlspecialchars(stripslashes($cookie_options['message'])); ?></textarea>
85
        <input name='message' value='<?php echo htmlspecialchars(stripslashes($cookie_options['message'])); ?>' class="biginput" />
86
      </td>
87
    </tr>
88
    <tr>
89
      <td valign="top" width="30%"><strong><?php _e( 'Accept Button text:' , 'eu-cookie-consent'); ?></strong></td>
90
      <td valign="top">
91
        <input name='dismiss' value='<?php echo htmlspecialchars(stripslashes($cookie_options['dismiss'])); ?>' />
92
      </td>
93
    </tr>
94
    <tr>
95
      <td valign="top" width="30%"><strong><?php _e( 'Read More button text:' , 'eu-cookie-consent'); ?></strong></td>
96
      <td valign="top">
97
        <input name='learnMore' value='<?php echo htmlspecialchars(stripslashes($cookie_options['learnMore'])); ?>' />
98
      </td>
99
    </tr>
100
    <tr>
101
      <td valign="top" width="30%"><strong><?php _e( 'Cookie Policy Page:' , 'eu-cookie-consent'); ?></strong></td>
102
      <td valign="top">
103
        <input name='link' value='<?php echo htmlspecialchars(stripslashes($cookie_options['link'])); ?>' class="biginput" />
104
      </td>
105
    </tr>
106
    <tr>
107
      <td valign="top" width="30%"><strong><?php _e( 'Expire Days:' , 'eu-cookie-consent'); ?></strong></td>
108
      <td valign="top">
109
        <input name='expiryDays' value='<?php echo htmlspecialchars(stripslashes($cookie_options['expiryDays'])); ?>' />
61 110
      </td>
62 111
    </tr>
63 112
  </table>

+ 57 - 11
eu-cookie-consent.php

@ -10,6 +10,19 @@ Text Domain: eu-cookie-consent
10 10
License: http://www.gnu.org/licenses/gpl-3.0.en.html
11 11
*/
12 12
13
define( 'EU_COOKIECONSENT_VERSION', 0.1);
14
15
global $cookie_options_defaults;
16
$cookie_options_defaults = array(
17
    'message'     => 'This website uses cookies to ensure '
18
                    .'you get the best experience. ',
19
    'dismiss'     => 'Got it!',
20
    'learnMore'   => 'More info',
21
    'link'        => null,
22
    'theme'       => 'light-floating',
23
    'expiryDays'  => 365,
24
  );
25
13 26
### Create Text Domain For Translations
14 27
add_action( 'plugins_loaded', 'eu_cookieconsent_textdomain' );
15 28
function eu_cookieconsent_textdomain() {
@ -29,18 +42,9 @@ function eu_cookieconsent_menu() {
29 42
30 43
register_activation_hook( __FILE__, 'eu_cookieconsent_activation');
31 44
function eu_cookieconsent_activation( $network_wide ) {
45
  global $cookie_options_defaults; 
32 46
  $option_name = 'eu_cookieconsent_options';
33
  $option      = array(
34
    'message'     => 'This website uses cookies to ensure '
35
                    .'you get the best experience. ',
36
    'dismiss'     => 'Got it!',
37
    'learnMore'   => 'More info',
38
    'link'        => null,
39
    'container'   => null,
40
    'theme'       => 'light-floating',
41
    'expiryDays'  => 365,
42
  );
43
47
  $option      = $cookie_options_defaults;
44 48
  if ( is_multisite() && $network_wide ) {
45 49
    $sites = wp_get_sites();
46 50
@ -57,7 +61,49 @@ function eu_cookieconsent_activation( $network_wide ) {
57 61
  }
58 62
}
59 63
64
add_action('admin_enqueue_scripts', 'eu_cookieconsent_admin');
65
function eu_cookieconsent_admin($hook_suffix) {
66
  $eu_cookieconsent_admin_pages = array('eu-cookie-consent/cookieconsent-options.php','eu-cookie-consent/eu-cookie-consent.php');
67
  if (in_array($hook_suffix, $eu_cookieconsent_admin_pages) ) {
68
    wp_enqueue_style('eu-cookie-consent',plugins_url('eu-cookie-consent/styles.css'), false, EU_COOKIECONSENT_VERSION,'all');
69
  }
70
}
60 71
61 72
function eu_cookieconsent_options_parse( $key ) {
62 73
  return !empty($_POST[$key]) ? $_POST[$key] : null;
63 74
}
75
76
add_action('wp_head','eu_cookieconsent_headers');
77
function eu_cookieconsent_headers() {
78
  global $cookie_options_defaults; 
79
  $cookie_options = get_option('eu_cookieconsent_options');
80
81
  $cookie_options = array_merge(
82
      $cookie_options_defaults,
83
      $cookie_options
84
    );
85
86
  echo '<!--';
87
  print_r( $cookie_options );
88
  print_r( $cookie_options_defaults );
89
  echo '-->';
90
  
91
  $result = "window.cookieconsent_options = {\n";
92
  $cnt = 0;
93
  foreach ($cookie_options as $option_name => $option_value ) {
94
    if ( $option_value ) {
95
      if ( $cnt++ ) {
96
        $result = $result .",\n";
97
      }
98
      $result = $result . "\"$option_name\": \""
99
        . htmlspecialchars(stripslashes( $option_value ))
100
        . "\"";
101
    }
102
  }
103
  $result = $result . "\n};\n";
104
  echo "<script type='text/javascript'>\n $result </script>\n";
105
  echo "<script type='text/javascript' src='"
106
    . plugins_url('eu-cookie-consent/silktide/cookieconsent.js')
107
    ."?v=".EU_COOKIECONSENT_VERSION."'></script>";
108
}
109
   

BIN
silktide/cookie-consent-logo.png


+ 12 - 0
silktide/sass.rb

@ -0,0 +1,12 @@
1
## config file for compass
2
# compile files with:
3
# compass compile -c sass.rb
4
5
require 'compass/import-once/activate'
6
7
http_path = "/"
8
css_dir = "styles"
9
sass_dir = "sass"
10
11
output_style = :nested
12
line_comments = false

silktide/styles/_variables.scss → silktide/sass/_variables.scss


silktide/styles/animations/_fadeinright.scss → silktide/sass/animations/_fadeinright.scss


silktide/styles/animations/_pushdown.scss → silktide/sass/animations/_pushdown.scss


silktide/styles/animations/_slidedown.scss → silktide/sass/animations/_slidedown.scss


silktide/styles/animations/_slideup.scss → silktide/sass/animations/_slideup.scss


silktide/styles/animations/_tada.scss → silktide/sass/animations/_tada.scss


+ 2 - 2
silktide/styles/basic-layouts/_base.scss

@ -33,7 +33,7 @@
33 33
        width:100px;
34 34
        height:22px;
35 35
        background-size: cover;
36
        background-image: url(https://s3-eu-west-1.amazonaws.com/assets.cookieconsent.silktide.com/cookie-consent-logo.png);
36
        background-image: url(../cookie-consent-logo.png);
37 37
        opacity:0.9;
38 38
        transition: opacity 200ms;
39 39
    }
@ -95,4 +95,4 @@
95 95
    .cc_container {
96 96
        display:none;
97 97
    }
98
}
98
}

silktide/styles/basic-layouts/_bottom.scss → silktide/sass/basic-layouts/_bottom.scss


silktide/styles/basic-layouts/_floating.scss → silktide/sass/basic-layouts/_floating.scss


silktide/styles/basic-layouts/_inline.scss → silktide/sass/basic-layouts/_inline.scss


silktide/styles/basic-layouts/_top-overlay.scss → silktide/sass/basic-layouts/_top-overlay.scss


silktide/styles/basic-layouts/_top.scss → silktide/sass/basic-layouts/_top.scss


silktide/styles/dark-bottom.scss → silktide/sass/dark-bottom.scss


silktide/styles/dark-floating-tada.scss → silktide/sass/dark-floating-tada.scss


silktide/styles/dark-floating.scss → silktide/sass/dark-floating.scss


silktide/styles/dark-inline.scss → silktide/sass/dark-inline.scss


silktide/styles/dark-top.scss → silktide/sass/dark-top.scss


silktide/styles/light-bottom.scss → silktide/sass/light-bottom.scss


silktide/styles/light-floating.scss → silktide/sass/light-floating.scss


silktide/styles/light-top.scss → silktide/sass/light-top.scss


silktide/styles/themes/_dark.scss → silktide/sass/themes/_dark.scss


silktide/styles/themes/_light.scss → silktide/sass/themes/_light.scss


+ 147 - 0
silktide/styles/dark-bottom.css

@ -0,0 +1,147 @@
1
.cc_banner-wrapper {
2
  z-index: 9001;
3
  position: relative; }
4
5
.cc_container .cc_btn {
6
  cursor: pointer;
7
  text-align: center;
8
  font-size: 0.6em;
9
  transition: font-size 200ms;
10
  line-height: 1em; }
11
.cc_container .cc_message {
12
  font-size: 0.6em;
13
  transition: font-size 200ms;
14
  margin: 0;
15
  padding: 0;
16
  line-height: 1.5em; }
17
.cc_container .cc_logo {
18
  display: none;
19
  text-indent: -1000px;
20
  overflow: hidden;
21
  width: 100px;
22
  height: 22px;
23
  background-size: cover;
24
  background-image: url(../cookie-consent-logo.png);
25
  opacity: 0.9;
26
  transition: opacity 200ms; }
27
.cc_container .cc_logo:hover,
28
.cc_container .cc_logo:active {
29
  opacity: 1; }
30
31
@media screen and (min-width: 500px) {
32
  .cc_container .cc_btn {
33
    font-size: 0.8em; }
34
  .cc_container .cc_message {
35
    font-size: 0.8em; } }
36
@media screen and (min-width: 768px) {
37
  .cc_container .cc_btn {
38
    font-size: 1em; }
39
  .cc_container .cc_message {
40
    font-size: 1em;
41
    line-height: 1em; } }
42
@media screen and (min-width: 992px) {
43
  .cc_container .cc_message {
44
    font-size: 1em; } }
45
@media print {
46
  .cc_banner-wrapper,
47
  .cc_container {
48
    display: none; } }
49
.cc_container {
50
  position: fixed;
51
  left: 0;
52
  right: 0;
53
  bottom: 0;
54
  overflow: hidden;
55
  padding: 10px; }
56
  .cc_container .cc_btn {
57
    padding: 8px 10px;
58
    background-color: #f1d600;
59
    cursor: pointer;
60
    transition: font-size 200ms;
61
    text-align: center;
62
    font-size: 0.6em;
63
    display: block;
64
    width: 33%;
65
    margin-left: 10px;
66
    float: right;
67
    max-width: 120px; }
68
  .cc_container .cc_message {
69
    transition: font-size 200ms;
70
    font-size: 0.6em;
71
    display: block; }
72
73
@media screen and (min-width: 500px) {
74
  .cc_container .cc_btn {
75
    font-size: 0.8em; }
76
  .cc_container .cc_message {
77
    margin-top: 0.5em;
78
    font-size: 0.8em; } }
79
@media screen and (min-width: 768px) {
80
  .cc_container {
81
    padding: 15px 30px 15px; }
82
    .cc_container .cc_btn {
83
      font-size: 1em;
84
      padding: 8px 15px; }
85
    .cc_container .cc_message {
86
      font-size: 1em; } }
87
@media screen and (min-width: 992px) {
88
  .cc_container .cc_message {
89
    font-size: 1em; } }
90
.cc_container {
91
  background: #222;
92
  color: #fff;
93
  font-size: 17px;
94
  font-family: "Helvetica Neue Light", "HelveticaNeue-Light", "Helvetica Neue", Calibri, Helvetica, Arial;
95
  box-sizing: border-box; }
96
  .cc_container ::-moz-selection {
97
    background: #ff5e99;
98
    color: #fff;
99
    text-shadow: none; }
100
  .cc_container .cc_btn,
101
  .cc_container .cc_btn:visited {
102
    color: #000;
103
    background-color: #f1d600;
104
    transition: background 200ms ease-in-out, color 200ms ease-in-out, box-shadow 200ms ease-in-out;
105
    -webkit-transition: background 200ms ease-in-out, color 200ms ease-in-out, box-shadow 200ms ease-in-out;
106
    border-radius: 5px;
107
    -webkit-border-radius: 5px; }
108
  .cc_container .cc_btn:hover,
109
  .cc_container .cc_btn:active {
110
    background-color: #fff;
111
    color: #000; }
112
  .cc_container a,
113
  .cc_container a:visited {
114
    text-decoration: none;
115
    color: #31a8f0;
116
    transition: 200ms color; }
117
  .cc_container a:hover,
118
  .cc_container a:active {
119
    color: #b2f7ff; }
120
121
/* Fade in up
122
------------------------------------ */
123
@-webkit-keyframes slideUp {
124
  0% {
125
    -webkit-transform: translateY(66px);
126
    transform: translateY(66px); }
127
  100% {
128
    -webkit-transform: translateY(0);
129
    transform: translateY(0); } }
130
@keyframes slideUp {
131
  0% {
132
    -webkit-transform: translateY(66px);
133
    -ms-transform: translateY(66px);
134
    transform: translateY(66px); }
135
  100% {
136
    -webkit-transform: translateY(0);
137
    -ms-transform: translateY(0);
138
    transform: translateY(0); } }
139
.cc_container,
140
.cc_message,
141
.cc_btn {
142
  animation-duration: 0.8s;
143
  -webkit-animation-duration: 0.8s;
144
  -moz-animation-duration: 0.8s;
145
  -o-animation-duration: 0.8s;
146
  -webkit-animation-name: slideUp;
147
  animation-name: slideUp; }

+ 178 - 0
silktide/styles/dark-floating-tada.css

@ -0,0 +1,178 @@
1
.cc_banner-wrapper {
2
  z-index: 9001;
3
  position: relative; }
4
5
.cc_container .cc_btn {
6
  cursor: pointer;
7
  text-align: center;
8
  font-size: 0.6em;
9
  transition: font-size 200ms;
10
  line-height: 1em; }
11
.cc_container .cc_message {
12
  font-size: 0.6em;
13
  transition: font-size 200ms;
14
  margin: 0;
15
  padding: 0;
16
  line-height: 1.5em; }
17
.cc_container .cc_logo {
18
  display: none;
19
  text-indent: -1000px;
20
  overflow: hidden;
21
  width: 100px;
22
  height: 22px;
23
  background-size: cover;
24
  background-image: url(../cookie-consent-logo.png);
25
  opacity: 0.9;
26
  transition: opacity 200ms; }
27
.cc_container .cc_logo:hover,
28
.cc_container .cc_logo:active {
29
  opacity: 1; }
30
31
@media screen and (min-width: 500px) {
32
  .cc_container .cc_btn {
33
    font-size: 0.8em; }
34
  .cc_container .cc_message {
35
    font-size: 0.8em; } }
36
@media screen and (min-width: 768px) {
37
  .cc_container .cc_btn {
38
    font-size: 1em; }
39
  .cc_container .cc_message {
40
    font-size: 1em;
41
    line-height: 1em; } }
42
@media screen and (min-width: 992px) {
43
  .cc_container .cc_message {
44
    font-size: 1em; } }
45
@media print {
46
  .cc_banner-wrapper,
47
  .cc_container {
48
    display: none; } }
49
.cc_container {
50
  position: fixed;
51
  left: 0;
52
  right: 0;
53
  bottom: 0;
54
  overflow: hidden;
55
  padding: 10px 15px 50px; }
56
  .cc_container .cc_btn {
57
    padding: 8px 16px;
58
    background-color: #f1d600;
59
    position: absolute;
60
    bottom: 10px;
61
    left: 15px;
62
    right: 15px;
63
    text-align: center; }
64
65
@media screen and (min-width: 500px) {
66
  .cc_container {
67
    left: initial;
68
    right: 20px;
69
    bottom: 20px;
70
    width: 300px;
71
    padding-bottom: 77px; }
72
    .cc_container .cc_btn {
73
      right: 15px;
74
      bottom: 37px; }
75
    .cc_container .cc_logo {
76
      display: block;
77
      position: absolute;
78
      bottom: 8px;
79
      left: calc(50% - 50px); } }
80
@media screen and (min-width: 768px) {
81
  .cc_container {
82
    padding-bottom: 87px; }
83
    .cc_container .cc_message {
84
      font-size: 1em; } }
85
.cc_container {
86
  background: #222;
87
  color: #fff;
88
  font-size: 17px;
89
  font-family: "Helvetica Neue Light", "HelveticaNeue-Light", "Helvetica Neue", Calibri, Helvetica, Arial;
90
  box-sizing: border-box; }
91
  .cc_container ::-moz-selection {
92
    background: #ff5e99;
93
    color: #fff;
94
    text-shadow: none; }
95
  .cc_container .cc_btn,
96
  .cc_container .cc_btn:visited {
97
    color: #000;
98
    background-color: #f1d600;
99
    transition: background 200ms ease-in-out, color 200ms ease-in-out, box-shadow 200ms ease-in-out;
100
    -webkit-transition: background 200ms ease-in-out, color 200ms ease-in-out, box-shadow 200ms ease-in-out;
101
    border-radius: 5px;
102
    -webkit-border-radius: 5px; }
103
  .cc_container .cc_btn:hover,
104
  .cc_container .cc_btn:active {
105
    background-color: #fff;
106
    color: #000; }
107
  .cc_container a,
108
  .cc_container a:visited {
109
    text-decoration: none;
110
    color: #31a8f0;
111
    transition: 200ms color; }
112
  .cc_container a:hover,
113
  .cc_container a:active {
114
    color: #b2f7ff; }
115
116
/* Tada
117
------------------------------------------ */
118
@-webkit-keyframes tada {
119
  0% {
120
    -webkit-transform: scale(1); }
121
  10%, 20% {
122
    -webkit-transform: scale(0.9) rotate(-3deg); }
123
  30%, 50%, 70%, 90% {
124
    -webkit-transform: scale(1.1) rotate(3deg); }
125
  40%, 60%, 80% {
126
    -webkit-transform: scale(1.1) rotate(-3deg); }
127
  100% {
128
    -webkit-transform: scale(1) rotate(0); } }
129
@-moz-keyframes tada {
130
  0% {
131
    -moz-transform: scale(1); }
132
  10%, 20% {
133
    -moz-transform: scale(0.9) rotate(-3deg); }
134
  30%, 50%, 70%, 90% {
135
    -moz-transform: scale(1.1) rotate(3deg); }
136
  40%, 60%, 80% {
137
    -moz-transform: scale(1.1) rotate(-3deg); }
138
  100% {
139
    -moz-transform: scale(1) rotate(0); } }
140
@-o-keyframes tada {
141
  0% {
142
    -o-transform: scale(1); }
143
  10%, 20% {
144
    -o-transform: scale(0.9) rotate(-3deg); }
145
  30%, 50%, 70%, 90% {
146
    -o-transform: scale(1.1) rotate(3deg); }
147
  40%, 60%, 80% {
148
    -o-transform: scale(1.1) rotate(-3deg); }
149
  100% {
150
    -o-transform: scale(1) rotate(0); } }
151
@keyframes tada {
152
  0% {
153
    transform: scale(1); }
154
  10%, 20% {
155
    transform: scale(0.9) rotate(-3deg); }
156
  30%, 50%, 70%, 90% {
157
    transform: scale(1.1) rotate(3deg); }
158
  40%, 60%, 80% {
159
    transform: scale(1.1) rotate(-3deg); }
160
  100% {
161
    transform: scale(1) rotate(0); } }
162
.cc_container {
163
  -webkit-animation-duration: 0.6s;
164
  animation-duration: 0.6s;
165
  -webkit-animation-fill-mode: both;
166
  animation-fill-mode: both;
167
  -webkit-animation-duration: 0.8s;
168
  -moz-animation-duration: 0.8s;
169
  -o-animation-duration: 0.8s;
170
  animation-duration: 0.8s;
171
  -webkit-animation-fill-mode: both;
172
  -moz-animation-fill-mode: both;
173
  -o-animation-fill-mode: both;
174
  animation-fill-mode: both;
175
  -webkit-animation-name: tada;
176
  -moz-animation-name: tada;
177
  -o-animation-name: tada;
178
  animation-name: tada; }

+ 150 - 0
silktide/styles/dark-floating.css

@ -0,0 +1,150 @@
1
.cc_banner-wrapper {
2
  z-index: 9001;
3
  position: relative; }
4
5
.cc_container .cc_btn {
6
  cursor: pointer;
7
  text-align: center;
8
  font-size: 0.6em;
9
  transition: font-size 200ms;
10
  line-height: 1em; }
11
.cc_container .cc_message {
12
  font-size: 0.6em;
13
  transition: font-size 200ms;
14
  margin: 0;
15
  padding: 0;
16
  line-height: 1.5em; }
17
.cc_container .cc_logo {
18
  display: none;
19
  text-indent: -1000px;
20
  overflow: hidden;
21
  width: 100px;
22
  height: 22px;
23
  background-size: cover;
24
  background-image: url(../cookie-consent-logo.png);
25
  opacity: 0.9;
26
  transition: opacity 200ms; }
27
.cc_container .cc_logo:hover,
28
.cc_container .cc_logo:active {
29
  opacity: 1; }
30
31
@media screen and (min-width: 500px) {
32
  .cc_container .cc_btn {
33
    font-size: 0.8em; }
34
  .cc_container .cc_message {
35
    font-size: 0.8em; } }
36
@media screen and (min-width: 768px) {
37
  .cc_container .cc_btn {
38
    font-size: 1em; }
39
  .cc_container .cc_message {
40
    font-size: 1em;
41
    line-height: 1em; } }
42
@media screen and (min-width: 992px) {
43
  .cc_container .cc_message {
44
    font-size: 1em; } }
45
@media print {
46
  .cc_banner-wrapper,
47
  .cc_container {
48
    display: none; } }
49
.cc_container {
50
  position: fixed;
51
  left: 0;
52
  right: 0;
53
  bottom: 0;
54
  overflow: hidden;
55
  padding: 10px 15px 50px; }
56
  .cc_container .cc_btn {
57
    padding: 8px 16px;
58
    background-color: #f1d600;
59
    position: absolute;
60
    bottom: 10px;
61
    left: 15px;
62
    right: 15px;
63
    text-align: center; }
64
65
@media screen and (min-width: 500px) {
66
  .cc_container {
67
    left: initial;
68
    right: 20px;
69
    bottom: 20px;
70
    width: 300px;
71
    padding-bottom: 77px; }
72
    .cc_container .cc_btn {
73
      right: 15px;
74
      bottom: 37px; }
75
    .cc_container .cc_logo {
76
      display: block;
77
      position: absolute;
78
      bottom: 8px;
79
      left: calc(50% - 50px); } }
80
@media screen and (min-width: 768px) {
81
  .cc_container {
82
    padding-bottom: 87px; }
83
    .cc_container .cc_message {
84
      font-size: 1em; } }
85
.cc_container {
86
  background: #222;
87
  color: #fff;
88
  font-size: 17px;
89
  font-family: "Helvetica Neue Light", "HelveticaNeue-Light", "Helvetica Neue", Calibri, Helvetica, Arial;
90
  box-sizing: border-box; }
91
  .cc_container ::-moz-selection {
92
    background: #ff5e99;
93
    color: #fff;
94
    text-shadow: none; }
95
  .cc_container .cc_btn,
96
  .cc_container .cc_btn:visited {
97
    color: #000;
98
    background-color: #f1d600;
99
    transition: background 200ms ease-in-out, color 200ms ease-in-out, box-shadow 200ms ease-in-out;
100
    -webkit-transition: background 200ms ease-in-out, color 200ms ease-in-out, box-shadow 200ms ease-in-out;
101
    border-radius: 5px;
102
    -webkit-border-radius: 5px; }
103
  .cc_container .cc_btn:hover,
104
  .cc_container .cc_btn:active {
105
    background-color: #fff;
106
    color: #000; }
107
  .cc_container a,
108
  .cc_container a:visited {
109
    text-decoration: none;
110
    color: #31a8f0;
111
    transition: 200ms color; }
112
  .cc_container a:hover,
113
  .cc_container a:active {
114
    color: #b2f7ff; }
115
116
@-webkit-keyframes fadeInRight {
117
  0% {
118
    opacity: 0;
119
    -webkit-transform: translateX(20px);
120
    transform: translateX(20px); }
121
  100% {
122
    opacity: 1;
123
    -webkit-transform: translateX(0);
124
    transform: translateX(0); } }
125
@keyframes fadeInRight {
126
  0% {
127
    opacity: 0;
128
    -webkit-transform: translateX(20px);
129
    -ms-transform: translateX(20px);
130
    transform: translateX(20px); }
131
  100% {
132
    opacity: 1;
133
    -webkit-transform: translateX(0);
134
    -ms-transform: translateX(0);
135
    transform: translateX(0); } }
136
.cc_container {
137
  -webkit-animation-duration: 0.6s;
138
  animation-duration: 0.6s;
139
  -webkit-animation-fill-mode: both;
140
  animation-fill-mode: both;
141
  -webkit-animation-duration: 0.8s;
142
  -moz-animation-duration: 0.8s;
143
  -o-animation-duration: 0.8s;
144
  animation-duration: 0.8s;
145
  -webkit-animation-fill-mode: both;
146
  -moz-animation-fill-mode: both;
147
  -o-animation-fill-mode: both;
148
  animation-fill-mode: both;
149
  -webkit-animation-name: fadeInRight;
150
  animation-name: fadeInRight; }

+ 102 - 0
silktide/styles/dark-inline.css

@ -0,0 +1,102 @@
1
.cc_banner-wrapper {
2
  z-index: 9001;
3
  position: relative; }
4
5
.cc_container .cc_btn {
6
  cursor: pointer;
7
  text-align: center;
8
  font-size: 0.6em;
9
  transition: font-size 200ms;
10
  line-height: 1em; }
11
.cc_container .cc_message {
12
  font-size: 0.6em;
13
  transition: font-size 200ms;
14
  margin: 0;
15
  padding: 0;
16
  line-height: 1.5em; }
17
.cc_container .cc_logo {
18
  display: none;
19
  text-indent: -1000px;
20
  overflow: hidden;
21
  width: 100px;
22
  height: 22px;
23
  background-size: cover;
24
  background-image: url(../cookie-consent-logo.png);
25
  opacity: 0.9;
26
  transition: opacity 200ms; }
27
.cc_container .cc_logo:hover,
28
.cc_container .cc_logo:active {
29
  opacity: 1; }
30
31
@media screen and (min-width: 500px) {
32
  .cc_container .cc_btn {
33
    font-size: 0.8em; }
34
  .cc_container .cc_message {
35
    font-size: 0.8em; } }
36
@media screen and (min-width: 768px) {
37
  .cc_container .cc_btn {
38
    font-size: 1em; }
39
  .cc_container .cc_message {
40
    font-size: 1em;
41
    line-height: 1em; } }
42
@media screen and (min-width: 992px) {
43
  .cc_container .cc_message {
44
    font-size: 1em; } }
45
@media print {
46
  .cc_banner-wrapper,
47
  .cc_container {
48
    display: none; } }
49
.cc_container {
50
  overflow: hidden;
51
  padding: 10px; }
52
  .cc_container .cc_btn {
53
    padding: 8px 10px;
54
    background-color: #f1d600;
55
    cursor: pointer;
56
    text-align: center;
57
    display: block;
58
    width: 33%;
59
    margin-left: 10px;
60
    float: right;
61
    max-width: 120px; }
62
  .cc_container .cc_message {
63
    display: block; }
64
65
@media screen and (min-width: 500px) {
66
  .cc_container .cc_message {
67
    margin-top: 0.5em; } }
68
@media screen and (min-width: 768px) {
69
  .cc_container {
70
    padding: 15px 30px 15px; }
71
    .cc_container .cc_btn {
72
      padding: 8px 15px; } }
73
.cc_container {
74
  background: #222;
75
  color: #fff;
76
  font-size: 17px;
77
  font-family: "Helvetica Neue Light", "HelveticaNeue-Light", "Helvetica Neue", Calibri, Helvetica, Arial;
78
  box-sizing: border-box; }
79
  .cc_container ::-moz-selection {
80
    background: #ff5e99;
81
    color: #fff;
82
    text-shadow: none; }
83
  .cc_container .cc_btn,
84
  .cc_container .cc_btn:visited {
85
    color: #000;
86
    background-color: #f1d600;
87
    transition: background 200ms ease-in-out, color 200ms ease-in-out, box-shadow 200ms ease-in-out;
88
    -webkit-transition: background 200ms ease-in-out, color 200ms ease-in-out, box-shadow 200ms ease-in-out;
89
    border-radius: 5px;
90
    -webkit-border-radius: 5px; }
91
  .cc_container .cc_btn:hover,
92
  .cc_container .cc_btn:active {
93
    background-color: #fff;
94
    color: #000; }
95
  .cc_container a,
96
  .cc_container a:visited {
97
    text-decoration: none;
98
    color: #31a8f0;
99
    transition: 200ms color; }
100
  .cc_container a:hover,
101
  .cc_container a:active {
102
    color: #b2f7ff; }

+ 145 - 0
silktide/styles/dark-top.css

@ -0,0 +1,145 @@
1
.cc_banner-wrapper {
2
  z-index: 9001;
3
  position: relative; }
4
5
.cc_container .cc_btn {
6
  cursor: pointer;
7
  text-align: center;
8
  font-size: 0.6em;
9
  transition: font-size 200ms;
10
  line-height: 1em; }
11
.cc_container .cc_message {
12
  font-size: 0.6em;
13
  transition: font-size 200ms;
14
  margin: 0;
15
  padding: 0;
16
  line-height: 1.5em; }
17
.cc_container .cc_logo {
18
  display: none;
19
  text-indent: -1000px;
20
  overflow: hidden;
21
  width: 100px;
22
  height: 22px;
23
  background-size: cover;
24
  background-image: url(../cookie-consent-logo.png);
25
  opacity: 0.9;
26
  transition: opacity 200ms; }
27
.cc_container .cc_logo:hover,
28
.cc_container .cc_logo:active {
29
  opacity: 1; }
30
31
@media screen and (min-width: 500px) {
32
  .cc_container .cc_btn {
33
    font-size: 0.8em; }
34
  .cc_container .cc_message {
35
    font-size: 0.8em; } }
36
@media screen and (min-width: 768px) {
37
  .cc_container .cc_btn {
38
    font-size: 1em; }
39
  .cc_container .cc_message {
40
    font-size: 1em;
41
    line-height: 1em; } }
42
@media screen and (min-width: 992px) {
43
  .cc_container .cc_message {
44
    font-size: 1em; } }
45
@media print {
46
  .cc_banner-wrapper,
47
  .cc_container {
48
    display: none; } }
49
.cc_banner-wrapper {
50
  height: 66px; }
51
52
.cc_container {
53
  padding: 15px 15px 15px;
54
  overflow: hidden;
55
  position: fixed;
56
  top: 0;
57
  left: 0;
58
  right: 0; }
59
  .cc_container .cc_btn {
60
    padding: 8px 10px;
61
    background-color: #f1d600;
62
    cursor: pointer;
63
    text-align: center;
64
    display: block;
65
    width: 33%;
66
    margin-left: 10px;
67
    float: right;
68
    max-width: 120px; }
69
  .cc_container .cc_message {
70
    display: block; }
71
72
@media screen and (min-width: 500px) {
73
  .cc_container .cc_message {
74
    margin-top: 0.5em; } }
75
@media screen and (min-width: 768px) {
76
  .cc_container {
77
    padding: 15px 30px 15px; }
78
    .cc_container .cc_btn {
79
      padding: 8px 15px; } }
80
.cc_container {
81
  background: #222;
82
  color: #fff;
83
  font-size: 17px;
84
  font-family: "Helvetica Neue Light", "HelveticaNeue-Light", "Helvetica Neue", Calibri, Helvetica, Arial;
85
  box-sizing: border-box; }
86
  .cc_container ::-moz-selection {
87
    background: #ff5e99;
88
    color: #fff;
89
    text-shadow: none; }
90
  .cc_container .cc_btn,
91
  .cc_container .cc_btn:visited {
92
    color: #000;
93
    background-color: #f1d600;
94
    transition: background 200ms ease-in-out, color 200ms ease-in-out, box-shadow 200ms ease-in-out;
95
    -webkit-transition: background 200ms ease-in-out, color 200ms ease-in-out, box-shadow 200ms ease-in-out;
96
    border-radius: 5px;
97
    -webkit-border-radius: 5px; }
98
  .cc_container .cc_btn:hover,
99
  .cc_container .cc_btn:active {
100
    background-color: #fff;
101
    color: #000; }
102
  .cc_container a,
103
  .cc_container a:visited {
104
    text-decoration: none;
105
    color: #31a8f0;
106
    transition: 200ms color; }
107
  .cc_container a:hover,
108
  .cc_container a:active {
109
    color: #b2f7ff; }
110
111
@-webkit-keyframes slideDown {
112
  0% {
113
    margin-top: -66px; }
114
  100% {
115
    margin-top: 0; } }
116
@keyframes slideDown {
117
  0% {
118
    margin-top: -66px; }
119
  100% {
120
    margin-top: 0px; } }
121
@-webkit-keyframes growDown {
122
  0% {
123
    height: 0; }
124
  100% {
125
    height: 66px; } }
126
@keyframes growDown {
127
  0% {
128
    height: 0; }
129
  100% {
130
    height: 66px; } }
131
.cc_container {
132
  -webkit-animation-duration: 0.8s;
133
  -moz-animation-duration: 0.8s;
134
  -o-animation-duration: 0.8s;
135
  animation-duration: 0.8s;
136
  -webkit-animation-name: slideDown;
137
  animation-name: slideDown; }
138
139
.cc_banner-wrapper {
140
  -webkit-animation-duration: 0.8s;
141
  -moz-animation-duration: 0.8s;
142
  -o-animation-duration: 0.8s;
143
  animation-duration: 0.8s;
144
  -webkit-animation-name: growDown;
145
  animation-name: growDown; }

+ 148 - 0
silktide/styles/light-bottom.css

@ -0,0 +1,148 @@
1
.cc_banner-wrapper {
2
  z-index: 9001;
3
  position: relative; }
4
5
.cc_container .cc_btn {
6
  cursor: pointer;
7
  text-align: center;
8
  font-size: 0.6em;
9
  transition: font-size 200ms;
10
  line-height: 1em; }
11
.cc_container .cc_message {
12
  font-size: 0.6em;
13
  transition: font-size 200ms;
14
  margin: 0;
15
  padding: 0;
16
  line-height: 1.5em; }
17
.cc_container .cc_logo {
18
  display: none;
19
  text-indent: -1000px;
20
  overflow: hidden;
21
  width: 100px;
22
  height: 22px;
23
  background-size: cover;
24
  background-image: url(../cookie-consent-logo.png);
25
  opacity: 0.9;
26
  transition: opacity 200ms; }
27
.cc_container .cc_logo:hover,
28
.cc_container .cc_logo:active {
29
  opacity: 1; }
30
31
@media screen and (min-width: 500px) {
32
  .cc_container .cc_btn {
33
    font-size: 0.8em; }
34
  .cc_container .cc_message {
35
    font-size: 0.8em; } }
36
@media screen and (min-width: 768px) {
37
  .cc_container .cc_btn {
38
    font-size: 1em; }
39
  .cc_container .cc_message {
40
    font-size: 1em;
41
    line-height: 1em; } }
42
@media screen and (min-width: 992px) {
43
  .cc_container .cc_message {
44
    font-size: 1em; } }
45
@media print {
46
  .cc_banner-wrapper,
47
  .cc_container {
48
    display: none; } }
49
.cc_container {
50
  position: fixed;
51
  left: 0;
52
  right: 0;
53
  bottom: 0;
54
  overflow: hidden;
55
  padding: 10px; }
56
  .cc_container .cc_btn {
57
    padding: 8px 10px;
58
    background-color: #f1d600;
59
    cursor: pointer;
60
    transition: font-size 200ms;
61
    text-align: center;
62
    font-size: 0.6em;
63
    display: block;
64
    width: 33%;
65
    margin-left: 10px;
66
    float: right;
67
    max-width: 120px; }
68
  .cc_container .cc_message {
69
    transition: font-size 200ms;
70
    font-size: 0.6em;
71
    display: block; }
72
73
@media screen and (min-width: 500px) {
74
  .cc_container .cc_btn {
75
    font-size: 0.8em; }
76
  .cc_container .cc_message {
77
    margin-top: 0.5em;
78
    font-size: 0.8em; } }
79
@media screen and (min-width: 768px) {
80
  .cc_container {
81
    padding: 15px 30px 15px; }
82
    .cc_container .cc_btn {
83
      font-size: 1em;
84
      padding: 8px 15px; }
85
    .cc_container .cc_message {
86
      font-size: 1em; } }
87
@media screen and (min-width: 992px) {
88
  .cc_container .cc_message {
89
    font-size: 1em; } }
90
.cc_container {
91
  background: #fff;
92
  color: #999;
93
  font-size: 17px;
94
  font-family: "Helvetica Neue Light", "HelveticaNeue-Light", "Helvetica Neue", Calibri, Helvetica, Arial;
95
  box-sizing: border-box;
96
  border: 1px solid #ccc; }
97
  .cc_container ::-moz-selection {
98
    background: #ff5e99;
99
    color: #fff;
100
    text-shadow: none; }
101
  .cc_container .cc_btn,
102
  .cc_container .cc_btn:visited {
103
    color: #000;
104
    background-color: #f1d600;
105
    transition: background 200ms ease-in-out, color 200ms ease-in-out, box-shadow 200ms ease-in-out;
106
    -webkit-transition: background 200ms ease-in-out, color 200ms ease-in-out, box-shadow 200ms ease-in-out;
107
    border-radius: 5px;
108
    -webkit-border-radius: 5px; }
109
  .cc_container .cc_btn:hover,
110
  .cc_container .cc_btn:active {
111
    background-color: #d8bf00;
112
    color: #000; }
113
  .cc_container a,
114
  .cc_container a:visited {
115
    text-decoration: none;
116
    color: #31a8f0;
117
    transition: 200ms color; }
118
  .cc_container a:hover,
119
  .cc_container a:active {
120
    color: #555; }
121
122
/* Fade in up
123
------------------------------------ */
124
@-webkit-keyframes slideUp {
125
  0% {
126
    -webkit-transform: translateY(66px);
127
    transform: translateY(66px); }
128
  100% {
129
    -webkit-transform: translateY(0);
130
    transform: translateY(0); } }
131
@keyframes slideUp {
132
  0% {
133
    -webkit-transform: translateY(66px);
134
    -ms-transform: translateY(66px);
135
    transform: translateY(66px); }
136
  100% {
137
    -webkit-transform: translateY(0);
138
    -ms-transform: translateY(0);
139
    transform: translateY(0); } }
140
.cc_container,
141
.cc_message,
142
.cc_btn {
143
  animation-duration: 0.8s;
144
  -webkit-animation-duration: 0.8s;
145
  -moz-animation-duration: 0.8s;
146
  -o-animation-duration: 0.8s;
147
  -webkit-animation-name: slideUp;
148
  animation-name: slideUp; }

+ 156 - 0
silktide/styles/light-floating.css

@ -0,0 +1,156 @@
1
.cc_banner-wrapper {
2
  z-index: 9001;
3
  position: relative; }
4
5
.cc_container .cc_btn {
6
  cursor: pointer;
7
  text-align: center;
8
  font-size: 0.6em;
9
  transition: font-size 200ms;
10
  line-height: 1em; }
11
.cc_container .cc_message {
12
  font-size: 0.6em;
13
  transition: font-size 200ms;
14
  margin: 0;
15
  padding: 0;
16
  line-height: 1.5em; }
17
.cc_container .cc_logo {
18
  display: none;
19
  text-indent: -1000px;
20
  overflow: hidden;
21
  width: 100px;
22
  height: 22px;
23
  background-size: cover;
24
  background-image: url(../cookie-consent-logo.png);
25
  opacity: 0.9;
26
  transition: opacity 200ms; }
27
.cc_container .cc_logo:hover,
28
.cc_container .cc_logo:active {
29
  opacity: 1; }
30
31
@media screen and (min-width: 500px) {
32
  .cc_container .cc_btn {
33
    font-size: 0.8em; }
34
  .cc_container .cc_message {
35
    font-size: 0.8em; } }
36
@media screen and (min-width: 768px) {
37
  .cc_container .cc_btn {
38
    font-size: 1em; }
39
  .cc_container .cc_message {
40
    font-size: 1em;
41
    line-height: 1em; } }
42
@media screen and (min-width: 992px) {
43
  .cc_container .cc_message {
44
    font-size: 1em; } }
45
@media print {
46
  .cc_banner-wrapper,
47
  .cc_container {
48
    display: none; } }
49
.cc_container {
50
  position: fixed;
51
  left: 0;
52
  right: 0;
53
  bottom: 0;
54
  overflow: hidden;
55
  padding: 10px 15px 50px; }
56
  .cc_container .cc_btn {
57
    padding: 8px 16px;
58
    background-color: #f1d600;
59
    position: absolute;
60
    bottom: 10px;
61
    left: 15px;
62
    right: 15px;
63
    text-align: center; }
64
65
@media screen and (min-width: 500px) {
66
  .cc_container {
67
    left: initial;
68
    right: 20px;
69
    bottom: 20px;
70
    width: 300px;
71
    padding-bottom: 77px; }
72
    .cc_container .cc_btn {
73
      right: 15px;
74
      bottom: 37px; }
75
    .cc_container .cc_logo {
76
      display: block;
77
      position: absolute;
78
      bottom: 8px;
79
      left: calc(50% - 50px); } }
80
@media screen and (min-width: 768px) {
81
  .cc_container {
82
    padding-bottom: 87px; }
83
    .cc_container .cc_message {
84
      font-size: 1em; } }
85
.cc_container {
86
  background: #fff;
87
  color: #999;
88
  font-size: 17px;
89
  font-family: "Helvetica Neue Light", "HelveticaNeue-Light", "Helvetica Neue", Calibri, Helvetica, Arial;
90
  box-sizing: border-box;
91
  border: 1px solid #ccc; }
92
  .cc_container ::-moz-selection {
93
    background: #ff5e99;
94
    color: #fff;
95
    text-shadow: none; }
96
  .cc_container .cc_btn,
97
  .cc_container .cc_btn:visited {
98
    color: #000;
99
    background-color: #f1d600;
100
    transition: background 200ms ease-in-out, color 200ms ease-in-out, box-shadow 200ms ease-in-out;
101
    -webkit-transition: background 200ms ease-in-out, color 200ms ease-in-out, box-shadow 200ms ease-in-out;
102
    border-radius: 5px;
103
    -webkit-border-radius: 5px; }
104
  .cc_container .cc_btn:hover,
105
  .cc_container .cc_btn:active {
106
    background-color: #d8bf00;
107
    color: #000; }
108
  .cc_container a,
109
  .cc_container a:visited {
110
    text-decoration: none;
111
    color: #31a8f0;
112
    transition: 200ms color; }
113
  .cc_container a:hover,
114
  .cc_container a:active {
115
    color: #555; }
116
117
@-webkit-keyframes fadeInRight {
118
  0% {
119
    opacity: 0;
120
    -webkit-transform: translateX(20px);
121
    transform: translateX(20px); }
122
  100% {
123
    opacity: 1;
124
    -webkit-transform: translateX(0);
125
    transform: translateX(0); } }
126
@keyframes fadeInRight {
127
  0% {
128
    opacity: 0;
129
    -webkit-transform: translateX(20px);
130
    -ms-transform: translateX(20px);
131
    transform: translateX(20px); }
132
  100% {
133
    opacity: 1;
134
    -webkit-transform: translateX(0);
135
    -ms-transform: translateX(0);
136
    transform: translateX(0); } }
137
.cc_container {
138
  -webkit-animation-duration: 0.6s;
139
  animation-duration: 0.6s;
140
  -webkit-animation-fill-mode: both;
141
  animation-fill-mode: both;
142
  -webkit-animation-duration: 0.8s;
143
  -moz-animation-duration: 0.8s;
144
  -o-animation-duration: 0.8s;
145
  animation-duration: 0.8s;
146
  -webkit-animation-fill-mode: both;
147
  -moz-animation-fill-mode: both;
148
  -o-animation-fill-mode: both;
149
  animation-fill-mode: both;
150
  -webkit-animation-name: fadeInRight;
151
  animation-name: fadeInRight; }
152
153
@media screen and (min-width: 500px) {
154
  .cc_container {
155
    border-radius: 5px;
156
    box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.2); } }

+ 146 - 0
silktide/styles/light-top.css

@ -0,0 +1,146 @@
1
.cc_banner-wrapper {
2
  z-index: 9001;
3
  position: relative; }
4
5
.cc_container .cc_btn {
6
  cursor: pointer;
7
  text-align: center;
8
  font-size: 0.6em;
9
  transition: font-size 200ms;
10
  line-height: 1em; }
11
.cc_container .cc_message {
12
  font-size: 0.6em;
13
  transition: font-size 200ms;
14
  margin: 0;
15
  padding: 0;
16
  line-height: 1.5em; }
17
.cc_container .cc_logo {
18
  display: none;
19
  text-indent: -1000px;
20
  overflow: hidden;
21
  width: 100px;
22
  height: 22px;
23
  background-size: cover;
24
  background-image: url(../cookie-consent-logo.png);
25
  opacity: 0.9;
26
  transition: opacity 200ms; }
27
.cc_container .cc_logo:hover,
28
.cc_container .cc_logo:active {
29
  opacity: 1; }
30
31
@media screen and (min-width: 500px) {
32
  .cc_container .cc_btn {
33
    font-size: 0.8em; }
34
  .cc_container .cc_message {
35
    font-size: 0.8em; } }
36
@media screen and (min-width: 768px) {
37
  .cc_container .cc_btn {
38
    font-size: 1em; }
39
  .cc_container .cc_message {
40
    font-size: 1em;
41
    line-height: 1em; } }
42
@media screen and (min-width: 992px) {
43
  .cc_container .cc_message {
44
    font-size: 1em; } }
45
@media print {
46
  .cc_banner-wrapper,
47
  .cc_container {
48
    display: none; } }
49
.cc_banner-wrapper {
50
  height: 66px; }
51
52
.cc_container {
53
  padding: 15px 15px 15px;
54
  overflow: hidden;
55
  position: fixed;
56
  top: 0;
57
  left: 0;
58
  right: 0; }
59
  .cc_container .cc_btn {
60
    padding: 8px 10px;
61
    background-color: #f1d600;
62
    cursor: pointer;
63
    text-align: center;
64
    display: block;
65
    width: 33%;
66
    margin-left: 10px;
67
    float: right;
68
    max-width: 120px; }
69
  .cc_container .cc_message {
70
    display: block; }
71
72
@media screen and (min-width: 500px) {
73
  .cc_container .cc_message {
74
    margin-top: 0.5em; } }
75
@media screen and (min-width: 768px) {
76
  .cc_container {
77
    padding: 15px 30px 15px; }
78
    .cc_container .cc_btn {
79
      padding: 8px 15px; } }
80
.cc_container {
81
  background: #fff;
82
  color: #999;
83
  font-size: 17px;
84
  font-family: "Helvetica Neue Light", "HelveticaNeue-Light", "Helvetica Neue", Calibri, Helvetica, Arial;
85
  box-sizing: border-box;
86
  border: 1px solid #ccc; }
87
  .cc_container ::-moz-selection {
88
    background: #ff5e99;
89
    color: #fff;
90
    text-shadow: none; }
91
  .cc_container .cc_btn,
92
  .cc_container .cc_btn:visited {
93
    color: #000;
94
    background-color: #f1d600;
95
    transition: background 200ms ease-in-out, color 200ms ease-in-out, box-shadow 200ms ease-in-out;
96
    -webkit-transition: background 200ms ease-in-out, color 200ms ease-in-out, box-shadow 200ms ease-in-out;
97
    border-radius: 5px;
98
    -webkit-border-radius: 5px; }
99
  .cc_container .cc_btn:hover,
100
  .cc_container .cc_btn:active {
101
    background-color: #d8bf00;
102
    color: #000; }
103
  .cc_container a,
104
  .cc_container a:visited {
105
    text-decoration: none;
106
    color: #31a8f0;
107
    transition: 200ms color; }
108
  .cc_container a:hover,
109
  .cc_container a:active {
110
    color: #555; }
111
112
@-webkit-keyframes slideDown {
113
  0% {
114
    margin-top: -66px; }
115
  100% {
116
    margin-top: 0; } }
117
@keyframes slideDown {
118
  0% {
119
    margin-top: -66px; }
120
  100% {
121
    margin-top: 0px; } }
122
@-webkit-keyframes growDown {
123
  0% {
124
    height: 0; }
125
  100% {
126
    height: 66px; } }
127
@keyframes growDown {
128
  0% {
129
    height: 0; }
130
  100% {
131
    height: 66px; } }
132
.cc_container {
133
  -webkit-animation-duration: 0.8s;
134
  -moz-animation-duration: 0.8s;
135
  -o-animation-duration: 0.8s;
136
  animation-duration: 0.8s;
137
  -webkit-animation-name: slideDown;
138
  animation-name: slideDown; }
139
140
.cc_banner-wrapper {
141
  -webkit-animation-duration: 0.8s;
142
  -moz-animation-duration: 0.8s;
143
  -o-animation-duration: 0.8s;
144
  animation-duration: 0.8s;
145
  -webkit-animation-name: growDown;
146
  animation-name: growDown; }

+ 19 - 0
styles.css

@ -0,0 +1,19 @@
1
/*
2
 * CSS for admin pages of EU Cookie Consent
3
 */
4
5
.eucc-theme-select {
6
  width: 170px;
7
  float:left;
8
  text-align:center;
9
  padding: 10px;
10
}
11
12
.eucc-theme-select img {
13
  width: 150px;
14
  text-align:center;
15
}
16
17
.biginput {
18
  width: 450px;
19
}