مراية لـ
https://github.com/postalserver/postal.git
تم المزامنة 2025-12-01 05:43:04 +00:00
initial commit from appmail
هذا الالتزام موجود في:
Adam Cooke
16
app/assets/stylesheets/application/elements/_bar.scss
Normal file
16
app/assets/stylesheets/application/elements/_bar.scss
Normal file
@@ -0,0 +1,16 @@
|
||||
.bar {
|
||||
background:$darkBlue;
|
||||
border-radius:10px;
|
||||
display:inline-block;
|
||||
height:5px;
|
||||
width:100%;
|
||||
overflow:hidden;
|
||||
}
|
||||
|
||||
.bar__inner {
|
||||
background:$blue;
|
||||
display:inline-block;
|
||||
border-radius:10px;
|
||||
height:5px;
|
||||
width:50%;
|
||||
}
|
||||
98
app/assets/stylesheets/application/elements/_button.scss
Normal file
98
app/assets/stylesheets/application/elements/_button.scss
Normal file
@@ -0,0 +1,98 @@
|
||||
.button {
|
||||
display:inline-block;
|
||||
font:inherit;
|
||||
border-radius:4px;
|
||||
appearance:none;
|
||||
background:$blue;
|
||||
color:#fff;
|
||||
font-size:14px !important;
|
||||
margin:0;
|
||||
vertical-align:top;
|
||||
padding:6px 15px;
|
||||
border:2px solid transparent;
|
||||
border-bottom:2px solid darken($blue, 20%);
|
||||
&:active {
|
||||
background-color:darken($blue, 15%);
|
||||
}
|
||||
&:focus {
|
||||
border-color:darken($blue, 15%);
|
||||
background-color:lighten($blue, 5%);
|
||||
}
|
||||
&.is-spinning {
|
||||
color:transparent;
|
||||
background-repeat:no-repeat;
|
||||
background-position: center center;
|
||||
background-size:25px;
|
||||
background-image:image-url('button-spinner.gif');
|
||||
}
|
||||
}
|
||||
|
||||
.button--small {
|
||||
font-size:12px !important;
|
||||
padding:3px 10px;
|
||||
border-width:1px;
|
||||
}
|
||||
|
||||
.button--positive {
|
||||
background-color:$green;
|
||||
border-bottom-color:darken($green, 15%);
|
||||
&:active {
|
||||
background-color:darken($green, 15%);
|
||||
}
|
||||
&:focus {
|
||||
border-color:darken($green, 15%);
|
||||
background-color:lighten($green, 5%);
|
||||
}
|
||||
&.is-spinning {
|
||||
background-image:image-url('button-spinner-positive.gif');
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
.button--neutral {
|
||||
background-color:#ccc;
|
||||
border-bottom-color:darken(#ccc, 15%);
|
||||
&:active {
|
||||
background-color:darken(#ccc, 15%);
|
||||
}
|
||||
&:focus {
|
||||
border-color:darken(#ccc, 15%);
|
||||
background-color:lighten(#ccc, 5%);
|
||||
}
|
||||
&.is-spinning {
|
||||
background-image:image-url('button-spinner-neutral.gif');
|
||||
}
|
||||
}
|
||||
|
||||
.button--danger {
|
||||
background-color:$red;
|
||||
border-bottom-color:darken($red, 15%);
|
||||
&:active {
|
||||
background-color:darken($red, 15%);
|
||||
}
|
||||
&:focus {
|
||||
border-color:darken($red, 15%);
|
||||
background-color:lighten($red, 5%);
|
||||
}
|
||||
&.is-spinning {
|
||||
background-image:image-url('button-spinner-danger.gif');
|
||||
}
|
||||
}
|
||||
|
||||
.button--dark {
|
||||
background-color:$darkBlue;
|
||||
border-bottom-color:darken($darkBlue, 15%);
|
||||
&:active {
|
||||
background-color:darken($darkBlue, 15%);
|
||||
}
|
||||
&:focus {
|
||||
border-color:darken($darkBlue, 15%);
|
||||
background-color:lighten($darkBlue, 5%);
|
||||
}
|
||||
&.is-spinning {
|
||||
background-image:image-url('button-spinner-dark.gif');
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
11
app/assets/stylesheets/application/elements/_code_block.scss
Normal file
11
app/assets/stylesheets/application/elements/_code_block.scss
Normal file
@@ -0,0 +1,11 @@
|
||||
.codeBlock {
|
||||
background:#909db0;
|
||||
color:#fff;
|
||||
padding:25px;
|
||||
border-radius:4px;
|
||||
}
|
||||
|
||||
.codeBlock--whitespace {
|
||||
white-space:pre;
|
||||
overflow-x:auto;
|
||||
}
|
||||
70
app/assets/stylesheets/application/elements/_input.scss
Normal file
70
app/assets/stylesheets/application/elements/_input.scss
Normal file
@@ -0,0 +1,70 @@
|
||||
.input {
|
||||
border:0;
|
||||
padding:0;
|
||||
margin:0;
|
||||
background:#fff;
|
||||
border:1px solid #e4e8ef;
|
||||
padding:8px 10px;
|
||||
font:inherit;
|
||||
width:100%;
|
||||
color:$darkBlue;
|
||||
font-weight:600;
|
||||
appearance:none;
|
||||
border-radius:4px;
|
||||
}
|
||||
|
||||
.input--onWhite {
|
||||
background-color:$backgroundGrey;
|
||||
}
|
||||
|
||||
.input:disabled, .input.is-disabled {
|
||||
opacity:0.5;
|
||||
}
|
||||
|
||||
.input:focus {
|
||||
border-color:$blue;
|
||||
background-color:#fff;
|
||||
}
|
||||
|
||||
.input--danger {
|
||||
color:$red;
|
||||
border-width:2px;
|
||||
border-color:lighten($red, 37%);
|
||||
}
|
||||
|
||||
.input--area {
|
||||
height:300px;
|
||||
}
|
||||
|
||||
.input--smallArea {
|
||||
height:120px;
|
||||
}
|
||||
|
||||
.input--danger:focus {
|
||||
border-color:$red;
|
||||
color:$red;
|
||||
background:#fff;
|
||||
}
|
||||
|
||||
.input::placeholder {
|
||||
color:#b5c0d0;
|
||||
font-weight:400;
|
||||
}
|
||||
|
||||
.input--select {
|
||||
background: #fff image-url('icons/select-arrow.svg') right 12px top 50% / 16px 16px no-repeat;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.input--code {
|
||||
font-family:'Droid Sans Mono', fixed;
|
||||
font-size:13px;
|
||||
}
|
||||
|
||||
.inputPair {
|
||||
display:flex;
|
||||
justify-content: space-between;
|
||||
.input {
|
||||
width:49%;
|
||||
}
|
||||
}
|
||||
132
app/assets/stylesheets/application/elements/_label.scss
Normal file
132
app/assets/stylesheets/application/elements/_label.scss
Normal file
@@ -0,0 +1,132 @@
|
||||
.label {
|
||||
display:inline-block;
|
||||
background:#000;
|
||||
color:#fff;
|
||||
font-size:9px;
|
||||
text-transform: uppercase;
|
||||
border-radius:40px;
|
||||
padding:2px 6px;
|
||||
line-height:0.9;
|
||||
}
|
||||
|
||||
.label--green {
|
||||
background-color:$green;
|
||||
}
|
||||
|
||||
.label--red {
|
||||
background-color:$red;
|
||||
}
|
||||
|
||||
.label--orange {
|
||||
background-color:$orange;
|
||||
}
|
||||
|
||||
.label--blue {
|
||||
background-color:$blue;
|
||||
}
|
||||
|
||||
.label--grey {
|
||||
background-color:#999;
|
||||
}
|
||||
|
||||
.label--turquoise {
|
||||
background-color:$blue;
|
||||
}
|
||||
|
||||
.label--purple {
|
||||
background-color:$purple;
|
||||
}
|
||||
|
||||
.label--large {
|
||||
font-size:11px;
|
||||
padding:4px 10px;
|
||||
}
|
||||
|
||||
.label--serverStatus-live {
|
||||
background-color:$green;
|
||||
}
|
||||
|
||||
.label--serverStatus-development {
|
||||
background-color:#636363;
|
||||
}
|
||||
|
||||
.label--serverStatus-suspended {
|
||||
background-color:$red;
|
||||
}
|
||||
|
||||
.label--messageStatus-pending {
|
||||
background-color:$subBlue;
|
||||
}
|
||||
|
||||
.label--messageStatus-held {
|
||||
background-color:#aaa;
|
||||
}
|
||||
|
||||
.label--messageStatus-processed {
|
||||
background-color:$green;
|
||||
}
|
||||
|
||||
.label--messageStatus-sent {
|
||||
background-color:$green;
|
||||
}
|
||||
|
||||
.label--messageStatus-hard_fail {
|
||||
background-color:$red;
|
||||
}
|
||||
|
||||
.label--messageStatus-soft_fail {
|
||||
background-color:$orange;
|
||||
}
|
||||
|
||||
.label--messageStatus-bounced {
|
||||
background-color:$red;
|
||||
}
|
||||
|
||||
.label--messageStatus-hold_cancelled {
|
||||
background-color:#ccc;
|
||||
}
|
||||
|
||||
|
||||
.label--credentialType-api {
|
||||
background-color:$blue;
|
||||
}
|
||||
|
||||
.label--credentialType-smtp {
|
||||
background-color:$turquoise;
|
||||
}
|
||||
|
||||
.label--spamStatus-not_checked {
|
||||
background:#aaa;
|
||||
}
|
||||
|
||||
.label--spamStatus-spam {
|
||||
background:$orange;
|
||||
}
|
||||
|
||||
.label--spamStatus-not_spam {
|
||||
background:$turquoise;
|
||||
}
|
||||
|
||||
.label--http-status-2 {
|
||||
background-color:$green;
|
||||
}
|
||||
|
||||
.label--http-status-3 {
|
||||
background-color:$orange;
|
||||
}
|
||||
|
||||
.label--http-status-4,
|
||||
.label--http-status-5 {
|
||||
background-color:$red;
|
||||
}
|
||||
|
||||
.domainList__ssl {
|
||||
color:$green;
|
||||
&:hover {
|
||||
text-decoration:underline;
|
||||
}
|
||||
}
|
||||
|
||||
.domainList__ssl--disabled {
|
||||
color:#999;
|
||||
}
|
||||
16
app/assets/stylesheets/application/elements/_misc.scss
Normal file
16
app/assets/stylesheets/application/elements/_misc.scss
Normal file
@@ -0,0 +1,16 @@
|
||||
.returnPathTag {
|
||||
background:image-url('icons/return-path.svg') no-repeat 0 4px / 10px;
|
||||
padding-left:14px;
|
||||
}
|
||||
|
||||
.returnPathTag--inMessageHeader {
|
||||
background-size:14px;
|
||||
padding-left:18px;
|
||||
}
|
||||
|
||||
.warningBox {
|
||||
background-color:#fff8e4;
|
||||
border:1px solid #c8bc9b;
|
||||
padding:15px;
|
||||
line-height:1.4;
|
||||
}
|
||||
159
app/assets/stylesheets/application/elements/_spam_range.scss
Normal file
159
app/assets/stylesheets/application/elements/_spam_range.scss
Normal file
@@ -0,0 +1,159 @@
|
||||
.spamRangeLabel {
|
||||
font-size:12px;
|
||||
text-align:right;
|
||||
margin-top:7px;
|
||||
}
|
||||
|
||||
.spamRange {
|
||||
-webkit-appearance: none; /* Hides the slider so that custom slider can be made */
|
||||
width: 100%; /* Specific width is required for Firefox. */
|
||||
background: transparent; /* Otherwise white in Chrome */
|
||||
&:disabled {
|
||||
opacity:0.5;
|
||||
}
|
||||
}
|
||||
|
||||
.spamRange::-webkit-slider-thumb {
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
|
||||
.spamRange:focus {
|
||||
outline: none; /* Removes the blue border. You should probably do some kind of focus styling for accessibility reasons though. */
|
||||
}
|
||||
|
||||
.spamRange::-ms-track {
|
||||
width: 100%;
|
||||
cursor: pointer;
|
||||
|
||||
/* Hides the slider so custom styles can be added */
|
||||
background: transparent;
|
||||
border-color: transparent;
|
||||
color: transparent;
|
||||
}
|
||||
|
||||
/* Special styling for WebKit/Blink */
|
||||
.spamRange::-webkit-slider-thumb {
|
||||
-webkit-appearance: none;
|
||||
border: 2px solid #2b2e32;
|
||||
height:25px;
|
||||
width:25px;
|
||||
border-radius: 50%;
|
||||
background: #ffffff;
|
||||
cursor: pointer;
|
||||
margin-top: -7px; /* You need to specify a margin in Chrome, but in Firefox and IE it is automatic */
|
||||
}
|
||||
|
||||
/* All the same stuff for Firefox */
|
||||
.spamRange::-moz-range-thumb {
|
||||
border: 2px solid #2b2e32;
|
||||
height:25px;
|
||||
width:25px;
|
||||
border-radius: 50%;
|
||||
background: #ffffff;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
/* All the same stuff for IE */
|
||||
.spamRange::-ms-thumb {
|
||||
border: 2px solid #2b2e32;
|
||||
height:25px;
|
||||
width:25px;
|
||||
border-radius: 50%;
|
||||
background: #ffffff;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
//
|
||||
// Track
|
||||
//
|
||||
|
||||
.spamRange::-webkit-slider-runnable-track {
|
||||
width: 100%;
|
||||
height: 12px;
|
||||
cursor: pointer;
|
||||
border-radius:30px;
|
||||
background: #3ff990; /* Old browsers */
|
||||
background: -moz-linear-gradient(left, #3ff990 0%, #197ec9 47%, #6c5c8b 100%); /* FF3.6-15 */
|
||||
background: -webkit-linear-gradient(left, #3ff990 0%,#197ec9 47%,#6c5c8b 100%); /* Chrome10-25,Safari5.1-6 */
|
||||
background: linear-gradient(to right, #3ff990 0%,#197ec9 47%,#6c5c8b 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
|
||||
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3ff990', endColorstr='#6c5c8b',GradientType=1 ); /* IE6-9 */
|
||||
}
|
||||
|
||||
.spamRange::-moz-range-track {
|
||||
width: 100%;
|
||||
height: 12px;
|
||||
cursor: pointer;
|
||||
border-radius:30px;
|
||||
background: #3ff990; /* Old browsers */
|
||||
background: -moz-linear-gradient(left, #3ff990 0%, #197ec9 47%, #6c5c8b 100%); /* FF3.6-15 */
|
||||
background: -webkit-linear-gradient(left, #3ff990 0%,#197ec9 47%,#6c5c8b 100%); /* Chrome10-25,Safari5.1-6 */
|
||||
background: linear-gradient(to right, #3ff990 0%,#197ec9 47%,#6c5c8b 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
|
||||
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3ff990', endColorstr='#6c5c8b',GradientType=1 ); /* IE6-9 */
|
||||
}
|
||||
|
||||
.spamRange::-ms-track {
|
||||
width: 100%;
|
||||
height: 12px;
|
||||
cursor: pointer;
|
||||
border-radius:30px;
|
||||
background: transparent;
|
||||
border-color: transparent;
|
||||
background: #3ff990; /* Old browsers */
|
||||
background: -moz-linear-gradient(left, #3ff990 0%, #197ec9 47%, #6c5c8b 100%); /* FF3.6-15 */
|
||||
background: -webkit-linear-gradient(left, #3ff990 0%,#197ec9 47%,#6c5c8b 100%); /* Chrome10-25,Safari5.1-6 */
|
||||
background: linear-gradient(to right, #3ff990 0%,#197ec9 47%,#6c5c8b 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
|
||||
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3ff990', endColorstr='#6c5c8b',GradientType=1 ); /* IE6-9 */
|
||||
}
|
||||
|
||||
.spamRange--hot::-webkit-slider-runnable-track {
|
||||
background: #1688d0; /* Old browsers */
|
||||
background: -moz-linear-gradient(left, #1688d0 0%, #fa141b 100%); /* FF3.6-15 */
|
||||
background: -webkit-linear-gradient(left, #1688d0 0%,#fa141b 100%); /* Chrome10-25,Safari5.1-6 */
|
||||
background: linear-gradient(to right, #1688d0 0%,#fa141b 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
|
||||
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1688d0', endColorstr='#fa141b',GradientType=1 ); /* IE6-9 */
|
||||
}
|
||||
|
||||
.spamRange--hot::-moz-range-track {
|
||||
background: #1688d0; /* Old browsers */
|
||||
background: -moz-linear-gradient(left, #1688d0 0%, #fa141b 100%); /* FF3.6-15 */
|
||||
background: -webkit-linear-gradient(left, #1688d0 0%,#fa141b 100%); /* Chrome10-25,Safari5.1-6 */
|
||||
background: linear-gradient(to right, #1688d0 0%,#fa141b 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
|
||||
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1688d0', endColorstr='#fa141b',GradientType=1 ); /* IE6-9 */
|
||||
}
|
||||
|
||||
.spamRange--hot::-ms-track {
|
||||
background: #1688d0; /* Old browsers */
|
||||
background: -moz-linear-gradient(left, #1688d0 0%, #fa141b 100%); /* FF3.6-15 */
|
||||
background: -webkit-linear-gradient(left, #1688d0 0%,#fa141b 100%); /* Chrome10-25,Safari5.1-6 */
|
||||
background: linear-gradient(to right, #1688d0 0%,#fa141b 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
|
||||
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1688d0', endColorstr='#fa141b',GradientType=1 ); /* IE6-9 */
|
||||
}
|
||||
|
||||
|
||||
.spamRange--blueGreen::-webkit-slider-runnable-track {
|
||||
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#146dd2+0,7cc546+100 */
|
||||
background: #146dd2; /* Old browsers */
|
||||
background: -moz-linear-gradient(left, #146dd2 0%, #7cc546 100%); /* FF3.6-15 */
|
||||
background: -webkit-linear-gradient(left, #146dd2 0%,#7cc546 100%); /* Chrome10-25,Safari5.1-6 */
|
||||
background: linear-gradient(to right, #146dd2 0%,#7cc546 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
|
||||
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#146dd2', endColorstr='#7cc546',GradientType=1 ); /* IE6-9 */
|
||||
}
|
||||
|
||||
.spamRange--blueGreen::-moz-range-track {
|
||||
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#146dd2+0,7cc546+100 */
|
||||
background: #146dd2; /* Old browsers */
|
||||
background: -moz-linear-gradient(left, #146dd2 0%, #7cc546 100%); /* FF3.6-15 */
|
||||
background: -webkit-linear-gradient(left, #146dd2 0%,#7cc546 100%); /* Chrome10-25,Safari5.1-6 */
|
||||
background: linear-gradient(to right, #146dd2 0%,#7cc546 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
|
||||
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#146dd2', endColorstr='#7cc546',GradientType=1 ); /* IE6-9 */
|
||||
}
|
||||
|
||||
.spamRange--blueGreen::-ms-track {
|
||||
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#146dd2+0,7cc546+100 */
|
||||
background: #146dd2; /* Old browsers */
|
||||
background: -moz-linear-gradient(left, #146dd2 0%, #7cc546 100%); /* FF3.6-15 */
|
||||
background: -webkit-linear-gradient(left, #146dd2 0%,#7cc546 100%); /* Chrome10-25,Safari5.1-6 */
|
||||
background: linear-gradient(to right, #146dd2 0%,#7cc546 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
|
||||
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#146dd2', endColorstr='#7cc546',GradientType=1 ); /* IE6-9 */
|
||||
}
|
||||
|
||||
المرجع في مشكلة جديدة
حظر مستخدم