move ssb-patchwork-api and ssb-patchwork-ui into this repo
This commit is contained in:
Paul Frazee
35
ui/less/com/address-book.less
Normal file
35
ui/less/com/address-book.less
Normal file
@@ -0,0 +1,35 @@
|
||||
.address-book-controls {
|
||||
display: flex;
|
||||
max-width: 1000px;
|
||||
background: #fff;
|
||||
margin: 24px auto 0;
|
||||
border-radius: 5px;
|
||||
border: 1px solid #ccc;
|
||||
|
||||
h4 {
|
||||
color: #555;
|
||||
white-space: pre;
|
||||
}
|
||||
p {
|
||||
color: gray;
|
||||
}
|
||||
|
||||
.search {
|
||||
padding: 0 24px;
|
||||
input {
|
||||
height: 30px;
|
||||
margin-top: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
.getcode {
|
||||
flex: 0 0 260px;
|
||||
cursor: pointer;
|
||||
padding: 0 12px 0 24px;
|
||||
border-left: 1px solid #ccc;
|
||||
|
||||
&:hover {
|
||||
background: #f5f5f5;
|
||||
}
|
||||
}
|
||||
}
|
||||
33
ui/less/com/advert-form.less
Normal file
33
ui/less/com/advert-form.less
Normal file
@@ -0,0 +1,33 @@
|
||||
.advert-form {
|
||||
margin-top: 1em;
|
||||
|
||||
.open {
|
||||
display: none;
|
||||
}
|
||||
&.opened {
|
||||
.open {
|
||||
display: block;
|
||||
}
|
||||
.closed {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
.preview {
|
||||
margin-top: 1em;
|
||||
color: #555;
|
||||
}
|
||||
.preview:empty {
|
||||
display: none;
|
||||
}
|
||||
.preview > :last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.post-form-btns {
|
||||
button, a {
|
||||
margin-right: 5px;
|
||||
}
|
||||
a {
|
||||
color: @link-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
11
ui/less/com/adverts.less
Normal file
11
ui/less/com/adverts.less
Normal file
@@ -0,0 +1,11 @@
|
||||
.adverts-but-its-cool-tho {
|
||||
max-width: 200px;
|
||||
.well {
|
||||
color: #808080;
|
||||
margin-bottom: 1em;
|
||||
padding: 9px;
|
||||
& > :last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
53
ui/less/com/composer.less
Normal file
53
ui/less/com/composer.less
Normal file
@@ -0,0 +1,53 @@
|
||||
|
||||
.composer {
|
||||
margin: 15px 24px;
|
||||
&.reply {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.composer-body {
|
||||
padding: 10px;
|
||||
border: 1px solid #ccc;
|
||||
background: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
.composer-header {
|
||||
position: relative;
|
||||
margin: 5px 0 0 88px;
|
||||
|
||||
.composer-header-nav {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: -40px;
|
||||
width: 38px;
|
||||
|
||||
a {
|
||||
display: none;
|
||||
position: relative;
|
||||
padding: 6px 12px;
|
||||
color: gray;
|
||||
border-radius: 2px;
|
||||
cursor: pointer;
|
||||
text-shadow: 0 2px 3px rgba(0,0,0,0.15);
|
||||
|
||||
&:hover {
|
||||
color: #555;
|
||||
}
|
||||
&.selected {
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
&:hover {
|
||||
background: #fff;
|
||||
z-index: 1000;
|
||||
box-shadow: 2px 3px 3px rgba(0, 0, 0, 0.15);
|
||||
a {
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.composer-header-body {
|
||||
}
|
||||
}
|
||||
16
ui/less/com/contact-feed.less
Normal file
16
ui/less/com/contact-feed.less
Normal file
@@ -0,0 +1,16 @@
|
||||
.contact-feed-container {
|
||||
|
||||
.contact-feed {
|
||||
max-width: 960px;
|
||||
margin: 0 auto;
|
||||
|
||||
&:empty::before {
|
||||
content: 'Empty';
|
||||
font-size: 16px;
|
||||
font-style: italic;
|
||||
color: #777;
|
||||
margin: 1em;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
64
ui/less/com/contact-listing.less
Normal file
64
ui/less/com/contact-listing.less
Normal file
@@ -0,0 +1,64 @@
|
||||
.contact-listing {
|
||||
display: flex;
|
||||
color: #555;
|
||||
|
||||
.profpic {
|
||||
margin-left: 10px;
|
||||
height: 75px;
|
||||
}
|
||||
.details {
|
||||
flex: 1;
|
||||
margin-left: 14px;
|
||||
padding: 10px 0;
|
||||
p {
|
||||
margin: 0 15px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.name {
|
||||
font-size: 21px;
|
||||
|
||||
a {
|
||||
color: #444;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
.actions {
|
||||
padding: 24px 10px 0 0;
|
||||
}
|
||||
.text-danger {
|
||||
color: #FD241F;
|
||||
}
|
||||
|
||||
&:not(.compact):nth-child(odd) {
|
||||
background: #fff;
|
||||
.details {
|
||||
margin-left: 60px;
|
||||
}
|
||||
}
|
||||
&:not(.compact):nth-child(even) {
|
||||
.profpic {
|
||||
margin-left: 54px;
|
||||
}
|
||||
}
|
||||
&.compact {
|
||||
.details {
|
||||
margin-left: 8px;
|
||||
}
|
||||
.profpic {
|
||||
height: auto;
|
||||
margin-top: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.peers {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.address-book-page {
|
||||
.message-feed-container {
|
||||
padding-top: 10px;
|
||||
}
|
||||
}
|
||||
133
ui/less/com/contact-summary.less
Normal file
133
ui/less/com/contact-summary.less
Normal file
@@ -0,0 +1,133 @@
|
||||
.contact-summary {
|
||||
margin: 5px 10px;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
|
||||
h2, p {
|
||||
margin: 0;
|
||||
}
|
||||
.section {
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
li {
|
||||
display: inline-block;
|
||||
margin-right: 1em;
|
||||
}
|
||||
.title {
|
||||
width: 275px;
|
||||
text-align: center;
|
||||
margin: 15px 0 10px;
|
||||
|
||||
h2 {
|
||||
font-weight: bold;
|
||||
}
|
||||
h3 {
|
||||
margin: 1px 0 0;
|
||||
font-size: 21px;
|
||||
.user-link {
|
||||
color: inherit;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.profpic {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
.hexagon-275 {
|
||||
z-index: 10;
|
||||
}
|
||||
.hexTop, .hexBottom {
|
||||
outline: 5px solid #eee;
|
||||
}
|
||||
}
|
||||
|
||||
.totem {
|
||||
position: relative;
|
||||
width: 275px;
|
||||
height: 318px;
|
||||
|
||||
.corner {
|
||||
position: absolute;
|
||||
z-index: 5;
|
||||
display: block;
|
||||
width: 130px;
|
||||
height: 100px;
|
||||
background: #282C32;
|
||||
color: #2778E2;
|
||||
border-radius: 2px;
|
||||
font-family: @font-family-monospace;
|
||||
font-size: 21px;
|
||||
.corner-inner {
|
||||
position: absolute;
|
||||
}
|
||||
&:hover:after {
|
||||
content: attr(data-overlay);
|
||||
position: absolute;
|
||||
background: inherit;
|
||||
border-radius: 2px;
|
||||
width: 100%;
|
||||
font-family: @font-family-sans-serif;
|
||||
font-size: 15px;
|
||||
}
|
||||
}
|
||||
.topleft {
|
||||
top: 10px;
|
||||
left: 10px;
|
||||
.corner-inner {
|
||||
left: 9px;
|
||||
top: 4px;
|
||||
}
|
||||
&:hover:after {
|
||||
top: 0;
|
||||
left: 0;
|
||||
padding: 4px 6px 50px;
|
||||
}
|
||||
}
|
||||
.topright {
|
||||
top: 10px;
|
||||
right: 10px;
|
||||
.corner-inner {
|
||||
right: 11px;
|
||||
top: 4px;
|
||||
}
|
||||
}
|
||||
.botleft {
|
||||
bottom: 10px;
|
||||
left: 10px;
|
||||
.corner-inner {
|
||||
left: 9px;
|
||||
top: 68px;
|
||||
}
|
||||
&:hover:after {
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
padding: 50px 6px 4px;
|
||||
}
|
||||
}
|
||||
.botright {
|
||||
bottom: 10px;
|
||||
right: 10px;
|
||||
.corner-inner {
|
||||
right: 11px;
|
||||
top: 68px;
|
||||
}
|
||||
&:hover:after {
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
padding: 50px 6px 4px;
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
.glyphicon {
|
||||
font-size: 12px;
|
||||
margin: 0 3px;
|
||||
}
|
||||
}
|
||||
|
||||
.relations {
|
||||
margin: 0 0 0 10px;
|
||||
.user-hexagon {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
39
ui/less/com/contact-sync-listing.less
Normal file
39
ui/less/com/contact-sync-listing.less
Normal file
@@ -0,0 +1,39 @@
|
||||
.contact-sync-listing {
|
||||
|
||||
&.empty {
|
||||
padding: 10px;
|
||||
background: #fff;
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.peer {
|
||||
margin: 10px 0;
|
||||
}
|
||||
.peer-title {
|
||||
font-size: 21px;
|
||||
padding: 5px 10px;
|
||||
background: #fff;
|
||||
position: relative;
|
||||
|
||||
&:before {
|
||||
content: attr(data-history);
|
||||
position: absolute;
|
||||
bottom: 10px;
|
||||
left: 77px;
|
||||
font-size: 12px;
|
||||
color: gray;
|
||||
}
|
||||
|
||||
.hexagon-60 {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
}
|
||||
}
|
||||
.contact-feed-container {
|
||||
padding: 10px;
|
||||
&:before {
|
||||
content: 'follows:';
|
||||
color: #777;
|
||||
}
|
||||
}
|
||||
}
|
||||
51
ui/less/com/dropdown.less
Normal file
51
ui/less/com/dropdown.less
Normal file
@@ -0,0 +1,51 @@
|
||||
.dropdown {
|
||||
position: absolute;
|
||||
z-index: 10000;
|
||||
width: 200px;
|
||||
padding: 6px 0;
|
||||
background: #fff;
|
||||
box-shadow: 0px 3px 3px rgba(0,0,0,0.1);
|
||||
border: 1px solid #bbb;
|
||||
|
||||
&:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 17px;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
top: -10px;
|
||||
border-width: 0 7px 8px;
|
||||
border-bottom-color: #ccc;
|
||||
border-style: solid;
|
||||
color: transparent;
|
||||
}
|
||||
&.nopad {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.item {
|
||||
display: block;
|
||||
margin: 0;
|
||||
padding: 6px 20px;
|
||||
color: gray;
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
text-decoration: none;
|
||||
color: #fff;
|
||||
background: @brand-primary;
|
||||
font-weight:100;
|
||||
}
|
||||
}
|
||||
hr {
|
||||
margin: 6px 0;
|
||||
border-color: #ccc;
|
||||
}
|
||||
|
||||
&.right {
|
||||
&:before {
|
||||
left: auto;
|
||||
right: 17px;
|
||||
}
|
||||
}
|
||||
}
|
||||
26
ui/less/com/error-form.less
Normal file
26
ui/less/com/error-form.less
Normal file
@@ -0,0 +1,26 @@
|
||||
.error-form {
|
||||
.modal-form;
|
||||
padding: 0;
|
||||
|
||||
.error-form-title {
|
||||
padding: 6px 11px;
|
||||
color: #666;
|
||||
font-size: 21px;
|
||||
background: url(../img/lines.svg);
|
||||
border-bottom: 1px solid #ddd;
|
||||
}
|
||||
.error-form-message {
|
||||
padding: 10px 12px;
|
||||
font-size: 16px;
|
||||
}
|
||||
.error-form-actions {
|
||||
padding: 12px;
|
||||
.btn {
|
||||
margin-right: 5px;
|
||||
}
|
||||
}
|
||||
.error-form-stack {
|
||||
border-radius: 0;
|
||||
color: #777;
|
||||
}
|
||||
}
|
||||
27
ui/less/com/ext.less
Normal file
27
ui/less/com/ext.less
Normal file
@@ -0,0 +1,27 @@
|
||||
.ext {
|
||||
padding-bottom: 100px;
|
||||
small {
|
||||
background: #f5f5f5;
|
||||
margin: 0;
|
||||
}
|
||||
.ext-txt {
|
||||
white-space: pre-wrap;
|
||||
font-family: @font-family-monospace;
|
||||
}
|
||||
.ext-markdown {
|
||||
font-family: @font-family-sans-serif;
|
||||
}
|
||||
.ext-img {
|
||||
max-width: 100%;
|
||||
padding: 0;
|
||||
border-top: 1px solid #999;
|
||||
}
|
||||
.ext-obj {
|
||||
width: 100%;
|
||||
min-height: 600px;
|
||||
border: 1px solid #999;
|
||||
}
|
||||
.ext-html {
|
||||
min-height: 600px;
|
||||
}
|
||||
}
|
||||
16
ui/less/com/fact-form.less
Normal file
16
ui/less/com/fact-form.less
Normal file
@@ -0,0 +1,16 @@
|
||||
.fact-form {
|
||||
display: table;
|
||||
.fact-form-subject {
|
||||
display: table-cell;
|
||||
white-space: pre;
|
||||
padding: 0 5px;
|
||||
}
|
||||
.fact-form-textarea {
|
||||
display: table-cell;
|
||||
width: 100%;
|
||||
padding: 0 5px;
|
||||
}
|
||||
button {
|
||||
display: table-cell;
|
||||
}
|
||||
}
|
||||
93
ui/less/com/files-view.less
Normal file
93
ui/less/com/files-view.less
Normal file
@@ -0,0 +1,93 @@
|
||||
.files-view {
|
||||
.table;
|
||||
.table-hover;
|
||||
background: #fff;
|
||||
white-space: pre;
|
||||
|
||||
td:nth-child(1) {
|
||||
width: 80px;
|
||||
border-right: 1px solid #ddd;
|
||||
border-left: 1px solid #ddd;
|
||||
}
|
||||
td:nth-child(2) {
|
||||
width: 28px;
|
||||
}
|
||||
td:nth-child(4) {
|
||||
width: 180px;
|
||||
}
|
||||
td:nth-child(5) {
|
||||
width: 80px;
|
||||
border-right: 1px solid #ddd;
|
||||
}
|
||||
.folder {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.glyphicon {
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.files-view-pathctrl {
|
||||
border: 1px solid #ccc;
|
||||
padding: 7px 10px 6px 10px;
|
||||
background: #fafafa;
|
||||
position: relative;
|
||||
left: -4px;
|
||||
top: 2px;
|
||||
border-left: 0;
|
||||
border-top-right-radius: 5px;
|
||||
border-bottom-right-radius: 5px;
|
||||
box-shadow: inset 2px 0 3px rgba(0,0,0,0.15);
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.files-view-changes {
|
||||
margin: 0 0 12px;
|
||||
|
||||
& > div {
|
||||
display: flex;
|
||||
|
||||
& > div {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
|
||||
border-top: 1px solid;
|
||||
border-right: 1px solid;
|
||||
padding: 5px;
|
||||
&:first-child {
|
||||
border-left: 1px solid;
|
||||
}
|
||||
}
|
||||
&:last-child > div {
|
||||
border-bottom: 1px solid;
|
||||
}
|
||||
}
|
||||
.action {
|
||||
flex: 0 0 30px;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
}
|
||||
.path {
|
||||
flex: 1;
|
||||
}
|
||||
.size {
|
||||
flex: 0 0 80px;
|
||||
}
|
||||
.type {
|
||||
flex: 0 0 180px;
|
||||
}
|
||||
|
||||
.add {
|
||||
background: #efe;
|
||||
color: green;
|
||||
}
|
||||
.mod {
|
||||
background: #eef;
|
||||
color: blue;
|
||||
}
|
||||
.del {
|
||||
background: #fee;
|
||||
color: red;
|
||||
}
|
||||
}
|
||||
16
ui/less/com/finder.less
Normal file
16
ui/less/com/finder.less
Normal file
@@ -0,0 +1,16 @@
|
||||
#finder {
|
||||
position: fixed;
|
||||
top: 43px;
|
||||
left: 5px;
|
||||
width: 300px;
|
||||
height: 32px;
|
||||
z-index: 1000;
|
||||
background-color: #fff;
|
||||
border: 1px solid #ccc;
|
||||
padding: 2px;
|
||||
|
||||
input {
|
||||
display: block;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
11
ui/less/com/flag-form.less
Normal file
11
ui/less/com/flag-form.less
Normal file
@@ -0,0 +1,11 @@
|
||||
.flag-form {
|
||||
.modal-form;
|
||||
.radios {
|
||||
margin-bottom: 10px;
|
||||
background: #fafafa;
|
||||
}
|
||||
.radio {
|
||||
display: inline-block;
|
||||
margin: 10px;
|
||||
}
|
||||
}
|
||||
97
ui/less/com/header-controls.less
Normal file
97
ui/less/com/header-controls.less
Normal file
@@ -0,0 +1,97 @@
|
||||
.header-ctrls {
|
||||
font-size: 16px;
|
||||
background: #fff;
|
||||
margin: 10px 5px;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 2px;
|
||||
padding: 5px;
|
||||
|
||||
.navlinks {
|
||||
display: table-cell;
|
||||
white-space: pre;
|
||||
vertical-align: middle;
|
||||
|
||||
a {
|
||||
display: inline-block;
|
||||
padding: 4px 15px;
|
||||
margin-right: 5px;
|
||||
font-weight: 100;
|
||||
color: #769142;
|
||||
|
||||
&:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
&.selected {
|
||||
color: #5E6F3C;
|
||||
}
|
||||
&.highlight {
|
||||
background: #71A800;
|
||||
color: #FFF;
|
||||
border-radius: 2px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.btns {
|
||||
display: table-cell;
|
||||
vertical-align: top;
|
||||
a {
|
||||
display: block;
|
||||
width: 50px;
|
||||
text-align: center;
|
||||
font-size: 21px;
|
||||
color: gray;
|
||||
position: relative;
|
||||
top: 15px;
|
||||
&:hover {
|
||||
color: #666;
|
||||
}
|
||||
}
|
||||
}
|
||||
& > form {
|
||||
display: table-cell;
|
||||
width: 100%;
|
||||
input {
|
||||
border: 1px solid #ccc;
|
||||
padding: 5px 10px;
|
||||
&.search {
|
||||
padding: 5px 12px;
|
||||
border-radius: 15px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.big {
|
||||
font-size: 18px;
|
||||
|
||||
.navlinks a {
|
||||
padding: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
&.light {
|
||||
|
||||
.navlinks a {
|
||||
color: #777;
|
||||
background: #fff;
|
||||
border: 0;
|
||||
border-top: 1px solid #ccc;
|
||||
border-bottom: 3px solid #ccc;
|
||||
margin-right: 0;
|
||||
|
||||
&:first-child {
|
||||
border-left: 1px solid #ccc;
|
||||
}
|
||||
&:last-child {
|
||||
border-right: 1px solid #ccc;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
color: #555;
|
||||
}
|
||||
&.selected {
|
||||
color: #333;
|
||||
border-bottom-color: #777;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
16
ui/less/com/helptip.less
Normal file
16
ui/less/com/helptip.less
Normal file
@@ -0,0 +1,16 @@
|
||||
.helptip {
|
||||
display: none;
|
||||
position: fixed;
|
||||
top: 1%;
|
||||
left: 1%;
|
||||
width: 340px;
|
||||
background: white;
|
||||
padding: 20px;
|
||||
border: 1px solid #ccc;
|
||||
z-index: 1000;
|
||||
box-shadow: 0px 3px 5px rgba(0,0,0,0.15);
|
||||
|
||||
&.active {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
513
ui/less/com/hexagon.less
Normal file
513
ui/less/com/hexagon.less
Normal file
@@ -0,0 +1,513 @@
|
||||
// courtesy of csshexagon.com
|
||||
|
||||
.hexagon-30 {
|
||||
position: relative;
|
||||
width: 30px;
|
||||
height: 17.32px;
|
||||
margin: 8.66px 0;
|
||||
background-size: auto 34.6410px;
|
||||
background-position: center;
|
||||
|
||||
.hexTop,
|
||||
.hexBottom {
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
width: 21.21px;
|
||||
height: 21.21px;
|
||||
overflow: hidden;
|
||||
-webkit-transform: scaleY(0.5774) rotate(-45deg);
|
||||
-ms-transform: scaleY(0.5774) rotate(-45deg);
|
||||
transform: scaleY(0.5774) rotate(-45deg);
|
||||
background: inherit;
|
||||
left: 4.39px;
|
||||
|
||||
/* Keeps borders smooth in webkit */
|
||||
backface-visibility: hidden;
|
||||
}
|
||||
|
||||
/*counter transform the bg image on the caps*/
|
||||
.hexTop:after,
|
||||
.hexBottom:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
width: 30.0000px;
|
||||
height: 17.320508075688775px;
|
||||
-webkit-transform: rotate(45deg) scaleY(1.7321) translateY(-8.6603px);
|
||||
-ms-transform: rotate(45deg) scaleY(1.7321) translateY(-8.6603px);
|
||||
transform: rotate(45deg) scaleY(1.7321) translateY(-8.6603px);
|
||||
-webkit-transform-origin: 0 0;
|
||||
-ms-transform-origin: 0 0;
|
||||
transform-origin: 0 0;
|
||||
background: inherit;
|
||||
}
|
||||
|
||||
.hexTop {
|
||||
top: -10.6066px;
|
||||
}
|
||||
|
||||
.hexTop:after {
|
||||
background-position: center top;
|
||||
}
|
||||
|
||||
.hexBottom {
|
||||
bottom: -10.6066px;
|
||||
}
|
||||
|
||||
.hexBottom:after {
|
||||
background-position: center bottom;
|
||||
}
|
||||
|
||||
&:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 30.0000px;
|
||||
height: 17.3205px;
|
||||
z-index: 2;
|
||||
background: inherit;
|
||||
}
|
||||
}
|
||||
|
||||
.hexagon-45 {
|
||||
position: relative;
|
||||
width: 45px;
|
||||
height: 25.98px;
|
||||
margin: 12.99px 0;
|
||||
background-size: auto 51.9615px;
|
||||
background-position: center;
|
||||
|
||||
.hexTop,
|
||||
.hexBottom {
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
width: 31.82px;
|
||||
height: 31.82px;
|
||||
overflow: hidden;
|
||||
-webkit-transform: scaleY(0.5774) rotate(-45deg);
|
||||
-ms-transform: scaleY(0.5774) rotate(-45deg);
|
||||
transform: scaleY(0.5774) rotate(-45deg);
|
||||
background: inherit;
|
||||
left: 6.59px;
|
||||
|
||||
/* Keeps borders smooth in webkit */
|
||||
backface-visibility: hidden;
|
||||
}
|
||||
|
||||
/*counter transform the bg image on the caps*/
|
||||
.hexTop:after,
|
||||
.hexBottom:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
width: 45.0000px;
|
||||
height: 25.98076211353316px;
|
||||
-webkit-transform: rotate(45deg) scaleY(1.7321) translateY(-12.9904px);
|
||||
-ms-transform: rotate(45deg) scaleY(1.7321) translateY(-12.9904px);
|
||||
transform: rotate(45deg) scaleY(1.7321) translateY(-12.9904px);
|
||||
-webkit-transform-origin: 0 0;
|
||||
-ms-transform-origin: 0 0;
|
||||
transform-origin: 0 0;
|
||||
background: inherit;
|
||||
}
|
||||
|
||||
.hexTop {
|
||||
top: -15.9099px;
|
||||
}
|
||||
|
||||
.hexTop:after {
|
||||
background-position: center top;
|
||||
}
|
||||
|
||||
.hexBottom {
|
||||
bottom: -15.9099px;
|
||||
}
|
||||
|
||||
.hexBottom:after {
|
||||
background-position: center bottom;
|
||||
}
|
||||
|
||||
&:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0.0000px;
|
||||
left: 0;
|
||||
width: 45.0000px;
|
||||
height: 25.9808px;
|
||||
z-index: 2;
|
||||
background: inherit;
|
||||
}
|
||||
}
|
||||
|
||||
.hexagon-60 {
|
||||
position: relative;
|
||||
width: 60px;
|
||||
height: 34.64px;
|
||||
margin: 17.32px 0;
|
||||
background-size: auto 69.2820px;
|
||||
background-position: center;
|
||||
|
||||
.hexTop,
|
||||
.hexBottom {
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
width: 42.43px;
|
||||
height: 42.43px;
|
||||
overflow: hidden;
|
||||
-webkit-transform: scaleY(0.5774) rotate(-45deg);
|
||||
-ms-transform: scaleY(0.5774) rotate(-45deg);
|
||||
transform: scaleY(0.5774) rotate(-45deg);
|
||||
background: inherit;
|
||||
left: 8.79px;
|
||||
|
||||
/* Keeps borders smooth in webkit */
|
||||
backface-visibility: hidden;
|
||||
}
|
||||
|
||||
/*counter transform the bg image on the caps*/
|
||||
.hexTop:after,
|
||||
.hexBottom:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
width: 60.0000px;
|
||||
height: 34.64101615137755px;
|
||||
-webkit-transform: rotate(45deg) scaleY(1.7321) translateY(-17.3205px);
|
||||
-ms-transform: rotate(45deg) scaleY(1.7321) translateY(-17.3205px);
|
||||
transform: rotate(45deg) scaleY(1.7321) translateY(-17.3205px);
|
||||
-webkit-transform-origin: 0 0;
|
||||
-ms-transform-origin: 0 0;
|
||||
transform-origin: 0 0;
|
||||
background: inherit;
|
||||
}
|
||||
|
||||
.hexTop {
|
||||
top: -21.2132px;
|
||||
}
|
||||
|
||||
.hexTop:after {
|
||||
background-position: center top;
|
||||
}
|
||||
|
||||
.hexBottom {
|
||||
bottom: -21.2132px;
|
||||
}
|
||||
|
||||
.hexBottom:after {
|
||||
background-position: center bottom;
|
||||
}
|
||||
|
||||
&:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0.0000px;
|
||||
left: 0;
|
||||
width: 60.0000px;
|
||||
height: 34.6410px;
|
||||
z-index: 2;
|
||||
background: inherit;
|
||||
}
|
||||
}
|
||||
|
||||
.hexagon-80 {
|
||||
position: relative;
|
||||
width: 81px; // was 80, 81 seems to look better
|
||||
height: 46.19px;
|
||||
margin: 23.09px 0;
|
||||
background-image: url(http://csshexagon.com/img/meow.jpg);
|
||||
background-size: auto 92.3760px;
|
||||
background-position: center;
|
||||
|
||||
.hexTop,
|
||||
.hexBottom {
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
width: 56.57px;
|
||||
height: 56.57px;
|
||||
overflow: hidden;
|
||||
-webkit-transform: scaleY(0.5774) rotate(-45deg);
|
||||
-ms-transform: scaleY(0.5774) rotate(-45deg);
|
||||
transform: scaleY(0.5774) rotate(-45deg);
|
||||
background: inherit;
|
||||
left: 11.72px;
|
||||
}
|
||||
|
||||
/*counter transform the bg image on the caps*/
|
||||
.hexTop:after,
|
||||
.hexBottom:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
width: 80.0000px;
|
||||
height: 46.188021535170066px;
|
||||
-webkit-transform: rotate(45deg) scaleY(1.7321) translateY(-23.0940px);
|
||||
-ms-transform: rotate(45deg) scaleY(1.7321) translateY(-23.0940px);
|
||||
transform: rotate(45deg) scaleY(1.7321) translateY(-23.0940px);
|
||||
-webkit-transform-origin: 0 0;
|
||||
-ms-transform-origin: 0 0;
|
||||
transform-origin: 0 0;
|
||||
background: inherit;
|
||||
|
||||
/* Keeps borders smooth in webkit */
|
||||
backface-visibility: hidden;
|
||||
}
|
||||
|
||||
.hexTop {
|
||||
top: -28.2843px;
|
||||
}
|
||||
|
||||
.hexTop:after {
|
||||
background-position: center top;
|
||||
}
|
||||
|
||||
.hexBottom {
|
||||
bottom: -28.2843px;
|
||||
}
|
||||
|
||||
.hexBottom:after {
|
||||
background-position: center bottom;
|
||||
}
|
||||
|
||||
&:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0.0000px;
|
||||
left: 0;
|
||||
width: 80.0000px;
|
||||
height: 46.1880px;
|
||||
z-index: 2;
|
||||
background: inherit;
|
||||
}
|
||||
}
|
||||
|
||||
.hexagon-200 {
|
||||
position: relative;
|
||||
width: 200px;
|
||||
height: 115.47px;
|
||||
margin: 57.74px 0;
|
||||
background-image: url(http://csshexagon.com/img/meow.jpg);
|
||||
background-size: auto 230.9401px;
|
||||
background-position: center;
|
||||
|
||||
.hexTop,
|
||||
.hexBottom {
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
width: 141.42px;
|
||||
height: 141.42px;
|
||||
overflow: hidden;
|
||||
-webkit-transform: scaleY(0.5774) rotate(-45deg);
|
||||
-ms-transform: scaleY(0.5774) rotate(-45deg);
|
||||
transform: scaleY(0.5774) rotate(-45deg);
|
||||
background: inherit;
|
||||
left: 29.29px;
|
||||
}
|
||||
|
||||
/*counter transform the bg image on the caps*/
|
||||
.hexTop:after,
|
||||
.hexBottom:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
width: 200.0000px;
|
||||
height: 115.47005383792516px;
|
||||
-webkit-transform: rotate(45deg) scaleY(1.7321) translateY(-57.7350px);
|
||||
-ms-transform: rotate(45deg) scaleY(1.7321) translateY(-57.7350px);
|
||||
transform: rotate(45deg) scaleY(1.7321) translateY(-57.7350px);
|
||||
-webkit-transform-origin: 0 0;
|
||||
-ms-transform-origin: 0 0;
|
||||
transform-origin: 0 0;
|
||||
background: inherit;
|
||||
|
||||
/* Keeps borders smooth in webkit */
|
||||
backface-visibility: hidden;
|
||||
}
|
||||
|
||||
.hexTop {
|
||||
top: -70.7107px;
|
||||
}
|
||||
|
||||
.hexTop:after {
|
||||
background-position: center top;
|
||||
}
|
||||
|
||||
.hexBottom {
|
||||
bottom: -70.7107px;
|
||||
}
|
||||
|
||||
.hexBottom:after {
|
||||
background-position: center bottom;
|
||||
}
|
||||
|
||||
&:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0.0000px;
|
||||
left: 0;
|
||||
width: 200.0000px;
|
||||
height: 115.4701px;
|
||||
z-index: 2;
|
||||
background: inherit;
|
||||
}
|
||||
}
|
||||
|
||||
.hexagon-275 {
|
||||
position: relative;
|
||||
width: 275px;
|
||||
height: 158.77px;
|
||||
margin: 79.39px 0;
|
||||
background-size: auto 317.5426px;
|
||||
background-position: center;
|
||||
|
||||
|
||||
&:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0.0000px;
|
||||
left: 0;
|
||||
width: 275.0000px;
|
||||
height: 158.7713px;
|
||||
z-index: 2;
|
||||
background: inherit;
|
||||
}
|
||||
|
||||
.hexTop,
|
||||
.hexBottom {
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
width: 194.45px;
|
||||
height: 194.45px;
|
||||
overflow: hidden;
|
||||
-webkit-transform: scaleY(0.5774) rotate(-45deg);
|
||||
-ms-transform: scaleY(0.5774) rotate(-45deg);
|
||||
transform: scaleY(0.5774) rotate(-45deg);
|
||||
background: inherit;
|
||||
left: 40.27px;
|
||||
|
||||
/* Keeps borders smooth in webkit */
|
||||
backface-visibility: hidden;
|
||||
}
|
||||
|
||||
/*counter transform the bg image on the caps*/
|
||||
.hexTop:after,
|
||||
.hexBottom:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
width: 275.0000px;
|
||||
height: 158.7713240271471px;
|
||||
-webkit-transform: rotate(45deg) scaleY(1.7321) translateY(-79.3857px);
|
||||
-ms-transform: rotate(45deg) scaleY(1.7321) translateY(-79.3857px);
|
||||
transform: rotate(45deg) scaleY(1.7321) translateY(-79.3857px);
|
||||
-webkit-transform-origin: 0 0;
|
||||
-ms-transform-origin: 0 0;
|
||||
transform-origin: 0 0;
|
||||
background: inherit;
|
||||
}
|
||||
|
||||
.hexTop {
|
||||
top: -98.0272px; // tweaked value, original: -97.2272px;
|
||||
}
|
||||
|
||||
.hexTop:after {
|
||||
background-position: center top;
|
||||
}
|
||||
|
||||
.hexBottom {
|
||||
bottom: -97.0272px; //tweaked value, original: -97.2272px;
|
||||
}
|
||||
|
||||
.hexBottom:after {
|
||||
background-position: center bottom;
|
||||
}
|
||||
}
|
||||
|
||||
.user-hexagrid {
|
||||
display: inline-block;
|
||||
margin: 35px 0;
|
||||
|
||||
> div {
|
||||
.user-hexagon {
|
||||
display: inline-block;
|
||||
opacity: 0.75;
|
||||
&:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.user-hexagrid-30 {
|
||||
.user-hexagrid;
|
||||
|
||||
> div {
|
||||
&:nth-child(even) {
|
||||
margin-left: 15px;
|
||||
}
|
||||
.user-hexagon {
|
||||
margin: -3px 1px -9px 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.user-hexagrid-60 {
|
||||
.user-hexagrid;
|
||||
|
||||
> div {
|
||||
&:nth-child(even) {
|
||||
margin-left: 30px;
|
||||
}
|
||||
.user-hexagon {
|
||||
margin: -11px 1px -11px 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.user-hexagrid-80 {
|
||||
.user-hexagrid;
|
||||
|
||||
> div {
|
||||
&:nth-child(even) {
|
||||
margin-left: 41px;
|
||||
}
|
||||
.user-hexagon {
|
||||
margin: -13px 1px -12px 1px;
|
||||
}
|
||||
}
|
||||
|
||||
.hovercard {
|
||||
margin-top: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.user-hexagrid-200 {
|
||||
.user-hexagrid;
|
||||
margin: 70px 0;
|
||||
|
||||
> div {
|
||||
&:nth-child(even) {
|
||||
margin-left: 101px;
|
||||
}
|
||||
.user-hexagon {
|
||||
margin: -30px 2px -29px 0;
|
||||
}
|
||||
}
|
||||
|
||||
.hovercard {
|
||||
margin-top: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.user-hexagrid-275 {
|
||||
.user-hexagrid;
|
||||
margin: 70px 0;
|
||||
|
||||
> div {
|
||||
&:nth-child(even) {
|
||||
margin-left: 138px;
|
||||
}
|
||||
.user-hexagon {
|
||||
margin: -41px 1px -41px 0;
|
||||
}
|
||||
}
|
||||
|
||||
.hovercard {
|
||||
margin-top: 10px;
|
||||
}
|
||||
}
|
||||
67
ui/less/com/hovercard.less
Normal file
67
ui/less/com/hovercard.less
Normal file
@@ -0,0 +1,67 @@
|
||||
.hovercard {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
z-index: 10000;
|
||||
|
||||
padding: 20px;
|
||||
white-space: pre;
|
||||
background: #2D2D2D top left no-repeat;
|
||||
background-size: contain;
|
||||
padding-left: 130px;
|
||||
color: #ccc;
|
||||
box-shadow: 0px 3px 3px rgba(0,0,0,.85);
|
||||
|
||||
opacity: 0;
|
||||
transition: opacity 0.15s ease-in-out 0.25s, top 0.15s ease-in-out 0.25s;
|
||||
pointer-events: none;
|
||||
|
||||
h3 {
|
||||
margin: 0 0 12px;
|
||||
color: #5CBB1D;
|
||||
}
|
||||
p {
|
||||
margin: 0;
|
||||
}
|
||||
p:last-child {
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
.layout-rightnav .hovercard {
|
||||
// orient for right side of the page
|
||||
left: auto;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.user-hexagon {
|
||||
position: relative;
|
||||
.hovercard {
|
||||
top: 65px;
|
||||
}
|
||||
&:hover .hovercard {
|
||||
opacity: 1;
|
||||
top: 60px;
|
||||
}
|
||||
}
|
||||
|
||||
.user-img {
|
||||
position: relative;
|
||||
.hovercard {
|
||||
top: 55px;
|
||||
}
|
||||
&:hover .hovercard {
|
||||
opacity: 1;
|
||||
top: 50px;
|
||||
}
|
||||
}
|
||||
|
||||
.user-link-outer {
|
||||
position: relative;
|
||||
.hovercard {
|
||||
top: 25px;
|
||||
}
|
||||
&:hover .hovercard {
|
||||
opacity: 1;
|
||||
top: 20px;
|
||||
}
|
||||
}
|
||||
12
ui/less/com/image-uploader.less
Normal file
12
ui/less/com/image-uploader.less
Normal file
@@ -0,0 +1,12 @@
|
||||
.image-uploader {
|
||||
.image-uploader-existing {
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
.image-uploader-editor {
|
||||
width: 277px;
|
||||
color: #555;
|
||||
canvas {
|
||||
border: 1px solid #aaa;
|
||||
}
|
||||
}
|
||||
}
|
||||
33
ui/less/com/images-form.less
Normal file
33
ui/less/com/images-form.less
Normal file
@@ -0,0 +1,33 @@
|
||||
.images-form {
|
||||
.images-form-list {
|
||||
&:empty:before {
|
||||
content: 'Click "Add image" to start a new album';
|
||||
cursor: pointer;
|
||||
background: #ddd;
|
||||
border-radius: 5px;
|
||||
padding: 40px;
|
||||
text-align: center;
|
||||
color: gray;
|
||||
display: block;
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
.image {
|
||||
display: flex;
|
||||
margin: 0 0 6px;
|
||||
|
||||
.image-img {
|
||||
flex: 0 0 128px;
|
||||
img {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
.image-ctrls {
|
||||
flex: 1;
|
||||
padding: 0 0 0 10px;
|
||||
p {
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
30
ui/less/com/invite-form.less
Normal file
30
ui/less/com/invite-form.less
Normal file
@@ -0,0 +1,30 @@
|
||||
.invite-form {
|
||||
.modal-form;
|
||||
|
||||
.form-inline > p {
|
||||
display: flex;
|
||||
.form-control {
|
||||
flex: 1;
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
.processing-info {
|
||||
display: none;
|
||||
margin: 30px 25px 60px;
|
||||
.spinner {
|
||||
margin: 0;
|
||||
float: left;
|
||||
}
|
||||
p {
|
||||
color: #666;
|
||||
position: relative;
|
||||
left: 50px;
|
||||
top: 15px;
|
||||
}
|
||||
}
|
||||
.error {
|
||||
display: none;
|
||||
margin: 30px;
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
11
ui/less/com/lookup-code-form.less
Normal file
11
ui/less/com/lookup-code-form.less
Normal file
@@ -0,0 +1,11 @@
|
||||
.lookup-code-form {
|
||||
.modal-form;
|
||||
|
||||
.code {
|
||||
padding: 10px;
|
||||
margin-bottom: 10px;
|
||||
background: #fafafa;
|
||||
border: 1px solid #ddd;
|
||||
word-break: break-all;
|
||||
}
|
||||
}
|
||||
38
ui/less/com/lookup-form.less
Normal file
38
ui/less/com/lookup-form.less
Normal file
@@ -0,0 +1,38 @@
|
||||
.lookup-form {
|
||||
.modal-form;
|
||||
|
||||
.form-inline > p {
|
||||
display: flex;
|
||||
.form-control {
|
||||
flex: 1;
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
.processing-info {
|
||||
display: none;
|
||||
margin: 30px 25px 60px;
|
||||
.spinner {
|
||||
margin: 0;
|
||||
float: left;
|
||||
}
|
||||
p {
|
||||
color: #666;
|
||||
position: relative;
|
||||
left: 50px;
|
||||
top: 15px;
|
||||
}
|
||||
}
|
||||
.error {
|
||||
display: none;
|
||||
margin: 30px;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.code {
|
||||
padding: 10px;
|
||||
margin-bottom: 10px;
|
||||
background: #fafafa;
|
||||
border: 1px solid #ddd;
|
||||
word-break: break-all;
|
||||
}
|
||||
}
|
||||
10
ui/less/com/message-feed.less
Normal file
10
ui/less/com/message-feed.less
Normal file
@@ -0,0 +1,10 @@
|
||||
.message-feed-ctrls {
|
||||
padding: 0.5em 0;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.message-feed-container {
|
||||
.message-feed {
|
||||
margin: 0 auto;
|
||||
}
|
||||
}
|
||||
94
ui/less/com/message-oneline.less
Normal file
94
ui/less/com/message-oneline.less
Normal file
@@ -0,0 +1,94 @@
|
||||
.message-oneline {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
border-top: 1px solid #ccc;
|
||||
|
||||
&.unread {
|
||||
background: #fff;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.message-oneline-column {
|
||||
padding: 6px;
|
||||
|
||||
&:nth-child(1) {
|
||||
flex: 0 0 40px;
|
||||
padding-left: 15px;
|
||||
}
|
||||
&:nth-child(2) {
|
||||
flex: 0 0 115px;
|
||||
}
|
||||
&:nth-child(3) {
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
flex: 1;
|
||||
a {
|
||||
color: #444;
|
||||
}
|
||||
}
|
||||
&:nth-child(4) {
|
||||
flex: 0 0 80px;
|
||||
text-align: right;
|
||||
padding-right: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
.user-img {
|
||||
img {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
border-radius: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.message-oneline-menuitem {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
border-top: 1px solid #ccc;
|
||||
padding: 4px;
|
||||
background: #eee;
|
||||
color: #444;
|
||||
|
||||
&.unread {
|
||||
background: #fff;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.message-oneline-column {
|
||||
padding: 4px;
|
||||
text-align: left;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
|
||||
&:nth-child(1) {
|
||||
flex: 0 0 50px;
|
||||
}
|
||||
&:nth-child(2), &.only {
|
||||
flex: 1;
|
||||
}
|
||||
&:nth-child(3) {
|
||||
flex: 0 0 60px;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #444;
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background: @brand-primary;
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
.message-oneline-column a {
|
||||
color: #fff;
|
||||
}
|
||||
.text-muted {
|
||||
color: #eee;
|
||||
}
|
||||
}
|
||||
}
|
||||
73
ui/less/com/message-stats.less
Normal file
73
ui/less/com/message-stats.less
Normal file
@@ -0,0 +1,73 @@
|
||||
.message-stats {
|
||||
margin-bottom: 8px;
|
||||
span, a {
|
||||
color: #8899a6;
|
||||
}
|
||||
overflow: hidden;
|
||||
|
||||
.glyphicon {
|
||||
color: #ccd6dd;
|
||||
position: relative;
|
||||
}
|
||||
.selected .glyphicon {
|
||||
color: darken(#8899a6, 5%);
|
||||
}
|
||||
.stat {
|
||||
display: inline-block;
|
||||
padding: 0 28px 0 0;
|
||||
&:last-child {
|
||||
padding: 0;
|
||||
}
|
||||
.glyphicon-comment {
|
||||
font-size: 16px;
|
||||
top: 3px;
|
||||
}
|
||||
.glyphicon-triangle-top {
|
||||
font-size: 18px;
|
||||
top: 4px;
|
||||
}
|
||||
.glyphicon-triangle-bottom {
|
||||
font-size: 18px;
|
||||
top: 4px;
|
||||
}
|
||||
&:hover .glyphicon {
|
||||
color: darken(#8899a6, 5%);
|
||||
}
|
||||
}
|
||||
.vote-tally:after {
|
||||
content: attr(data-amt);
|
||||
padding: 0 5px;
|
||||
}
|
||||
.comments:after {
|
||||
content: attr(data-amt) " comments";
|
||||
padding: 0 5px;
|
||||
}
|
||||
.user-hexagrid-30 {
|
||||
margin: 1em 0 0;
|
||||
border: 1px solid #ccc;
|
||||
padding: 5px 5px 0;
|
||||
background: #fafafa;
|
||||
.user-hexagon {
|
||||
margin: -9px 1px -3px 0;
|
||||
}
|
||||
}
|
||||
.upvoters {
|
||||
position: relative;
|
||||
&:after {
|
||||
content: ' +1';
|
||||
position: absolute;
|
||||
right: -22px;
|
||||
top: 5px;
|
||||
}
|
||||
}
|
||||
.downvoters {
|
||||
float: right;
|
||||
position: relative;
|
||||
&:after {
|
||||
content: '-1';
|
||||
position: absolute;
|
||||
left: -22px;
|
||||
top: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
45
ui/less/com/message-summary.less
Normal file
45
ui/less/com/message-summary.less
Normal file
@@ -0,0 +1,45 @@
|
||||
.message-summary {
|
||||
margin: 5px 36px;
|
||||
|
||||
& > .user-img {
|
||||
img {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
border-radius: 15px;
|
||||
float: left;
|
||||
margin: 4px;
|
||||
}
|
||||
.hovercard {
|
||||
top: 35px;
|
||||
right: auto;
|
||||
left: -40px;
|
||||
}
|
||||
&:hover .hovercard {
|
||||
opacity: 1;
|
||||
top: 30px;
|
||||
}
|
||||
}
|
||||
|
||||
.message-summary-content {
|
||||
padding: 10px 40px
|
||||
}
|
||||
|
||||
.msg-link {
|
||||
color: #666;
|
||||
display: block;
|
||||
padding: 12px 0;
|
||||
}
|
||||
|
||||
.pretty-raw {
|
||||
font-size: 15px;
|
||||
td {
|
||||
padding: 2px 7px;
|
||||
vertical-align: top;
|
||||
}
|
||||
td:first-child {
|
||||
text-align: right;
|
||||
min-width: 150px;
|
||||
color: #999;
|
||||
}
|
||||
}
|
||||
}
|
||||
162
ui/less/com/message.less
Normal file
162
ui/less/com/message.less
Normal file
@@ -0,0 +1,162 @@
|
||||
.message {
|
||||
position: relative;
|
||||
margin: 0 auto;
|
||||
word-break: break-word;
|
||||
|
||||
& > .user-img {
|
||||
position: absolute;
|
||||
left: 0px;
|
||||
top: 0px;
|
||||
|
||||
img {
|
||||
width: 88px;
|
||||
height: 88px;
|
||||
opacity: 0.9;
|
||||
}
|
||||
img:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
&.secret {
|
||||
}
|
||||
|
||||
&.smallview {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.message-inner {
|
||||
margin-left: 88px;
|
||||
background: #fff;
|
||||
border-bottom: 1px solid #eee;
|
||||
}
|
||||
&.unread .message-inner {
|
||||
background: #FCFFE3;
|
||||
}
|
||||
|
||||
&.add-anim {
|
||||
.message-inner {
|
||||
transition: background 0.5s;
|
||||
background: #EDFFAC;
|
||||
}
|
||||
}
|
||||
|
||||
.message-ctrls {
|
||||
margin: 0;
|
||||
background: #eee;
|
||||
font-size: 12px;
|
||||
|
||||
a {
|
||||
color: #666;
|
||||
}
|
||||
li {
|
||||
padding: 7px 10px;
|
||||
}
|
||||
}
|
||||
.message-header,
|
||||
.message-footer {
|
||||
margin: 0;
|
||||
height: 34px;
|
||||
padding-left: 3px;
|
||||
|
||||
a {
|
||||
color: #666;
|
||||
}
|
||||
li {
|
||||
padding: 7px 10px;
|
||||
}
|
||||
.glyphicon {
|
||||
font-size: 18px;
|
||||
color: #bbb;
|
||||
&.glyphicon-lock {
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
a:hover .glyphicon {
|
||||
color: #aaa;
|
||||
}
|
||||
.favorite {
|
||||
padding-right: 0;
|
||||
a.selected .glyphicon-star {
|
||||
color: rgb(255, 194, 0);
|
||||
}
|
||||
a.selected:hover .glyphicon-star {
|
||||
color: darken(rgb(255, 194, 0), 10%);
|
||||
}
|
||||
|
||||
.users {
|
||||
margin-right: 5px;
|
||||
.user-img {
|
||||
margin-right: 5px;
|
||||
}
|
||||
img {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
border-radius: 10px;
|
||||
vertical-align: top;
|
||||
}
|
||||
span {
|
||||
color: #555;
|
||||
position: relative;
|
||||
top: -5px;
|
||||
font-size: 14px;
|
||||
margin: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.message-footer a {
|
||||
color: gray;
|
||||
}
|
||||
.message-body {
|
||||
padding: 6px 24px;
|
||||
|
||||
& > * {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
.markdown {
|
||||
& > :first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
& > :last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
ul {
|
||||
padding-left: 24px;
|
||||
}
|
||||
img {
|
||||
max-width: 424px;
|
||||
}
|
||||
}
|
||||
.message-mentions {
|
||||
background: #fafafa;
|
||||
padding: 8px 24px;
|
||||
box-shadow: inset 0px 2px 2px rgba(0,0,0,0.1);
|
||||
a {
|
||||
color: gray;
|
||||
}
|
||||
}
|
||||
|
||||
.message-comments {
|
||||
&:empty {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
.composer-header {
|
||||
margin-left: 88px;
|
||||
max-width: 100%;
|
||||
}
|
||||
.pretty-raw {
|
||||
font-size: 15px;
|
||||
td {
|
||||
padding: 2px 7px;
|
||||
vertical-align: top;
|
||||
}
|
||||
td:first-child {
|
||||
text-align: right;
|
||||
min-width: 150px;
|
||||
color: #999;
|
||||
}
|
||||
}
|
||||
}
|
||||
13
ui/less/com/modal-form.less
Normal file
13
ui/less/com/modal-form.less
Normal file
@@ -0,0 +1,13 @@
|
||||
.modal-form {
|
||||
background: #fff;
|
||||
padding: 14px 15px;
|
||||
border-radius: 2px;
|
||||
max-width: 600px;
|
||||
margin: 10px auto;
|
||||
|
||||
h3 {
|
||||
margin-top: 0;
|
||||
color: #555;
|
||||
font-size: 22px;
|
||||
}
|
||||
}
|
||||
15
ui/less/com/modal.less
Normal file
15
ui/less/com/modal.less
Normal file
@@ -0,0 +1,15 @@
|
||||
.modal {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: 1000;
|
||||
overflow-y: scroll;
|
||||
background: rgba(0,0,0,0.5);
|
||||
|
||||
.modal-inner {
|
||||
margin: 0 auto;
|
||||
max-width: 600px;
|
||||
}
|
||||
}
|
||||
25
ui/less/com/notifications.less
Normal file
25
ui/less/com/notifications.less
Normal file
@@ -0,0 +1,25 @@
|
||||
.notifications {
|
||||
.note {
|
||||
margin: 0 32px;
|
||||
&.warning {
|
||||
color: #444;
|
||||
background: #fff;
|
||||
padding: 10px 15px 10px;
|
||||
border: 1px solid #ccc;
|
||||
|
||||
h3 {
|
||||
font-weight: bold;
|
||||
margin: 0 0 3px;
|
||||
color: #D71611;
|
||||
}
|
||||
ul.list-inline {
|
||||
margin-bottom: 2px;
|
||||
}
|
||||
}
|
||||
.user-img img {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
border-radius: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
143
ui/less/com/page-nav.less
Normal file
143
ui/less/com/page-nav.less
Normal file
@@ -0,0 +1,143 @@
|
||||
#page-nav {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
height: 38px;
|
||||
width: 100%;
|
||||
z-index: 100;
|
||||
|
||||
white-space: nowrap;
|
||||
font-size: 15px;
|
||||
font-weight: 100;
|
||||
padding: 6px;
|
||||
background: linear-gradient(to bottom, #eee, #ddd);
|
||||
border-bottom: 1px solid #aaa;
|
||||
|
||||
.page-nav-inner {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
height: 25px;
|
||||
|
||||
& > a {
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
padding-top: 3px;
|
||||
color: rgb(100, 98, 98);
|
||||
cursor: pointer;
|
||||
|
||||
&:hover, &.selected {
|
||||
text-decoration: none;
|
||||
color: @brand-primary;
|
||||
}
|
||||
}
|
||||
}
|
||||
a.disabled, a.disabled:hover {
|
||||
color: #aaa;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.spacer {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
a.button {
|
||||
position: relative;
|
||||
flex: 0 0 30px;
|
||||
height: 25px;
|
||||
}
|
||||
|
||||
a.action {
|
||||
position: relative;
|
||||
top: -2px;
|
||||
height: 29px;
|
||||
padding: 3px 7px;
|
||||
margin-right: 8px;
|
||||
border-radius: 3px;
|
||||
background: linear-gradient(to bottom, #F2F2F2, #E4E2E2 7%, #DAD9D9 97%, #C2C0C0);
|
||||
border: 1px solid #ccc;
|
||||
}
|
||||
|
||||
a.stat {
|
||||
position: relative;
|
||||
height: 26px;
|
||||
padding: 2px 5px 0;
|
||||
|
||||
.glyphicon {
|
||||
margin-right: 2px;
|
||||
}
|
||||
.glyphicon-envelope, .glyphicon-user {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
|
||||
.unread {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
color: #FFFFFF;
|
||||
background: @brand-primary;
|
||||
font-size: 9px;
|
||||
border-radius: 3px;
|
||||
padding: 0 4px;
|
||||
font-weight: normal;
|
||||
}
|
||||
a:hover .unread {
|
||||
background: lighten(@brand-primary, 10%);
|
||||
}
|
||||
|
||||
a.profile {
|
||||
width: 40px;
|
||||
position: relative;
|
||||
top: -7px;
|
||||
margin-right: 0;
|
||||
|
||||
img {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
border-radius: 5px;
|
||||
box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.35);
|
||||
}
|
||||
}
|
||||
|
||||
.divider {
|
||||
width: 1px;
|
||||
border-left: 1px solid #ccc;
|
||||
margin: 0 10px 0 2px;
|
||||
}
|
||||
|
||||
input {
|
||||
position: relative;
|
||||
top: -3px;
|
||||
flex: 1;
|
||||
height: 31px;
|
||||
padding: 0 7px;
|
||||
margin: 0 5px;
|
||||
font-size: 14px;
|
||||
color: #808080;
|
||||
outline: 0;
|
||||
box-shadow: inset 0px 1px 2px rgba(0, 0, 0, 0.2);
|
||||
background: #fff;
|
||||
border: 1px solid #bbb;
|
||||
|
||||
&:focus, &:active, &:hover {
|
||||
outline: 0;
|
||||
box-shadow: inset 0px 1px 2px rgba(0, 0, 0, 0.2);
|
||||
background: #fff;
|
||||
border: 1px solid #bbb;
|
||||
}
|
||||
}
|
||||
|
||||
.address-icon {
|
||||
position: relative;
|
||||
.glyphicon {
|
||||
position: absolute;
|
||||
right: 20px;
|
||||
top: 6px;
|
||||
color: #666;
|
||||
}
|
||||
}
|
||||
}
|
||||
36
ui/less/com/peers.less
Normal file
36
ui/less/com/peers.less
Normal file
@@ -0,0 +1,36 @@
|
||||
.peers {
|
||||
max-width: 840px;
|
||||
margin: 0 auto 15px;
|
||||
|
||||
.peer {
|
||||
display: flex;
|
||||
background-color: #fff;
|
||||
height: 110px;
|
||||
padding: 5px 10px;
|
||||
margin: 10px 0;
|
||||
border-radius: 5px;
|
||||
|
||||
.user-hexagon {
|
||||
margin-top: 5px;
|
||||
margin-right: 15px;
|
||||
}
|
||||
.details {
|
||||
flex: 1;
|
||||
h3 {
|
||||
margin-top: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
.progress {
|
||||
display: none;
|
||||
}
|
||||
&.connected {
|
||||
.progress {
|
||||
display: block;
|
||||
}
|
||||
.last-connect {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
94
ui/less/com/pm-form.less
Normal file
94
ui/less/com/pm-form.less
Normal file
@@ -0,0 +1,94 @@
|
||||
.pm-form {
|
||||
.pm-form-recipients {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
height: auto;
|
||||
min-height: 34px;
|
||||
border-bottom: 1px solid #ccc;
|
||||
padding: 8px 10px 2px;
|
||||
|
||||
.recp-label {
|
||||
color: #999;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.recp {
|
||||
display: inline-block;
|
||||
border: 1px solid #eee;
|
||||
border-radius: 2px;
|
||||
padding: 0 3px;
|
||||
margin-left: 5px;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
input {
|
||||
border: 0;
|
||||
flex: 1;
|
||||
padding-left: 5px;
|
||||
margin-bottom: 5px;
|
||||
min-width: 50px;
|
||||
&:focus {
|
||||
outline: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
.pm-form-subject {
|
||||
border-bottom: 1px solid #ccc;
|
||||
input {
|
||||
padding: 8px 10px 8px;
|
||||
border: 0;
|
||||
width: 100%;
|
||||
&:focus {
|
||||
outline: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
.pm-form-textarea {
|
||||
textarea {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 325px;
|
||||
padding: 8px 10px;
|
||||
font-size: @font-size-base;
|
||||
line-height: @line-height-base;
|
||||
color: @input-color;
|
||||
background-image: none;
|
||||
|
||||
border: 0;
|
||||
outline: none;
|
||||
resize: none;
|
||||
|
||||
// Placeholder
|
||||
.placeholder(@input-color-placeholder);
|
||||
}
|
||||
}
|
||||
.pm-form-attachments {
|
||||
position: relative; // for the position absolute postbtn
|
||||
border-bottom-left-radius: @input-border-radius;
|
||||
border-bottom-right-radius: @input-border-radius;
|
||||
padding: 10px 5px 6px;
|
||||
color: #555;
|
||||
font-size: 12px;
|
||||
|
||||
ul {
|
||||
padding-left: 20px;
|
||||
|
||||
&:empty {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
& > a {
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
.postbtn {
|
||||
position: absolute;
|
||||
bottom: 1px;
|
||||
right: 3px;
|
||||
height: 34px;
|
||||
color: #fff;
|
||||
background: @brand-primary;
|
||||
font-weight: 100;
|
||||
}
|
||||
}
|
||||
}
|
||||
81
ui/less/com/post-form.less
Normal file
81
ui/less/com/post-form.less
Normal file
@@ -0,0 +1,81 @@
|
||||
.post-form {
|
||||
.post-form-textarea {
|
||||
textarea {
|
||||
display: block;
|
||||
width: 100%;
|
||||
padding: 6px 12px;
|
||||
font-size: @font-size-base;
|
||||
line-height: @line-height-base;
|
||||
color: @input-color;
|
||||
background-image: none;
|
||||
|
||||
border-radius: @input-border-radius;
|
||||
border-bottom-left-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
outline: none;
|
||||
|
||||
position: relative;
|
||||
z-index: 1; // put higher than attachments bar below so that box shadow covers it
|
||||
|
||||
// Placeholder
|
||||
.placeholder(@input-color-placeholder);
|
||||
|
||||
&.short {
|
||||
border-radius: 2px;
|
||||
border-bottom-width: 1px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.post-form-preview {
|
||||
background: rgba(255, 255, 255, 0.5);
|
||||
padding: 10px 12px;
|
||||
margin-bottom: 5px;
|
||||
border-top: 1px dashed @input-border;
|
||||
border-radius: @input-border-radius;
|
||||
border-top-left-radius: 0;
|
||||
border-top-right-radius: 0;
|
||||
&:empty {
|
||||
padding: 0;
|
||||
border-width: 0;
|
||||
}
|
||||
& > :first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
& > :last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
.post-form-attachments {
|
||||
position: relative; // for the position absolute postbtn
|
||||
padding: 6px;
|
||||
color: #555;
|
||||
font-size: 12px;
|
||||
height: 40px;
|
||||
|
||||
ul {
|
||||
padding-left: 20px;
|
||||
|
||||
&:empty {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
& > a {
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
.postbtn {
|
||||
position: absolute;
|
||||
top: 1px;
|
||||
right: 1px;
|
||||
height: 34px;
|
||||
color: #fff;
|
||||
background: @brand-primary;
|
||||
font-weight: 100;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.modal .post-form {
|
||||
background: #fff;
|
||||
padding: 2px 10px 12px;
|
||||
}
|
||||
124
ui/less/com/program-editor.less
Normal file
124
ui/less/com/program-editor.less
Normal file
@@ -0,0 +1,124 @@
|
||||
.editor-container {
|
||||
position: relative;
|
||||
.editor-ctrls {
|
||||
position: absolute;
|
||||
z-index: 500;
|
||||
right: 10px;
|
||||
top: 6px;
|
||||
text-align: right;
|
||||
|
||||
a {
|
||||
display: inline-block;
|
||||
padding: 6px 15px;
|
||||
background: #44453D;
|
||||
color: #A6B1BE;
|
||||
border-radius: 2px;
|
||||
border: 1px solid transparent;
|
||||
box-shadow: 0 0 3px rgba(0,0,0,1);
|
||||
margin-left: 5px;
|
||||
|
||||
&.highlighted {
|
||||
border-color: #154F9B;
|
||||
color: #2778e2;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
color: #747D88;
|
||||
text-decoration: none;
|
||||
background: #3F4137;
|
||||
box-shadow: 0 0 15px rgba(0,0,0,1);
|
||||
border-color: transparent;
|
||||
&.blue {
|
||||
background: @blue-primary;
|
||||
color: @blue-tertiary;
|
||||
}
|
||||
&.yellow {
|
||||
background: @yellow-primary;
|
||||
color: @yellow-secondary;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.editor-nav {
|
||||
margin: 2px 0 8px;
|
||||
|
||||
.navlinks {
|
||||
display: table-cell;
|
||||
white-space: pre;
|
||||
a {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
padding: 6px 22px 0 19px;
|
||||
font-weight: 100;
|
||||
color: #555;
|
||||
margin-right: 5px;
|
||||
border: 1px solid transparent;
|
||||
|
||||
&:hover {
|
||||
text-decoration: none;
|
||||
background: #ddd;
|
||||
}
|
||||
&.selected {
|
||||
border-color: #ccc;
|
||||
background: #fff;
|
||||
|
||||
// hide the border under the selected item
|
||||
&:after {
|
||||
content: '';
|
||||
display: block;
|
||||
position: absolute;
|
||||
bottom: -2px;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 4px;
|
||||
background: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.editor-nav-body {
|
||||
background: #fff;
|
||||
border: 1px solid #ccc;
|
||||
padding: 0 5px;
|
||||
p {
|
||||
margin: 5px 0;
|
||||
}
|
||||
input.form-control {
|
||||
height: 29px;
|
||||
padding: 5px;
|
||||
}
|
||||
.btn-default {
|
||||
background: #eee;
|
||||
&:hover {
|
||||
background: #ddd;
|
||||
}
|
||||
}
|
||||
.buffer-list {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 5px 0;
|
||||
font-size: 13px;
|
||||
border: 1px solid #ccc;
|
||||
overflow-y: scroll;
|
||||
max-height: 500px;
|
||||
|
||||
li {
|
||||
background: #eee;
|
||||
padding: 5px 5px 3px;
|
||||
display: block;
|
||||
a {
|
||||
color: #666;
|
||||
}
|
||||
&.selected {
|
||||
background: #666;
|
||||
background: linear-gradient(to bottom, #888 0%, #555 100%);
|
||||
a {
|
||||
color: #eee;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
17
ui/less/com/program-feed.less
Normal file
17
ui/less/com/program-feed.less
Normal file
@@ -0,0 +1,17 @@
|
||||
.program-feed-container {
|
||||
border: 1px solid #ccc;
|
||||
background: #fff;
|
||||
|
||||
.program-feed {
|
||||
width: 100%;
|
||||
|
||||
&:empty::before {
|
||||
content: 'Empty';
|
||||
font-size: 16px;
|
||||
font-style: italic;
|
||||
color: #777;
|
||||
margin: 1em;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
11
ui/less/com/program-summary.less
Normal file
11
ui/less/com/program-summary.less
Normal file
@@ -0,0 +1,11 @@
|
||||
.program-summary {
|
||||
|
||||
&:nth-child(odd) {
|
||||
.profpic .hexagon-60 {
|
||||
margin-left: 32px;
|
||||
}
|
||||
td {
|
||||
background: #f5f5f5;
|
||||
}
|
||||
}
|
||||
}
|
||||
10
ui/less/com/rename-form.less
Normal file
10
ui/less/com/rename-form.less
Normal file
@@ -0,0 +1,10 @@
|
||||
.rename-form {
|
||||
.modal-form;
|
||||
.form-inline > p {
|
||||
display: flex;
|
||||
.form-control {
|
||||
flex: 1;
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
6
ui/less/com/search.less
Normal file
6
ui/less/com/search.less
Normal file
@@ -0,0 +1,6 @@
|
||||
.search {
|
||||
display: block;
|
||||
width: 100%;
|
||||
padding: 7px 10px;
|
||||
.placeholder;
|
||||
}
|
||||
61
ui/less/com/sidenav.less
Normal file
61
ui/less/com/sidenav.less
Normal file
@@ -0,0 +1,61 @@
|
||||
.sidenav {
|
||||
margin-top: 8px;
|
||||
a {
|
||||
color: #666;
|
||||
}
|
||||
h4 {
|
||||
margin: 0;
|
||||
color: gray;
|
||||
}
|
||||
.pubstats {
|
||||
font-size: 21px;
|
||||
cursor: pointer;
|
||||
padding: 5px;
|
||||
margin-bottom: -5px;
|
||||
&:hover {
|
||||
background: #ddd;
|
||||
}
|
||||
p {
|
||||
margin: 0;
|
||||
}
|
||||
a {
|
||||
color: #333;
|
||||
}
|
||||
.name a {
|
||||
font-weight: bold;
|
||||
color: #333;
|
||||
}
|
||||
}
|
||||
.view {
|
||||
font-size: 15px;
|
||||
small {
|
||||
color: gray;
|
||||
}
|
||||
}
|
||||
label {
|
||||
input {
|
||||
font-size: 16px;
|
||||
}
|
||||
top: 1px;
|
||||
position: relative;
|
||||
font-size: 15px;
|
||||
color: #666;
|
||||
font-weight: normal;
|
||||
cursor: pointer;
|
||||
}
|
||||
.filters {
|
||||
color: #555;
|
||||
display: inline-block;
|
||||
font-size: 15px;
|
||||
label {
|
||||
margin: 0 0 0 5px;
|
||||
}
|
||||
}
|
||||
li {
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
hr {
|
||||
border-color: #ddd;
|
||||
margin: 30px 0;
|
||||
}
|
||||
}
|
||||
96
ui/less/com/spinner.less
Normal file
96
ui/less/com/spinner.less
Normal file
@@ -0,0 +1,96 @@
|
||||
// http://tobiasahlin.com/spinkit/
|
||||
|
||||
.spinner {
|
||||
margin: 100px auto;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
position: relative;
|
||||
|
||||
.cube1, .cube2 {
|
||||
background-color: #333;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
|
||||
-webkit-animation: cubemove 1.8s infinite ease-in-out;
|
||||
animation: cubemove 1.8s infinite ease-in-out;
|
||||
}
|
||||
|
||||
.cube2 {
|
||||
-webkit-animation-delay: -0.9s;
|
||||
animation-delay: -0.9s;
|
||||
}
|
||||
|
||||
&.small {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
.cube1, .cube2 {
|
||||
width: 5px;
|
||||
height: 5px;
|
||||
-webkit-animation: cubemove-small 1.8s infinite ease-in-out;
|
||||
animation: cubemove-small 1.8s infinite ease-in-out;
|
||||
}
|
||||
.cube2 {
|
||||
-webkit-animation-delay: -0.9s;
|
||||
animation-delay: -0.9s;
|
||||
}
|
||||
}
|
||||
&.inline {
|
||||
margin: 0;
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
|
||||
@-webkit-keyframes cubemove {
|
||||
25% { -webkit-transform: translateX(42px) rotate(-90deg) scale(0.5) }
|
||||
50% { -webkit-transform: translateX(42px) translateY(42px) rotate(-180deg) }
|
||||
75% { -webkit-transform: translateX(0px) translateY(42px) rotate(-270deg) scale(0.5) }
|
||||
100% { -webkit-transform: rotate(-360deg) }
|
||||
}
|
||||
|
||||
@keyframes cubemove {
|
||||
25% {
|
||||
transform: translateX(42px) rotate(-90deg) scale(0.5);
|
||||
-webkit-transform: translateX(42px) rotate(-90deg) scale(0.5);
|
||||
} 50% {
|
||||
transform: translateX(42px) translateY(42px) rotate(-179deg);
|
||||
-webkit-transform: translateX(42px) translateY(42px) rotate(-179deg);
|
||||
} 50.1% {
|
||||
transform: translateX(42px) translateY(42px) rotate(-180deg);
|
||||
-webkit-transform: translateX(42px) translateY(42px) rotate(-180deg);
|
||||
} 75% {
|
||||
transform: translateX(0px) translateY(42px) rotate(-270deg) scale(0.5);
|
||||
-webkit-transform: translateX(0px) translateY(42px) rotate(-270deg) scale(0.5);
|
||||
} 100% {
|
||||
transform: rotate(-360deg);
|
||||
-webkit-transform: rotate(-360deg);
|
||||
}
|
||||
}
|
||||
|
||||
@-webkit-keyframes cubemove-small {
|
||||
25% { -webkit-transform: translateX(21px) rotate(-90deg) scale(0.5) }
|
||||
50% { -webkit-transform: translateX(21px) translateY(21px) rotate(-180deg) }
|
||||
75% { -webkit-transform: translateX(0px) translateY(21px) rotate(-270deg) scale(0.5) }
|
||||
100% { -webkit-transform: rotate(-360deg) }
|
||||
}
|
||||
|
||||
@keyframes cubemove-small {
|
||||
25% {
|
||||
transform: translateX(21px) rotate(-90deg) scale(0.5);
|
||||
-webkit-transform: translateX(21px) rotate(-90deg) scale(0.5);
|
||||
} 50% {
|
||||
transform: translateX(21px) translateY(21px) rotate(-179deg);
|
||||
-webkit-transform: translateX(21px) translateY(21px) rotate(-179deg);
|
||||
} 50.1% {
|
||||
transform: translateX(21px) translateY(21px) rotate(-180deg);
|
||||
-webkit-transform: translateX(21px) translateY(21px) rotate(-180deg);
|
||||
} 75% {
|
||||
transform: translateX(0px) translateY(21px) rotate(-270deg) scale(0.5);
|
||||
-webkit-transform: translateX(0px) translateY(21px) rotate(-270deg) scale(0.5);
|
||||
} 100% {
|
||||
transform: rotate(-360deg);
|
||||
-webkit-transform: rotate(-360deg);
|
||||
}
|
||||
}
|
||||
62
ui/less/com/subwindow.less
Normal file
62
ui/less/com/subwindow.less
Normal file
@@ -0,0 +1,62 @@
|
||||
.subwindow {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
right: 10px;
|
||||
width: 500px;
|
||||
height: 440px;
|
||||
z-index: 1000;
|
||||
|
||||
border: 1px solid #aaa;
|
||||
background: #fff;
|
||||
box-shadow: 0 0 10px rgba(0,0,0,0.35);
|
||||
|
||||
.subwindow-toolbar {
|
||||
height: 40px;
|
||||
background: #555;
|
||||
padding: 4px;
|
||||
text-align: center;
|
||||
border-bottom: 1px solid #ccc;
|
||||
display: flex;
|
||||
|
||||
.title {
|
||||
flex: 1;
|
||||
font-size: 16px;
|
||||
color: #fff;
|
||||
font-weight: 100;
|
||||
text-align: left;
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
a {
|
||||
flex: 0 0 40px;
|
||||
display: block;
|
||||
padding: 7px 0;
|
||||
color: #ccc;
|
||||
|
||||
&:hover {
|
||||
background: #666;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.subwindow-body {
|
||||
flex: 1;
|
||||
height: 400px;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
&.collapsed {
|
||||
width: 50px;
|
||||
height: 42px;
|
||||
|
||||
.subwindow-toolbar {
|
||||
border: 0;
|
||||
.title, .help, .goto, .close {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
.subwindow-body {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
42
ui/less/com/suggest-box.less
Normal file
42
ui/less/com/suggest-box.less
Normal file
@@ -0,0 +1,42 @@
|
||||
@import "../variables";
|
||||
|
||||
.suggest-box {
|
||||
position: fixed;
|
||||
border: 1px solid #ddd;
|
||||
z-index: 10000;
|
||||
background: white;
|
||||
|
||||
ul {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
li {
|
||||
padding: 4px 8px;
|
||||
font-size: 85%;
|
||||
border-bottom: 1px solid #ddd;
|
||||
&:last-child {
|
||||
border: 0;
|
||||
}
|
||||
&.selected {
|
||||
color: #fff;
|
||||
background-color: @brand-primary;
|
||||
border-color: darken(@brand-primary, 5%);
|
||||
}
|
||||
img {
|
||||
height: 20px;
|
||||
}
|
||||
&.user img {
|
||||
border-radius: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
&.msg-recipients {
|
||||
ul li {
|
||||
font-size: 16px;
|
||||
img {
|
||||
height: 24px;
|
||||
border-radius: 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
29
ui/less/com/webcam-giffer-form.less
Normal file
29
ui/less/com/webcam-giffer-form.less
Normal file
@@ -0,0 +1,29 @@
|
||||
.webcam-giffer-form {
|
||||
display: flex;
|
||||
.webcam-giffer-form-videos {
|
||||
position: relative;
|
||||
flex: 0 0 300px;
|
||||
video {
|
||||
cursor: pointer;
|
||||
&.recording {
|
||||
outline: 1px solid red;
|
||||
}
|
||||
}
|
||||
.countdown {
|
||||
position: absolute;
|
||||
font-size: 72px;
|
||||
left: 130px;
|
||||
top: 30px;
|
||||
font-weight: bold;
|
||||
color: rgb(182, 0, 0);
|
||||
}
|
||||
}
|
||||
.webcam-giffer-form-ctrls {
|
||||
flex: 1;
|
||||
padding: 0 3px;
|
||||
textarea {
|
||||
height: 150px;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user