So. I have joined a Star Trek Adventures campaign and my GM has asked me to make the OP site for it look like a Star Trek Next Generation LCARS interface. Has anyone had experience with this? I have managed to get a pretty good feel using a frame around every page but I am having trouble figuring out what to do with the main menu that is to the left of every page and the Adventure Log pages. Any suggestions and advice would be welcome. You can see what I have so far here: https://startrekadventureslaurelsofvictory.obsidianportal.com/
November 2012 CotM: Dresden Files RPG: The Emerald City
June 2016 CotM: Star Wars: Rise of the Infinite Empire
JUNE 2020 CotM & 2020 CotY: Mass Effect Accelerated
FEBRUARY 2022 CotM & 2022 CotY: Dresden Files Accelerated: Emerald City-Requiem
Current Campaigns: Traveller Osmium Buccaneers: Pirates of Drinax, Cyberpunk 2077 Accelerated
It looks like you're new here. If you want to get involved, click one of these buttons!
Comments
So I know this would take a little CSS trickery, but I'm a follower of your stuff and know you have the chops for it- but If I can put in my 2 cents a a *huge* Star Trek and aesthetics nerd both:
For the left-side menu:
-Make the font larger
-Drop the underlining when you hover. I haven't found anything else that has the same underlining on the Portal,and I'm pretty sure there generally isn't any in the LCARS design
-Round out the boxes that appear when you hover over the links. It will help it look more consistent with the rest of the text and give a little more Star Trek-y interface feeling. I would say either make the point rounded on the right, or eliminate the point, and add a convex curve on the left
Adventure logs:
-A simple oblong background strip in the STNG colors would work for both the header and sub header. Kind of like what the left side menu items look like when you hover over them, but rounded. Also, on hover, the titles are disappearing?
- A thin rounded box, again in the orange or purple around the adventure logs would give it a good "Capain's Log" feel
Overall, it's already super impressive! I'm excited to follow a STNG game
Thanks Conan. I appreciate the suggestions. I will consider that for sure. I have never really modified the Menu so I haven't sussed out how to go about the changes yet. I did manage to get rid of the icons though so I figure it will just be a matter of time.
November 2012 CotM: Dresden Files RPG: The Emerald City
June 2016 CotM: Star Wars: Rise of the Infinite Empire
JUNE 2020 CotM & 2020 CotY: Mass Effect Accelerated
FEBRUARY 2022 CotM & 2022 CotY: Dresden Files Accelerated: Emerald City-Requiem
Current Campaigns: Traveller Osmium Buccaneers: Pirates of Drinax, Cyberpunk 2077 Accelerated
I have been banging my head against the CSS for menus trying to figure out how to make it look appropriate but I am making little headway. Can anyone suggest a thread, post, website or example that can help me figure this out? I am getting nowhere so far.
November 2012 CotM: Dresden Files RPG: The Emerald City
June 2016 CotM: Star Wars: Rise of the Infinite Empire
JUNE 2020 CotM & 2020 CotY: Mass Effect Accelerated
FEBRUARY 2022 CotM & 2022 CotY: Dresden Files Accelerated: Emerald City-Requiem
Current Campaigns: Traveller Osmium Buccaneers: Pirates of Drinax, Cyberpunk 2077 Accelerated
What are you specifically trying to do?
Man i am so jealous of you...I was thinking of running a Trek Game and setting the site like that...but don't wanna be a copycat. Besides, you probably do it better than I can.
One Trekker nitpick. Shran is the first name of Shran from enterprise. Thy'lek is the family name :)
Keryth you should totally do it too! I can learn from you and you from me and so on. I would love to see your approach to LCARS.
As for what I want to do - I am not sure. Like I said I have never really done anything to the menus before (except a failed attempt to put the menu up top that I never got to work). I was hoping to be able to add my own Symbol or Symbols to the different items. Maybe a Starfleet chevron thingy? Or even just the rounded end cap with maybe some LCARS shapes or something.
November 2012 CotM: Dresden Files RPG: The Emerald City
June 2016 CotM: Star Wars: Rise of the Infinite Empire
JUNE 2020 CotM & 2020 CotY: Mass Effect Accelerated
FEBRUARY 2022 CotM & 2022 CotY: Dresden Files Accelerated: Emerald City-Requiem
Current Campaigns: Traveller Osmium Buccaneers: Pirates of Drinax, Cyberpunk 2077 Accelerated
November 2012 CotM: Dresden Files RPG: The Emerald City
June 2016 CotM: Star Wars: Rise of the Infinite Empire
JUNE 2020 CotM & 2020 CotY: Mass Effect Accelerated
FEBRUARY 2022 CotM & 2022 CotY: Dresden Files Accelerated: Emerald City-Requiem
Current Campaigns: Traveller Osmium Buccaneers: Pirates of Drinax, Cyberpunk 2077 Accelerated
This is just a quick mockup I threw together but maybe something along these lines? I am not sure what to do to be honest.
The above could even be simplified without the two frame elements on either side.November 2012 CotM: Dresden Files RPG: The Emerald City
June 2016 CotM: Star Wars: Rise of the Infinite Empire
JUNE 2020 CotM & 2020 CotY: Mass Effect Accelerated
FEBRUARY 2022 CotM & 2022 CotY: Dresden Files Accelerated: Emerald City-Requiem
Current Campaigns: Traveller Osmium Buccaneers: Pirates of Drinax, Cyberpunk 2077 Accelerated
"One Trekker nitpick. Shran is the first name of Shran from enterprise. Thy'lek is the family name :)"
OH! Thanks for that. I totally forgot and haven't watched Enterprise in ages. I will fix that.
I ended up making Te'Yannah her family name with her first name as Shran. Who says it can't be a female's name too?November 2012 CotM: Dresden Files RPG: The Emerald City
June 2016 CotM: Star Wars: Rise of the Infinite Empire
JUNE 2020 CotM & 2020 CotY: Mass Effect Accelerated
FEBRUARY 2022 CotM & 2022 CotY: Dresden Files Accelerated: Emerald City-Requiem
Current Campaigns: Traveller Osmium Buccaneers: Pirates of Drinax, Cyberpunk 2077 Accelerated
Thanks for the encouragement HumAnnoyd, but I have another campaign to finsih the site on and run first :)
@HumAnnoyd, go check out the Settings Advanced tab on your Campaign right above the Custom CSS field!
I added you to a new beta feature that @Kallak is working on that we're calling Custom Navigation.
You can now replace the default navigation with whatever HTML you want. If you want to get back the default navigation, just clear the Custom Navigation text area and Save. Let us know if you see any issues.
@Kallak put in a little extra time last night to get this done before the weekend, so you wouldn't be banging your head against the wall trying to change the navigation the "old way". I hope this saves you some Advil.
If anyone else wants in on testing this beta feature, let me know, and I'll add you to the beta.
Obsidian Portal Developer
OOoooOOoh. I will certainly take advantage of that. Thank you!
November 2012 CotM: Dresden Files RPG: The Emerald City
June 2016 CotM: Star Wars: Rise of the Infinite Empire
JUNE 2020 CotM & 2020 CotY: Mass Effect Accelerated
FEBRUARY 2022 CotM & 2022 CotY: Dresden Files Accelerated: Emerald City-Requiem
Current Campaigns: Traveller Osmium Buccaneers: Pirates of Drinax, Cyberpunk 2077 Accelerated
Awesome! I'm looking forward to seeing what you do with it!
Obsidian Portal Developer
Well, it may take a minute or two to figure out what to do. I am self taught and will have to use trial and error. Plus we have our first session for that game on Sunday and I have some prep to do for the GM and others.
November 2012 CotM: Dresden Files RPG: The Emerald City
June 2016 CotM: Star Wars: Rise of the Infinite Empire
JUNE 2020 CotM & 2020 CotY: Mass Effect Accelerated
FEBRUARY 2022 CotM & 2022 CotY: Dresden Files Accelerated: Emerald City-Requiem
Current Campaigns: Traveller Osmium Buccaneers: Pirates of Drinax, Cyberpunk 2077 Accelerated
Pffft....run your game like Kirk. By the seat of his pants...that he'll likely not be wearing after he finds the new alien hottie for this episode...so never mind. That was a bad idea.
~Weasel0
A Parade of Black | ShadowRunHack |
Where I play with CSS code
I love Kirk but I hope we are beyond the Alien date of the week stage of Star Trek. LOL.
November 2012 CotM: Dresden Files RPG: The Emerald City
June 2016 CotM: Star Wars: Rise of the Infinite Empire
JUNE 2020 CotM & 2020 CotY: Mass Effect Accelerated
FEBRUARY 2022 CotM & 2022 CotY: Dresden Files Accelerated: Emerald City-Requiem
Current Campaigns: Traveller Osmium Buccaneers: Pirates of Drinax, Cyberpunk 2077 Accelerated
No worries, @HumAnnoyd, whenever you get back to it is just fine. If you get stuck or need help, definitely ask! We're happy to help. Plus, it will help us to hear where you have any difficulties, so we can figure out if there are any tweaks to the feature that we need to make. That's part of the benefit of beta testers.
Obsidian Portal Developer
Thanks, Thaen. I am just starting to grock the possibilities. I look forward to seeing what I can figure out. I may just take you up on that advice at some point. I am mostly the art/designer type and coding is something I have picked up on the side so there are many gaps in my understanding of it.
November 2012 CotM: Dresden Files RPG: The Emerald City
June 2016 CotM: Star Wars: Rise of the Infinite Empire
JUNE 2020 CotM & 2020 CotY: Mass Effect Accelerated
FEBRUARY 2022 CotM & 2022 CotY: Dresden Files Accelerated: Emerald City-Requiem
Current Campaigns: Traveller Osmium Buccaneers: Pirates of Drinax, Cyberpunk 2077 Accelerated
Cool! If I'm thinking about it right, the mockup that you have above should be pretty straightforward for slicing up and creating a menu out of, so I'm definitely curious to see if you run into any roadblocks.
Also, I'll just seed this little extra idea here...feel free to ignore...
https://forums.obsidianportal.com/discussion/5614/campaign-member-specific-css
So you could, for example, create a wiki page specific to each Player (or it could be their Character page), and then create a link to that wiki page in your new navigation that only shows for that Player (and would be hidden for other Players). So each Player would have a custom menu item displaying in their navigation.
Obsidian Portal Developer
That was actually one of the first questions I was going to ask you. How do you make it so the menu only shows the items that you have to be logged in for? In other words make Secrets, Calender, Forum and Settings only show for those who are part of the campaign and logged into it?
November 2012 CotM: Dresden Files RPG: The Emerald City
June 2016 CotM: Star Wars: Rise of the Infinite Empire
JUNE 2020 CotM & 2020 CotY: Mass Effect Accelerated
FEBRUARY 2022 CotM & 2022 CotY: Dresden Files Accelerated: Emerald City-Requiem
Current Campaigns: Traveller Osmium Buccaneers: Pirates of Drinax, Cyberpunk 2077 Accelerated
Um. Also a bit of a snag. I seem to be locked out of the Advanced Settings page for that site now and cannot make any changes. (Damn. I knew I should have stuck with using my Test page till I got it all worked out.)
November 2012 CotM: Dresden Files RPG: The Emerald City
June 2016 CotM: Star Wars: Rise of the Infinite Empire
JUNE 2020 CotM & 2020 CotY: Mass Effect Accelerated
FEBRUARY 2022 CotM & 2022 CotY: Dresden Files Accelerated: Emerald City-Requiem
Current Campaigns: Traveller Osmium Buccaneers: Pirates of Drinax, Cyberpunk 2077 Accelerated
This is really bad timing as our first session is tomorrow at 1pm. Any chance you can reset it or something? Get rid of any of the offending text from the menus window?
Actually get rid of any of the CSS at the beginning of the site. It should be apparent.November 2012 CotM: Dresden Files RPG: The Emerald City
June 2016 CotM: Star Wars: Rise of the Infinite Empire
JUNE 2020 CotM & 2020 CotY: Mass Effect Accelerated
FEBRUARY 2022 CotM & 2022 CotY: Dresden Files Accelerated: Emerald City-Requiem
Current Campaigns: Traveller Osmium Buccaneers: Pirates of Drinax, Cyberpunk 2077 Accelerated
You can still get to the settings area manually by way of URL input. You'll just need to put the "settings/advanced-settings" on after the ".com"
- Kallak
I know that but it won't let me make ANY changes. It won't even let me click on any buttons or anything at all over the whole site. I can't delete the code and I can't even scroll down to see what code might have caused the issue.
November 2012 CotM: Dresden Files RPG: The Emerald City
June 2016 CotM: Star Wars: Rise of the Infinite Empire
JUNE 2020 CotM & 2020 CotY: Mass Effect Accelerated
FEBRUARY 2022 CotM & 2022 CotY: Dresden Files Accelerated: Emerald City-Requiem
Current Campaigns: Traveller Osmium Buccaneers: Pirates of Drinax, Cyberpunk 2077 Accelerated
Whew. Never mind. I figured out that I could type the address manually into my phone's browser and from there was able to delete the offending code. It is working again.
November 2012 CotM: Dresden Files RPG: The Emerald City
June 2016 CotM: Star Wars: Rise of the Infinite Empire
JUNE 2020 CotM & 2020 CotY: Mass Effect Accelerated
FEBRUARY 2022 CotM & 2022 CotY: Dresden Files Accelerated: Emerald City-Requiem
Current Campaigns: Traveller Osmium Buccaneers: Pirates of Drinax, Cyberpunk 2077 Accelerated
@HumAnnoyd, if you (or anyone) runs into a time sensitive issue, email the support inbox ([email protected]) for faster help. It's more likely that one of us will see it there quicker than if it's a post here in the community forums.
Glad you were able to get it working again!
If you know what the code was that was causing the issue, can you email it to support? It might be something we need to watch out for if someone else could run into a similar jam.
Obsidian Portal Developer
Thanks Thaen. I will remember that if I have problems in the future. Unfortunately I am not sure what the code was. I deleted it all and didn't think to save it at the time. It was something I cut and pasted from W3 Schools if I am remembering correctly. I will try and narrow it down and email yall if I can figure it out.
November 2012 CotM: Dresden Files RPG: The Emerald City
June 2016 CotM: Star Wars: Rise of the Infinite Empire
JUNE 2020 CotM & 2020 CotY: Mass Effect Accelerated
FEBRUARY 2022 CotM & 2022 CotY: Dresden Files Accelerated: Emerald City-Requiem
Current Campaigns: Traveller Osmium Buccaneers: Pirates of Drinax, Cyberpunk 2077 Accelerated
Was it something involving z-index of links? When I first started working on the CSS for the hover over effect on the character portrait page that I was trying to alter the z-index of the link to match the hover. I screwed it up and caused ALL links to have a z-index below 0. This made all links on my site impossible to click until I navigated back to the advanced settings (using the url as @kallak described) and fixed the CSS causing the stack issue.
I think it must have been more than that. I wasn't able to click on ANYTHING even when navigating back to the Settings page using the URL. It would not even let me select the code to delete it or even scroll down to see what might be the problem. The only reason I was able to get around it was that my phone's browser allowed me to scroll and delete. Which I did hastily for which I apologize. I was just so happy to be able to work on the site again. I am not sure what the offending code was. I was trying out a lot of ideas from W3 and don't know which I was doing. I am sorry. I know the point of Beta is to break things, which I clearly did, but it needed to be recorded. Which I failed at. I have some notes that I was cutting and pasting things into. I will look into it in that document and see if I can figure it out.
November 2012 CotM: Dresden Files RPG: The Emerald City
June 2016 CotM: Star Wars: Rise of the Infinite Empire
JUNE 2020 CotM & 2020 CotY: Mass Effect Accelerated
FEBRUARY 2022 CotM & 2022 CotY: Dresden Files Accelerated: Emerald City-Requiem
Current Campaigns: Traveller Osmium Buccaneers: Pirates of Drinax, Cyberpunk 2077 Accelerated
This does bring up a feature that might be worth looking into - Version history on the CSS. I imagine that it might be a much bigger headache than I can fathom.
November 2012 CotM: Dresden Files RPG: The Emerald City
June 2016 CotM: Star Wars: Rise of the Infinite Empire
JUNE 2020 CotM & 2020 CotY: Mass Effect Accelerated
FEBRUARY 2022 CotM & 2022 CotY: Dresden Files Accelerated: Emerald City-Requiem
Current Campaigns: Traveller Osmium Buccaneers: Pirates of Drinax, Cyberpunk 2077 Accelerated