mirrors/h5ai
1
0
Fork 0
mirror of https://github.com/lrsjng/h5ai.git synced 2025-05-29 14:35:18 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

Refactor styles.

Browse source
This commit is contained in:
Lars Jung 2015-04-25 21:44:34 +02:00
parent ba315be9e5
commit ebcf431363
24 changed files with 131 additions and 171 deletions
Download patch file Download diff file Expand all files Collapse all files

1
src/_h5ai/client/css/inc/content.less
View file

@ -1,4 +1,3 @@
#content {
overflow: auto;
flex: 1 1 auto;

120
src/_h5ai/client/css/inc/contextmenu.less
View file

@ -1,5 +1,4 @@
.cm-overlay {
#cm-overlay {
display: none;
position: fixed;
left: 0;
@ -10,68 +9,67 @@
z-index: 200;
// background: rgba(0,0,0,0.1);
// background: rgba(255,255,255,0.6);
}
.cm-panel {
.popup();
.rounded();
display: block;
position: absolute;
left: 100px;
top: 100px;
background: #fff;
color: @col;
z-index: 10;
overflow: auto;
min-width: 200px;
.cm-panel {
.popup();
.rounded();
display: block;
position: absolute;
left: 100px;
top: 100px;
background: #fff;
color: @col;
z-index: 10;
overflow: auto;
min-width: 200px;
ul {
margin: 0;
padding: 0;
list-style: none;
text-align: left;
.cm-label {
padding: 8px 16px;
white-space: nowrap;
font-weight: bold;
}
.cm-entry {
padding: 8px 16px;
white-space: nowrap;
cursor: pointer;
&:hover {
color: @col-hover;
background: @col-darkgray;
}
.cm-icon {
position: relative;
top: -2px;
img {
width: 20px;
height: 20px;
}
&.no-icon {
opacity: 0;
}
}
.cm-text {
margin: 0 0 0 12px;
}
}
.cm-sep {
height: 1px;
margin: 8px 0;
ul {
margin: 0;
padding: 0;
border-top: 1px solid rgba(0,0,0,0.08);
list-style: none;
text-align: left;
.cm-label {
padding: 8px 16px;
white-space: nowrap;
font-weight: bold;
}
.cm-entry {
padding: 8px 16px;
white-space: nowrap;
cursor: pointer;
&:hover {
color: @col-hover;
background: @col-darkgray;
}
.cm-icon {
position: relative;
top: -2px;
img {
width: 20px;
height: 20px;
}
&.no-icon {
opacity: 0;
}
}
.cm-text {
margin: 0 0 0 12px;
}
}
.cm-sep {
height: 1px;
margin: 8px 0;
padding: 0;
border-top: 1px solid rgba(0,0,0,0.08);
}
}
}
}

2
src/_h5ai/client/css/inc/crumb.less
View file

@ -23,7 +23,7 @@
}
.crumb {
display: inline-block;
.transition(all 0.2s ease-in-out);
transition: all 0.2s ease-in-out;
}
.sep {
width: 24px;

1
src/_h5ai/client/css/inc/download.less
View file

@ -1,4 +1,3 @@
#download {
display: none;

5
src/_h5ai/client/css/inc/fallback.less
View file

@ -1,4 +1,3 @@
#fallback {
display: none;
max-width: 960px;
@ -59,7 +58,6 @@
}
}
#fallback-hints {
display: none;
overflow: hidden;
@ -72,7 +70,7 @@
line-height: 48px;
color: @col-text-secondary-black;
text-decoration: none;
.transition(all 0.2s ease-in-out);
transition: all 0.2s ease-in-out;
outline: 0;
&:hover {
@ -90,7 +88,6 @@
}
}
html.no-js, html.no-browser {
body {

1
src/_h5ai/client/css/inc/filter.less
View file

@ -1,4 +1,3 @@
#filter {
input {

13
src/_h5ai/client/css/inc/general.less
View file

@ -77,17 +77,6 @@
::-moz-selection { background: @col-pink-a200; color: @col-text-primary-white; text-shadow: none; }
::selection { background: @col-pink-a200; color: @col-text-primary-white; text-shadow: none; }
.transition (@transition) {
-webkit-transition: @transition;
transition: @transition;
}
.transform (@transform) {
-webkit-transform: @transform;
-ms-transform: @transform;
transform: @transform;
zoom: 1;
}
.card() {
box-shadow: 0 1px 1px 0 rgba(0,0,0,0.2);
@ -109,7 +98,7 @@
.el-button() {
.card();
.rounded();
.transition(all 0.2s ease-in-out);
transition: all 0.2s ease-in-out;
color: @col-text-primary-white;
background: @col-blue-400;
border-radius: 2px;

5
src/_h5ai/client/css/inc/h5ai-info.less
View file

@ -1,5 +1,4 @@
body#h5ai-info {
#h5ai-info {
#content {
flex: 1 1 auto;
@ -25,7 +24,7 @@ body#h5ai-info {
margin: 0.8em 0 0 0;
color: @col-text-primary-black;
text-decoration: none;
.transition(all 0.2s ease-in-out);
transition: all 0.2s ease-in-out;
&:hover {
color: @col-hover;

1
src/_h5ai/client/css/inc/info.less
View file

@ -1,4 +1,3 @@
#info {
display: none;

1
src/_h5ai/client/css/inc/notify.less
View file

@ -1,4 +1,3 @@
#notify {
position: fixed;
left: 50%;

1
src/_h5ai/client/css/inc/preview-aud.less
View file

@ -1,4 +1,3 @@
#pv-aud-audio {
position: absolute;

7
src/_h5ai/client/css/inc/preview-img.less
View file

@ -1,7 +1,8 @@
@check-white: #f8f8f8;
@check-black: #e8e8e8;
#pv-img-image {
@check-white: #f8f8f8;
@check-black: #e8e8e8;
position: absolute;
max-width: 100%;

2
src/_h5ai/client/css/inc/preview-txt.less
View file

@ -1,4 +1,3 @@
#pv-txt-text {
max-width: 960px;
text-align: left;
@ -92,7 +91,6 @@
}
}
&.markdown {
font-size: 1.1em;
padding: 8px 24px;

1
src/_h5ai/client/css/inc/preview-vid.less
View file

@ -1,4 +1,3 @@
#pv-vid-video {
position: absolute;

15
src/_h5ai/client/css/inc/preview.less
View file

@ -1,4 +1,3 @@
#pv-overlay {
display: none;
position: fixed;
@ -9,7 +8,7 @@
z-index: 100;
background-color: rgba(0,0,0,0.5);
.transition(background-color 0.3s ease-in-out);
transition: background-color 0.3s ease-in-out;
text-align: center;
}
@ -53,7 +52,7 @@
margin: -36px 0;
padding: 12px;
opacity: 0.5;
.transition(all 0.2s ease-in-out);
transition: all 0.2s ease-in-out;
}
&:hover {
@ -101,7 +100,7 @@
line-height: 48px;
padding: 0 12px;
opacity: 0.7;
.transition(all 0.2s ease-in-out);
transition: all 0.2s ease-in-out;
}
.bar-button {
@ -109,7 +108,7 @@
line-height: 48px;
opacity: 0.7;
cursor: pointer;
.transition(all 0.2s ease-in-out);
transition: all 0.2s ease-in-out;
&:hover {
opacity: 1.0;
@ -146,7 +145,7 @@
}
@media only screen and (max-width: 700px) {
#pv-prev-area, #pv-next-area {
display: none !important;
}
#pv-prev-area, #pv-next-area {
display: none !important;
}
}

1
src/_h5ai/client/css/inc/responsive.less
View file

@ -1,4 +1,3 @@
@media only screen and (max-width: 700px) {
#crumbbar {
.crumb:not(.active) {

3
src/_h5ai/client/css/inc/sidebar.less
View file

@ -1,4 +1,3 @@
#sidebar {
display: none;
overflow: auto;
@ -25,7 +24,7 @@
border-radius: 2px;
color: @col;
cursor: pointer;
.transition(all 0.2s ease-in-out);
transition: all 0.2s ease-in-out;
&:hover {
background: rgba(0,0,0,0.03);

7
src/_h5ai/client/css/inc/topbar.less
View file

@ -15,7 +15,6 @@
z-index: 1;
}
#toolbar {
overflow: hidden;
flex: 0 0 auto;
@ -25,7 +24,7 @@
.tool {
display: inline-block;
cursor: pointer;
.transition(all 0.2s ease-in-out);
transition: all 0.2s ease-in-out;
img {
display: inline-block;
@ -40,7 +39,6 @@
}
}
#flowbar {
overflow: hidden;
flex: 1 1 auto;
@ -49,7 +47,6 @@
font-size: 16px;
}
#backlink {
display: block;
overflow: hidden;
@ -59,7 +56,7 @@
padding: 6px 12px;
overflow: hidden;
height: 36px;
.transition(all 0.2s ease-in-out);
transition: all 0.2s ease-in-out;
&, &:active, &:visited {
color: @col-text-disabled-black;

6
src/_h5ai/client/css/inc/tree.less
View file

@ -1,4 +1,3 @@
#tree {
display: none;
@ -40,11 +39,12 @@
img {
width: 20px;
height: 20px;
.transition(all 0.2s ease-in-out);
transition: all 0.2s ease-in-out;
}
&.open {
img {
.transform(rotate(90deg));
transform: rotate(90deg);
zoom: 1;
}
}
&.unknown {

39
src/_h5ai/client/css/inc/view-details.less
View file

@ -1,30 +1,28 @@
#view.view-details {
.view-details-sized(@size) {
.view-details-sized(@size) {
.item {
.label, .date, .size {
line-height: @size + 14px;
.item {
.label, .date, .size {
line-height: @size + 14px;
}
}
}
.square {
width: @size;
height: @size;
img {
.square {
width: @size;
height: @size;
img {
width: @size;
height: @size;
}
}
.label {
margin: 0 246px 0 (@size + 32px);
}
}
.label {
margin: 0 246px 0 (@size + 32px);
}
}
#view.view-details {
margin: 16px;
#items {
@ -44,7 +42,7 @@
line-height: 46px;
opacity: 0.4;
outline: 0;
.transition(all 0.2s ease-in-out);
transition: all 0.2s ease-in-out;
&:hover {
opacity: 1;
@ -67,7 +65,8 @@
.descending .sort {
display: inline;
.transform(rotate(180deg));
transform: rotate(180deg);
zoom: 1;
}
}

24
src/_h5ai/client/css/inc/view-grid.less
View file

@ -1,23 +1,21 @@
#view.view-grid {
.view-grid-sized(@size) {
.view-grid-sized(@size) {
.label {
line-height: @size;
}
.label {
line-height: @size;
}
.square {
width: @size;
height: @size;
img {
.square {
width: @size;
height: @size;
img {
width: @size;
height: @size;
}
}
}
}
#view.view-grid {
margin: 8px;

36
src/_h5ai/client/css/inc/view-icons.less
View file

@ -1,27 +1,25 @@
#view.view-icons {
.view-icons-sized(@size) {
.view-icons-sized(@size) {
.item {
width: @size * 4/3;
}
.landscape {
width: @size * 4/3;
height: @size;
img {
width: @size;
height: @size;
}
.thumb {
.item {
width: @size * 4/3;
}
.landscape {
width: @size * 4/3;
height: @size;
img {
width: @size;
height: @size;
}
.thumb {
width: @size * 4/3;
}
}
}
}
#view.view-icons {
margin: 8px;

4
src/_h5ai/client/css/inc/view.less
View file

@ -1,5 +1,3 @@
html.drag-select, html.drag-select * {
cursor: move !important;
@ -11,7 +9,6 @@ html.drag-select, html.drag-select * {
user-select: none;
}
#selection-rect {
display: none;
position: absolute;
@ -22,7 +19,6 @@ html.drag-select, html.drag-select * {
background: rgba(0,0,0,0.1);
}
#view {
display: none;

6
src/_h5ai/client/js/inc/ext/contextmenu.js
View file

@ -3,7 +3,7 @@ modulejs.define('ext/contextmenu', ['_', '$', 'core/resource', 'core/settings'],
var settings = _.extend({
enabled: false
}, allsettings.contextmenu);
var templateOverlay = '<div class="cm-overlay"/>';
var templateOverlay = '<div id="cm-overlay"/>';
var templatePanel = '<div class="cm-panel"><ul/></div>';
var templateSep = '<li class="cm-sep"/>';
var templateEntry = '<li class="cm-entry"><span class="cm-icon"><img/></span><span class="cm-text"/></li>';
@ -164,8 +164,8 @@ modulejs.define('ext/contextmenu', ['_', '$', 'core/resource', 'core/settings'],
// ];
// var callback = function (res) {
// window.console.log('>> CB-RESULT >> ' + res);
// };
// window.console.log('>> CB-RESULT >> ' + res);
// };
// $(document).on('h5ai-contextmenu', '#items .item.folder', function (ev) {