passbolt-styleguide
Version:
Passbolt styleguide contains common styling assets used by the different sites, plugin, etc.
101 lines (99 loc) • 2.38 kB
CSS
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 400;
src: local('Open Sans'), local('OpenSans'), url('/fonts/opensans-regular.woff') format('woff');
}
html {
font-size: 62.5%;
line-height: normal;
-webkit-text-size-adjust: 100%;
}
body {
font-size: 1.4rem;
line-height: 1.9rem;
}
.storybook-intro-hero p {
font-size: 1.4rem;
line-height: 1.9rem;
max-width: 64rem;
margin: 0;
}
.storybook-intro-hero .button {
font-size: 1.5rem;
padding: 0.8rem 1.6rem;
line-height: 2rem;
position: relative;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
vertical-align: middle;
outline: none;
cursor: pointer;
text-align: center;
text-decoration: none;
border: none;
box-shadow: inset 0 0 0 1px #e0e0e0;
color: #000000;
background: #F8F8F8;
border-radius: 0.4rem;
box-sizing: border-box;
}
.storybook-intro-hero .button.primary {
background: #2894DF;
box-shadow: inset 0 0 0 0.1rem #2894df;
color: #FFFFFF;
}
.sbdocs-content {
width: 100%;
max-width: none;
padding: 0;
margin: 0;
border: 0;
}
.storybook-intro-hero {
height: 90vh;
width: 98vw;
display: flex;
position: relative;
align-items: center;
padding: 0 12% 0 14%;
box-sizing: border-box;
font-family: 'Open Sans', Verdana, sans-serif;
}
.storybook-intro-hero .storybook-intro-hero-left {
width: 45%;
display: flex;
flex-direction: column;
}
.storybook-intro-hero .storybook-intro-hero-left h1{
font-size: 2.2rem;
line-height: 3.2rem;
margin: 0.67em 0;
}
.storybook-intro-hero .storybook-intro-hero-left .storybook-intro-hero-subtitle {
font-size: 3rem;
line-height: 3.6rem;
max-width: 80%;
padding: 1.6rem 0 5.2rem 0;
color: #000000;
margin: 0;
}
.storybook-intro-hero .storybook-intro-hero-left img {
width: 35rem;
}
.storybook-intro-hero .storybook-intro-hero-left .storybook-intro-hero-actions {
display: flex;
}
.storybook-intro-hero .storybook-intro-hero-left .storybook-intro-hero-actions a {
margin-right: 1.6rem;
}
.storybook-intro-hero .storybook-intro-hero-right {
width: 55%;
align-items: center;
justify-content: center;
}
.storybook-intro-hero .storybook-intro-hero-right img {
width: 95%;
}