Skip to content
GitLab
Menu
Projects
Groups
Snippets
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
Menu
Open sidebar
yPhil
Pétrolette
Commits
91a43ab9
Commit
91a43ab9
authored
Dec 09, 2017
by
yPhil
Browse files
Merge branch 'layout' into dev
parents
0bf83fbe
95155a8e
Changes
4
Hide whitespace changes
Inline
Side-by-side
public/css/mob-ui.css
View file @
91a43ab9
h1
,
h2
{
:root
{
--ui-bg-color-pri
:
#2B374B
;
--ui-color-pri
:
#BFD8D1
;
--ui-color-sec
:
#FFDC00
;
--ui-color-ter
:
#6E7A94
;
}
body
{
background-color
:
var
(
--bg-color-tri
)
!important
;
}
li
.ui-tabs-active
,
li
.mobTab
:first-child
{
box-shadow
:
none
!important
;
}
#tabUl
,
#tabs
{
background
:
none
;
border-radius
:
0
;
}
li
.mobTab
{
background-color
:
var
(
--bg-color-sec
)
!important
;
}
h1
,
h2
,
p
.ui
{
color
:
var
(
--ui-color-pri
)
!important
;
}
p
.dialog
>
a
:link
{
color
:
var
(
--
ui-
color-pri
)
!important
;
color
:
var
(
--color-pri
)
!important
;
}
p
.dialog
>
a
:visited
{
color
:
var
(
--
ui-
color-pri
)
!important
;
color
:
var
(
--color-pri
)
!important
;
}
select
{
...
...
@@ -28,26 +54,18 @@ fieldset > p {
}
fieldset
a
:link
{
color
:
#BFD8D1
;
color
:
var
(
--ui-color-pri
)
;
}
fieldset
a
:visited
{
color
:
#6E7A94
;
}
p
,
label
{
font-size
:
12pt
;
font-family
:
'ArimaKoshiRegular'
;
font-weight
:
normal
;
font-style
:
normal
;
line-height
:
1.2em
;
color
:
#FFD05B
;
color
:
var
(
--ui-color-ter
);
}
fieldset
,
legend
{
background-color
:
var
(
--ui-bg-color-pri
)
!important
;
color
:
#BFD8D1
!important
;
background
:
var
(
--ui-bg-color-pri
)
!important
;
/* background-color: var(--bg-color-pri) !important; */
color
:
var
(
--ui-color-pri
);
/* font-size:76% !important; */
}
...
...
@@ -56,7 +74,7 @@ legend {
}
fieldset
{
border
:
1px
solid
#BFD8D1
!important
;
/*
border: 1px solid #BFD8D1 !important;
*/
/* font-size:76% !important; */
}
...
...
@@ -75,7 +93,6 @@ fieldset {
height
:
2px
;
}
#menu
{
/* border-right: #2e2e2e solid 1px; */
padding
:
.5em
;
...
...
@@ -120,8 +137,8 @@ fieldset {
.ui-dialog
,
.ui-dialog
.ui-dialog-buttonpane
,
.handle
{
background-color
:
#2B374B
!important
;
color
:
var
(
--ui-color-pri
)
!important
;
background-color
:
var
(
--ui-bg-color-pri
)
;
/*
color: var(--ui-color-pri) !important;
*/
}
button
#profile
,
...
...
@@ -135,11 +152,12 @@ button#donate {
.handle
{
opacity
:
0.6
;
color
:
var
(
--ui-color-sec
)
!important
;
}
.handle
:hover
{
opacity
:
1
;
color
:
#FFDC00
!important
;
color
:
var
(
--ui-color-sec
)
!important
;
}
.ui-button
:active
,
...
...
@@ -151,7 +169,7 @@ button#donate {
.ui-state-active
,
.ui-state-hover
{
background-color
:
#FFD05B
!important
;
color
:
#001F3F
!important
;
color
:
var
(
--ui-bg-color-pri
)
;
}
.ui-state-success
{
...
...
@@ -175,7 +193,6 @@ button#donate {
#tabs
.newFeed
,
#menu
>
.handle
{
font-size
:
2rem
;
background-color
:
#001F3F
;
position
:
absolute
;
}
...
...
@@ -399,12 +416,12 @@ div.testFlex {
button
.dangerous
:hover
{
/* border-color: #2B374B !important; */
background-color
:
var
(
--
ui-
color-danger
)
!important
;
color
:
var
(
--
ui-
color-pri
)
!important
;
background-color
:
var
(
--color-danger
)
!important
;
color
:
var
(
--color-pri
)
!important
;
}
i
.dangerous
:hover
{
color
:
var
(
--
ui-
color-danger
)
!important
;
color
:
var
(
--color-danger
)
!important
;
/* color: #2B374B !important; */
}
...
...
@@ -513,7 +530,7 @@ button > i {
display
:
flex
;
text-align
:
right
;
background-color
:
var
(
--
ui-
bg-color-sec
)
!important
;
background-color
:
var
(
--bg-color-sec
)
!important
;
/* padding:.2rem; */
/* min-width:80px; */
...
...
@@ -542,8 +559,8 @@ button > i {
width
:
0
;
top
:
0
;
left
:
0
;
border-bottom
:
26px
solid
var
(
--
ui-
bg-color-pri
);
border-right
:
18px
solid
var
(
--
ui-
bg-color-sec
);
border-bottom
:
26px
solid
var
(
--bg-color-pri
);
border-right
:
18px
solid
var
(
--bg-color-sec
);
}
.mobHeader
.feedControls
div
{
...
...
@@ -562,3 +579,104 @@ button > i {
.mobHeader
.feedControls
div
i
.ui-button
:first-child
{
margin
:
0
!important
;
}
/* From night */
#tabUl
,
#tabs
{
background
:
none
;
border-radius
:
0
;
}
li
.mobTab
,
#newTabButton
{
box-shadow
:
inset
14px
0px
10px
-3px
rgba
(
0
,
0
,
0
,
0.19
)
!important
;
}
#newTabButton
{
background-color
:
var
(
--color-qua
);
}
.handle
:hover
{
opacity
:
1
;
color
:
var
(
--color-tri
);
}
#newTabButton
:hover
{
background-color
:
var
(
--bg-color-pri
)
!important
;
box-shadow
:
none
!important
;
}
li
.ui-tabs-active
,
div
.ui-tabs-panel
{
background-color
:
var
(
--bg-color-tri
)
!important
;
}
li
.ui-state-hover
:not
(
.ui-tabs-active
)
{
background-color
:
var
(
--bg-color-pri
)
!important
;
}
.ui-state-error
{
background-color
:
var
(
--bg-color-pri
)
!important
;
color
:
var
(
--color-danger
);
}
i
.tabCloser
,
li
.ui-tabs-active
a
:link
{
color
:
var
(
--color-pri
)
!important
;
}
i
.tabCloser
,
li
.ui-tabs-tab
a
:link
{
color
:
var
(
--color-pri
)
!important
;
}
i
.tabCloser
:hover
{
color
:
var
(
--color-danger
);
}
li
.feed
{
background-color
:
var
(
--bg-color-pri
)
!important
;
color
:
var
(
--color-pri
)
!important
;
}
li
.feed
a
{
color
:
var
(
--color-pri
)
!important
;
}
.mobHeader
{
background-color
:
var
(
--bg-color-pri
);
color
:
var
(
--color-pri
);
}
li
.feedItem
{
background-color
:
var
(
--bg-color-sec
)
!important
;
}
li
.feedItem
:nth-child
(
even
)
{
background-color
:
var
(
--bg-color-qua
)
!important
;
}
li
.feedItem
:hover
{
background-color
:
var
(
--bg-color-pri
)
!important
;
color
:
#000
!important
;
}
li
.feedItem
a
:visited
{
color
:
var
(
--color-sec
);
}
#progressBar
>
#cursor
{
width
:
1%
;
height
:
2px
;
background-color
:
var
(
--color-sec
);
box-shadow
:
0px
0px
6px
5px
rgba
(
227
,
239
,
243
,
.2
);
}
.fancybox-thumbs
{
background-color
:
var
(
--bg-color-qua
)
!important
;
}
.arrow
{
background-image
:
url("/static/images/feed-toggle-triangle-fff.png")
!important
;
}
public/css/themes/day.css
View file @
91a43ab9
body
{
background-color
:
#dddddd
;
}
li
.mobTab
{
background-color
:
#C3DCD9
!important
;
}
li
.ui-tabs-active
,
li
.mobTab
:first-child
{
box-shadow
:
none
!important
;
}
#tabUl
,
#tabs
{
background
:
none
;
border-radius
:
0
;
}
#newTabButton
{
background-color
:
#DDE0FA
!important
;
}
#newTabButton
:hover
{
background-color
:
#E3EFF3
!important
;
box-shadow
:
none
!important
;
}
.handle
:hover
{
opacity
:
1
;
color
:
#E3EFF3
!important
;
}
li
.ui-tabs-active
,
div
.ui-tabs-panel
{
background-color
:
#E3EFF3
!important
;
}
li
.ui-state-hover
:not
(
.ui-tabs-active
)
{
background-color
:
#dddddd
!important
;
}
i
.tabCloser
,
li
.ui-tabs-active
a
:link
{
color
:
#3C4440
!important
;
}
i
.tabCloser
:hover
{
color
:
#000
!important
;
}
li
.feed
{
background-color
:
#ffffff
!important
;
color
:
#3C4440
!important
;
}
li
.feed
a
{
color
:
#3C4440
!important
;
}
li
.feedItem
:nth-child
(
even
)
{
background-color
:
#dddddd
!important
;
}
li
.feedItem
:hover
{
background-color
:
#e3eff3
!important
;
color
:
#000
!important
;
}
li
.feedItem
a
:visited
{
color
:
#565
!important
;
}
#progressBar
>
#cursor
{
width
:
1%
;
height
:
2px
;
background-color
:
#3C4440
;
box-shadow
:
0px
12px
6px
5px
rgba
(
227
,
239
,
243
,
.2
);
}
li
.ui-droppable-hover
{
background
:
#E3EFF3
!important
;
}
li
.ui-droppable-hover
a
:link
{
color
:
red
!important
;
:root
{
--bg-color-tri
:
#DDE0FA
;
--bg-color-qua
:
#e3eff3
;
--bg-color-pri
:
#C3DCD9
;
--bg-color-sec
:
#eeeeee
;
--color-pri
:
#3C4440
;
--color-sec
:
#5294E2
;
--color-tri
:
#FFDC00
;
--color-qua
:
#DDE0FA
;
--color-danger
:
#660000
;
}
public/css/themes/night.css
View file @
91a43ab9
:root
{
--main-bg-color
:
red
;
--ui-bg-color
:
red
;
--ui-bg-color-pri
:
#383C4A
;
--ui-bg-color-sec
:
#4B5162
;
--ui-color-pri
:
#eeeeee
;
--ui-color-sec
:
red
;
--ui-color-danger
:
#660000
;
}
body
{
background-color
:
#7C818C
!important
;
}
li
.mobTab
{
background-color
:
#4B5162
!important
;
}
li
.mobTab
,
#newTabButton
{
box-shadow
:
inset
14px
0px
10px
-3px
rgba
(
0
,
0
,
0
,
0.19
)
!important
;
}
#newTabButton
{
background-color
:
#7395AE
!important
;
}
.handle
:hover
{
opacity
:
1
;
color
:
#FFDC00
!important
;
}
#newTabButton
:hover
{
background-color
:
#383C4A
!important
;
box-shadow
:
none
!important
;
}
li
.ui-tabs-active
,
li
.mobTab
:first-child
{
box-shadow
:
none
!important
;
}
#tabUl
,
#tabs
{
background
:
none
;
border-radius
:
0
;
}
li
.ui-tabs-active
,
div
.ui-tabs-panel
{
background-color
:
#7C818C
!important
;
}
li
.ui-state-hover
:not
(
.ui-tabs-active
)
{
background-color
:
#383C4A
!important
;
}
.ui-state-error
{
background-color
:
#000
!important
;
color
:
#EA2D44
!important
;
}
i
.tabCloser
,
li
.ui-tabs-active
a
:link
{
color
:
#eeeeee
!important
;
}
i
.tabCloser
,
li
.ui-tabs-tab
a
:link
{
color
:
#eeeeee
!important
;
}
i
.tabCloser
:hover
{
color
:
#7395AE
;
}
li
.feed
{
background-color
:
#383C4A
!important
;
color
:
#eeeeee
!important
;
}
li
.feed
a
{
color
:
#ffffff
!important
;
}
.mobHeader
{
background-color
:
#383C4A
;
color
:
#eeeeee
;
}
li
.feedItem
{
background-color
:
#4B5162
!important
;
}
li
.feedItem
:nth-child
(
even
)
{
background-color
:
#404552
!important
;
}
li
.feedItem
:hover
{
background-color
:
#383C4A
!important
;
color
:
#000
!important
;
}
li
.feedItem
a
:visited
{
color
:
#dddddd
!important
;
}
#progressBar
>
#cursor
{
width
:
1%
;
height
:
2px
;
background-color
:
#5294E2
;
box-shadow
:
0px
0px
6px
5px
rgba
(
227
,
239
,
243
,
.2
);
}
.fancybox-thumbs
{
background-color
:
#404552
!important
;
}
.arrow
{
background-image
:
url("/static/images/feed-toggle-triangle-fff.png")
!important
;
--bg-color-tri
:
#7C818C
;
--bg-color-qua
:
#404552
;
--bg-color-pri
:
#383C4A
;
--bg-color-sec
:
#4B5162
;
--color-pri
:
#eeeeee
;
--color-sec
:
#dddddd
;
--color-tri
:
#FFDC00
;
--color-qua
:
#7395AE
;
--color-danger
:
#660000
;
}
public/templates/dialogs.html
View file @
91a43ab9
...
...
@@ -14,7 +14,7 @@
<h1
class=
"translate"
data-title=
"What is Petrolette?"
data-content=
"What is Petrolette?"
>
What is Petrolette?
</h1>
<p
class=
"translate"
<p
class=
"translate
ui
"
data-title=
"Petrolette is your news reader. Find new sources, sort them in categories, you are on the in-ter-net."
data-content=
"Petrolette is your news reader. Find new sources, sort them in categories, you are on the in-ter-net."
>
Petrolette is your news reader. Find new sources, sort them in categories, you are on the in-ter-net.
...
...
@@ -22,7 +22,7 @@
<h2
class=
"translate"
data-title=
"How do I use it?"
data-content=
"How do I use it?"
>
How do I use it?
</h2>
<p>
<p
class=
"ui"
>
<span
class=
"dialog translate"
data-content=
"Learn how to use"
>
Learn how to use
</span>
<button
id=
"aide-un"
...
...
Write
Preview
Supports
Markdown
0%
Try again
or
attach a new file
.
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment