mirror of
https://github.com/YunoHost/SSOwat.git
synced 2024-09-03 20:06:27 +02:00
[enh] Move artichaut framework into ynh-style.css file.
This commit is contained in:
opi
parent
7d0c71ef80
commit
af65559ef1
6 changed files with 197 additions and 482 deletions
|
|
@ -1,83 +0,0 @@
|
|||
/* ==========================================================================
|
||||
Sommaire
|
||||
|
||||
1 = Default button
|
||||
2 = Important button
|
||||
3 = Validate button
|
||||
4 = Warning button
|
||||
5 = Classic button
|
||||
========================================================================== */
|
||||
|
||||
/* ==========================================================================
|
||||
1 = Default button
|
||||
========================================================================== */
|
||||
|
||||
.btn {
|
||||
background: #999;
|
||||
display: inline-block;
|
||||
padding: 0.5em 1em;
|
||||
line-height: normal;
|
||||
text-decoration: none;
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
.large-btn {
|
||||
padding: 0.8em 1.5em;
|
||||
font-size: 1.1em;
|
||||
}
|
||||
|
||||
button.btn,
|
||||
input.btn {
|
||||
border:0;
|
||||
cursor:pointer;
|
||||
}
|
||||
|
||||
.btn:hover,
|
||||
.btn:focus {
|
||||
background: #AAA;
|
||||
}
|
||||
|
||||
|
||||
/* ==========================================================================
|
||||
2 = Important button
|
||||
========================================================================== */
|
||||
|
||||
.important-btn { background: #c0392b;
|
||||
}
|
||||
.important-btn:hover,
|
||||
.important-btn:focus {
|
||||
background: #e74c3c;
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
3 = Validate button
|
||||
========================================================================== */
|
||||
|
||||
.validate-btn { background: #27ae60;
|
||||
}
|
||||
.validate-btn:hover,
|
||||
.validate-btn:focus {
|
||||
background: #2ecc71;
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
3 = Warning button
|
||||
========================================================================== */
|
||||
|
||||
.warning-btn { background: #e67e22;
|
||||
}
|
||||
.warning-btn:hover,
|
||||
.warning-btn:focus {
|
||||
background: #f39c12;
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
5 = Classic button
|
||||
========================================================================== */
|
||||
|
||||
.classic-btn { background: #2980b9;
|
||||
}
|
||||
.classic-btn:hover,
|
||||
.classic-btn:focus {
|
||||
background: #3498db;
|
||||
}
|
||||
|
|
@ -1,87 +0,0 @@
|
|||
/* ==========================================================================
|
||||
Sommaire
|
||||
|
||||
1 = col
|
||||
2 = Sidebar Left
|
||||
3 = Sidebar Right
|
||||
4 = Col 2
|
||||
5 = Col 3
|
||||
6 = Col 4
|
||||
========================================================================== */
|
||||
|
||||
.col {
|
||||
letter-spacing: -5px; /*fix bug ff PC*/
|
||||
}
|
||||
|
||||
.col > * {
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
letter-spacing: normal;
|
||||
}
|
||||
|
||||
.colMarge > * {
|
||||
margin-left: 1%;
|
||||
}
|
||||
|
||||
.colNomarge > * {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
2 = Sidebar left
|
||||
========================================================================== */
|
||||
|
||||
.colSidebarLeft > *:first-child {
|
||||
width:31%;
|
||||
margin-left:0;
|
||||
}
|
||||
.colSidebarLeft > *:first-child + * { width:68%; }
|
||||
|
||||
/* ==========================================================================
|
||||
3 = Sidebar right
|
||||
========================================================================== */
|
||||
|
||||
.colSidebarRight > *:first-child {
|
||||
width:68%;
|
||||
margin-left:0;
|
||||
}
|
||||
.colSidebarRight > *:first-child + * { width:31%; }
|
||||
|
||||
/* ==========================================================================
|
||||
4 = col 2
|
||||
========================================================================== */
|
||||
|
||||
.col2 > * {
|
||||
width: 49.5%!important;
|
||||
margin-bottom: 1%;
|
||||
}
|
||||
|
||||
.col2 > *:nth-child(2n+1) {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
5 = col 3
|
||||
========================================================================== */
|
||||
|
||||
.col3 > * {
|
||||
width: 32.65%;
|
||||
margin-bottom: 1%;
|
||||
}
|
||||
|
||||
.col3 > *:nth-child(3n+1) {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
6 = col 4
|
||||
========================================================================== */
|
||||
|
||||
.col4 > * {
|
||||
width: 24.25%;
|
||||
margin-bottom: 1%;
|
||||
}
|
||||
|
||||
.col4 > *:nth-child(4n+1) {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
/* ==========================================================================
|
||||
Sommaire
|
||||
|
||||
1 = Messages
|
||||
========================================================================== */
|
||||
|
||||
.messages {
|
||||
color: #FFF;
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
.danger { background: #c0392b; }
|
||||
.warning { background: #e67e22; }
|
||||
.success { background: #27ae60; }
|
||||
.info { background: #2980b9; }
|
||||
|
|
@ -1,265 +0,0 @@
|
|||
/*
|
||||
Ratatouille mini Framework css by Thomas LEBEAU
|
||||
Base on KNACSS => www.KNACSS.com (2013-10) @author: Raphael Goetter, Alsacreations
|
||||
and normalize.css
|
||||
*/
|
||||
|
||||
/* ==========================================================================
|
||||
Sommaire
|
||||
|
||||
1 = Mise en Forme
|
||||
2 = Mise en Page
|
||||
3 = Internet Explorer
|
||||
========================================================================== */
|
||||
|
||||
/* ==========================================================================
|
||||
1 = Mise en forme
|
||||
========================================================================== */
|
||||
|
||||
* {
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
html {
|
||||
font-family: sans-serif; /* 1 */
|
||||
-ms-text-size-adjust: 100%; /* 2 */
|
||||
-webkit-text-size-adjust: 100%; /* 2 */
|
||||
}
|
||||
|
||||
body {
|
||||
font-size: 1em;
|
||||
line-height:1.5;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
h1:first-child,
|
||||
h2:first-child,
|
||||
h3:first-child,
|
||||
h4:first-child,
|
||||
h5:first-child,
|
||||
h6:first-child,
|
||||
p:first-child,
|
||||
ul:first-child,
|
||||
ol:first-child,
|
||||
dl:first-child{
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
code,
|
||||
kbd,
|
||||
pre,
|
||||
samp {
|
||||
font-family: monospace, serif;
|
||||
}
|
||||
|
||||
pre {
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
|
||||
|
||||
.upper {
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.bold {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.inner {
|
||||
margin: 0 auto;
|
||||
max-width: 61.25em;/*980px*/
|
||||
}
|
||||
|
||||
table, img {
|
||||
max-width: 100%;
|
||||
height :auto;
|
||||
}
|
||||
|
||||
iframe {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.fl {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.fr {
|
||||
float: right;
|
||||
}
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
}
|
||||
|
||||
figure {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
button,
|
||||
input,
|
||||
select,
|
||||
textarea {
|
||||
font-family: inherit;
|
||||
font-size: 100%;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
input[type="search"] {
|
||||
-webkit-appearance: textfield;
|
||||
}
|
||||
|
||||
input::-moz-focus-inner {
|
||||
border: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
@media screen and (-webkit-min-device-pixel-ratio:0){
|
||||
select{
|
||||
-webkit-appearance: none;
|
||||
border-radius: 0;
|
||||
}
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
2 = Mise en page
|
||||
========================================================================== */
|
||||
|
||||
.ul-reset {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
.ul-reset li {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.dib {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.dblock { display: block; }
|
||||
|
||||
.dnone { display: none; }
|
||||
|
||||
.dtable { display:table }
|
||||
|
||||
.dtable > * { display:table-row; }
|
||||
|
||||
.dtable > * > * { display:table-cell; }
|
||||
|
||||
.element-invisible {
|
||||
border: 0;
|
||||
clip: rect(0 0 0 0);
|
||||
height: 1px;
|
||||
margin: -1px;
|
||||
overflow: hidden;
|
||||
padding: 0;
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
}
|
||||
|
||||
.x-text-small { font-size:x-small; }
|
||||
|
||||
.text-small { font-size:small; }
|
||||
|
||||
.text-large { font-size:large; }
|
||||
|
||||
.x-text-large { font-size:x-large; }
|
||||
|
||||
/*Width*/
|
||||
|
||||
.w100 { width:100%; }
|
||||
.w90 { width:90%; }
|
||||
.w80 { width:80%; }
|
||||
.w70 { width:70%; }
|
||||
.w60 { width:60%; }
|
||||
.w50 { width:50%; }
|
||||
.w40 { width:40%; }
|
||||
.w30 { width:30%; }
|
||||
.w20 { width:20%; }
|
||||
.w10 { width:10%; }
|
||||
|
||||
h1,
|
||||
.h1 {
|
||||
font-size: 2.5em;
|
||||
}
|
||||
|
||||
h2,
|
||||
.h2 {
|
||||
font-size: 1.8em;
|
||||
}
|
||||
|
||||
h3,
|
||||
.h3 {
|
||||
font-size: 1.4em;
|
||||
}
|
||||
|
||||
h4,
|
||||
.h4 {
|
||||
font-size: 1.2em;
|
||||
}
|
||||
|
||||
h5,
|
||||
.h5 {
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
h6,
|
||||
.h6 {
|
||||
font-size: 0.8em;
|
||||
}
|
||||
|
||||
/*Table*/
|
||||
|
||||
table {
|
||||
color: #999;
|
||||
min-width: 100%;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
table thead {
|
||||
background: #CCC;
|
||||
}
|
||||
|
||||
table td, table th {
|
||||
padding: 0.5em;
|
||||
color: #333;
|
||||
border-color: #999;
|
||||
}
|
||||
|
||||
.box {
|
||||
padding: 1.5em;
|
||||
}
|
||||
|
||||
|
||||
/* ==========================================================================
|
||||
Internet Explorer
|
||||
========================================================================== */
|
||||
|
||||
/*IE8 and IE9*/
|
||||
|
||||
article,
|
||||
aside,
|
||||
details,
|
||||
figcaption,
|
||||
figure,
|
||||
footer,
|
||||
header,
|
||||
hgroup,
|
||||
main,
|
||||
nav,
|
||||
section,
|
||||
summary {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/*IE8 and IE9*/
|
||||
|
||||
audio,
|
||||
canvas,
|
||||
video {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
|
|
@ -1,44 +1,110 @@
|
|||
/* ==========================================================================
|
||||
Sommaire
|
||||
1 = Global
|
||||
2 = Apps
|
||||
3 = User
|
||||
4 = Form
|
||||
5 = Footer
|
||||
6 = Colors
|
||||
7 = Internet Explorer
|
||||
========================================================================== */
|
||||
|
||||
/* ==========================================================================
|
||||
1 = Global
|
||||
========================================================================== */
|
||||
|
||||
* {
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
html {
|
||||
font-family: sans-serif; /* 1 */
|
||||
-ms-text-size-adjust: 100%; /* 2 */
|
||||
-webkit-text-size-adjust: 100%; /* 2 */
|
||||
}
|
||||
|
||||
body {
|
||||
background: #41444f;
|
||||
font-family: 'source_sans_proregular';
|
||||
overflow-y: scroll;
|
||||
font-size: 1em;
|
||||
line-height:1.5;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
h1:first-child,
|
||||
h2:first-child,
|
||||
h3:first-child,
|
||||
h4:first-child,
|
||||
h5:first-child,
|
||||
h6:first-child,
|
||||
p:first-child,
|
||||
ul:first-child,
|
||||
ol:first-child,
|
||||
dl:first-child{
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
/* Responsive image */
|
||||
img {
|
||||
max-width: 100%;
|
||||
height :auto;
|
||||
}
|
||||
|
||||
.element-invisible {
|
||||
border: 0;
|
||||
clip: rect(0 0 0 0);
|
||||
height: 1px;
|
||||
margin: -1px;
|
||||
overflow: hidden;
|
||||
padding: 0;
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
}
|
||||
|
||||
|
||||
/* Layout */
|
||||
|
||||
.overlay {
|
||||
padding: 2%;
|
||||
}
|
||||
|
||||
.inner {
|
||||
max-width: 50em;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.wrapper {
|
||||
width: 90%;
|
||||
margin: 2% 5%;
|
||||
z-index: 10;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
.wrapper:before,
|
||||
.wrapper:after {content: " ";display: table;}
|
||||
.wrapper:after {clear: both;}
|
||||
|
||||
|
||||
.col {
|
||||
letter-spacing: -5px; /*fix bug ff PC*/
|
||||
}
|
||||
|
||||
.col > * {
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
letter-spacing: normal;
|
||||
}
|
||||
|
||||
.colMarge > * {
|
||||
margin-left: 1%;
|
||||
}
|
||||
|
||||
.colNomarge > * {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
/* Logo */
|
||||
.logo {
|
||||
text-align: center;
|
||||
margin-bottom: 0;
|
||||
|
|
@ -68,17 +134,20 @@ body {
|
|||
display: none;
|
||||
}
|
||||
|
||||
.wrapper {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
/* messages */
|
||||
.messages {
|
||||
color: #FFF;
|
||||
margin-bottom: 1em;
|
||||
text-align: center;
|
||||
max-width: 21em;
|
||||
margin: 2% auto 1em auto;
|
||||
padding: 1.5em;
|
||||
}
|
||||
.messages.danger { background: #c0392b; }
|
||||
.messages.warning { background: #e67e22; }
|
||||
.messages.success { background: #27ae60; }
|
||||
.messages.info { background: #2980b9; }
|
||||
|
||||
.logged .messages {
|
||||
max-width: none;
|
||||
|
|
@ -101,6 +170,17 @@ h6 {
|
|||
font-weight: normal;
|
||||
}
|
||||
|
||||
/* headings */
|
||||
h1,
|
||||
.h1 {
|
||||
font-size: 2.5em;
|
||||
}
|
||||
|
||||
h2,
|
||||
.h2 {
|
||||
font-size: 1.8em;
|
||||
}
|
||||
|
||||
.cwhite {
|
||||
color: #fff;
|
||||
}
|
||||
|
|
@ -162,7 +242,13 @@ textarea {
|
|||
content: attr(data-first-letter);
|
||||
}
|
||||
|
||||
.listing-apps {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.listing-apps li {
|
||||
list-style: none;
|
||||
margin: 0 0 1em 1em;
|
||||
box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.4),
|
||||
-2px -2px 3px 0 rgba(0, 0, 0, 0.7) inset;
|
||||
|
|
@ -394,7 +480,18 @@ textarea {
|
|||
4 = Forms
|
||||
========================================================================== */
|
||||
|
||||
button,
|
||||
input,
|
||||
select,
|
||||
textarea {
|
||||
font-family: inherit;
|
||||
font-size: 100%;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
input[type="search"] {
|
||||
-webkit-appearance: textfield;
|
||||
}
|
||||
[type="submit"],
|
||||
[type="password"],
|
||||
[type="email"],
|
||||
|
|
@ -404,11 +501,17 @@ textarea {
|
|||
-webkit-border-radius:0;
|
||||
}
|
||||
|
||||
/* Extend artichaut-buttons.css */
|
||||
.link-btn { background: none;}
|
||||
.link-btn:hover,
|
||||
.link-btn:focus {background: #41444f;text-decoration: underline;}
|
||||
input::-moz-focus-inner {
|
||||
border: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
@media screen and (-webkit-min-device-pixel-ratio:0){
|
||||
select{
|
||||
-webkit-appearance: none;
|
||||
border-radius: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.form-text {
|
||||
padding: 0.8em;
|
||||
|
|
@ -452,17 +555,6 @@ label + .help-link {
|
|||
}
|
||||
label + .help-link:hover {background: #30333b;}
|
||||
|
||||
.btn {
|
||||
cursor: pointer;
|
||||
transition: all 0.1s ease;
|
||||
-webkit-transition: all 0.1s ease;
|
||||
}
|
||||
|
||||
.btn-group {
|
||||
margin: 4em 0;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.form-group {
|
||||
background: none;
|
||||
margin-bottom: 2em;
|
||||
|
|
@ -505,6 +597,63 @@ input:disabled {
|
|||
.form-group .btn {padding: 0.5em 0.8em;}
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* Buttons */
|
||||
.btn {
|
||||
background: #999;
|
||||
display: inline-block;
|
||||
padding: 0.5em 1em;
|
||||
line-height: normal;
|
||||
text-decoration: none;
|
||||
color: #FFF;
|
||||
cursor: pointer;
|
||||
transition: all 0.1s ease;
|
||||
-webkit-transition: all 0.1s ease;
|
||||
}
|
||||
|
||||
.large-btn {
|
||||
padding: 0.8em 1.5em;
|
||||
font-size: 1.1em;
|
||||
}
|
||||
|
||||
button.btn,
|
||||
input.btn {
|
||||
border:0;
|
||||
cursor:pointer;
|
||||
}
|
||||
|
||||
.btn:hover,
|
||||
.btn:focus {
|
||||
background: #AAA;
|
||||
}
|
||||
|
||||
.important-btn { background: #c0392b;}
|
||||
.important-btn:hover,
|
||||
.important-btn:focus {background: #e74c3c;}
|
||||
|
||||
.validate-btn { background: #27ae60;}
|
||||
.validate-btn:hover,
|
||||
.validate-btn:focus {background: #2ecc71;}
|
||||
|
||||
.warning-btn { background: #e67e22;}
|
||||
.warning-btn:hover,
|
||||
.warning-btn:focus {background: #f39c12;}
|
||||
|
||||
.classic-btn { background: #2980b9;}
|
||||
.classic-btn:hover,
|
||||
.classic-btn:focus {background: #3498db;}
|
||||
|
||||
.link-btn { background: none;}
|
||||
.link-btn:hover,
|
||||
.link-btn:focus {background: #41444f;text-decoration: underline;}
|
||||
|
||||
|
||||
.btn-group {
|
||||
margin: 4em 0;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
/* Login form */
|
||||
|
||||
.login-form {
|
||||
|
|
@ -624,7 +773,7 @@ input:disabled {
|
|||
6 = Colors
|
||||
========================================================================== */
|
||||
|
||||
.listing-apps .purplebg {
|
||||
.purplebg {
|
||||
background: #9B59B6!important;
|
||||
}
|
||||
.purplebg:hover:after,
|
||||
|
|
@ -753,3 +902,23 @@ input:disabled {
|
|||
|
||||
|
||||
|
||||
/* ==========================================================================
|
||||
Internet Explorer
|
||||
========================================================================== */
|
||||
|
||||
/*IE8 and IE9*/
|
||||
|
||||
article,
|
||||
aside,
|
||||
details,
|
||||
figcaption,
|
||||
figure,
|
||||
footer,
|
||||
header,
|
||||
hgroup,
|
||||
main,
|
||||
nav,
|
||||
section,
|
||||
summary {
|
||||
display: block;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -12,10 +12,6 @@
|
|||
<meta name="robots" content="noindex, nofollow">
|
||||
|
||||
<!-- Stylesheets -->
|
||||
<link rel="stylesheet" href="assets/css/artichaut.css">
|
||||
<link rel="stylesheet" href="assets/css/artichaut-col.css">
|
||||
<link rel="stylesheet" href="assets/css/artichaut-messages.css">
|
||||
<link rel="stylesheet" href="assets/css/artichaut-buttons.css">
|
||||
<link rel="stylesheet" href="assets/css/fonts.css">
|
||||
<link rel="stylesheet" href="assets/css/ynh-style.css">
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue