setting up bounds
This commit is contained in:
francois.lutran
@@ -1,21 +1,21 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
|
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
|
||||||
<meta name="author" content="Franzz" />
|
<meta name="author" content="Franzz" />
|
||||||
<link href="style/mythoughts.css" rel="stylesheet" type="text/css" />
|
<link href="style/mythoughts.css" rel="stylesheet" type="text/css" />
|
||||||
<script type="text/javascript" src="scripts/jquery.min.js"></script>
|
<script type="text/javascript" src="scripts/jquery.min.js"></script>
|
||||||
<script type="text/javascript" src="scripts/quill.min.js"></script>
|
<script type="text/javascript" src="scripts/quill.min.js"></script>
|
||||||
<script type="text/javascript" src="scripts/functions.js"></script>
|
<script type="text/javascript" src="scripts/functions.js"></script>
|
||||||
<script type="text/javascript" src="scripts/mythoughts.js"></script>
|
<script type="text/javascript" src="scripts/mythoughts.js"></script>
|
||||||
<link rel="shortcut icon" href="images/favicon2.ico" />
|
<link rel="shortcut icon" href="images/favicon2.ico" />
|
||||||
<title>My Thoughts</title>
|
<title>My Thoughts</title>
|
||||||
</head>
|
<script type="text/javascript">
|
||||||
<body>
|
var oMyThoughts = new MyThoughts(asGlobalVars);
|
||||||
<div id="container"></div>
|
$(document).ready(oMyThoughts.init);
|
||||||
<script type="text/javascript">
|
</script>
|
||||||
var oMyThoughts = new MyThoughts(asGlobalVars);
|
</head>
|
||||||
$(document).ready(oMyThoughts.init);
|
<body>
|
||||||
</script>
|
<div id="container"></div>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
267
masks/write.html
267
masks/write.html
@@ -1,130 +1,139 @@
|
|||||||
<div id="write">
|
<div id="write">
|
||||||
<div id="write_feedback"></div>
|
<div id="write_feedback"></div>
|
||||||
<div id="nav">
|
<div id="nav">
|
||||||
<a class="fa fa-prev"></a>
|
<a class="fa fa-prev"></a>
|
||||||
<span class="page_nb">1</span>
|
<span class="page_nb">1</span>
|
||||||
<A class="fa fa-next"></a>
|
<A class="fa fa-next"></a>
|
||||||
</div>
|
</div>
|
||||||
<div id="editor">
|
<div id="editor_container">
|
||||||
<p>So, I'm there, wondering about myself and my future - such a luxury by the way - when suddenly, someone approaches. mid-40s i'd say, elegant cold women, the kind you've learned not to talk to, to eventually avoid feeling repressed, or bad for yourself, or both.</p>
|
<div id="editor">
|
||||||
<p>Anyhow, it would seem that in this particular situation, the choice wasn't given to me to decide whether or not to talk to that precise women. She seats down next to me and engage a conversation. 'How is it you're here today?' I'm already regretting not having gone away when i still had the chance.</p>
|
<p>So, I'm there, wondering about myself and my future - such a luxury by the way - when suddenly, someone approaches. mid-40s i'd say, elegant cold women, the kind you've learned not to talk to, to eventually avoid feeling repressed, or bad for yourself, or both.</p>
|
||||||
<p>'Hello to you too' I say, still willing to show some manhood, even though I already know this women crushes manhood by pairs as a breakfast ritual.</p>
|
<p>Anyhow, it would seem that in this particular situation, the choice wasn't given to me to decide whether or not to talk to that precise women. She seats down next to me and engage a conversation. 'How is it you're here today?' I'm already regretting not having gone away when i still had the chance.</p>
|
||||||
<p>In-extremist, I manage to babble some excuses about a rigorous lunch break time and leave the premises.</p>
|
<p>'Hello to you too' I say, still willing to show some manhood, even though I already know this women crushes manhood by pairs as a breakfast ritual.</p>
|
||||||
<p>So, I'm there, wondering about myself and my future - such a luxury by the way - when suddenly, someone approaches. mid-40s i'd say, elegant cold women, the kind you've learned not to talk to, to eventually avoid feeling repressed, or bad for yourself, or both.</p>
|
<p>In-extremist, I manage to babble some excuses about a rigorous lunch break time and leave the premises.</p>
|
||||||
<p>Anyhow, it would seem that in this particular situation, the choice wasn't given to me to decide whether or not to talk to that precise women. She seats down next to me and engage a conversation. 'How is it you're here today?' I'm already regretting not having gone away when i still had the chance.</p>
|
<p>So, I'm there, wondering about myself and my future - such a luxury by the way - when suddenly, someone approaches. mid-40s i'd say, elegant cold women, the kind you've learned not to talk to, to eventually avoid feeling repressed, or bad for yourself, or both.</p>
|
||||||
<p>'Hello to you too' I say, still willing to show some manhood, even though I already know this women crushes manhood by pairs as a breakfast ritual.</p>
|
<p>Anyhow, it would seem that in this particular situation, the choice wasn't given to me to decide whether or not to talk to that precise women. She seats down next to me and engage a conversation. 'How is it you're here today?' I'm already regretting not having gone away when i still had the chance.</p>
|
||||||
<p>In-extremist, I manage to babble some excuses about a rigorous lunch break time and leave the premises.</p>
|
<p>'Hello to you too' I say, still willing to show some manhood, even though I already know this women crushes manhood by pairs as a breakfast ritual.</p>
|
||||||
</div>
|
<p>In-extremist, I manage to babble some excuses about a rigorous lunch break time and leave the premises.</p>
|
||||||
</div>
|
</div>
|
||||||
<script type="text/javascript">
|
</div>
|
||||||
oMyThoughts.pageInit = function(asHash, bFirstPage)
|
</div>
|
||||||
{
|
<script type="text/javascript">
|
||||||
self.vars('counter', 0);
|
oMyThoughts.pageInit = function(asHash, bFirstPage)
|
||||||
self.vars('id', 0);
|
{
|
||||||
self.vars('default_text', '<p><br></p>');
|
self.vars('counter', 0);
|
||||||
self.vars('working', false);
|
self.vars('id', 0);
|
||||||
self.vars('prec_displayed', 0);
|
self.vars('default_text', '<p><br></p>');
|
||||||
self.vars('prec_content', 0);
|
self.vars('working', false);
|
||||||
self.vars('page', $('.page_nb').text());
|
self.vars('prec_displayed', 0);
|
||||||
|
self.vars('prec_content', 0);
|
||||||
self.vars('page_height', $('#editor').height());
|
self.vars('page', $('.page_nb').text());
|
||||||
|
|
||||||
var oQuill = new Quill('#editor', {
|
self.vars('page_height', $('#editor').height());
|
||||||
theme: 'bubble',
|
|
||||||
modules:
|
var oQuill = new Quill('#editor', {
|
||||||
{
|
theme: 'bubble',
|
||||||
toolbar: [['bold', 'italic', 'underline'], [{ 'list': 'ordered'}, { 'list': 'bullet' }], ['clean']]
|
modules:
|
||||||
}
|
{
|
||||||
});
|
toolbar: [['bold', 'italic', 'underline'], [{ 'list': 'ordered'}, { 'list': 'bullet' }], ['clean']]
|
||||||
|
}
|
||||||
quill.on('text-change', function(delta, oldDelta, source) {
|
});
|
||||||
if(source == 'user')
|
|
||||||
{
|
oQuill.on('text-change', function(delta, oldDelta, source) {
|
||||||
|
if(source == 'user')
|
||||||
}
|
{
|
||||||
});
|
var range = oQuill.getSelection();
|
||||||
|
if(range)
|
||||||
$('.fa-prev').click(function(){moveToPage(-1);});
|
{
|
||||||
$('.fa-next').click(function(){moveToPage(1);});
|
var oBound = oQuill.getBounds(range.index, range.length);
|
||||||
};
|
$('#editor').append($('<div>', {style:'background:red;width:1px;height:'+(oBound.bottom - oBound.top)+'px;position:absolute;top:'+oBound.top+'px;left:'+oBound.left+'px;'}));
|
||||||
|
$('#editor').append($('<div>', {style:'background:red;width:1px;height:10px;position:absolute;top:0px;left:0px;'}));
|
||||||
oMyThoughts.onFeedback = function(sType, sMsg)
|
$('#editor').append($('<div>', {style:'background:red;width:1px;height:10px;position:absolute;top:'+($('#editor').height() - 10)+'px;left:'+($('#editor').width() - 1)+'px;'}));
|
||||||
{
|
}
|
||||||
var $Feedback = $('#write_feedback');
|
}
|
||||||
$Feedback
|
});
|
||||||
.stop()
|
|
||||||
.fadeOut($Feedback.is(':empty')?0:'fast', function(){
|
$('.fa-prev').click(function(){moveToPage(-1);});
|
||||||
$(this)
|
$('.fa-next').click(function(){moveToPage(1);});
|
||||||
.empty()
|
};
|
||||||
.append($('<span>', {'class':sType}).text(sMsg))
|
|
||||||
.fadeIn('fast');
|
oMyThoughts.onFeedback = function(sType, sMsg)
|
||||||
});
|
{
|
||||||
};
|
var $Feedback = $('#write_feedback');
|
||||||
|
$Feedback
|
||||||
oMyThoughts.onQuitPage = function()
|
.stop()
|
||||||
{
|
.fadeOut($Feedback.is(':empty')?0:'fast', function(){
|
||||||
save();
|
$(this)
|
||||||
return true;
|
.empty()
|
||||||
};
|
.append($('<span>', {'class':sType}).text(sMsg))
|
||||||
|
.fadeIn('fast');
|
||||||
function save(sContent)
|
});
|
||||||
{
|
};
|
||||||
if(sContent != self.vars('default_text'))
|
|
||||||
{
|
oMyThoughts.onQuitPage = function()
|
||||||
oMyThoughts.onFeedback('info', 'Saving...');
|
{
|
||||||
getInfo
|
save();
|
||||||
(
|
return true;
|
||||||
'update',
|
};
|
||||||
function(asData)
|
|
||||||
{
|
function save(sContent)
|
||||||
self.vars('id', asData.id_thought);
|
{
|
||||||
oMyThoughts.onFeedback('notice', 'Saved ('+asData.led.substr(11, 5)+')');
|
if(sContent != self.vars('default_text'))
|
||||||
},
|
{
|
||||||
{content:sContent, id:self.vars('id')},
|
oMyThoughts.onFeedback('info', 'Saving...');
|
||||||
function(sError)
|
getInfo
|
||||||
{
|
(
|
||||||
oMyThoughts.onFeedback('error', 'Not saved! Un error occured: '+sError);
|
'update',
|
||||||
},
|
function(asData)
|
||||||
'POST'
|
{
|
||||||
);
|
self.vars('id', asData.id_thought);
|
||||||
}
|
oMyThoughts.onFeedback('notice', 'Saved ('+asData.led.substr(11, 5)+')');
|
||||||
}
|
},
|
||||||
|
{content:sContent, id:self.vars('id')},
|
||||||
function checkPageBook()
|
function(sError)
|
||||||
{
|
{
|
||||||
self.vars('working', true);
|
oMyThoughts.onFeedback('error', 'Not saved! Un error occured: '+sError);
|
||||||
var iEm = $(1).toPx();
|
},
|
||||||
iEm = iEm.substr(0, iEm.length - 2);
|
'POST'
|
||||||
|
);
|
||||||
$Editor = self.vars('editor');
|
}
|
||||||
|
}
|
||||||
//Content Height
|
|
||||||
var iContentHeight = $Editor.height();
|
function checkPageBook()
|
||||||
|
{
|
||||||
//Calculates what should be displayed
|
self.vars('working', true);
|
||||||
iDisplayedHeight = iContentHeight % self.vars('max_height');
|
var iEm = $(1).toPx();
|
||||||
console.log(iContentHeight+'%'+self.vars('max_height')+'='+iDisplayedHeight);
|
iEm = iEm.substr(0, iEm.length - 2);
|
||||||
|
|
||||||
//Navigation
|
$Editor = self.vars('editor');
|
||||||
var iNewPage = Math.ceil(iContentHeight / self.vars('max_height'));
|
|
||||||
moveToPage(iNewPage);
|
//Content Height
|
||||||
|
var iContentHeight = $Editor.height();
|
||||||
|
|
||||||
self.vars('prec_displayed', iDisplayedHeight);
|
//Calculates what should be displayed
|
||||||
self.vars('prec_content', iContentHeight);
|
iDisplayedHeight = iContentHeight % self.vars('max_height');
|
||||||
|
console.log(iContentHeight+'%'+self.vars('max_height')+'='+iDisplayedHeight);
|
||||||
self.vars('working', false);
|
|
||||||
}
|
//Navigation
|
||||||
|
var iNewPage = Math.ceil(iContentHeight / self.vars('max_height'));
|
||||||
function moveToPage(iNewPage)
|
moveToPage(iNewPage);
|
||||||
{
|
|
||||||
if(iNewPage!=self.vars('page'))
|
|
||||||
{
|
self.vars('prec_displayed', iDisplayedHeight);
|
||||||
self.vars('page', iNewPage);
|
self.vars('prec_content', iContentHeight);
|
||||||
console.log('moving to page '+self.vars('page'));
|
|
||||||
$('.page_nb').text(self.vars('page'));
|
self.vars('working', false);
|
||||||
|
}
|
||||||
self.vars('editor').css('top', (self.vars('page') - 1)*self.vars('max_height')*-1);
|
|
||||||
}
|
function moveToPage(iNewPage)
|
||||||
}
|
{
|
||||||
|
if(iNewPage!=self.vars('page'))
|
||||||
|
{
|
||||||
|
self.vars('page', iNewPage);
|
||||||
|
console.log('moving to page '+self.vars('page'));
|
||||||
|
$('.page_nb').text(self.vars('page'));
|
||||||
|
|
||||||
|
self.vars('editor').css('top', (self.vars('page') - 1)*self.vars('max_height')*-1);
|
||||||
|
}
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
42
style/_logon.scss
Normal file
42
style/_logon.scss
Normal file
@@ -0,0 +1,42 @@
|
|||||||
|
/* Log on */
|
||||||
|
|
||||||
|
#logon {
|
||||||
|
width: 496px;
|
||||||
|
height: 225px;
|
||||||
|
position: fixed;
|
||||||
|
top: 0px;
|
||||||
|
bottom: 0px;
|
||||||
|
left: 0px;
|
||||||
|
right: 0px;
|
||||||
|
margin: auto;
|
||||||
|
background: transparent url('../images/bubble_inverted.png') 0 0 no-repeat;
|
||||||
|
}
|
||||||
|
|
||||||
|
#logon, #logon input {
|
||||||
|
font-size:30px;
|
||||||
|
border:none;
|
||||||
|
background-color:transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
#logon .credentials {
|
||||||
|
margin:45px 0 0 0 ;
|
||||||
|
}
|
||||||
|
|
||||||
|
#logon .credentials input {
|
||||||
|
width: 305px;
|
||||||
|
padding:0 60px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
#logon input.connection {
|
||||||
|
position:absolute;
|
||||||
|
left:374px;
|
||||||
|
top:140px;
|
||||||
|
cursor:pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
#logon .register {
|
||||||
|
margin-top:60px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
@@ -1,6 +1,94 @@
|
|||||||
#write {
|
#write {
|
||||||
.ql-container {
|
|
||||||
font-family: 'Indie Flower', cursive;
|
height:100%;
|
||||||
font-size: 16px;
|
|
||||||
|
#editor_container {
|
||||||
|
|
||||||
|
padding:1em;
|
||||||
|
height: calc(100% - 4em);
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
.ql-container {
|
||||||
|
font-family: 'Indie Flower', cursive;
|
||||||
|
font-size: 16px;
|
||||||
|
padding:0;
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
.ql-editor {
|
||||||
|
padding:0;
|
||||||
|
height:auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
/* Write - Editor */
|
||||||
|
|
||||||
|
#write #editor div {
|
||||||
|
margin:0;
|
||||||
|
}
|
||||||
|
|
||||||
|
#write #editor p {
|
||||||
|
text-indent: 1.5em;
|
||||||
|
margin:1em 0 0 0;
|
||||||
|
padding:0;
|
||||||
|
text-align: justify;
|
||||||
|
}
|
||||||
|
|
||||||
|
#write .jqte_editor p:FIRST-CHILD, #write .jqte_toolbar {
|
||||||
|
margin-top:0.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Write - Toolbar */
|
||||||
|
|
||||||
|
#write #nav {
|
||||||
|
position:absolute;
|
||||||
|
bottom:0;
|
||||||
|
right:0;
|
||||||
|
left:0;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
#write .fa-prev, #write .page_nb, #write .fa-next {
|
||||||
|
color:#997E60;
|
||||||
|
font-size:1.5em;
|
||||||
|
margin:0 0 0.5em 0;
|
||||||
|
cursor:pointer;
|
||||||
|
}
|
||||||
|
#write .page_nb {
|
||||||
|
font-size: 1em;
|
||||||
|
vertical-align:0.25em;
|
||||||
|
cursor: default;
|
||||||
|
padding-left:0.5em;
|
||||||
|
padding-right:0.5em;
|
||||||
|
}
|
||||||
|
#write .fa-prev:hover, #write .fa-next:hover {
|
||||||
|
color:#584127;
|
||||||
|
}
|
||||||
|
#write .fa-prev.disabled, #write .fa-next.disabled,
|
||||||
|
#write .fa-prev.disabled:hover, #write .fa-next.disabled:hover {
|
||||||
|
color:#EDE0D0;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Write - Placeholder */
|
||||||
|
|
||||||
|
#write .jqte_placeholder_text {
|
||||||
|
top:1em;
|
||||||
|
left:0;
|
||||||
|
text-indent: 1.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
#write .jqte_focused .jqte_placeholder_text {
|
||||||
|
display:none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Write - Feedback */
|
||||||
|
|
||||||
|
#write_feedback {
|
||||||
|
position:absolute;
|
||||||
|
top: -1.5em;
|
||||||
|
right:0.5em;
|
||||||
}
|
}
|
||||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -1,465 +1,347 @@
|
|||||||
/* Colors
|
/* Colors
|
||||||
Very Very Bright Brown: #f7f2eb
|
Very Very Bright Brown: #f7f2eb
|
||||||
Very Bright Brown: #ede0d0
|
Very Bright Brown: #ede0d0
|
||||||
bright brown : #e2ccb2
|
bright brown : #e2ccb2
|
||||||
dark brown : #584127
|
dark brown : #584127
|
||||||
blue lines : #2DCDFF
|
blue lines : #2DCDFF
|
||||||
red lines : #EC3B45
|
red lines : #EC3B45
|
||||||
*/
|
*/
|
||||||
|
|
||||||
/* Fonts */
|
/* Fonts */
|
||||||
|
|
||||||
@import 'font-awesome';
|
@import 'font-awesome';
|
||||||
@import url('https://fonts.googleapis.com/css?family=Indie+Flower');
|
@import url('https://fonts.googleapis.com/css?family=Indie+Flower');
|
||||||
|
|
||||||
/* Plugins */
|
/* Plugins */
|
||||||
|
|
||||||
@import 'quill.bubble';
|
@import 'quill.bubble';
|
||||||
|
|
||||||
/* Pages */
|
/* Pages */
|
||||||
|
|
||||||
@import 'write';
|
@import 'logon';
|
||||||
|
@import 'write';
|
||||||
/* General */
|
|
||||||
|
|
||||||
body {
|
/* General */
|
||||||
min-width: 700px;
|
|
||||||
font-family: 'Indie Flower', cursive;
|
body {
|
||||||
font-size:1em;
|
min-width: 700px;
|
||||||
background-color:#e2ccb2;
|
font-family: 'Indie Flower', cursive;
|
||||||
margin:0;
|
font-size:1em;
|
||||||
color:#584127;
|
background-color:#e2ccb2;
|
||||||
}
|
margin:0;
|
||||||
|
color:#584127;
|
||||||
table {
|
}
|
||||||
border:none;
|
|
||||||
background:none;
|
table {
|
||||||
text-align:center;
|
border:none;
|
||||||
margin:0;
|
background:none;
|
||||||
padding:0;
|
text-align:center;
|
||||||
border-spacing:0;
|
margin:0;
|
||||||
}
|
padding:0;
|
||||||
|
border-spacing:0;
|
||||||
input, textarea {
|
}
|
||||||
font-family: 'Indie Flower', cursive;
|
|
||||||
font-size:1em;
|
input, textarea {
|
||||||
color:#584127;
|
font-family: 'Indie Flower', cursive;
|
||||||
}
|
font-size:1em;
|
||||||
|
color:#584127;
|
||||||
input[type=button], input[type=submit] {
|
}
|
||||||
-moz-border-radius:5px;
|
|
||||||
-webkit-border-radius:5px;
|
input[type=button], input[type=submit] {
|
||||||
border-radius:5px;
|
-moz-border-radius:5px;
|
||||||
font-weight:bold;
|
-webkit-border-radius:5px;
|
||||||
color:#584127;
|
border-radius:5px;
|
||||||
}
|
font-weight:bold;
|
||||||
|
color:#584127;
|
||||||
p {
|
}
|
||||||
margin:0;
|
|
||||||
padding:0;
|
p {
|
||||||
}
|
margin:0;
|
||||||
|
padding:0;
|
||||||
a:visited, a {
|
}
|
||||||
color:#584127;
|
|
||||||
text-decoration: none;
|
a:visited, a {
|
||||||
font-weight: bold;
|
color:#584127;
|
||||||
}
|
text-decoration: none;
|
||||||
|
font-weight: bold;
|
||||||
a:active, a:focus, input:active, input:focus {
|
}
|
||||||
outline: none;
|
|
||||||
}
|
a:active, a:focus, input:active, input:focus {
|
||||||
|
outline: none;
|
||||||
.round {
|
}
|
||||||
-moz-border-radius:3px;
|
|
||||||
-webkit-border-radius:3px;
|
.round {
|
||||||
border-radius:3px;
|
-moz-border-radius:3px;
|
||||||
}
|
-webkit-border-radius:3px;
|
||||||
.round_top {
|
border-radius:3px;
|
||||||
-moz-border-radius:3px 3px 0 0;
|
}
|
||||||
-webkit-border-radius:3px 3px 0 0;
|
.round_top {
|
||||||
border-radius:3px 3px 0 0;
|
-moz-border-radius:3px 3px 0 0;
|
||||||
}
|
-webkit-border-radius:3px 3px 0 0;
|
||||||
.round_right {
|
border-radius:3px 3px 0 0;
|
||||||
-moz-border-radius:0 3px 3px 0;
|
}
|
||||||
-webkit-border-radius:0 3px 3px 0;
|
.round_right {
|
||||||
border-radius:0 3px 3px 0;
|
-moz-border-radius:0 3px 3px 0;
|
||||||
}
|
-webkit-border-radius:0 3px 3px 0;
|
||||||
|
border-radius:0 3px 3px 0;
|
||||||
button::-moz-focus-inner, input[type="reset"]::-moz-focus-inner, input[type="button"]::-moz-focus-inner, input[type="submit"]::-moz-focus-inner,input[type="file"] > input[type="button"]::-moz-focus-inner {
|
}
|
||||||
border: none;
|
|
||||||
}
|
button::-moz-focus-inner, input[type="reset"]::-moz-focus-inner, input[type="button"]::-moz-focus-inner, input[type="submit"]::-moz-focus-inner,input[type="file"] > input[type="button"]::-moz-focus-inner {
|
||||||
|
border: none;
|
||||||
/* Common Classes */
|
}
|
||||||
|
|
||||||
a.button {
|
/* Common Classes */
|
||||||
font-weight:normal;
|
|
||||||
height:50px;
|
a.button {
|
||||||
width:50px;
|
font-weight:normal;
|
||||||
line-height:50px;
|
height:50px;
|
||||||
font-size: 1.2em;
|
width:50px;
|
||||||
text-align:center;
|
line-height:50px;
|
||||||
background: url("../images/minicloud.png") 0 0 no-repeat;
|
font-size: 1.2em;
|
||||||
}
|
text-align:center;
|
||||||
a.button:hover {
|
background: url("../images/minicloud.png") 0 0 no-repeat;
|
||||||
color:white;
|
}
|
||||||
background-position:0 -50px;
|
a.button:hover {
|
||||||
}
|
color:white;
|
||||||
a.button:active {
|
background-position:0 -50px;
|
||||||
color:white;
|
}
|
||||||
background-position:0 -100px;
|
a.button:active {
|
||||||
}
|
color:white;
|
||||||
|
background-position:0 -100px;
|
||||||
/* Container */
|
}
|
||||||
|
|
||||||
#container {
|
/* Container */
|
||||||
position:absolute;
|
|
||||||
left:0;
|
#container {
|
||||||
right:0;
|
position:absolute;
|
||||||
top:1em;
|
left:0;
|
||||||
bottom:1em;
|
right:0;
|
||||||
width:40em;
|
top:1em;
|
||||||
margin:auto;
|
bottom:1em;
|
||||||
}
|
width:40em;
|
||||||
|
margin:auto;
|
||||||
/* Feedback */
|
}
|
||||||
|
|
||||||
#feedback {
|
/* Feedback */
|
||||||
position:absolute;
|
|
||||||
width:100%;
|
#feedback {
|
||||||
z-index:1000;
|
position:absolute;
|
||||||
}
|
width:100%;
|
||||||
|
z-index:1000;
|
||||||
#feedback span.feedback {
|
}
|
||||||
display:block;
|
|
||||||
margin-bottom:1em;
|
#feedback span.feedback {
|
||||||
width:calc(100% - 1em);
|
display:block;
|
||||||
box-shadow: 3px 3px 3px 0px rgba(0, 0, 0, 0.6);
|
margin-bottom:1em;
|
||||||
}
|
width:calc(100% - 1em);
|
||||||
|
box-shadow: 3px 3px 3px 0px rgba(0, 0, 0, 0.6);
|
||||||
/* Header */
|
}
|
||||||
|
|
||||||
#header {
|
/* Header */
|
||||||
margin-left:-100px;
|
|
||||||
height:203px;
|
#header {
|
||||||
background:url('../images/logo.png') 0 0 no-repeat;
|
margin-left:-100px;
|
||||||
}
|
height:203px;
|
||||||
|
background:url('../images/logo.png') 0 0 no-repeat;
|
||||||
/* Menu */
|
}
|
||||||
|
|
||||||
#menu {
|
/* Menu */
|
||||||
position:absolute;
|
|
||||||
top:0;
|
#menu {
|
||||||
right:0;
|
position:absolute;
|
||||||
}
|
top:0;
|
||||||
|
right:0;
|
||||||
/* Calendar */
|
}
|
||||||
|
|
||||||
#calendar {
|
/* Calendar */
|
||||||
position:absolute;
|
|
||||||
margin-top:-40px;
|
#calendar {
|
||||||
margin-left:560px;
|
position:absolute;
|
||||||
}
|
margin-top:-40px;
|
||||||
|
margin-left:560px;
|
||||||
table.calendar_list {
|
}
|
||||||
/*border:2px solid #584127;*/
|
|
||||||
background-color:#e2ccb2;
|
table.calendar_list {
|
||||||
}
|
/*border:2px solid #584127;*/
|
||||||
|
background-color:#e2ccb2;
|
||||||
table.calendar_list tbody {
|
}
|
||||||
display:none;
|
|
||||||
border:2px solid #584127;
|
table.calendar_list tbody {
|
||||||
}
|
display:none;
|
||||||
|
border:2px solid #584127;
|
||||||
table.calendar_list:hover tbody {
|
}
|
||||||
display:inline-table;
|
|
||||||
overflow:visible;
|
table.calendar_list:hover tbody {
|
||||||
}
|
display:inline-table;
|
||||||
|
overflow:visible;
|
||||||
table.calendar_list tr.calendar_items td {
|
}
|
||||||
background-position:-6px -7px;
|
|
||||||
background-repeat:no-repeat;
|
table.calendar_list tr.calendar_items td {
|
||||||
width:37px;
|
background-position:-6px -7px;
|
||||||
height:42px;
|
background-repeat:no-repeat;
|
||||||
padding-top:2px;
|
width:37px;
|
||||||
padding-right:3px;
|
height:42px;
|
||||||
}
|
padding-top:2px;
|
||||||
|
padding-right:3px;
|
||||||
table.calendar_list tr th {
|
}
|
||||||
width:auto;
|
|
||||||
text-align:left;
|
table.calendar_list tr th {
|
||||||
font-size:16px;
|
width:auto;
|
||||||
/*border-bottom:2px solid #584127;*/
|
text-align:left;
|
||||||
padding-top:2px;
|
font-size:16px;
|
||||||
}
|
/*border-bottom:2px solid #584127;*/
|
||||||
|
padding-top:2px;
|
||||||
table.calendar_list tr td.item_full {
|
}
|
||||||
background-image:url('../images/minicloud.png');
|
|
||||||
cursor:pointer;
|
table.calendar_list tr td.item_full {
|
||||||
}
|
background-image:url('../images/minicloud.png');
|
||||||
table.calendar_list tr td.item_full:hover {
|
cursor:pointer;
|
||||||
background-image:url('../images/minicloud_hover.png');
|
}
|
||||||
color:white;
|
table.calendar_list tr td.item_full:hover {
|
||||||
}
|
background-image:url('../images/minicloud_hover.png');
|
||||||
table.calendar_list tr td.item_full:active {
|
color:white;
|
||||||
background-image:url('../images/minicloud_active.png');
|
}
|
||||||
background-position: 53% 53%;
|
table.calendar_list tr td.item_full:active {
|
||||||
}
|
background-image:url('../images/minicloud_active.png');
|
||||||
table.calendar_list tr td.item_empty {
|
background-position: 53% 53%;
|
||||||
background-image:url('../images/minicloud_disabled.png');
|
}
|
||||||
color:#e2ccb2;
|
table.calendar_list tr td.item_empty {
|
||||||
font-weight:bold;
|
background-image:url('../images/minicloud_disabled.png');
|
||||||
}
|
color:#e2ccb2;
|
||||||
table.calendar_list tr td.item_disabled {
|
font-weight:bold;
|
||||||
color:#e2ccb2;
|
}
|
||||||
}
|
table.calendar_list tr td.item_disabled {
|
||||||
|
color:#e2ccb2;
|
||||||
a.calendar_direction {
|
}
|
||||||
text-decoration:none;
|
|
||||||
}
|
a.calendar_direction {
|
||||||
|
text-decoration:none;
|
||||||
/* Main */
|
}
|
||||||
|
|
||||||
#main {
|
/* Main */
|
||||||
margin-top:1em;
|
|
||||||
position: absolute;
|
#main {
|
||||||
top:203px;
|
margin-top:1em;
|
||||||
bottom:2em;
|
position: absolute;
|
||||||
right:0;
|
top:203px;
|
||||||
left:0;
|
bottom:2em;
|
||||||
background:#EDE0D0;
|
right:0;
|
||||||
border-radius: 0.5em;
|
left:0;
|
||||||
}
|
background:#EDE0D0;
|
||||||
|
border-radius: 0.5em;
|
||||||
/* Log on */
|
}
|
||||||
|
|
||||||
#logon {
|
/* Read */
|
||||||
width: 496px;
|
|
||||||
height: 225px;
|
div.read {
|
||||||
position: fixed;
|
position:relative;
|
||||||
top: 0px;
|
padding-bottom:30px;
|
||||||
bottom: 0px;
|
}
|
||||||
left: 0px;
|
|
||||||
right: 0px;
|
div.thought {
|
||||||
margin: auto;
|
font-size:16px;
|
||||||
background: transparent url('../images/bubble_inverted.png') 0 0 no-repeat;
|
line-height:20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#logon, #logon input {
|
p.date {
|
||||||
font-size:30px;
|
font-size:20px;
|
||||||
border:none;
|
}
|
||||||
background-color:transparent;
|
|
||||||
}
|
div.time {
|
||||||
|
position:absolute;
|
||||||
#logon .credentials {
|
margin-left:-100px;
|
||||||
margin:45px 0 0 0 ;
|
}
|
||||||
}
|
|
||||||
|
div.paragraphs p {
|
||||||
#logon .credentials input {
|
margin:0 0 20px 0;
|
||||||
width: 305px;
|
}
|
||||||
padding:0 60px;
|
|
||||||
text-align: center;
|
div.paragraphs p:first-letter {
|
||||||
}
|
font-size:59px;
|
||||||
|
line-height:16px;
|
||||||
|
margin-right:5px;
|
||||||
#logon input.connection {
|
font-weight:400;
|
||||||
position:absolute;
|
float:left;
|
||||||
left:374px;
|
text-transform:uppercase;
|
||||||
top:140px;
|
}
|
||||||
cursor:pointer;
|
|
||||||
}
|
div.paragraphs p + p, div.paragraphs p + p:first-letter {
|
||||||
|
font-size:inherit;
|
||||||
#logon .register {
|
line-height:inherit;
|
||||||
margin-top:60px;
|
margin-right:inherit;
|
||||||
text-align: center;
|
font-weight:normal;
|
||||||
}
|
float:none;
|
||||||
|
text-indent:40px;
|
||||||
/* Write */
|
}
|
||||||
|
|
||||||
/* Write - Container */
|
/* Settings */
|
||||||
|
|
||||||
#write {
|
#settings table tr td {
|
||||||
height:100%;
|
text-align:left;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Footer */
|
||||||
/* Write - Editor */
|
|
||||||
|
#footer {
|
||||||
#write #editor div {
|
position: absolute;
|
||||||
margin:0;
|
bottom: 0;
|
||||||
}
|
text-align:center;
|
||||||
|
color:grey;
|
||||||
#write #editor p {
|
font-size:0.9em;
|
||||||
text-indent: 1.5em;
|
width:100%;
|
||||||
margin:1em 0 0 0;
|
height:2em;
|
||||||
padding:0;
|
}
|
||||||
text-align: justify;
|
|
||||||
}
|
#footer a {
|
||||||
|
color:grey;
|
||||||
#write .jqte_editor p:FIRST-CHILD, #write .jqte_toolbar {
|
|
||||||
margin-top:0.5em;
|
}
|
||||||
}
|
|
||||||
|
/* Errors */
|
||||||
/* Write - Toolbar */
|
|
||||||
|
#errors {
|
||||||
#write #nav {
|
position:fixed;
|
||||||
position:absolute;
|
bottom:-2px;
|
||||||
bottom:0;
|
background-color:white;
|
||||||
right:0;
|
width:696px;
|
||||||
left:0;
|
border:2px solid red;
|
||||||
text-align: center;
|
}
|
||||||
}
|
#errors ul li {
|
||||||
|
list-style-image: url(../images/error.png);
|
||||||
#write .fa-prev, #write .page_nb, #write .fa-next {
|
color:red;
|
||||||
color:#997E60;
|
font-weight: bold;
|
||||||
font-size:1.5em;
|
font-size:24px;
|
||||||
margin:0 0 0.5em 0;
|
}
|
||||||
cursor:pointer;
|
|
||||||
}
|
fieldset {
|
||||||
#write .page_nb {
|
margin:20px auto;
|
||||||
font-size: 1em;
|
width:90%;
|
||||||
vertical-align:0.25em;
|
}
|
||||||
cursor: default;
|
|
||||||
padding-left:0.5em;
|
fieldset p {
|
||||||
padding-right:0.5em;
|
text-align: justify;
|
||||||
}
|
}
|
||||||
#write .fa-prev:hover, #write .fa-next:hover {
|
|
||||||
color:#584127;
|
/* Feedback */
|
||||||
}
|
|
||||||
#write .fa-prev.disabled, #write .fa-next.disabled,
|
.notice {
|
||||||
#write .fa-prev.disabled:hover, #write .fa-next.disabled:hover {
|
padding:0;
|
||||||
color:#EDE0D0;
|
color:#997E60;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Write - Placeholder */
|
.error {
|
||||||
|
padding:0 0.5em;
|
||||||
#write .jqte_placeholder_text {
|
color: red;
|
||||||
top:1em;
|
background:#FFB2B2;
|
||||||
left:0;
|
}
|
||||||
text-indent: 1.5em;
|
.warning {
|
||||||
}
|
padding:0 0.5em;
|
||||||
|
color:orange;
|
||||||
#write .jqte_focused .jqte_placeholder_text {
|
background:#FFE4B2;
|
||||||
display:none;
|
}
|
||||||
}
|
.success {
|
||||||
|
padding:0 0.5em;
|
||||||
/* Write - Feedback */
|
color:green;
|
||||||
|
background:#B2D9B2;
|
||||||
#write_feedback {
|
|
||||||
position:absolute;
|
|
||||||
top: -1.5em;
|
|
||||||
right:0.5em;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Read */
|
|
||||||
|
|
||||||
div.read {
|
|
||||||
position:relative;
|
|
||||||
padding-bottom:30px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.thought {
|
|
||||||
font-size:16px;
|
|
||||||
line-height:20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
p.date {
|
|
||||||
font-size:20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.time {
|
|
||||||
position:absolute;
|
|
||||||
margin-left:-100px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.paragraphs p {
|
|
||||||
margin:0 0 20px 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.paragraphs p:first-letter {
|
|
||||||
font-size:59px;
|
|
||||||
line-height:16px;
|
|
||||||
margin-right:5px;
|
|
||||||
font-weight:400;
|
|
||||||
float:left;
|
|
||||||
text-transform:uppercase;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.paragraphs p + p, div.paragraphs p + p:first-letter {
|
|
||||||
font-size:inherit;
|
|
||||||
line-height:inherit;
|
|
||||||
margin-right:inherit;
|
|
||||||
font-weight:normal;
|
|
||||||
float:none;
|
|
||||||
text-indent:40px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Settings */
|
|
||||||
|
|
||||||
#settings table tr td {
|
|
||||||
text-align:left;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Footer */
|
|
||||||
|
|
||||||
#footer {
|
|
||||||
position: absolute;
|
|
||||||
bottom: 0;
|
|
||||||
text-align:center;
|
|
||||||
color:grey;
|
|
||||||
font-size:0.9em;
|
|
||||||
width:100%;
|
|
||||||
height:2em;
|
|
||||||
}
|
|
||||||
|
|
||||||
#footer a {
|
|
||||||
color:grey;
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Errors */
|
|
||||||
|
|
||||||
#errors {
|
|
||||||
position:fixed;
|
|
||||||
bottom:-2px;
|
|
||||||
background-color:white;
|
|
||||||
width:696px;
|
|
||||||
border:2px solid red;
|
|
||||||
}
|
|
||||||
#errors ul li {
|
|
||||||
list-style-image: url(../images/error.png);
|
|
||||||
color:red;
|
|
||||||
font-weight: bold;
|
|
||||||
font-size:24px;
|
|
||||||
}
|
|
||||||
|
|
||||||
fieldset {
|
|
||||||
margin:20px auto;
|
|
||||||
width:90%;
|
|
||||||
}
|
|
||||||
|
|
||||||
fieldset p {
|
|
||||||
text-align: justify;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Feedback */
|
|
||||||
|
|
||||||
.notice {
|
|
||||||
padding:0;
|
|
||||||
color:#997E60;
|
|
||||||
}
|
|
||||||
|
|
||||||
.error {
|
|
||||||
padding:0 0.5em;
|
|
||||||
color: red;
|
|
||||||
background:#FFB2B2;
|
|
||||||
}
|
|
||||||
.warning {
|
|
||||||
padding:0 0.5em;
|
|
||||||
color:orange;
|
|
||||||
background:#FFE4B2;
|
|
||||||
}
|
|
||||||
.success {
|
|
||||||
padding:0 0.5em;
|
|
||||||
color:green;
|
|
||||||
background:#B2D9B2;
|
|
||||||
}
|
}
|
||||||
Reference in New Issue
Block a user