iwmlib/lib/card/test/example/_theme/css/popup.css

164 lines
3.1 KiB
CSS

/* Color */
/* Font Properties */
/* Spacing */
/* Borders */
/* Shadows */
/*
$context: "../../../../../..";
$white: #FEFEFE;
$shady-white: rgb(240, 240, 240);
$gray: #CCC;
$dark: #333;
$black: #222;
$small-edge-radius: 3px;
$big-edge-radius: 10px;
$small-pad: 16px;
$big-pad: 32px;
$tuebingen-red: #e73230;
$increased-letter-spacing: 0.1em;
$font-color: $black;
$text-font-size: 26px;
$medium-font-size: 28px;
$large-font-size: 32px;
$regular-font-size: 1.451rem;
$subtitle-font-size: $medium-font-size;
$title-font-size: $subtitle-font-size * 1.641;
/* Font Weights */
/*
$strong-font-weight: 700;
$medium-font-weight: 500;
$light-font-weight: 300;
*/
/* Color */
/* Font Properties */
/* Spacing */
/* Borders */
/* Shadows */
/*
$context: "../../../../../..";
$white: #FEFEFE;
$shady-white: rgb(240, 240, 240);
$gray: #CCC;
$dark: #333;
$black: #222;
$small-edge-radius: 3px;
$big-edge-radius: 10px;
$small-pad: 16px;
$big-pad: 32px;
$tuebingen-red: #e73230;
$increased-letter-spacing: 0.1em;
$font-color: $black;
$text-font-size: 26px;
$medium-font-size: 28px;
$large-font-size: 32px;
$regular-font-size: 1.451rem;
$subtitle-font-size: $medium-font-size;
$title-font-size: $subtitle-font-size * 1.641;
/* Font Weights */
/*
$strong-font-weight: 700;
$medium-font-weight: 500;
$light-font-weight: 300;
*/
@font-face {
font-family: "Material Icons";
font-style: normal;
font-weight: 400;
src: url(../fonts/material-icon-font/MaterialIcons-Regular.eot);
/* For IE6-8 */
src: local("Material Icons"), local("MaterialIcons-Regular"), url(../fonts/material-icon-font/MaterialIcons-Regular.woff2) format("woff2"), url(../fonts/material-icon-font/MaterialIcons-Regular.woff) format("woff"), url(../fonts/material-icon-font/MaterialIcons-Regular.ttf) format("truetype");
}
.material-icons {
font-family: 'Material Icons';
font-weight: normal;
font-style: normal;
font-size: 24px;
/* Preferred icon size */
display: inline-block;
line-height: 1;
text-transform: none;
letter-spacing: normal;
word-wrap: normal;
white-space: nowrap;
direction: ltr;
/* Support for all WebKit browsers. */
-webkit-font-smoothing: antialiased;
/* Support for Safari and Chrome. */
text-rendering: optimizeLegibility;
/* Support for Firefox. */
-moz-osx-font-smoothing: grayscale;
/* Support for IE. */
-webkit-font-feature-settings: 'liga';
font-feature-settings: 'liga';
}
.popup {
width: 800px;
width: -webkit-fit-content;
width: -moz-fit-content;
width: fit-content;
min-width: 400px;
color: #191919;
background-color: #f2f2f2;
border-radius: 3px;
-webkit-box-shadow: 0 0 100px rgba(0, 0, 0, 0.3), 2px 3px 25px rgba(0, 0, 0, 0.3), 0 0 4px rgba(0, 0, 0, 0.8);
box-shadow: 0 0 100px rgba(0, 0, 0, 0.3), 2px 3px 25px rgba(0, 0, 0, 0.3), 0 0 4px rgba(0, 0, 0, 0.8);
padding: 25.64px 40px;
}
.popup img {
display: block;
margin: auto;
}
.popup img:not(:first-child) {
margin-top: 20px;
}
.popup img:not(:last-child) {
margin-bottom: 20px;
}
.popup .notch {
width: 20px;
height: 20px;
border-color: #f2f2f2;
}
.PopupContent p:not(:last-child) {
margin-bottom: 30px;
}