mediawiki-skins-Citizen/skinStyles/extensions/CookieWarning/ext.CookieWarning.styles.less
alistair3149 f72af5e76d
Improve CI and code clean up (#143)
* Replace existing grunt linter

* Fix stylesheet issues picked up by stylelint

* Update the git workflow

* Fix incorrect slash in workflow file

* Github CI lint - eslint/stylelint

* Clean up composer

* Fix phpcb error

* MediaWiki CI

* Change commit message

* Update status badge

* Add JSDoc

* Add SVGO

* Make a dinner reservation - MediaWiki CI

I clean up code to MediaWiki standards

* Optimize SVG files with SVGO

Co-authored-by: github-actions <github-actions@users.noreply.github.com>
2020-06-16 22:49:41 -04:00

103 lines
1.6 KiB
Plaintext

/*
* Citizen - Cookie Warning Styles
* https://starcitizen.tools
*/
@import '../../../resources/variables.less';
@import '../../../resources/mixins.less';
.mw-cookiewarning-container {
top: unset;
right: 0;
bottom: @margin-side;
margin: 0 auto;
padding: 0;
max-width: @page-width;
opacity: 1;
background: @base-20;
font-size: @content-small-text-size;
font-weight: normal;
.boxshadow(5);
.mw-cookiewarning-text {
display: flex;
line-height: 1.4;
> * {
display: flex;
align-items: center;
}
span {
margin: 0;
padding: @margin-side * 0.75 @margin-side;
display: block;
flex-grow: 1;
}
.mw-cookiewarning-dismiss {
background: @accent-50;
height: 100%;
&:hover {
background: @accent-10;
}
}
> a {
background: @base-10;
&:hover {
background: @base-0;
}
}
a,
.mw-cookiewarning-dismiss {
margin: 0;
padding: @margin-side * 0.75 @margin-side;
border-radius: 0;
font-weight: normal;
line-height: 1.4;
transition: @transition-background-quick;
}
a {
height: auto;
}
}
}
@media only screen and ( max-width: @screen1 ) {
.mw-cookiewarning-container {
max-width: none;
bottom: 0;
}
}
@media only screen and ( max-width: 480px ) {
.mw-cookiewarning-container .mw-cookiewarning-text {
/* Hack to hide nbsp */
font-size: 0;
flex-wrap: wrap;
span {
font-size: @content-small-text-size;
}
a {
width: ~'calc(50vw - @{margin-side} * 2)';
justify-content: center;
}
.mw-cookiewarning-dismiss {
width: 50vw;
}
a,
.mw-cookiewarning-dismiss {
padding: @margin-side / 2 @margin-side;
}
}
}